/* =========================================================
   Office portal dark mode (polished)
   Toggle: html.portal-dark / data-bs-theme="dark"
   ========================================================= */

html.portal-dark {
    color-scheme: dark;
    --portal-primary: #7aa2ff;
    --portal-primary-dark: #5d86f0;
    --portal-primary-soft: rgba(122, 162, 255, 0.14);
    --portal-shell-text: #e7ecf5;
    --portal-shell-muted: #97a3b8;
    --portal-shell-border: #2c3648;
    --dm-bg: #0e1218;
    --dm-surface: #12171f;
    --dm-elevated: #1b2330;
    --dm-hover: #1c2432;
    --dm-text: #e7ecf5;
    --dm-muted: #97a3b8;
    --dm-border: #2c3648;
    --dm-input: #10161f;
    --dm-accent: #7aa2ff;
    --dm-accent-soft: rgba(122, 162, 255, 0.16);
    --dm-danger: #f07178;
    --dm-shadow: rgba(0, 0, 0, 0.4);
}

/* ---------- Base ---------- */
html.portal-dark body,
html.portal-dark .page-wrapper,
html.portal-dark #content,
html.portal-dark #page-content,
html.portal-dark .page-content,
html.portal-dark .main-content,
html.portal-dark .content-area,
html.portal-dark .portal-list-page {
    background: var(--dm-bg) !important;
    color: var(--dm-text) !important;
}

html.portal-dark .portal-list-page {
    --portal-list-accent: var(--dm-accent);
    --portal-list-accent-dark: #9bbcff;
    --portal-list-accent-soft: var(--dm-accent-soft);
    --portal-list-border: var(--dm-border);
    --portal-list-muted: var(--dm-muted);
    --portal-list-ink: var(--dm-text);
}

html.portal-dark h1,
html.portal-dark h2,
html.portal-dark h3,
html.portal-dark h4,
html.portal-dark h5,
html.portal-dark h6,
html.portal-dark .page-title,
html.portal-dark .general-form label,
html.portal-dark .form-group label,
html.portal-dark label {
    color: var(--dm-text) !important;
}

html.portal-dark .text-off,
html.portal-dark .text-muted,
html.portal-dark .help,
html.portal-dark small,
html.portal-dark .meta {
    color: var(--dm-muted) !important;
}

html.portal-dark a:not(.btn):not(.dropdown-item):not(.nav-link):not(.list-group-item):not(.edit):not(.delete) {
    color: var(--dm-accent);
}

html.portal-dark a:not(.btn):not(.dropdown-item):not(.nav-link):hover {
    color: #a8c2ff;
}

html.portal-dark .project-comment-description a,
html.portal-dark .project-comment-description a:link,
html.portal-dark .project-comment-description a:visited,
html.portal-dark .project-comment-description a *,
html.portal-dark .comment-container .project-comment-description a,
html.portal-dark .comment-text-link {
    color: #7aa2ff !important;
    text-decoration: underline !important;
    font-weight: 600;
}

html.portal-dark .project-comment-description a:hover,
html.portal-dark .project-comment-description a:hover *,
html.portal-dark .comment-text-link:hover {
    color: #b4cbff !important;
}

/* ---------- Topbar ---------- */
html.portal-dark .portal-topbar.navbar-custom,
html.portal-dark .navbar-custom,
html.portal-dark .navbar-light {
    background: #12171f !important;
    border-bottom: 1px solid #2c3648 !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.02) !important;
}

html.portal-dark .portal-topbar .nav-link,
html.portal-dark .portal-topbar .icon,
html.portal-dark .portal-topbar svg,
html.portal-dark .portal-user-chevron {
    color: var(--dm-muted) !important;
}

html.portal-dark .portal-topbar .nav-link:hover,
html.portal-dark .portal-topbar .nav-link:focus {
    color: var(--dm-text) !important;
}

html.portal-dark .portal-topbar-search {
    background: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    box-shadow: none !important;
    color: var(--dm-muted) !important;
}

html.portal-dark .portal-topbar-search:hover,
html.portal-dark .portal-topbar-search:focus {
    border-color: var(--dm-accent) !important;
    color: var(--dm-text) !important;
    box-shadow: 0 0 0 3px var(--dm-accent-soft) !important;
}

html.portal-dark .portal-topbar-search-placeholder,
html.portal-dark .portal-user-copy small {
    color: var(--dm-muted) !important;
}

html.portal-dark .portal-user-copy strong {
    color: var(--dm-text) !important;
}

html.portal-dark .portal-topbar-shortcut kbd {
    background: var(--dm-elevated) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-muted) !important;
}

/* ---------- Sidebar (beat app.all .sidebar-scroll #FFF) ---------- */
html.portal-dark {
    --portal-shell-text: #e7ecf5;
    --portal-shell-muted: #97a3b8;
    --portal-shell-border: #2c3648;
    --portal-primary: #7aa2ff;
    --portal-primary-dark: #5d86f0;
    --portal-primary-soft: rgba(122, 162, 255, 0.14);
}

html.portal-dark .portal-sidebar.sidebar,
html.portal-dark .sidebar,
html.portal-dark .sidebar.sidebar-off,
html.portal-dark body .sidebar,
html.portal-dark body.messages-page .sidebar {
    background: #12171f !important;
    background-color: #12171f !important;
    border-right: 1px solid #2c3648 !important;
    box-shadow: none !important;
}

html.portal-dark .portal-sidebar .sidebar-brand,
html.portal-dark .sidebar-brand,
html.portal-dark .sidebar .sidebar-brand,
html.portal-dark body.messages-page .sidebar-brand {
    background: #12171f !important;
    background-color: #12171f !important;
    border-bottom: 1px solid #2c3648 !important;
}

html.portal-dark .portal-sidebar .sidebar-scroll,
html.portal-dark .sidebar .sidebar-scroll,
html.portal-dark .sidebar-scroll,
html.portal-dark body.messages-page .sidebar-scroll {
    background: #12171f !important;
    background-color: #12171f !important;
    border-color: #2c3648 !important;
    scrollbar-color: #3a465c transparent;
}

html.portal-dark .portal-sidebar .sidebar-scroll::-webkit-scrollbar-thumb,
html.portal-dark .sidebar-scroll::-webkit-scrollbar-thumb {
    background: #3a465c !important;
}

html.portal-dark .portal-sidebar .sidebar-menu > li.main > a,
html.portal-dark .sidebar-menu > li > a,
html.portal-dark .sidebar-menu > li.main > a {
    color: #a8b4c8 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}

html.portal-dark .portal-sidebar .sidebar-menu > li.main > a .icon,
html.portal-dark .portal-sidebar .sidebar-menu > li.main > a > svg,
html.portal-dark .sidebar-menu > li.main > a > svg {
    color: #8b98ad !important;
    stroke: currentColor !important;
}

html.portal-dark .portal-sidebar .sidebar-menu > li.main > a:hover,
html.portal-dark .portal-sidebar .sidebar-menu > li.main > a:focus,
html.portal-dark .sidebar-menu > li.main > a:hover,
html.portal-dark .sidebar-menu > li.main > a:focus {
    background: #1c2432 !important;
    background-image: none !important;
    color: #eef3ff !important;
}

html.portal-dark .portal-sidebar .sidebar-menu > li.main > a:hover svg,
html.portal-dark .portal-sidebar .sidebar-menu > li.main > a:focus svg {
    color: #d7e4ff !important;
}

html.portal-dark .portal-sidebar .sidebar-menu > li.main.active > a,
html.portal-dark .sidebar-menu > li.main.active > a,
html.portal-dark .sidebar-menu li.active > a {
    color: #eaf0ff !important;
    background: rgba(122, 162, 255, 0.18) !important;
    background-image: none !important;
    box-shadow: inset 3px 0 0 #7aa2ff !important;
}

html.portal-dark .portal-sidebar .sidebar-menu > li.main.active > a svg,
html.portal-dark .sidebar-menu > li.main.active > a svg {
    color: #d7e4ff !important;
}

html.portal-dark .portal-sidebar .portal-menu-section {
    color: #66758d !important;
}

html.portal-dark .portal-sidebar-collapse,
html.portal-dark .portal-sidebar .portal-sidebar-collapse {
    color: #97a3b8 !important;
    background: transparent !important;
    border-color: transparent !important;
}

html.portal-dark .portal-sidebar-collapse:hover,
html.portal-dark .portal-sidebar-collapse:focus {
    color: #d7e4ff !important;
    background: rgba(122, 162, 255, 0.14) !important;
    border-color: #3a4a66 !important;
}

html.portal-dark .portal-sidebar-help {
    color: #e7ecf5 !important;
    background: linear-gradient(135deg, #1b2330 0%, #182030 100%) !important;
    border: 1px solid #2c3648 !important;
    box-shadow: none !important;
}

html.portal-dark .portal-sidebar-help:hover,
html.portal-dark .portal-sidebar-help:focus {
    color: #d7e4ff !important;
    border-color: #4d6bb8 !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.35) !important;
}

html.portal-dark .portal-sidebar-help-copy strong {
    color: #f0f4fb !important;
}

html.portal-dark .portal-sidebar-help-copy small,
html.portal-dark .portal-sidebar-help-arrow {
    color: #97a3b8 !important;
}

html.portal-dark .portal-sidebar-help-icon {
    background: rgba(122, 162, 255, 0.16) !important;
    color: #9bbcff !important;
    border-color: #3a4a66 !important;
}

/* ---------- Page hero (Projects white banner fix) ---------- */
html.portal-dark .portal-page-hero {
    background: linear-gradient(135deg, #1a2433 0%, #151d2a 55%, #121925 100%) !important;
    border: 1px solid var(--dm-border) !important;
    box-shadow: 0 8px 24px var(--dm-shadow) !important;
}

html.portal-dark .portal-page-hero-copy h1 {
    color: #f0f4fb !important;
}

html.portal-dark .portal-page-hero-copy p {
    color: var(--dm-muted) !important;
}

html.portal-dark .portal-page-art-back {
    background: rgba(122, 162, 255, 0.18) !important;
    color: #9bbcff !important;
}

html.portal-dark .portal-page-art-front {
    background: var(--dm-elevated) !important;
    border-color: #3a4a66 !important;
    color: var(--dm-accent) !important;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.35) !important;
}

html.portal-dark .portal-page-sparkle {
    color: #8eafff !important;
}

/* ---------- List cards / toolbars / tabs ---------- */
html.portal-dark .portal-list-card,
html.portal-dark .portal-list-tabs,
html.portal-dark .portal-list-card-topbar,
html.portal-dark .portal-tabbed-toolbar,
html.portal-dark .portal-list-table-wrap .filter-section-container,
html.portal-dark .card,
html.portal-dark .panel,
html.portal-dark .white-box,
html.portal-dark .bg-white,
html.portal-dark .dropdown-details.bg-white,
html.portal-dark .general-form.white,
html.portal-dark .box,
html.portal-dark .widget {
    background: var(--dm-elevated) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    box-shadow: 0 6px 20px var(--dm-shadow) !important;
}

html.portal-dark .portal-list-card {
    box-shadow: 0 4px 18px var(--dm-shadow) !important;
}

html.portal-dark .portal-list-card-topbar,
html.portal-dark .portal-list-table-wrap .filter-section-container,
html.portal-dark .card-header,
html.portal-dark .card-footer,
html.portal-dark .panel-heading,
html.portal-dark .panel-footer {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.portal-dark .portal-list-tabs .nav-link {
    color: var(--dm-muted) !important;
    background: transparent !important;
}

html.portal-dark .portal-list-tabs .nav-link:hover,
html.portal-dark .portal-list-tabs .nav-link.active {
    color: #d7e4ff !important;
}

html.portal-dark .portal-list-tabs .nav-link.active::after {
    background: var(--dm-accent) !important;
}

html.portal-dark .portal-list-table-wrap .dataTables_filter input,
html.portal-dark .portal-list-table-wrap .select2-container .select2-choice,
html.portal-dark .portal-list-table-wrap .dt-buttons .btn,
html.portal-dark .portal-list-table-wrap .dt-buttons button,
html.portal-dark .portal-list-table-wrap .filter-section-container .btn-default {
    background: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    box-shadow: none !important;
}

html.portal-dark .portal-list-table-wrap .dataTables_filter input:focus {
    border-color: var(--dm-accent) !important;
    box-shadow: 0 0 0 3px var(--dm-accent-soft) !important;
}

html.portal-dark .portal-list-table-wrap .dt-buttons .btn:hover,
html.portal-dark .portal-list-table-wrap .dt-buttons button:hover,
html.portal-dark .portal-list-table-wrap .filter-section-container .btn-default:hover {
    background: var(--dm-accent-soft) !important;
    border-color: #4d6bb8 !important;
    color: #d7e4ff !important;
}

html.portal-dark .portal-list-table-wrap .filter-form {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}

/* ---------- Tables ---------- */
html.portal-dark table,
html.portal-dark .table,
html.portal-dark .dataTables_wrapper,
html.portal-dark table.dataTable,
html.portal-dark .portal-list-card .dataTable {
    color: var(--dm-text) !important;
    background: transparent !important;
}

html.portal-dark .table > :not(caption) > * > *,
html.portal-dark table.dataTable thead th,
html.portal-dark table.dataTable tbody td,
html.portal-dark .table th,
html.portal-dark .table td,
html.portal-dark .portal-list-card .dataTable thead th,
html.portal-dark .portal-list-card .dataTable tbody td {
    background-color: var(--dm-elevated) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
}

html.portal-dark table.dataTable thead th,
html.portal-dark .portal-list-card .dataTable thead th {
    background-color: #1a2230 !important;
    color: var(--dm-muted) !important;
    font-weight: 600;
}

html.portal-dark table.dataTable tbody tr:hover > *,
html.portal-dark .table-hover > tbody > tr:hover > *,
html.portal-dark .portal-list-card .dataTable tbody tr:hover td {
    background-color: var(--dm-hover) !important;
    color: var(--dm-text) !important;
}

html.portal-dark .portal-list-card .dataTable a:not(.edit):not(.delete) {
    color: var(--dm-accent) !important;
}

html.portal-dark .portal-list-card .dataTable a:not(.edit):not(.delete):hover {
    color: #b6ccff !important;
}

/* White circular edit/delete buttons → dark chips */
html.portal-dark .portal-list-card td.option a.edit,
html.portal-dark .portal-list-card td.option a.delete,
html.portal-dark td.option a.edit,
html.portal-dark td.option a.delete {
    background: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-muted) !important;
    box-shadow: none !important;
}

html.portal-dark .portal-list-card td.option a.edit:hover,
html.portal-dark .portal-list-card td.option a.delete:hover,
html.portal-dark td.option a.edit:hover,
html.portal-dark td.option a.delete:hover {
    background: var(--dm-accent-soft) !important;
    border-color: #4d6bb8 !important;
    color: #d7e4ff !important;
}

html.portal-dark .badge,
html.portal-dark .badge-light,
html.portal-dark .bg-light {
    background: var(--dm-accent-soft) !important;
    color: #d7e4ff !important;
    border-color: transparent !important;
}

html.portal-dark .page-link {
    background: var(--dm-elevated) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.portal-dark .page-item.active .page-link {
    background: var(--dm-accent) !important;
    border-color: var(--dm-accent) !important;
    color: #0e1218 !important;
}

html.portal-dark .page-item.disabled .page-link {
    background: var(--dm-surface) !important;
    color: #66758a !important;
}

html.portal-dark div.dataTables_wrapper div.dataTables_info,
html.portal-dark div.dataTables_wrapper div.dataTables_paginate {
    color: var(--dm-muted) !important;
}

/* ---------- Forms ---------- */
html.portal-dark .form-control,
html.portal-dark .form-select,
html.portal-dark input[type="text"],
html.portal-dark input[type="email"],
html.portal-dark input[type="password"],
html.portal-dark input[type="number"],
html.portal-dark input[type="search"],
html.portal-dark input[type="date"],
html.portal-dark input[type="time"],
html.portal-dark textarea,
html.portal-dark select,
html.portal-dark .select2-container--default .select2-selection--single,
html.portal-dark .select2-container--default .select2-selection--multiple {
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.portal-dark .form-control:focus,
html.portal-dark .form-select:focus,
html.portal-dark textarea:focus {
    border-color: var(--dm-accent) !important;
    box-shadow: 0 0 0 0.2rem var(--dm-accent-soft) !important;
}

html.portal-dark .form-control::placeholder,
html.portal-dark textarea::placeholder {
    color: #6f7f96 !important;
}

html.portal-dark .select2-dropdown,
html.portal-dark .select2-container--default .select2-results__option {
    background-color: var(--dm-elevated) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
}

html.portal-dark .select2-container--default .select2-results__option--highlighted[aria-selected],
html.portal-dark .select2-container--default .select2-results__option--selected {
    background-color: var(--dm-accent-soft) !important;
    color: #d7e4ff !important;
}

html.portal-dark .btn-default,
html.portal-dark .btn-light,
html.portal-dark .btn-outline-secondary {
    background: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.portal-dark .btn-default:hover,
html.portal-dark .btn-light:hover {
    background: var(--dm-hover) !important;
    color: #fff !important;
}

html.portal-dark .btn-primary {
    background: var(--dm-accent) !important;
    border-color: var(--dm-accent) !important;
    color: #0e1218 !important;
}

html.portal-dark .btn-primary:hover {
    background: #93b3ff !important;
    border-color: #93b3ff !important;
    color: #0e1218 !important;
}

/* ---------- Dropdowns / modals ---------- */
html.portal-dark .dropdown-menu,
html.portal-dark .popover,
html.portal-dark .modal-content,
html.portal-dark .ajax-modal .modal-content {
    background: var(--dm-elevated) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    box-shadow: 0 16px 40px var(--dm-shadow) !important;
}

html.portal-dark .modal-header,
html.portal-dark .modal-footer {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}

html.portal-dark .dropdown-item {
    color: var(--dm-text) !important;
}

html.portal-dark .dropdown-item:hover,
html.portal-dark .dropdown-item:focus,
html.portal-dark .dropdown-item.active {
    background: var(--dm-hover) !important;
    color: #fff !important;
}

html.portal-dark .dropdown-divider,
html.portal-dark .dashed-row .form-group,
html.portal-dark .list-group-item,
html.portal-dark .border,
html.portal-dark .border-top,
html.portal-dark .border-bottom {
    border-color: var(--dm-border) !important;
}

html.portal-dark .list-group-item {
    background: var(--dm-elevated) !important;
    color: var(--dm-text) !important;
}

html.portal-dark .modal-backdrop.show {
    opacity: 0.72;
}

/* ---------- Tabs ---------- */
html.portal-dark .nav-tabs {
    border-bottom-color: var(--dm-border) !important;
}

html.portal-dark .nav-tabs .nav-link {
    color: var(--dm-muted) !important;
}

html.portal-dark .nav-tabs .nav-link.active {
    background: var(--dm-elevated) !important;
    border-color: var(--dm-border) var(--dm-border) var(--dm-elevated) !important;
    color: var(--dm-text) !important;
}

/* ---------- Domain pages ---------- */
html.portal-dark .email-integrations-page,
html.portal-dark .ei-folders,
html.portal-dark .ei-folder {
    background: var(--dm-elevated) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.portal-dark .ei-folder.active {
    background: var(--dm-accent-soft) !important;
    color: #d7e4ff !important;
}

html.portal-dark .ei-row-who,
html.portal-dark .fp-title {
    color: var(--dm-text) !important;
}

html.portal-dark .ei-row-preview {
    color: var(--dm-muted) !important;
}

html.portal-dark .google-chat-layout,
html.portal-dark .google-chat-sidebar,
html.portal-dark .google-chat-thread,
html.portal-dark .google-chat-messages,
html.portal-dark .google-chat-thread-head,
html.portal-dark .google-chat-composer,
html.portal-dark .js-google-chat-space {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.portal-dark .chat-msg a,
html.portal-dark .group-chat-bubble a,
html.portal-dark .js-message-reply p a,
html.portal-dark .message-container p a {
    color: var(--dm-accent) !important;
}

html.portal-dark .message-container,
html.portal-dark .b-b.bg-white,
html.portal-dark .card-header.bg-white,
html.portal-dark .card-footer.bg-white {
    background: var(--dm-elevated) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

/* Progress / task chips in tables */
html.portal-dark .progress {
    background: #10161f !important;
}

html.portal-dark .progress-bar {
    background: var(--dm-accent) !important;
}

/* Deadline reds stay readable */
html.portal-dark .text-danger,
html.portal-dark .overdue {
    color: var(--dm-danger) !important;
}

/* Scrollbars */
html.portal-dark * {
    scrollbar-color: #3a465a var(--dm-bg);
}

html.portal-dark ::-webkit-scrollbar-track {
    background: var(--dm-bg);
}

html.portal-dark ::-webkit-scrollbar-thumb {
    background: #3a465a;
    border-radius: 8px;
}

/* Toggle button */
.portal-dark-mode-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    border: 1px solid transparent;
    background: transparent;
    color: inherit;
    cursor: pointer;
    padding: 0;
}

.portal-dark-mode-toggle:hover {
    background: rgba(16, 33, 62, 0.06);
}

html.portal-dark .portal-dark-mode-toggle:hover {
    background: var(--dm-hover);
}

.portal-dark-mode-toggle .icon-moon,
.portal-dark-mode-toggle .icon-sun {
    display: none;
}

html:not(.portal-dark) .portal-dark-mode-toggle .icon-moon {
    display: block;
}

html.portal-dark .portal-dark-mode-toggle .icon-sun {
    display: block;
}

/* =========================================================
   Projects index (inline page styles override white surfaces)
   ========================================================= */
html.portal-dark .projects-index-page {
    --projects-accent: #7aa2ff;
    --projects-accent-dark: #9bbcff;
    --projects-accent-soft: rgba(122, 162, 255, 0.16);
    --projects-border: #2c3648;
    --projects-muted: #97a3b8;
    --projects-ink: #e7ecf5;
    background: #0e1218 !important;
}

html.portal-dark .projects-hero,
html.portal-dark .workhours-page .projects-hero {
    background: linear-gradient(135deg, #1a2433 0%, #151d2a 60%, #121925 100%) !important;
    border-color: #2c3648 !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35) !important;
}

html.portal-dark .projects-hero-copy h1,
html.portal-dark .workhours-page .projects-hero-copy h1 {
    color: #f0f4fb !important;
}

html.portal-dark .projects-hero-copy p,
html.portal-dark .workhours-page .projects-hero-copy p {
    color: #97a3b8 !important;
}

html.portal-dark .projects-art-folder {
    background: rgba(122, 162, 255, 0.18) !important;
    color: #9bbcff !important;
}

html.portal-dark .projects-art-list {
    background: #1b2330 !important;
    border-color: #3a4a66 !important;
    color: #7aa2ff !important;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.35) !important;
}

html.portal-dark .projects-list-card,
html.portal-dark .project-status-tabs,
html.portal-dark .projects-table-wrap .filter-section-container,
html.portal-dark .projects-member-view .projects-table-wrap .filter-form {
    background: #1b2330 !important;
    border-color: #2c3648 !important;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.3) !important;
}

html.portal-dark .projects-manager-topbar,
html.portal-dark .projects-member-toolbar {
    background: #151b24 !important;
    border-bottom-color: #2c3648 !important;
}

html.portal-dark .projects-tool-button {
    background: #10161f !important;
    border-color: #2c3648 !important;
    color: #c5d0e0 !important;
}

html.portal-dark .projects-tool-button:hover,
html.portal-dark .projects-tool-button:focus,
html.portal-dark .projects-tool-button.active {
    background: rgba(122, 162, 255, 0.16) !important;
    border-color: #4d6bb8 !important;
    color: #d7e4ff !important;
}

html.portal-dark .project-status-tabs .nav-link {
    color: #97a3b8 !important;
    background: transparent !important;
}

html.portal-dark .project-status-tabs .nav-link:hover,
html.portal-dark .project-status-tabs .nav-link.active {
    color: #d7e4ff !important;
}

html.portal-dark .projects-table-wrap .dataTables_filter input,
html.portal-dark .projects-member-search .dataTables_filter input,
html.portal-dark .projects-table-wrap .dt-buttons .btn,
html.portal-dark .projects-table-wrap .dt-buttons button {
    background: #10161f !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .projects-list-card .dataTable thead th {
    background: #1a2230 !important;
    color: #97a3b8 !important;
    border-bottom-color: #2c3648 !important;
}

html.portal-dark .projects-list-card .dataTable tbody td {
    background: #1b2330 !important;
    color: #d5dde9 !important;
    border-bottom-color: #2c3648 !important;
}

html.portal-dark .projects-list-card .dataTable tbody tr:hover td {
    background: #243044 !important;
}

html.portal-dark .projects-list-card .dataTable a:not(.edit):not(.delete) {
    color: #7aa2ff !important;
}

html.portal-dark .projects-list-card .project-task-count {
    background: rgba(122, 162, 255, 0.16) !important;
    color: #d7e4ff !important;
}

html.portal-dark .projects-list-card .project-task-count-empty {
    background: #243044 !important;
    color: #97a3b8 !important;
}

html.portal-dark .projects-list-card td .text-off {
    color: #97a3b8 !important;
}

html.portal-dark .projects-list-card td.option a.edit,
html.portal-dark .projects-list-card td.option a.delete {
    background: #10161f !important;
    border-color: #2c3648 !important;
    color: #97a3b8 !important;
}

html.portal-dark .projects-list-card td.option a.edit:hover,
html.portal-dark .projects-list-card td.option a.delete:hover {
    background: rgba(122, 162, 255, 0.16) !important;
    border-color: #4d6bb8 !important;
    color: #d7e4ff !important;
}

html.portal-dark .projects-list-card .dataTables_info,
html.portal-dark .projects-list-card .dataTables_paginate {
    color: #97a3b8 !important;
}

html.portal-dark .projects-toolbar-menu {
    background: #1b2330 !important;
    border-color: #2c3648 !important;
}

html.portal-dark .projects-toolbar-menu .dropdown-item {
    color: #d5dde9 !important;
}

html.portal-dark .projects-toolbar-menu .dropdown-item:hover,
html.portal-dark .projects-toolbar-menu .dropdown-item.active {
    background: rgba(122, 162, 255, 0.16) !important;
    color: #d7e4ff !important;
}

html.portal-dark .projects-mobile-header {
    background: #1b2330 !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .projects-mobile-title {
    color: #f0f4fb !important;
}

html.portal-dark .projects-mobile-subtitle {
    color: #97a3b8 !important;
}

/* =========================================================
   APP-WIDE late overrides (reloaded at end of body too)
   Messages + chat + generic white surfaces
   ========================================================= */

html.portal-dark .bg-white,
html.portal-dark .card.bg-white,
html.portal-dark .card-header.bg-white,
html.portal-dark .card-footer.bg-white,
html.portal-dark .dropdown-details.bg-white,
html.portal-dark .b-b.bg-white,
html.portal-dark .b-b.p15.m0.bg-white {
    background-color: #1b2330 !important;
    background: #1b2330 !important;
    color: #e7ecf5 !important;
    border-color: #2c3648 !important;
}

html.portal-dark body.messages-page {
    --messages-navy: #e7ecf5;
    --messages-blue: #7aa2ff;
    --messages-border: #2c3648;
    --messages-soft-blue: rgba(122, 162, 255, 0.14);
}

html.portal-dark body.messages-page .sidebar,
html.portal-dark body.messages-page .sidebar-brand,
html.portal-dark body.messages-page .sidebar-scroll {
    background: #12171f !important;
    background-color: #12171f !important;
    border-color: #2c3648 !important;
}

html.portal-dark #page-content.messages-page-container,
html.portal-dark .messages-workspace {
    background: #0e1218 !important;
    color: #e7ecf5 !important;
    border-color: #2c3648 !important;
}

html.portal-dark .messages-conversations-panel {
    background: #12171f !important;
    border-right: 1px solid #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .messages-thread-panel,
html.portal-dark .messages-chat-panel,
html.portal-dark .messages-active-pane,
html.portal-dark .messages-empty-state {
    background: #151b24 !important;
    color: #e7ecf5 !important;
    border-color: #2c3648 !important;
}

html.portal-dark .messages-list-scroll,
html.portal-dark .messages-conversation-list {
    background: #12171f !important;
    color: #e7ecf5 !important;
    border-color: #2c3648 !important;
}

html.portal-dark .messages-list-heading,
html.portal-dark .messages-list-tools,
html.portal-dark .messages-filter-tabs,
html.portal-dark .messages-conversations-panel .card,
html.portal-dark .messages-conversations-panel .card-header,
html.portal-dark .messages-conversations-panel .card-body {
    background: #12171f !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .messages-list-heading h1 {
    color: #f0f4fb !important;
}

html.portal-dark .messages-new-button {
    background: #1b2330 !important;
    border-color: #4d6bb8 !important;
    color: #9bbcff !important;
}

html.portal-dark .messages-new-button:hover {
    background: rgba(122, 162, 255, 0.16) !important;
}

html.portal-dark .messages-search-box,
html.portal-dark .messages-search-box input,
html.portal-dark .messages-search-input {
    background: #10161f !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .messages-filter-tab,
html.portal-dark .messages-tabs .nav-link,
html.portal-dark .messages-type-tabs button,
html.portal-dark .messages-type-tab {
    background: transparent !important;
    color: #97a3b8 !important;
}

html.portal-dark .messages-filter-tab.active,
html.portal-dark .messages-tabs .nav-link.active,
html.portal-dark .messages-type-tabs button.active,
html.portal-dark .messages-type-tab.active {
    color: #d7e4ff !important;
    background: rgba(122, 162, 255, 0.14) !important;
}

html.portal-dark .messages-conversation-item,
html.portal-dark .messages-row,
html.portal-dark .js-message-row,
html.portal-dark .message-row,
html.portal-dark a.messages-conversation-link {
    background: #151b24 !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .messages-conversation-item:hover,
html.portal-dark .messages-row:hover,
html.portal-dark .message-row:hover,
html.portal-dark .messages-conversation-item.active,
html.portal-dark .messages-row.active,
html.portal-dark .message-row.active,
html.portal-dark .messages-conversation-item.is-active {
    background: #243044 !important;
}

html.portal-dark .messages-conversation-item.unread,
html.portal-dark .message-row.unread {
    background: rgba(122, 162, 255, 0.1) !important;
    border-left-color: #7aa2ff !important;
}

html.portal-dark .messages-conversation-title,
html.portal-dark .messages-row-title,
html.portal-dark .message-row strong {
    color: #f0f4fb !important;
}

html.portal-dark .messages-conversation-preview,
html.portal-dark .messages-row-preview,
html.portal-dark .portal-side-chat-preview {
    color: #97a3b8 !important;
}

html.portal-dark .messages-row-time,
html.portal-dark .message-row .time {
    color: #7d8aa0 !important;
}

html.portal-dark .messages-sidebar-collapse {
    background: #1b2330 !important;
    border-color: #2c3648 !important;
    color: #97a3b8 !important;
}

html.portal-dark body.messages-page .member-chat-page-view,
html.portal-dark body.messages-page .member-chat-header,
html.portal-dark body.messages-page .member-chat-compose-panel,
html.portal-dark body.messages-page .member-chat-page-messages-wrapper,
html.portal-dark .member-chat-page-view,
html.portal-dark .member-chat-header,
html.portal-dark .member-chat-compose-panel,
html.portal-dark .member-chat-page-messages-wrapper {
    background: #151b24 !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark body.messages-page .member-chat-compose-panel {
    background: #1b2330 !important;
    border-top-color: #2c3648 !important;
    box-shadow: none !important;
}

html.portal-dark body.messages-page .member-chat-compose-row,
html.portal-dark .member-chat-compose-row {
    background: #1b2330 !important;
    border-color: #2c3648 !important;
    box-shadow: none !important;
}

html.portal-dark body.messages-page .member-chat-page-messages-wrapper .direct-chat-bubble,
html.portal-dark body.messages-page .member-chat-page-messages-wrapper .chat-other .direct-chat-bubble,
html.portal-dark .direct-chat-bubble {
    background: #1e2838 !important;
    border: 1px solid #334155 !important;
    color: #e7ecf5 !important;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) !important;
}

html.portal-dark body.messages-page .member-chat-page-messages-wrapper .chat-me:not(.is-deleted) .direct-chat-bubble,
html.portal-dark .chat-me:not(.is-deleted) .direct-chat-bubble {
    background: #2a4a8a !important;
    border-color: #3d63ad !important;
    color: #f3f7ff !important;
}

html.portal-dark body.messages-page .member-chat-page-messages-wrapper .chat-me:not(.is-deleted) .direct-chat-bubble a,
html.portal-dark .chat-me:not(.is-deleted) .direct-chat-bubble a {
    color: #b8d0ff !important;
}

html.portal-dark .chat-message-author,
html.portal-dark .direct-chat-author-line,
html.portal-dark body.messages-page .member-chat-page-messages-wrapper .chat-message-author {
    color: #c5d0e0 !important;
}

html.portal-dark body.messages-page .member-chat-page-messages-wrapper .chat-me:not(.is-deleted) .chat-message-author {
    color: #d7e4ff !important;
}

html.portal-dark .chat-date-separator span {
    background: #1b2330 !important;
    border-color: #2c3648 !important;
    color: #97a3b8 !important;
}

html.portal-dark .member-chat-header-text,
html.portal-dark .member-chat-header h4,
html.portal-dark .member-chat-header .chat-title {
    color: #f0f4fb !important;
}

html.portal-dark .member-chat-icon-button,
html.portal-dark .member-chat-inline-search,
html.portal-dark .member-chat-inline-search input {
    background: #10161f !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .note-editor.note-frame,
html.portal-dark .note-editor .note-editing-area,
html.portal-dark .note-editor .note-editable,
html.portal-dark .note-toolbar,
html.portal-dark .note-statusbar,
html.portal-dark body.messages-page .note-editor,
html.portal-dark body.messages-page .note-editable {
    background: #182030 !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .note-btn,
html.portal-dark .note-btn-group .note-btn {
    background: #1b2330 !important;
    border-color: #2c3648 !important;
    color: #c5d0e0 !important;
}

html.portal-dark .group-chat-header,
html.portal-dark .group-chat-compose-panel,
html.portal-dark .group-chat-page-messages-wrapper,
html.portal-dark .group-chat-page-view {
    background: #151b24 !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .group-chat-compose-panel,
html.portal-dark .group-chat-compose-row {
    background: #1b2330 !important;
    border-color: #2c3648 !important;
}

html.portal-dark .chat-other .group-chat-bubble {
    background: #1e2838 !important;
    border: 1px solid #334155 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .chat-me .group-chat-bubble {
    background: #2a4a8a !important;
    border-color: #3d63ad !important;
    color: #f3f7ff !important;
}

html.portal-dark .chat-me .group-chat-bubble a {
    color: #b8d0ff !important;
}

html.portal-dark .group-chat-author {
    color: #c5d0e0 !important;
}

html.portal-dark .chat-me .group-chat-author {
    color: #9bbcff !important;
}

html.portal-dark .group-chat-inline-time,
html.portal-dark .group-chat-meta {
    color: #7d8aa0 !important;
}

html.portal-dark .group-chat-page-messages-wrapper .chat-date-separator span {
    background: #1b2330 !important;
    border-color: #2c3648 !important;
    color: #97a3b8 !important;
}

html.portal-dark .rise-chat-wrapper,
html.portal-dark .rise-chat-wrapper > .rise-chat-header,
html.portal-dark .rise-chat-wrapper > .rise-chat-body,
html.portal-dark .rise-chat-wrapper .message-row,
html.portal-dark .portal-side-chat-group-list,
html.portal-dark .portal-side-chat-list-body,
html.portal-dark .rise-chat-list-footer {
    background: #151b24 !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .rise-chat-wrapper .message-row:hover {
    background: #243044 !important;
}

html.portal-dark .rise-chat-wrapper .message-row.unread {
    background: rgba(122, 162, 255, 0.12) !important;
}

html.portal-dark .rise-chat-wrapper .message-row strong {
    color: #f0f4fb !important;
}

html.portal-dark .kanban-col,
html.portal-dark .kanban-item,
html.portal-dark .task-board {
    background: #1b2330 !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .messages-conversation-row {
    background: #151b24 !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .messages-conversation-row:hover,
html.portal-dark .messages-conversation-row.is-active {
    background: #243044 !important;
}

html.portal-dark .messages-conversation-row.is-active {
    background: rgba(122, 162, 255, 0.14) !important;
}

html.portal-dark .messages-row-topline strong,
html.portal-dark .messages-row-copy strong {
    color: #f0f4fb !important;
}

html.portal-dark .messages-row-preview,
html.portal-dark .messages-row-meta,
html.portal-dark .messages-row-members,
html.portal-dark .messages-row-time-desktop,
html.portal-dark .messages-row-time-mobile {
    color: #97a3b8 !important;
}

html.portal-dark .messages-type-tab {
    background: transparent !important;
    color: #97a3b8 !important;
    border-color: transparent !important;
}

html.portal-dark .messages-type-tab.is-active {
    color: #d7e4ff !important;
    background: rgba(122, 162, 255, 0.14) !important;
}

html.portal-dark .messages-filter-button {
    background: #10161f !important;
    border-color: #2c3648 !important;
    color: #97a3b8 !important;
}

html.portal-dark .messages-active-pane,
html.portal-dark .messages-empty-state,
html.portal-dark .messages-list-count,
html.portal-dark .messages-list-empty {
    background: #151b24 !important;
    color: #97a3b8 !important;
    border-color: #2c3648 !important;
}

html.portal-dark .messages-empty-icon,
html.portal-dark .messages-group-avatar {
    background: rgba(122, 162, 255, 0.16) !important;
    color: #d7e4ff !important;
    border-color: #2c3648 !important;
}

html.portal-dark .messages-unread-count {
    background: #7aa2ff !important;
    color: #0e1218 !important;
}

/* =========================================================
   Work hours (page-inline whites)
   ========================================================= */
html.portal-dark .workhours-page {
    --workhours-primary: #7aa2ff;
    --workhours-primary-dark: #9bbcff;
    --workhours-primary-soft: rgba(122, 162, 255, 0.16);
    --workhours-border: #2c3648;
    --workhours-ink: #e7ecf5;
    --workhours-muted: #97a3b8;
    --projects-accent: #7aa2ff;
    --projects-accent-dark: #9bbcff;
    --projects-accent-soft: rgba(122, 162, 255, 0.16);
    --projects-border: #2c3648;
    --projects-ink: #e7ecf5;
    --projects-muted: #97a3b8;
    background: #0e1218 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .workhours-page .projects-hero,
html.portal-dark .workhours-card,
html.portal-dark .workhours-card .card-header,
html.portal-dark .workhours-card .filter-section-container,
html.portal-dark .workhours-card .dataTables_wrapper,
html.portal-dark .workhours-card .table-responsive,
html.portal-dark .workhours-card .dataTables_info,
html.portal-dark .workhours-card .dataTables_paginate {
    background: #151b24 !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
    box-shadow: none !important;
}

html.portal-dark .workhours-page .projects-hero-copy h1,
html.portal-dark .workhours-card .card-title,
html.portal-dark .workhours-card th,
html.portal-dark .workhours-card td,
html.portal-dark .workhours-card .dataTable tbody td {
    color: #e7ecf5 !important;
    border-color: #2c3648 !important;
    background: transparent !important;
}

html.portal-dark .workhours-page .projects-hero-copy p,
html.portal-dark .workhours-card .text-off,
html.portal-dark .workhours-muted {
    color: #97a3b8 !important;
}

html.portal-dark .workhours-secondary-action,
html.portal-dark .workhours-card .form-control,
html.portal-dark .workhours-card .select2-container .select2-choice,
html.portal-dark .workhours-card .dataTables_filter input,
html.portal-dark .workhours-card .paginate_button,
html.portal-dark .workhours-card .btn-default,
html.portal-dark .workhours-card .filter-section-left .btn-group .btn,
html.portal-dark .workhours-card .dt-buttons .btn {
    background: #10161f !important;
    border-color: #2c3648 !important;
    color: #c5d0e0 !important;
    box-shadow: none !important;
}

html.portal-dark .workhours-card .paginate_button.current,
html.portal-dark .workhours-card .paginate_button:hover {
    background: #7aa2ff !important;
    border-color: #7aa2ff !important;
    color: #0e1218 !important;
}

html.portal-dark .workhours-card .dataTable tbody tr,
html.portal-dark .workhours-card .wh-mobile-card,
html.portal-dark .workhours-card .filter-section-left .btn-group {
    background: #1b2330 !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .workhours-card .wh-mobile-card-action {
    background: #151b24 !important;
    color: #c5d0e0 !important;
}

html.portal-dark .workhours-card .wh-mobile-card-action.delete-action:hover {
    background: rgba(240, 113, 120, 0.12) !important;
    color: #f07178 !important;
}

html.portal-dark .workhours-page .projects-art-list,
html.portal-dark .workhours-page .projects-art-folder {
    background: #1b2330 !important;
    border-color: #3a4a66 !important;
    color: #7aa2ff !important;
}

/* =========================================================
   Side / popup group chat
   ========================================================= */
html.portal-dark .group-chat-popup-view,
html.portal-dark .group-chat-popup-view .rise-chat-body,
html.portal-dark .group-chat-popup-view .rise-chat-header,
html.portal-dark .group-chat-popup-view .rise-chat-footer,
html.portal-dark .group-chat-popup-view .rise-chat-footer form {
    background: #151b24 !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
    box-shadow: none !important;
}

html.portal-dark .group-chat-popup-view .chat-other .group-chat-bubble {
    background: #1b2330 !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .group-chat-popup-view .chat-me .group-chat-bubble {
    background: #243a66 !important;
    border-color: #35548f !important;
    color: #eef3ff !important;
}

html.portal-dark .group-chat-popup-view .chat-date-separator span {
    background: #1b2330 !important;
    border-color: #2c3648 !important;
    color: #97a3b8 !important;
}

html.portal-dark .group-chat-popup-view .chat-message-textarea textarea,
html.portal-dark .group-chat-popup-view .chat-message-textarea textarea:focus {
    background: #10161f !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .project-comment-ask-ai-menu {
    background: #1b2330 !important;
    border-color: #2c3648 !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45) !important;
}

html.portal-dark .project-comment-ask-ai-menu .dropdown-item,
html.portal-dark .project-comment-ask-ai-menu .project-comment-ask-ai-option {
    color: #e7ecf5 !important;
}

html.portal-dark .project-comment-ask-ai-menu .dropdown-item:hover,
html.portal-dark .project-comment-ask-ai-menu .project-comment-ask-ai-option:hover {
    background: #243044 !important;
}

/* =========================================================
   Attendance dashboard
   ========================================================= */
html.portal-dark .attendance-dashboard-page {
    --attendance-border: #2c3648;
    --attendance-muted: #97a3b8;
    --attendance-ink: #e7ecf5;
    background: #0e1218 !important;
    color: #e7ecf5 !important;
}

html.portal-dark .attendance-page-intro,
html.portal-dark .attendance-card,
html.portal-dark .attendance-panel,
html.portal-dark .attendance-log-card,
html.portal-dark .attendance-upcoming-holiday,
html.portal-dark .attendance-summary-card,
html.portal-dark .attendance-stat-card {
    background: #151b24 !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
    box-shadow: none !important;
}

html.portal-dark .attendance-page-title,
html.portal-dark .attendance-card h4,
html.portal-dark .attendance-card h5,
html.portal-dark .attendance-log-table th,
html.portal-dark .attendance-log-table td {
    color: #e7ecf5 !important;
    border-color: #2c3648 !important;
    background: transparent !important;
}

html.portal-dark .attendance-page-subtitle,
html.portal-dark .attendance-muted {
    color: #97a3b8 !important;
}

html.portal-dark .attendance-illustration-back {
    background: rgba(122, 162, 255, 0.18) !important;
    color: #9bbcff !important;
}

html.portal-dark .attendance-illustration-front {
    background: #1b2330 !important;
    border-color: #3a4a66 !important;
    color: #7aa2ff !important;
    box-shadow: none !important;
}

html.portal-dark .attendance-log-filter,
html.portal-dark .attendance-action-btn,
html.portal-dark .attendance-toolbar .btn,
html.portal-dark .attendance-dashboard-page .form-control,
html.portal-dark .attendance-dashboard-page .btn-default {
    background: #10161f !important;
    border-color: #2c3648 !important;
    color: #c5d0e0 !important;
}

html.portal-dark .attendance-log-filter.active {
    background: rgba(122, 162, 255, 0.16) !important;
    border-color: #4d6bb8 !important;
    color: #d7e4ff !important;
}

html.portal-dark #ajaxModal .attendance-holiday-dialog .modal-body,
html.portal-dark #ajaxModal .attendance-holiday-dialog .modal-footer,
html.portal-dark #ajaxModal .attendance-export-dialog .modal-body,
html.portal-dark #ajaxModal .attendance-export-dialog .modal-footer,
html.portal-dark #ajaxModal .attendance-holiday-dialog .form-control,
html.portal-dark #ajaxModal .attendance-export-dialog .form-control,
html.portal-dark #ajaxModal .attendance-holiday-icon {
    background: #151b24 !important;
    border-color: #2c3648 !important;
    color: #e7ecf5 !important;
}