/* * Astradent dark theme * * This file intentionally mirrors the sections in astradent.css. Keep a * component's light and dark treatments together when either is changed. * It is loaded on every page, but has no effect until * is present. */ html[data-theme="dark"] { color-scheme: dark; --ad-canvas: #111827; --ad-surface: #182333; --ad-ink: #e8f0f5; --ad-muted: #a7b5c2; --ad-line: #2d3c4e; --ad-accent: #68d3bd; --ad-dark: #8de0cf; --ad-mint: #203d40; } /* 1. Foundation */ html[data-theme="dark"] body.astradent-app { background: radial-gradient(circle at 92% 8%, #123c42 0, transparent 26%), radial-gradient(circle at 42% 0, #25204a 0, transparent 24%), #111827; } html[data-theme="dark"] body.astradent-login { background: #111827; } html[data-theme="dark"] .astradent-app :focus-visible, html[data-theme="dark"] .astradent-login :focus-visible { outline-color: #8de0cf; } html[data-theme="dark"] .astradent-app h1, html[data-theme="dark"] .astradent-app h2, html[data-theme="dark"] .astradent-app h3, html[data-theme="dark"] .astradent-app h4, html[data-theme="dark"] .astradent-app h5, html[data-theme="dark"] .astradent-app h6 { color: var(--ad-ink); } /* 2. Header and navigation */ html[data-theme="dark"] .astradent-topbar { background: #162132; border-bottom-color: #2d3c4e; box-shadow: 0 7px 24px #03071266; } html[data-theme="dark"] .astradent-brand { color: #e8f0f5 !important; border-right-color: #2d3c4e; } html[data-theme="dark"] .astradent-brand small, html[data-theme="dark"] .astradent-today { color: #a7b5c2; } html[data-theme="dark"] .astradent-mark { background: #254e54; color: #f4fffd; } html[data-theme="dark"] .astradent-search { color: #b4c2cf !important; } html[data-theme="dark"] .astradent-search kbd { background: #1d2a3b; border-color: #3a4b60; color: #b9c7d4; } html[data-theme="dark"] .astradent-icon-button { background: #1d2a3b; border-color: #36485d; color: #c4d2df !important; } html[data-theme="dark"] .astradent-icon-button:hover { background: #294252; color: #9ae5d6 !important; } html[data-theme="dark"] .astradent-theme-toggle[aria-pressed="true"] { background: #294b4d; border-color: #4e8983; color: #a8f0df !important; } html[data-theme="dark"] .astradent-dropdown, html[data-theme="dark"] .dropdown-menu { background: #1b2939; border-color: #3a4b60; box-shadow: 0 14px 40px #03071299; color: #e8f0f5; } html[data-theme="dark"] .dropdown-item { color: #d4e0e8; } html[data-theme="dark"] .dropdown-item:hover, html[data-theme="dark"] .dropdown-item:focus { background: #294252; color: #fff; } html[data-theme="dark"] .astradent-user { border-left-color: #314258; } html[data-theme="dark"] .astradent-user-button { color: #e8f0f5; } html[data-theme="dark"] .astradent-avatar { background: #30414d; color: #cfdfd2; } html[data-theme="dark"] .astradent-top-actions:before { background: #173b3a; border-color: #346763; color: #8de0cf; } html[data-theme="dark"] .astradent-app .pcoded-navbar { background: #162132 !important; border-right-color: #2d3c4e !important; box-shadow: 8px 0 28px #03071255; } html[data-theme="dark"] .astradent-nav-label { color: #9bacc0 !important; } html[data-theme="dark"] .astradent-app .pcoded-item > li > a { color: #c1cfdb !important; } html[data-theme="dark"] .astradent-app .pcoded-item > li > a:hover { background: #203445 !important; color: #8de0cf !important; } html[data-theme="dark"] .astradent-app .pcoded-item > li.active > a { background: #203a4a !important; border-color: #3d5b72; box-shadow: 0 7px 18px #03071266, inset 3px 0 #60d1bc; color: #f3f9fc !important; } html[data-theme="dark"] .astradent-app .pcoded-submenu li a { color: #aebdca !important; } html[data-theme="dark"] .astradent-app .pcoded-submenu li a:hover, html[data-theme="dark"] .astradent-app .pcoded-submenu li.active > a { background: #233d4d !important; color: #8de0cf !important; } html[data-theme="dark"] .astradent-sidebar-note { color: #b4c2cf; } html[data-theme="dark"] .astradent-sidebar-note small { color: #8fa2b3; } /* 3. Page framing, cards and dashboard */ html[data-theme="dark"] .astradent-app .pcoded-content, html[data-theme="dark"] .astradent-footer { background: transparent !important; } html[data-theme="dark"] body.astradent-app, html[data-theme="dark"] .astradent-app .pcoded-main-container, html[data-theme="dark"] .astradent-app .main-body, html[data-theme="dark"] .astradent-app .page-wrapper, html[data-theme="dark"] .astradent-app .pcoded-content { background-color: #080d13 !important; } html[data-theme="dark"] .astradent-app .container-fluid, html[data-theme="dark"] .astradent-app .page-body, html[data-theme="dark"] .astradent-app .card-body, html[data-theme="dark"] .astradent-app .card-footer, html[data-theme="dark"] .astradent-app .table-responsive { background: transparent !important; } html[data-theme="dark"] .astradent-app .card, html[data-theme="dark"] .astradent-app .card[style*="background"], html[data-theme="dark"] .astradent-app [style*="background-color:#fff"], html[data-theme="dark"] .astradent-app [style*="background-color: #fff"] { background-color: #182333 !important; } html[data-theme="dark"] .astradent-app .card-header[style*="background"] { background: #1e2d3e !important; } html[data-theme="dark"] .astradent-app .page-header { background: linear-gradient(105deg, #1a2a3e 0%, #173b40 54%, #29254a 100%) !important; border-color: #3b5068 !important; border-left-color: #69d3be !important; box-shadow: 0 8px 24px #03071255; } html[data-theme="dark"] .astradent-app .page-header-title h4, html[data-theme="dark"] .astradent-app .page-header-title h5 { color: #edf5f8 !important; } html[data-theme="dark"] .astradent-app .page-header-breadcrumb, html[data-theme="dark"] .astradent-app .breadcrumb-item a { color: #aab9c8; } html[data-theme="dark"] .astradent-app .card, html[data-theme="dark"] .ad-metric { background: #182333; border-color: #2d3c4e !important; box-shadow: 0 9px 24px #03071255 !important; color: var(--ad-ink) !important; } html[data-theme="dark"] .astradent-app .card:hover { box-shadow: 0 12px 30px #03071288 !important; } html[data-theme="dark"] .astradent-app .card-header { background: linear-gradient(90deg, #1c2a3b, #192c3d) !important; border-bottom-color: #304154 !important; } html[data-theme="dark"] .ad-page-intro { background: linear-gradient(118deg, #182f55 0%, #145466 58%, #157766 100%); box-shadow: 0 15px 32px #03071277; } html[data-theme="dark"] .ad-welcome { background: #233842; border-color: #3c5a60; } html[data-theme="dark"] .ad-welcome p, html[data-theme="dark"] .ad-welcome .ad-text-link { color: #c2ddd4; } html[data-theme="dark"] .ad-metric-icon { background: #243b47; color: #9cddc4; } html[data-theme="dark"] .ad-metric-top, html[data-theme="dark"] .ad-metric-foot, html[data-theme="dark"] .ad-section-heading small { color: #a7b5c2; } /* Dashboard labels requested to remain black in dark mode. */ html[data-theme="dark"] .astradent-app .ad-section-heading h5, html[data-theme="dark"] .astradent-app .ad-section-heading h5 small, html[data-theme="dark"] .astradent-app .ad-section-heading > a, html[data-theme="dark"] .astradent-app .ad-intro-actions .btn, html[data-theme="dark"] .astradent-app .ad-quick-actions a, html[data-theme="dark"] .astradent-app .ad-quick-actions a span { color: #000 !important; } html[data-theme="dark"] .astradent-app .ad-quick-card .card-header { background: #e8edf1 !important; border-bottom-color: #cbd5dc !important; } html[data-theme="dark"] .astradent-app .ad-quick-card .card-block { background: #f4f7f9 !important; } html[data-theme="dark"] .astradent-app .ad-quick-card .ad-quick-actions a { border-bottom-color: #d8e0e6; } html[data-theme="dark"] .astradent-app .ad-quick-card .ad-quick-actions b { color: #3c6f78 !important; } html[data-theme="dark"] .astradent-app .ad-intro-actions .btn.btn-secondary { background: #bfe9e1 !important; border-color: #8bcfc3 !important; color: #123b3d !important; } html[data-theme="dark"] .astradent-app .page-body > .card:last-child { background: #111923 !important; border-color: #2d3c4e !important; } html[data-theme="dark"] .astradent-app .page-body > .card:last-child .card-header { background: #e8edf1 !important; } html[data-theme="dark"] .astradent-app .page-body > .card:last-child .ad-section-heading h5, html[data-theme="dark"] .astradent-app .page-body > .card:last-child .ad-section-heading small { color: #000 !important; } html[data-theme="dark"] .astradent-app .page-body > .card:last-child .card-block { background: #111923 !important; } html[data-theme="dark"] .astradent-app .ct-label { color: #aebdca; fill: #aebdca; } html[data-theme="dark"] .astradent-app .ct-grid { stroke: #33465a; } /* 4. Forms, buttons, tables and tabs */ html[data-theme="dark"] .astradent-app .form-control, html[data-theme="dark"] .astradent-login .form-control, html[data-theme="dark"] .astradent-app .custom-select { background: #142131; border-color: #3a4b60; color: #e8f0f5; } html[data-theme="dark"] .astradent-app .form-control::placeholder, html[data-theme="dark"] .astradent-login .form-control::placeholder { color: #8194a8; } html[data-theme="dark"] .astradent-app .form-control:focus, html[data-theme="dark"] .astradent-login .form-control:focus { background: #162637; border-color: #67c9b7; box-shadow: 0 0 0 3px #68d3bd22; color: #f4f9fb; } html[data-theme="dark"] .astradent-app .form-control[readonly], html[data-theme="dark"] .astradent-app .form-control:disabled { background: #202d3d !important; color: #aebdca !important; } /* The visit-list doctor swap control keeps its light blue menu background. */ html[data-theme="dark"] .astradent-app select[id^="drswap"], html[data-theme="dark"] .astradent-app select[id^="drswap"] option { color: #000 !important; } html[data-theme="dark"] .astradent-app .visit-date-filter-label { color: #000 !important; } html[data-theme="dark"] .astradent-app .visit-list-title { color: #000 !important; } html[data-theme="dark"] .astradent-app .card-header:has(.visit-list-title) { background: #e8edf1 !important; border-bottom-color: #cbd5dc !important; } html[data-theme="dark"] .astradent-app input[type="date"].visit-date-filter { background: #eef2f5 !important; color: #000 !important; border-color: #cbd5dc !important; color-scheme: light; } html[data-theme="dark"] .astradent-app label { color: #c3d0da; } html[data-theme="dark"] .astradent-app .btn-secondary, html[data-theme="dark"] .astradent-app .btn-default, html[data-theme="dark"] .astradent-app .btn-outline-secondary { background: #243346 !important; border-color: #42556a !important; color: #dbe6ed !important; } html[data-theme="dark"] .astradent-app .btn-success { background: #1d443a !important; border-color: #326453 !important; color: #9fe0bc !important; } html[data-theme="dark"] .astradent-app .btn-danger { background: #482b32 !important; border-color: #75424b !important; color: #ffb7b1 !important; } html[data-theme="dark"] .astradent-app .btn-info, html[data-theme="dark"] .astradent-app .btn-outline-primary { background: #183f4a !important; border-color: #2e6775 !important; color: #9edfeb !important; } html[data-theme="dark"] .astradent-app .btn-warning { background: #4a3b1d !important; border-color: #796331 !important; color: #f8d981 !important; } html[data-theme="dark"] .astradent-app .btn-group { background: #223142; } html[data-theme="dark"] .astradent-app .table { color: #c7d4de; } html[data-theme="dark"] .astradent-app .table th, html[data-theme="dark"] .astradent-app .table td { border-bottom-color: #2d3c4e !important; } html[data-theme="dark"] .astradent-app .table thead th { background: linear-gradient(135deg, #253c63, #14626d) !important; color: #f3f8fa !important; } html[data-theme="dark"] .astradent-app .table tbody tr:nth-child(even) { background: #162334; } html[data-theme="dark"] .astradent-app .table tbody tr:hover { background: #203848 !important; } html[data-theme="dark"] .astradent-app .table td:first-child, html[data-theme="dark"] .astradent-app #operations-compliance-table-container tbody td { color: #dce7ed; } html[data-theme="dark"] .astradent-app .page-link { color: #b7c7d3; } html[data-theme="dark"] .astradent-app .page-item.active .page-link { background: #3d9e92; color: #081313; } html[data-theme="dark"] .astradent-app .nav-tabs { border-bottom-color: #304154 !important; } html[data-theme="dark"] .astradent-app .nav-tabs .nav-link { color: #aebdca; } html[data-theme="dark"] .astradent-app .nav-tabs .nav-link.active { color: #8de0cf; box-shadow: inset 0 -2px #68d3bd; } /* 5. Overlays and calendar */ html[data-theme="dark"] .astradent-app .modal-content { background: #182333; border-color: #3a4b60; box-shadow: 0 30px 90px #030712bb; } html[data-theme="dark"] .astradent-app .modal-header { background: #1e2d3e; border-bottom-color: #3a4b60; } html[data-theme="dark"] .astradent-app .modal-footer { border-top-color: #3a4b60; } html[data-theme="dark"] .astradent-app .close { color: #dbe6ed; text-shadow: none; } html[data-theme="dark"] .astradent-app .alert-info, html[data-theme="dark"] .astradent-app .alert-success { background: #1e443d; border-color: #38675b; color: #b9e0cc; } html[data-theme="dark"] .astradent-app .alert-primary { background: #183f4a !important; border-color: #2e6775 !important; color: #9edfeb !important; } html[data-theme="dark"] .astradent-app .alert-secondary { background: #243346 !important; border-color: #42556a !important; color: #dbe6ed !important; } html[data-theme="dark"] .astradent-app .alert-warning { background: #4a3b1d !important; border-color: #796331 !important; color: #f8d981 !important; } html[data-theme="dark"] .astradent-app .alert-danger { background: #482b32 !important; border-color: #75424b !important; color: #ffb7b1 !important; } /* SweetAlert2 is used by calendar, payment, visit swap, MC, inventory and operations. */ html[data-theme="dark"] .swal2-popup { background: #182333 !important; border: 1px solid #3a4b60 !important; color: #e8f0f5 !important; } html[data-theme="dark"] .swal2-toast { background: #1b2939 !important; box-shadow: 0 8px 28px #03071299 !important; } html[data-theme="dark"] .swal2-title, html[data-theme="dark"] .swal2-html-container, html[data-theme="dark"] .swal2-content { color: #e8f0f5 !important; } html[data-theme="dark"] .swal2-html-container { color: #c7d4de !important; } html[data-theme="dark"] .swal2-confirm { background: #3d9e92 !important; color: #081313 !important; } html[data-theme="dark"] .swal2-cancel { background: #243346 !important; color: #dbe6ed !important; } html[data-theme="dark"] .swal2-close { color: #dbe6ed !important; } html[data-theme="dark"] .swal2-timer-progress-bar { background: #68d3bd !important; } html[data-theme="dark"] .astradent-app .calendar-viewport { border-color: #3a4b60; } html[data-theme="dark"] .astradent-app .calendar-viewport, html[data-theme="dark"] .astradent-app .calendar-time-grid, html[data-theme="dark"] .astradent-app .calendar-month-grid { background: #111923 !important; } html[data-theme="dark"] .astradent-app .calendar-day-header, html[data-theme="dark"] .astradent-app .calendar-month-heading { background: #1e2d3e; border-color: #3a4b60; color: #b9c9d6; } html[data-theme="dark"] .astradent-app .calendar-time-label { color: #9eb0c1; background: #111923 !important; border-top-color: #33465a; } html[data-theme="dark"] .astradent-app .calendar-slot, html[data-theme="dark"] .astradent-app .calendar-month-day { background: #111923 !important; border-top-color: #27394d; border-left-color: #2d3f52; border-bottom-color: #2d3f52; border-right-color: #2d3f52; } html[data-theme="dark"] .astradent-app .calendar-slot.calendar-slot-non-operating { background: #152132; } html[data-theme="dark"] .astradent-app .calendar-month-day.outside { background: #0d151e !important; color: #8294a6; } html[data-theme="dark"] .astradent-app .calendar-doctor-badge { background: #243346; border-color: #6a8195; color: #e2edf3; } html[data-theme="dark"] .astradent-app .calendar-view-button { color: #dbe7ed !important; } html[data-theme="dark"] .astradent-app #calendar-today { background: #243346; border-color: #42556a; color: #dce7ed; } html[data-theme="dark"] .astradent-app .calendar-date-picker { background: #1b2939; border-color: #3a4b60; box-shadow: 0 12px 35px #03071299; } html[data-theme="dark"] .astradent-app .calendar-date-picker-header button { background: #243346; border-color: #42556a; color: #dce7ed; } html[data-theme="dark"] .astradent-app .calendar-date-picker-label, html[data-theme="dark"] .astradent-app .calendar-date-picker-day { color: #dce7ed; } /* 6. Page-specific working surfaces */ html[data-theme="dark"] .astradent-app .invoice-add-row td { background: #1b3044 !important; border-top-color: #35516b !important; } html[data-theme="dark"] .astradent-app .invoice-builder-table tfoot td { background: #1a2a3c !important; } html[data-theme="dark"] .astradent-app .invoice-builder-table tfoot tr:nth-last-child(2) td { background: #193d3d !important; } html[data-theme="dark"] .astradent-app .invoice-builder-table tfoot tr:last-child td { background: #182333 !important; } html[data-theme="dark"] .astradent-app .invoice-builder-table tfoot input.form-control, html[data-theme="dark"] .astradent-app .invoice-builder-table .invoice-remark-input { background: #142131 !important; color: #e8f0f5; } html[data-theme="dark"] body[data-page="payment.list"] .invoice-summary-card { background: linear-gradient(135deg, #173a43, #1c304c) !important; border-color: #365870 !important; } html[data-theme="dark"] body[data-page="payment.list"] .invoice-summary-value { color: #e8f0f5 !important; } html[data-theme="dark"] body[data-page="payment.list"] .invoice-summary-label { color: #c0d0dd !important; } html[data-theme="dark"] body[data-page="payment.list"] .invoice-summary-month { color: #83dccb !important; } /* Billing and archive tables stay light in dark mode so their records use clear black ink. */ html[data-theme="dark"] body[data-page="payment.list"] #dom-jqry, html[data-theme="dark"] body[data-page="invoices.archive"] #dom-jqry { background: #fff !important; color: #000 !important; } html[data-theme="dark"] body[data-page="payment.list"] #dom-jqry tbody tr, html[data-theme="dark"] body[data-page="invoices.archive"] #dom-jqry tbody tr { background: #fff; } html[data-theme="dark"] body[data-page="payment.list"] #dom-jqry tbody td, html[data-theme="dark"] body[data-page="payment.list"] #dom-jqry tbody td a, html[data-theme="dark"] body[data-page="invoices.archive"] #dom-jqry tbody td, html[data-theme="dark"] body[data-page="invoices.archive"] #dom-jqry tbody td a { color: #000 !important; } /* 7. Chat (markup currently uses inline styles, so these intentional !important rules win). */ html[data-theme="dark"] #chatPanel { background: #182333 !important; box-shadow: -4px 0 20px #03071299 !important; } html[data-theme="dark"] #chatPanel { color: #e8f0f5 !important; } html[data-theme="dark"] #chatMessages { background-color: #13202e !important; background-image: repeating-linear-gradient(45deg, #ffffff06 0, #ffffff06 2px, transparent 2px, transparent 4px) !important; } html[data-theme="dark"] #chatMessages > div:not(.chat-date-separator) { color: #142131 !important; } html[data-theme="dark"] #chatPanel > div:first-child { background: #1b4b55 !important; } html[data-theme="dark"] #chatChannelSelected, html[data-theme="dark"] #chatChannelOptions { background: #203b4b !important; } html[data-theme="dark"] .chat-option { border-bottom-color: #ffffff1f !important; } html[data-theme="dark"] #chatPanel > div:last-of-type { background: #1b2939 !important; border-top-color: #3a4b60 !important; } html[data-theme="dark"] #chatGifBtn, html[data-theme="dark"] #chatNudgeBtn, html[data-theme="dark"] #chatInput { background: #142131 !important; border-color: #3a4b60 !important; color: #e8f0f5 !important; } html[data-theme="dark"] #chatInput::placeholder { color: #8fa2b3 !important; } html[data-theme="dark"] #chatSendBtn { background: #2d6f72 !important; border-color: #438f8d !important; color: #fff !important; } html[data-theme="dark"] #nudgeToast { background: #1b4b55 !important; color: #e8f0f5 !important; } html[data-theme="dark"] #nudgeToast .nudge-title, html[data-theme="dark"] #nudgeToastText { color: #e8f0f5 !important; } html[data-theme="dark"] #gifPickerOverlay > div { background: #1b2939 !important; box-shadow: 0 8px 32px #030712aa !important; } html[data-theme="dark"] #gifPickerOverlay input { background: #142131 !important; border-color: #3a4b60 !important; color: #e8f0f5 !important; } /* 8. Sign-in */ html[data-theme="dark"] .astradent-login .ad-login-form-area { background: radial-gradient(circle at 100% 0, #29254a 0, transparent 32%), #111827; } html[data-theme="dark"] .astradent-login .ad-login-form { background: #182333; border-color: #33465a; box-shadow: 0 22px 55px #03071288; } html[data-theme="dark"] .astradent-login .ad-login-form h2 { color: #eef5f8; } html[data-theme="dark"] .astradent-login .ad-login-form p, html[data-theme="dark"] .astradent-login .ad-login-note { color: #aebdca; } /* 9. Mobile */ @media (max-width: 991px) { html[data-theme="dark"] .astradent-app .pcoded-navbar { box-shadow: 8px 0 28px #03071299; } }