/* 
 * Roundcube Green Dark Theme - FIXED VERSION
 * Thêm vào CUỐI file: styles.min.css
 */

:root {
    --color-primary: #1b5e20 !important;
    --color-primary-dark: #0d3d11 !important;
    --color-primary-light: #2e7d32 !important;
    --color-success: #2e7d32 !important;
    --color-background: #f1f8f4 !important;
    --color-background-dark: #e8f5e9 !important;
    --color-sidebar: #1b5e20 !important;
    --color-sidebar-hover: #2e7d32 !important;
    --color-button: #2e7d32 !important;
    --color-button-hover: #388e3c !important;
    --color-link: #1b5e20 !important;
    --color-border: #a5d6a7 !important;
    --color-header: #1b5e20 !important;
    --color-header-text: #ffffff !important;
}

/* ===== HEADER ===== */
#layout>div>.header,
.header {
    background-color: #1b5e20 !important;
    border-bottom: 2px solid #0d3d11 !important;
}

#layout>div>.header *,
.header .brand,
.header a,
.header a.button {
    color: #ffffff !important;
}

/* ===== SIDEBAR/MENU BÊN TRÁI ===== */
#layout-sidebar,
.layout-sidebar,
.sidebar {
    background-color: #1b5e20 !important;
}

/* ===== TASKBAR BÊN TRÁI (Compose, Mail, Contact...) - NỀN ĐEN ===== */
#layout-menu,
#taskmenu {
    background-color: #2f3a3f !important;
}

#layout-menu a,
#taskmenu a {
    color: #ffffff !important;
    background-color: transparent !important;
}

#layout-menu a:hover,
#layout-menu a:focus,
#layout-menu a.selected,
#taskmenu a:hover,
#taskmenu a:focus,
#taskmenu a.selected {
    background-color: #45555c !important;
    color: #ffffff !important;
}

/* Menu chính (Compose, Mail, Contact...) */
#layout-sidebar .sidebar-menu a,
#layout-sidebar .sidebar-menu .button,
#layout-sidebar a,
#layout-sidebar .button,
.sidebar-menu a,
.sidebar-menu .button,
.sidebar a,
.sidebar .list-group-item {
    color: #ffffff !important;
    background-color: transparent !important;
}

#layout-sidebar a:hover,
#layout-sidebar .button:hover,
.sidebar-menu a:hover,
.sidebar a:hover,
.sidebar .list-group-item:hover {
    background-color: #2e7d32 !important;
    color: #ffffff !important;
}
/* ===== FOLDER LIST (QUAN TRỌNG) ===== */
/* Reset tất cả folder về mặc định */
body .folderlist,
body .folderlist *,
body ul.treelist.folderlist,
body ul.treelist.folderlist * {
    background-color: transparent !important;
}

/* Folder thường - chữ xanh đậm */
body .folderlist li,
body .folderlist li a,
body .folderlist li > a,
body ul.treelist.folderlist li,
body ul.treelist.folderlist li a,
body ul.treelist.folderlist li > a {
    color: #0d3d11 !important;
    background-color: transparent !important;
    font-weight: normal !important;
}

/* Folder hover - nền xanh, chữ trắng */
body .folderlist li:hover,
body .folderlist li:hover a,
body .folderlist li:hover > a,
body .folderlist li a:hover,
body ul.treelist.folderlist li:hover,
body ul.treelist.folderlist li:hover a,
body ul.treelist.folderlist li a:hover {
    background-color: #2e7d32 !important;
    color: #ffffff !important;
}

/* Folder selected/active - nền xanh đậm, chữ trắng, in đậm */
body .folderlist li.selected,
body .folderlist li.selected a,
body .folderlist li.selected > a,
body .folderlist li.active,
body .folderlist li.active a,
body .folderlist li.active > a,
body ul.treelist.folderlist li.selected,
body ul.treelist.folderlist li.selected a,
body ul.treelist.folderlist li.selected > a {
    background-color: #2e7d32 !important;
    color: #ffffff !important;
    font-weight: bold !important;
}

/* Icon trong folder */
.folderlist li a:before {
    color: inherit !important;
}

/* Unread count badge */
.folderlist li.mailbox .unreadcount {
    background-color: #1b5e20 !important;
    color: #ffffff !important;
}

/* ===== TOOLBAR (Refresh, Junk buttons) ===== */
.toolbar,
.header-toolbar,
#toolbar,
.mail-toolbar,
.content-toolbar {
    background-color: #1b5e20 !important;
    border-bottom: 2px solid #0d3d11 !important;
}

.toolbar *,
.toolbar a,
.toolbar a.button,
.toolbar button,
.toolbar .button {
    color: #ffffff !important;
    background-color: transparent !important;
}

.toolbar a:hover,
.toolbar a.button:hover,
.toolbar button:hover,
.toolbar .button:hover {
    background-color: #2e7d32 !important;
    color: #ffffff !important;
}

.toolbar .button:before,
.toolbar button:before,
.toolbar a:before {
    color: #ffffff !important;
}


/* ===== SETTINGS CONTENT - NỀN TRẮNG ===== */
.content,
.content-frame,
#settings-sections,
.settings-section,
.formcontent {
    background-color: #ffffff !important;
}

/* ===== SETTINGS LIST (Folders, Identities...) - NỀN XANH LỢT ===== */
#layout-sidebar .listing,
#layout-sidebar ul.listing,
#layout-sidebar .treelist,
#layout-sidebar ul.treelist,
.layout-sidebar .listing,
.layout-sidebar ul.listing {
    background-color: #0d3d11 !important;
}

#layout-sidebar .listing li,
#layout-sidebar ul.listing li,
#layout-sidebar .treelist li,
.layout-sidebar .listing li,
.layout-sidebar ul.listing li {
    background-color: transparent !important;
    border-color: #d4e8d7 !important;
}

#layout-sidebar .listing li a,
#layout-sidebar ul.listing li a,
#layout-sidebar .treelist li a,
.layout-sidebar .listing li a,
.layout-sidebar ul.listing li a {
    color: #f1f8f4 !important;
    background-color: transparent !important;
}

#layout-sidebar .listing li:hover,
#layout-sidebar .listing li:hover a,
#layout-sidebar ul.listing li:hover,
#layout-sidebar ul.listing li:hover a,
#layout-sidebar .treelist li:hover,
#layout-sidebar .treelist li:hover a,
.layout-sidebar .listing li:hover,
.layout-sidebar .listing li:hover a {
    background-color: #2e7d32 !important;
    color: #ffffff !important;
}



#layout-sidebar .listing li.selected,
#layout-sidebar .listing li.selected a,
#layout-sidebar ul.listing li.selected,
#layout-sidebar ul.listing li.selected a,
#layout-sidebar .treelist li.selected,
#layout-sidebar .treelist li.selected a,
.layout-sidebar .listing li.selected,
.layout-sidebar .listing li.selected a {
    background-color: #2e7d32 !important;
    color: #ffffff !important;
    font-weight: bold !important;
}

/* Override cho iconized listing trong settings */
#layout-sidebar .listing.iconized li a,
.layout-sidebar .listing.iconized li a {
    color: #ffffff !important;
}

#layout-sidebar .listing.iconized li:hover a,
.layout-sidebar .listing.iconized li:hover a {
    color: #ffffff !important;
}

#layout-sidebar .listing.iconized li.selected a,
.layout-sidebar .listing.iconized li.selected a {
    color: #ffffff !important;
}

/* ===== NÚT BẤM ===== */
/* Nút Create, Delete, Empty */
.btn.create,
.btn.delete,
.btn.empty,
button.create,
button.delete,
button.empty,
a.button.create,
a.button.delete,
a.button.empty {
    background-color: #2e7d32 !important;
    color: #ffffff !important;
    border-color: #2e7d32 !important;
}


.btn.create:hover,
.btn.delete:hover,
.btn.empty:hover,
button.create:hover,
button.delete:hover,
button.empty:hover,
a.button.create:hover,
a.button.delete:hover,
a.button.empty:hover {
    background-color: #388e3c !important;
    color: #ffffff !important;
}

/* Nút primary chung */
.btn-primary,
button.btn-primary,
a.btn-primary {
    background-color: #2e7d32 !important;
    border-color: #2e7d32 !important;
    color: #ffffff !important;
}

.btn-primary:hover,
button.btn-primary:hover,
a.btn-primary:hover {
    background-color: #388e3c !important;
    border-color: #388e3c !important;
}

/* ===== DANH SÁCH EMAIL ===== */
.listing tbody tr.selected,
.listing tbody tr.selected > td {
    background-color: #e8f5e9 !important;
    border-left: 3px solid #1b5e20 !important;
}

.listing tbody tr:hover {
    background-color: #f1f8f4 !important;
}


/* ===== LINK ===== */
a {
    color: #1b5e20 !important;
}

a:hover {
    color: #2e7d32 !important;
}

/* ===== CHECKBOX ===== */
input[type="checkbox"]:checked {
    background-color: #1b5e20 !important;
    border-color: #1b5e20 !important;
}

/* ===== TABS ===== */
.nav-tabs .nav-link.active {
    border-bottom: 3px solid #1b5e20 !important;
    color: #1b5e20 !important;
}

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar-thumb {
    background-color: #2e7d32 !important;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #1b5e20 !important;
}

/* ===== NÚT COMPOSE ===== */
#layout-sidebar .sidebar-menu .create-mail,
.toolbar .compose,
a.button.compose {
    background-color: #2e7d32 !important;
    color: #ffffff !important;
    font-weight: bold !important;
}

#layout-sidebar .sidebar-menu .create-mail:hover,
.toolbar .compose:hover,
a.button.compose:hover {
    background-color: #388e3c !important;
}

/* ===== FORM INPUT FOCUS ===== */
input:focus,
textarea:focus,
select:focus,
.form-control:focus {
    border-color: #1b5e20 !important;
    box-shadow: 0 0 0 0.2rem rgba(27, 94, 32, 0.25) !important;
}

/* ===== PROGRESS BAR ===== */
.progress-bar {
    background-color: #1b5e20 !important;
}

/* ===== LOADING SPINNER ===== */
.spinner-border,
.spinner-grow {
    color: #1b5e20 !important;
}

/* ===== ALERT ===== */
.alert-success {
    background-color: #c8e6c9 !important;
    border-color: #2e7d32 !important;
    color: #0d3d11 !important;
}

/* ===== POPOVER/DROPDOWN ===== */
.popover,
.popupmenu {
    border-color: #a5d6a7 !important;
}

.popover-header {
    background-color: #2e7d32 !important;
    color: #ffffff !important;
}

.dropdown-menu .active {
    background-color: #2e7d32 !important;
}

/* ===== MESSAGE HEADER ===== */
.message-part .subject {
    color: #0d3d11 !important;
}

/* Message header khi xem email - nền trắng, gọn hơn */
#message-header,
#message-header .header,
.message-header {
    background-color: #ffffff !important;
    border: 1px solid #a5d6a7 !important;
    border-radius: 0.3rem !important;
    padding: 0.5rem 1rem !important;
    margin-bottom: 1rem !important;
}

/* Tiêu đề email - chữ xanh đậm */
#message-header .subject,
#message-header .subject a {
    color: #1b5e20 !important;
    font-size: 1.5rem !important;
    line-height: 1.3 !important;
    margin-bottom: 0.5rem !important;
}

/* Phần header content - giảm khoảng cách */
#message-header .header,
#message-header .header-content {
    margin: 0 !important;
    padding: 0 !important;
}

/* Label (From:, To:, Date:) - xanh đậm */
#message-header .header-title,
.message-partheaders .header-title {
    color: #1b5e20 !important;
    font-weight: bold !important;
    padding-right: 0.5rem !important;
}

/* Địa chỉ email và tên người gửi/nhận - xanh lợt - BỎ VIỀN */
#message-header .header-content,
#message-header .header-summary,
#message-header .header-summary > span,
#message-header .header-headers,
#message-header .header-headers td,
#message-header a:not(.button) {
    color: #2e7d32 !important;
    line-height: 1.5 !important;
    border: none !important;
    background: transparent !important;
}

/* Bỏ đường kẻ phân cách và viền các ô */
#message-header .header-summary,
#message-header .header-headers > div,
#message-header .header-headers tr,
#message-header .header-headers td,
#message-header .header-summary > span {
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
}

/* Header links - giảm margin */
#message-header .header-links {
    margin-top: 0.25rem !important;
}

/* Các nút/link trong header */
#message-header .header-links a {
    color: #1b5e20 !important;
}

#message-header .header-links a:hover {
    color: #2e7d32 !important;
}

/* Ảnh đại diện nếu có */
#message-header img.contactphoto {
    margin: 0 0.5rem 0 0 !important;
}

/* ===== BADGE ===== */
.badge-primary,
.label-primary {
    background-color: #1b5e20 !important;
}

/* === NÚT BẬT/TẮT (toggle switch) - màu xanh lá lợt === */
.switch input:checked + label {
    background-color: #81c784 !important; /* xanh lá lợt */
    border-color: #66bb6a !important;
}

.switch label {
    background-color: #c8e6c9 !important; /* màu nền khi tắt */
    border-color: #a5d6a7 !important;
}

/* === THANH QUOTA (dung lượng hộp thư) === */
#quota-widget .progressbar,
#quota-widget .progressbar .bar {
    background-color: #c8e6c9 !important; /* nền xanh rất nhạt */
}

#quota-widget .progressbar .bar {
    background-color: #66bb6a !important; /* thanh màu xanh lá lợt */
}

/* === Phần trăm dung lượng === */
#quota-widget .value {
    color: #1b5e20 !important; /* chữ xanh đậm */
    font-weight: bold;
}

/* === TOÀN BỘ NÚT BẬT/TẮT (switch toggle) === */
.switch input:checked + label {
    background-color: #81c784 !important; /* xanh lá lợt */
    border-color: #66bb6a !important;
}

.switch label {
    background-color: #c8e6c9 !important; /* nền nhạt */
    border-color: #a5d6a7 !important;
}

/* === MÀU NÚT, LIÊN KẾT, ICON, CHECKBOX ACTIVE === */
button.mainaction,
button:focus,
button:active,
button:hover,
.rcmList li.selected,
.rcmList li.selected a,
.rcmList li.selected span,
a.button:focus,
a.button:active,
a.button:hover,
a.rcmButton:focus,
a.rcmButton:active,
a.rcmButton:hover {
    background-color: #66bb6a !important;
    border-color: #388e3c !important;
    color: #fff !important;
}

/* === THANH QUOTA (bar và số %) === */
#quota-widget .progressbar {
    background-color: #c8e6c9 !important; /* nền xanh rất nhạt */
}
#quota-widget .progressbar .bar {
    background-color: #81c784 !important; /* xanh lá lợt */
}
#quota-widget .value {
    color: #1b5e20 !important;
    font-weight: bold;
}

/* === FOLDER SELECTED & SIDEBAR ITEM ACTIVE === */
#layout-sidebar .listing li.selected,
#layout-sidebar .listing li.selected a {
    background-color: #1b5e20 !important; /* xanh lá đậm */
    color: #ffffff !important;
}

/* === HIGHLIGHT TRÊN THANH MENU (Settings, Folders...) === */
#settings-menu li.selected a {
    background-color: #1b5e20 !important;
    color: #ffffff !important;
}
#settings-menu li a:hover {
    background-color: #388e3c !important;
    color: #ffffff !important;
}

/* === NÚT CHUYỂN (TOGGLE) XANH LỢT === */
input[type="checkbox"].switch:checked + label,
.toggle input:checked + .toggle-slider,
.rcm-switch input:checked + .switch-slider,
.switch input:checked + .slider {
  background-color: #99cc99 !important; /* xanh lá lợt */
  border-color: #7fbf7f !important;
}

.toggle-slider,
.switch .slider,
.switch-slider {
  background-color: #cde9cd !important; /* nền khi OFF */
  border: 1px solid #7fbf7f !important;
}

/* === THANH QUOTA XANH LỢT === */
#quotaBar .bar,
div.quota .bar,
.progress .bar,
.progress-bar {
  background-color: #99cc99 !important;
  border-radius: 4px !important;
}

/* === ĐẢM BẢO DARK MODE ICON KHÔNG MẤT === */
#theme-switch,
button#theme-switch,
a#theme-switch,
#darkmode-toggle {
  display: inline-block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* === FIX: NÚT CHUYỂN & QUOTA XANH LỢT CHUẨN ELASTIC === */

/* Toggle Switch (Dark Mode, Settings...) */
.custom-switch .custom-control-input:checked ~ .custom-control-label::before,
.switch input:checked + label,
input[type="checkbox"].switch:checked + label,
.toggle input:checked + .toggle-slider {
  background-color: #99cc99 !important;   /* xanh lá lợt */
  border-color: #7fbf7f !important;
}

.custom-switch .custom-control-label::before,
.switch label,
.toggle-slider {
  background-color: #d9ead3 !important;   /* nền khi tắt */
  border-color: #a5d6a7 !important;
}

/* Thanh quota trong plugin quota */
.quota-widget .bar,
#quota-widget .bar,
#quotaBar .bar {
  background-color: #99cc99 !important;   /* xanh lá lợt */
  border-radius: 4px !important;
}

/* Nền khung quota */
.quota-widget,
#quota-widget {
  background-color: #cde9cd !important;   /* nền nhạt hơn */
  border: 1px solid #a5d6a7 !important;
  color: #1b5e20 !important;
}

/* Chữ phần trăm quota */
.quota-widget .value,
#quota-widget .value {
  color: #1b5e20 !important;
  font-weight: bold;
}

/* Đảm bảo Dark Mode icon hiển thị */
#theme-switch,
button#theme-switch,
a#theme-switch,
#darkmode-toggle {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: #ffffff !important;
}

/* === FIX TOGGLE (các nút ON/OFF) === */
.custom-switch .custom-control-input:checked ~ .custom-control-label::before {
  background-color: #99cc99 !important;   /* xanh lá lợt */
  border-color: #7fbf7f !important;
}

.custom-switch .custom-control-label::before {
  background-color: #cde9cd !important;   /* nền khi OFF */
  border-color: #a5d6a7 !important;
}


/* === TOGGLE SWITCH (Xanh lá lợt) === */
.custom-control.custom-switch .custom-control-input:checked ~ .custom-control-label::before {
  background-color: #9ad19a !important;   /* xanh lá lợt khi bật */
  border-color: #7cbf7c !important;
}

.custom-control.custom-switch .custom-control-label::before {
  background-color: #e2f1e2 !important;   /* nền nhạt khi tắt */
  border-color: #b2d8b2 !important;
}

.custom-control.custom-switch .custom-control-label::after {
  background-color: #ffffff !important;   /* nút tròn trắng */
}

/* === QUOTA BAR (bao phủ mọi phiên bản Roundcube) === */
div#quotadisplay.quota-widget .bar,
div#quota-widget .bar,
div#rcmquotadisplay .bar {
  background-color: #e2f1e2 !important;   /* nền thanh quota nhạt */
  border-radius: 6px !important;
  overflow: hidden;
}

div#quotadisplay.quota-widget .bar .value,
div#quota-widget .bar .value,
div#rcmquotadisplay .bar .value {
  background-color: #9ad19a !important;   /* thanh tiến trình xanh lá lợt */
  border-radius: 6px 0 0 6px !important;
}

/* === CHỮ QUOTA === */
div#quotadisplay.quota-widget .count,
div#quotadisplay.quota-widget .voice,
div#quota-widget .count,
div#quota-widget .voice,
div#rcmquotadisplay .count,
div#rcmquotadisplay .voice {
  color: #1b5e20 !important;
  font-weight: 600 !important;
}

/* === KHÔI PHỤC ICON DARK MODE === */
#theme-switch, button#theme-switch, a#theme-switch, #darkmode-toggle {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* === TOGGLE SWITCH (Bật/tắt màu xanh lá lợt) === */
.custom-control.custom-switch .custom-control-input:checked ~ .custom-control-label::before {
  background-color: #9ad19a !important;  /* xanh lá lợt khi bật */
  border-color: #7cbf7c !important;
}

.custom-control.custom-switch .custom-control-label::before {
  background-color: #e2f1e2 !important;  /* nền nhạt khi tắt */
  border-color: #b2d8b2 !important;
}

.custom-control.custom-switch .custom-control-label::after {
  background-color: #ffffff !important;   /* nút tròn trắng */
}

/* === QUOTA BAR (ghi đè mạnh hơn Elastic) === */
body div#quotadisplay.quota-widget .bar {
  background: #e2f1e2 !important;        /* nền thanh quota nhạt */
  border-radius: 6px !important;
  overflow: hidden;
  height: 6px !important;
  margin-left: 6px;
}

body div#quotadisplay.quota-widget .bar .value {
  background: #9ad19a !important;        /* phần tiến trình xanh lá lợt */
  height: 6px !important;
  display: block !important;
  border-radius: 6px 0 0 6px !important;
}

/* === CHỮ TRONG QUOTA === */
body div#quotadisplay.quota-widget .count,
body div#quotadisplay.quota-widget .voice {
  color: #1b5e20 !important;
  font-weight: 600 !important;
}

/* === KHÔI PHỤC ICON DARK MODE === */
#theme-switch, button#theme-switch, a#theme-switch, #darkmode-toggle {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
}
/* === FORCE OVERRIDE ROUNDcube QUOTA BAR === */
html body div#quotadisplay.quota-widget span.bar {
  background: #e2f1e2 !important;        /* nền thanh quota nhạt */
  border-radius: 6px !important;
  overflow: hidden !important;
  height: 6px !important;
}

html body div#quotadisplay.quota-widget span.bar span.value {
  background: #9ad19a !important;        /* xanh lá lợt */
  background-image: none !important;     /* xóa gradient xanh dương gốc */
  border: none !important;
  height: 6px !important;
  display: block !important;
  border-radius: 6px 0 0 6px !important;
  transition: none !important;
}

/* === CHỮ TRONG QUOTA === */
html body div#quotadisplay.quota-widget .count,
html body div#quotadisplay.quota-widget .voice {
  color: #1b5e20 !important;
  font-weight: 600 !important;
}
/* === FIX QUOTA BAR COLOR (Final version) === */
body .quota-widget .value {
  background-color: #9ad19a !important;    /* xanh lá lợt */
  opacity: 1 !important;                   /* bỏ hiệu ứng mờ */
  height: 1rem !important;                 /* giữ nguyên kích thước gốc */
}

body .quota-widget .bar {
  background-color: #e2f1e2 !important;    /* nền nhạt */
  border-radius: 6px !important;
  overflow: hidden !important;
}

body .quota-widget .count,
body .quota-widget .voice {
  color: #1b5e20 !important;               /* chữ xanh đậm */
  font-weight: 600 !important;
}

/* === FORCE OVERRIDE FINAL === */
html body .quota-widget .value {
  background-color: #9ad19a !important;   /* xanh lá lợt */
  background-image: none !important;
  opacity: 1 !important;
  height: 1rem !important;
  border: none !important;
  display: block !important;
  transition: none !important;
}