/* Coachdesk theme selector styles. Three palettes: Default (no data-theme / "default"), Warm and Midnight. Loaded last so these rules override style.css, interface.css and theme.css. The active theme is set on by app.js from the signed-in trainer's saved preference. */ /* ---- Theme selector component (shared by every theme) ---- */ .theme-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:4px 24px 24px} .theme-option{display:flex;flex-direction:column;gap:14px;text-align:left;padding:16px;border:1px solid var(--line);border-radius:16px;background:transparent;color:inherit;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease} .theme-option:hover{transform:translateY(-2px);box-shadow:0 10px 24px #0000001f} .theme-option.selected{border-color:var(--green);box-shadow:0 0 0 2px var(--green) inset} .theme-swatch{display:flex;gap:6px} .theme-swatch i{width:26px;height:26px;border-radius:8px;border:1px solid #0000001f;display:block} .theme-option-body b{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:650} .theme-option-body small{display:block;margin-top:6px;color:var(--muted);line-height:1.55;font-size:12px} .theme-current{font-size:10px;letter-spacing:.6px;text-transform:uppercase;background:var(--green);color:#fff;padding:3px 8px;border-radius:999px;font-weight:600} @media(max-width:700px){.theme-grid{grid-template-columns:1fr;padding-inline:17px}} /* ===================================================================== WARM — a friendlier, energetic palette (light) with terracotta + amber. ===================================================================== */ html[data-theme="warm"]{--ink:#2b2420;--muted:#8a7c6e;--line:#ece1d3;--paper:#faf4ec;--green:#bd5330;--lime:#f4d7a4;--radius:26px} [data-theme="warm"] body{background:var(--paper);color:var(--ink)} [data-theme="warm"] h2,[data-theme="warm"] h3{color:#2f2620} [data-theme="warm"] .subtitle,[data-theme="warm"] .subtle,[data-theme="warm"] .meta-line,[data-theme="warm"] .breadcrumb{color:#8a7c6e} [data-theme="warm"] .eyebrow{color:#a8927c} [data-theme="warm"] .main-shell>header{background:#fdf8f1;border-color:#efe5d7} [data-theme="warm"] .breadcrumb b{color:#6c5a49} /* Sidebar */ [data-theme="warm"] .sidebar{background:#f6eee3;border-color:#ece0d0;color:#6b5c4e;color-scheme:light} [data-theme="warm"] .sidebar .brand{color:#4a382b} [data-theme="warm"] .sidebar .workspace-select{background:#fffdfa;color:#6b5a49;border-color:#e7dccb} [data-theme="warm"] .sidebar .nav-label{color:#a08c78} [data-theme="warm"] .sidebar .nav-link,[data-theme="warm"] .sidebar .nav-group-title{color:#6c5c4d} [data-theme="warm"] .sidebar .nav-link:hover{background:#efe2d2;color:#7a3b22} [data-theme="warm"] .sidebar .nav-link.active{background:#bd5330;color:#fff;box-shadow:0 3px 6px #7a3b2224} [data-theme="warm"] .sidebar .nav-group.group-active>.nav-link:not(.active){background:#f0e2d1;color:#7a3b22} [data-theme="warm"] .sidebar .plan-box{background:#f3e6d4;border-color:#e8d8c3} [data-theme="warm"] .sidebar .mini-tag{color:#b5602f}[data-theme="warm"] .sidebar .plan-box p{color:#3f3125} [data-theme="warm"] .sidebar .avatar{background:#f1d8bf;color:#8a4a26} [data-theme="warm"] .sidebar .profile{color:#463527}[data-theme="warm"] .sidebar .profile small{color:#8b7a68} /* Surfaces */ [data-theme="warm"] .card,[data-theme="warm"] .stat,[data-theme="warm"] .profile-hero{background:#fffdfa;border-color:#efe4d6;box-shadow:0 3px 3px #4a382b08,0 10px 28px #4a382b04} [data-theme="warm"] .stat-value{color:#3a2c20}[data-theme="warm"] .stat-top{color:#7f7061} [data-theme="warm"] .insight{background:#f6e2c9;border-color:#f0d6b6}[data-theme="warm"] .insight h2{color:#7a3b1c}[data-theme="warm"] .insight p{color:#8a6a4c}[data-theme="warm"] .insight-top span{color:#a5602f} [data-theme="warm"] .client-hero{background:#f6e2c9;border-color:#f0d6b6;color:#6f3a1c}[data-theme="warm"] .client-hero .eyebrow,[data-theme="warm"] .client-hero p{color:#9a6a44}[data-theme="warm"] .client-hero .big-number{color:#d08a4c} [data-theme="warm"] .detail-box{background:#f6efe5} /* Buttons */ [data-theme="warm"] .button{background:#fffdfa;border-color:#e7dccb;color:#3f3226} [data-theme="warm"] .button:hover{background:#f5ebdd;border-color:#dccbb4} [data-theme="warm"] .button.primary{background:#bd5330;border-color:#bd5330;color:#fff} [data-theme="warm"] .button.primary:hover{background:#a24525;border-color:#a24525} [data-theme="warm"] .button.lime-btn{background:#f4d7a4;border-color:#f4d7a4;color:#6b4114} [data-theme="warm"] .text-btn{color:#b5502e} /* Tabs, pills, days */ [data-theme="warm"] .profile-tabs,[data-theme="warm"] .segmented{background:#f1e6d7;border-color:#eaddca} [data-theme="warm"] .profile-tab.active,[data-theme="warm"] .segmented button.selected{background:#bd5330;color:#fff} [data-theme="warm"] .day.active{background:#bd5330}[data-theme="warm"] .day.active i{background:#f4d7a4} /* Forms */ [data-theme="warm"] input,[data-theme="warm"] select,[data-theme="warm"] textarea{background:#fffdfa;border-color:#e7dccb;color:#3f3226} [data-theme="warm"] input::placeholder{color:#a8967f} /* Tables + badges */ [data-theme="warm"] th{background:#f7f0e6;border-color:#efe4d6;color:#8a7863} [data-theme="warm"] td{border-color:#f0e7db}[data-theme="warm"] tbody tr:hover{background:#faf2e6} [data-theme="warm"] .badge{background:#f6e6cf;color:#9a5f2a} [data-theme="warm"] .avatar{background:#f1ddc6;color:#8a5a30}[data-theme="warm"] .avatar.lime{background:#f2e0c1;color:#8a6a30} /* Messaging, dialog, misc */ [data-theme="warm"] .bubble{background:#f4e8d8}[data-theme="warm"] .bubble.mine{background:#7a3b22;color:#fff} [data-theme="warm"] dialog{background:#fffdfa;border-color:#efe4d6}[data-theme="warm"] dialog::backdrop{background:#4a382b59} [data-theme="warm"] .notice{background:#fbeed6;color:#8a6a3a} [data-theme="warm"] .action-dropdown{background:#fffdfa;border-color:#eadfce}[data-theme="warm"] .action-dropdown .action-dropdown-item:hover{background:#f5ebdd} [data-theme="warm"] footer{color:#a8967f} [data-theme="warm"] .progress span,[data-theme="warm"] .session-line{background:#d9915a} [data-theme="warm"] .counter{background:#f6e6cf;color:#a5602f} /* ===================================================================== MIDNIGHT — high-contrast dark palette for low-light use (reviewed v0.7.4). Page #0e141b · cards #1a232e · dividers #2a3643 · text #eef3f8 · accent #7bdcb5 ===================================================================== */ html[data-theme="midnight"]{--ink:#eef3f8;--muted:#8a97a3;--line:#2a3643;--paper:#0e141b;--green:#7bdcb5;--lime:#7bdcb5;--radius:26px} /* Base text + page */ [data-theme="midnight"] body{background:var(--paper);color:var(--ink)} [data-theme="midnight"] main,[data-theme="midnight"] .card,[data-theme="midnight"] dialog{color:var(--ink)} [data-theme="midnight"] h1,[data-theme="midnight"] h2,[data-theme="midnight"] h3,[data-theme="midnight"] h4{color:#f2f6fa} [data-theme="midnight"] .subtitle,[data-theme="midnight"] .subtle,[data-theme="midnight"] .meta-line,[data-theme="midnight"] .muted,[data-theme="midnight"] .empty{color:#96a3af} [data-theme="midnight"] .eyebrow{color:#7e8c98} /* Top header */ [data-theme="midnight"] .main-shell>header{background:#121a23;border-color:#2a3643} [data-theme="midnight"] .breadcrumb,[data-theme="midnight"] .breadcrumb b{color:#c2ccd5}[data-theme="midnight"] .breadcrumb span{color:#5f6b76} [data-theme="midnight"] .icon-btn{color:#c2ccd5}[data-theme="midnight"] .icon-btn:hover{background:#1f2a35} [data-theme="midnight"] .header-right .avatar{background:#26463b;color:#8ce6c1} /* Wordmark PNG is dark art on a light plate; screen-blend the inverted image so it reads as a light logo on dark surfaces instead of a solid block. */ [data-theme="midnight"] .wordmark{mix-blend-mode:screen;filter:invert(1);opacity:.95} /* Sidebar */ [data-theme="midnight"] .sidebar{background:#111a23;border-color:#243039;color:#b4c0ca;color-scheme:dark} [data-theme="midnight"] .sidebar .brand{color:#f2f6fa} [data-theme="midnight"] .sidebar .workspace-select{background:#1a232d;color:#dbe4ea;border-color:#2c3945} [data-theme="midnight"] .sidebar .nav-label{color:#7e8c98} [data-theme="midnight"] .sidebar .nav-link,[data-theme="midnight"] .sidebar .nav-group-title,[data-theme="midnight"] .sidebar .group-active>.nav-group-title{color:#b4c0ca} [data-theme="midnight"] .sidebar .nav-link:hover{background:#1e2833;color:#f2f6fa} [data-theme="midnight"] .sidebar .nav-link.active{background:#7bdcb5;color:#0e141b;font-weight:650;box-shadow:0 3px 8px #00000047} [data-theme="midnight"] .sidebar .nav-group.group-active>.nav-link:not(.active){background:#1c2731;color:#cfe9df} [data-theme="midnight"] .sidebar .nav-children{border-color:#2b3742} [data-theme="midnight"] .sidebar .nav-count{background:#25463b;color:#8fe6c2} [data-theme="midnight"] .sidebar .plan-box{background:#182029;border-color:#2a3540} [data-theme="midnight"] .sidebar .mini-tag{color:#7bdcb5}[data-theme="midnight"] .sidebar .plan-box p{color:#eef3f8}[data-theme="midnight"] .sidebar .plan-box small{color:#93a0ab} [data-theme="midnight"] .sidebar .avatar{background:#26463b;color:#8ce6c1} [data-theme="midnight"] .sidebar .profile{color:#dbe4ea}[data-theme="midnight"] .sidebar .profile small{color:#93a0ab} [data-theme="midnight"] .nav-divider{background:#2a3643} /* Cards / stats */ [data-theme="midnight"] .card,[data-theme="midnight"] .stat,[data-theme="midnight"] .profile-hero{background:#1a232e;border-color:#2a3643;box-shadow:0 2px 4px #00000033,0 14px 34px #00000024} [data-theme="midnight"] .stat-value{color:#f4f7fb}[data-theme="midnight"] .stat-top{color:#a2aeb9}[data-theme="midnight"] .stat-top svg{color:#738390}[data-theme="midnight"] .stat-bottom{color:#93a0ab}[data-theme="midnight"] .positive{color:#5bbf9a} /* Muted body copy inside cards/rows */ [data-theme="midnight"] .attention-row p,[data-theme="midnight"] .activity-item p,[data-theme="midnight"] .activity-item small,[data-theme="midnight"] .session-info p,[data-theme="midnight"] .exercise-row p,[data-theme="midnight"] .line-item p,[data-theme="midnight"] .workout-card p,[data-theme="midnight"] .chart-meta span,[data-theme="midnight"] .chart-labels,[data-theme="midnight"] .bar-chart .bar span{color:#a2aeb9} /* Accent surfaces */ [data-theme="midnight"] .insight{background:#16332a;border-color:#204a3c}[data-theme="midnight"] .insight h2{color:#b6f0d8}[data-theme="midnight"] .insight p{color:#9fc0b4}[data-theme="midnight"] .insight-top span{color:#7bdcb5} [data-theme="midnight"] .client-hero{background:#16332a;border-color:#204a3c;color:#e4f5ee}[data-theme="midnight"] .client-hero .eyebrow,[data-theme="midnight"] .client-hero p{color:#93c9b6}[data-theme="midnight"] .client-hero .big-number{color:#5bbf9a} /* Tinted tiles (icons + numbers) */ [data-theme="midnight"] .workout-icon,[data-theme="midnight"] .activity-icon,[data-theme="midnight"] .list-item-icon,[data-theme="midnight"] .exercise-num,[data-theme="midnight"] .session-section-number,[data-theme="midnight"] .workout-log-section-number,[data-theme="midnight"] .workout-log-exercise-number,[data-theme="midnight"] .plan-slot-order{background:#25333f;color:#a8dcc9} [data-theme="midnight"] .detail-box{background:#141d26;border-color:#2a3643}[data-theme="midnight"] .detail-box small{color:#93a0ab}[data-theme="midnight"] .detail-box b{color:#eef3f8} /* Buttons */ [data-theme="midnight"] .button{background:#212c38;border-color:#33404c;color:#e7edf3} [data-theme="midnight"] .button:hover{background:#2a3743;border-color:#3d4b58} [data-theme="midnight"] .button.primary{background:#7bdcb5;border-color:#7bdcb5;color:#0e141b} [data-theme="midnight"] .button.primary:hover{background:#66cba2;border-color:#66cba2} [data-theme="midnight"] .button.lime-btn{background:#234a3c;border-color:#2c5748;color:#9ae9c8} [data-theme="midnight"] .text-btn{color:#7bdcb5} [data-theme="midnight"] .action-dropdown-trigger[aria-expanded=true]{background:#25333f;border-color:#3a4a56} /* Tabs */ [data-theme="midnight"] .profile-tabs,[data-theme="midnight"] .segmented{background:#141d26;border-color:#2a3643} [data-theme="midnight"] .profile-tab,[data-theme="midnight"] .segmented button{color:#a2aeb9} [data-theme="midnight"] .profile-tab:hover,[data-theme="midnight"] .segmented button:hover{background:#1e2833;color:#eef3f8} [data-theme="midnight"] .profile-tab.active,[data-theme="midnight"] .segmented button.selected{background:#7bdcb5;color:#0e141b} [data-theme="midnight"] .profile-tabs-select{background:#1a232e;border-color:#2a3643}[data-theme="midnight"] .profile-tabs-select>span{color:#96a3af} /* Days */ [data-theme="midnight"] .day b{color:#a2aeb9}[data-theme="midnight"] .day.active{background:#7bdcb5}[data-theme="midnight"] .day.active b{color:#0e141b}[data-theme="midnight"] .day.active i{background:#0e141b} /* Forms */ [data-theme="midnight"] input,[data-theme="midnight"] select,[data-theme="midnight"] textarea,[data-theme="midnight"] .log-field input,[data-theme="midnight"] .log-set input{background:#0f1720;border-color:#2f3b47;color:#e7edf3} [data-theme="midnight"] input::placeholder{color:#6b7883} [data-theme="midnight"] input[type=checkbox],[data-theme="midnight"] input[type=radio],[data-theme="midnight"] .checklist input{accent-color:#7bdcb5} [data-theme="midnight"] .search>span{color:#7e8c98} [data-theme="midnight"] .field,[data-theme="midnight"] .log-field{color:#aab6c1} /* Tables */ [data-theme="midnight"] .clients-toolbar{background:#1a232e;border-color:#2a3643} [data-theme="midnight"] th{background:#141d26;border-color:#2a3643;color:#9aa7b2}[data-theme="midnight"] th+th{border-left-color:#2a3643} [data-theme="midnight"] td{border-color:#232f3a}[data-theme="midnight"] tbody tr:hover{background:#1e2833} [data-theme="midnight"] .client-name b,[data-theme="midnight"] .client-name-link,[data-theme="midnight"] .item-name-link,[data-theme="midnight"] .profile-session-link{color:#eef3f8} [data-theme="midnight"] .client-name small,[data-theme="midnight"] .client-package-summary small,[data-theme="midnight"] .client-next-session small{color:#93a0ab} [data-theme="midnight"] .client-next-session{color:#7bdcb5} [data-theme="midnight"] .client-name-link:hover,[data-theme="midnight"] .item-name-link:hover,[data-theme="midnight"] .profile-session-link:hover{color:#9ae9c8} /* Status filter badges */ [data-theme="midnight"] .client-status-badge{background:#1a232e;border-color:#2f3b47;color:#aab6c1} [data-theme="midnight"] .client-status-badge:hover{background:#232f3a;color:#eef3f8} [data-theme="midnight"] .client-status-badge.selected{background:#7bdcb5;border-color:#7bdcb5;color:#0e141b} [data-theme="midnight"] .client-status-badge.status-active:not(.selected){background:#16332a;color:#7cd6ac;border-color:#204a3c} [data-theme="midnight"] .client-status-badge.status-onboarding:not(.selected){background:#33301f;color:#e0cc8f;border-color:#4a4327} [data-theme="midnight"] .client-status-badge.status-paused:not(.selected){background:#2b2740;color:#b3a3d6;border-color:#3a3457} [data-theme="midnight"] .client-status-badge.status-archived:not(.selected){background:#232e38;color:#9aa7b2;border-color:#313d47} /* Badges + avatars */ [data-theme="midnight"] .badge{background:#1e3a30;color:#8fe6c2} [data-theme="midnight"] .badge.gray{background:#232e38;color:#9aa7b2}[data-theme="midnight"] .badge.orange{background:#3a3121;color:#e0bd82}[data-theme="midnight"] .badge.purple{background:#2b2740;color:#bcaee0} [data-theme="midnight"] .avatar{background:#26463b;color:#8ce6c1}[data-theme="midnight"] .avatar.lime{background:#2a4a3d;color:#8ce6c1} /* Calendar */ [data-theme="midnight"] .calendar-day{background:#1a232e;border-color:#2a3643} [data-theme="midnight"] .calendar-day.today{background:#14261f;border-color:#2f5a49} [data-theme="midnight"] .calendar-day-heading span{color:#5bbf9a} [data-theme="midnight"] .calendar-event .calendar-session-time,[data-theme="midnight"] .calendar-event .calendar-session-client{color:#9ae9c8} [data-theme="midnight"] .calendar-event .calendar-session-title,[data-theme="midnight"] .calendar-event span{color:#cdd7e0} [data-theme="midnight"] .calendar-event{background:#16261f;border-left-color:#5bbf9a} [data-theme="midnight"] .calendar-event.session-type-personal,[data-theme="midnight"] .calendar-event.session-type-personal_training{background:#16261f;border-left-color:#6fc79f} [data-theme="midnight"] .calendar-event.session-type-consultation{background:#2a2417;border-left-color:#e1ad51} [data-theme="midnight"] .calendar-event.session-type-class{background:#241d33;border-left-color:#9d78c4} [data-theme="midnight"] .calendar-event.session-type-online{background:#152634;border-left-color:#659ed0} [data-theme="midnight"] .calendar-event.session-type-block{background:#20262c;border-left-color:#858e97} [data-theme="midnight"] .calendar-event.session-type-assessment{background:#2c1c1b;border-left-color:#cf746e} [data-theme="midnight"] .calendar-event.session-type-group{background:#152a27;border-left-color:#52a99e} [data-theme="midnight"] .calendar-event .pill-type,[data-theme="midnight"] .calendar-event .pill-status{background:#0e141b73;border-color:transparent;color:#cdd7e0} /* Session pills */ [data-theme="midnight"] .session-pill{background:#212c38;border-color:#33404c;color:#aab6c1} [data-theme="midnight"] .session-pill.pill-type{background:#16332a;border-color:#204a3c;color:#8fe6c2} [data-theme="midnight"] .session-pill.pill-status{background:#1a3a26;border-color:#274f34;color:#8fdf9f} [data-theme="midnight"] .session-pill.pill-location{background:#141d26;border-color:#2a3643;color:#aab6c1} [data-theme="midnight"] .session-pill.pill-muted{background:#232e38;border-color:#313d47;color:#93a0ab} [data-theme="midnight"] .session-pill.pill-fact{background:#141d26;border-color:#2a3643;color:#cdd7e0} /* Session detail / workout / plans */ [data-theme="midnight"] .session-workout{background:#141d26;border-color:#2a3643} [data-theme="midnight"] .session-workout-notes,[data-theme="midnight"] .session-exercise p{color:#a2aeb9} [data-theme="midnight"] .session-workout-empty{background:#1a232e;color:#a2aeb9}[data-theme="midnight"] .session-workout-empty h3{color:#eef3f8} [data-theme="midnight"] .session-training-block,[data-theme="midnight"] .session-participant,[data-theme="midnight"] .builder-section{background:#1a232e;border-color:#2a3643} [data-theme="midnight"] .session-section{border-color:#2a3643} [data-theme="midnight"] .workout-log-intro{background:#141d26;border-color:#2a3643;color:#a2aeb9}[data-theme="midnight"] .workout-log-intro p{color:#dbe4ea} [data-theme="midnight"] .workout-log-section{background:#1a232e} [data-theme="midnight"] .workout-log-section-head{background:#141d26;border-color:#2a3643}[data-theme="midnight"] .workout-log-section-head>span{color:#93a0ab} [data-theme="midnight"] .workout-log-section-note,[data-theme="midnight"] .log-set-number,[data-theme="midnight"] .workout-log-prescription{color:#a2aeb9} [data-theme="midnight"] .workout-log-prescription strong{color:#eef3f8} [data-theme="midnight"] .workout-log-sets{background:#0f1720;border-color:#2a3643} [data-theme="midnight"] .training-plan-head p,[data-theme="midnight"] .plan-block>p,[data-theme="midnight"] .plan-notes{color:#a2aeb9} [data-theme="midnight"] .plan-summary-grid{background:#2a3643}[data-theme="midnight"] .plan-summary-grid>div{background:#141d26}[data-theme="midnight"] .plan-summary-grid strong{color:#eef3f8} [data-theme="midnight"] .plan-progress{background:#232f3a} [data-theme="midnight"] .plan-slot{background:#1a232e;border-color:#232f3a}[data-theme="midnight"] .plan-slot:hover{background:#1e2833} [data-theme="midnight"] .plan-slot-completed .plan-slot-order{background:#1e3a2b;color:#7cd6a3} [data-theme="midnight"] .plan-slot-skipped .plan-slot-order,[data-theme="midnight"] .plan-slot-cancelled .plan-slot-order{background:#262f36;color:#93a0ab} [data-theme="midnight"] .management-list-item:hover{background:#1e2833} /* Messaging */ [data-theme="midnight"] .bubble{background:#212c38;color:#e7edf3}[data-theme="midnight"] .bubble.mine{background:#7bdcb5;color:#0e141b} [data-theme="midnight"] .conversation{background:#1a232e;border-color:#2a3643}[data-theme="midnight"] .conversation.selected{background:#1e2c26} [data-theme="midnight"] .conversation b{color:#eef3f8}[data-theme="midnight"] .conversation p{color:#93a0ab} [data-theme="midnight"] .chat-form{border-color:#2a3643} /* Dialog + close */ [data-theme="midnight"] dialog{background:#1a232e;border-color:#2a3643;box-shadow:0 22px 80px #00000080;color:var(--ink)} [data-theme="midnight"] dialog::backdrop{background:#04080ccc;backdrop-filter:blur(5px)} [data-theme="midnight"] .modal-heading .icon-btn[data-action="close"]{color:#aab6c1}[data-theme="midnight"] .modal-heading .icon-btn[data-action="close"]:hover{background:#232f3a;color:#eef3f8} /* Notices, dropdown, footer, misc */ [data-theme="midnight"] .notice{background:#33301f;color:#e6d29a} [data-theme="midnight"] .error-box{background:#3a2320;color:#f2b0a5} [data-theme="midnight"] .action-dropdown{background:#1a232e;border-color:#2f3b47;box-shadow:0 12px 40px #00000080} [data-theme="midnight"] .action-dropdown .action-dropdown-item{color:#e7edf3} [data-theme="midnight"] .action-dropdown .action-dropdown-item:hover{background:#242f3a} [data-theme="midnight"] .action-dropdown .destructive-action{color:#f2938a}[data-theme="midnight"] .action-dropdown .destructive-action:hover{background:#3a2320} [data-theme="midnight"] footer{color:#8a97a3} [data-theme="midnight"] .progress{background:#232f3a}[data-theme="midnight"] .progress span,[data-theme="midnight"] .session-line{background:#5bbf9a} [data-theme="midnight"] .counter{background:#1e3a30;color:#8fe6c2} [data-theme="midnight"] .bar-chart .bar{background:#26463b}[data-theme="midnight"] .bar-chart .bar.current{background:#5bbf9a} [data-theme="midnight"] hr{border-color:#2a3643} [data-theme="midnight"] .theme-current{color:#0e141b}