/* Quiet dark surfaces and a clear, compact notification center. */
html[data-theme="dark"] body{
 --glass-fill:rgba(10,18,31,.96);--glass-edge:rgba(119,145,177,.27);
 --glass-sheen:linear-gradient(135deg,rgba(42,66,96,.15),rgba(8,15,27,.12));
 --glass-shadow:0 10px 25px rgba(0,0,0,.24),inset 0 1px 0 rgba(184,208,239,.08);
 --icon-edge:#c65b25;--icon-edge-active:#ef813e;
 background:radial-gradient(ellipse at 0 0,rgba(23,42,68,.22),transparent 60%),linear-gradient(150deg,#0c1523,#080e18)!important;
}
html[data-theme="dark"] body[data-authenticated="1"] main.main .dashboard-metrics .metric-featured{
 background:linear-gradient(140deg,#172b44,#0b1526)!important;border-color:#3d5675!important;box-shadow:var(--glass-shadow)!important;
}
html[data-theme="dark"] body[data-authenticated="1"] :is(.side-nav a.active,.mobile-nav a.active:not(.mobile-sale)){
 background:linear-gradient(125deg,#203149,#15253a)!important;box-shadow:inset 0 1px 0 #46617d55!important;
}
html[data-theme="dark"] body[data-authenticated="1"] :is(.side-nav a:hover,.mobile-nav a:hover){background:linear-gradient(130deg,#22364e,#152338)!important}
html[data-theme="dark"] body[data-authenticated="1"] :is(.side-nav a,.mobile-nav a)::before{opacity:.16!important}
html[data-theme="dark"] body :is(.nav-icon,.metric-icon,.analytics-kpi-icon,.mauzo-goal-icon,.notification-icon){border-color:var(--icon-edge)!important}
html[data-theme="dark"] body :is(a.active .nav-icon,.notification-bell,.appearance-switch,.language-switch){border-color:var(--icon-edge-active)!important}
html[data-theme="dark"] body[data-authenticated="1"] main.main :is(.metric-icon,.analytics-kpi-icon,.mauzo-goal-icon){background:linear-gradient(135deg,#26364c,#172538)!important;box-shadow:inset 0 1px 0 #adc4e52b,0 3px 9px #0003!important}
html[data-theme="dark"] body[data-authenticated="0"] .auth-card{background:linear-gradient(140deg,#162337,#0e1829)!important;box-shadow:var(--glass-shadow)!important}
html[data-theme="dark"] body[data-authenticated="0"] .auth-panel{background:transparent!important}
html[data-theme] .auth-photo img{object-position:75% center}
html[data-theme] .auth-mobile-visual img{object-position:75% 45%}
.google-button:disabled{opacity:.7;cursor:not-allowed}
.google-setup-note{font-size:.75rem;line-height:1.5;color:var(--muted);margin:7px 0 14px}
.notification-bell{position:relative;display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;color:var(--heading-ink);background:var(--surface);border:1px solid var(--icon-edge);border-radius:12px;text-decoration:none}
.notification-bell .ui-icon{width:21px;height:21px}
.notification-bell:focus-visible{outline:3px solid #70aeff;outline-offset:3px}
.notification-badge{position:absolute;top:-5px;right:-5px;min-width:17px;height:17px;display:grid;place-items:center;font-size:10px;font-weight:600;background:#b54818;color:#fff;border-radius:12px;padding:0 3px;box-sizing:content-box;border:2px solid var(--surface)}
.notification-badge[hidden]{display:none}
.notification-center,.notification-settings{margin-bottom:18px}
.notification-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.notification-heading h2{margin-bottom:6px}.notification-heading p{margin-top:0}
.notification-list{display:grid;gap:10px;margin-top:18px}
.notification-item{display:flex;align-items:center;gap:14px;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--surface);text-decoration:none;color:var(--text)!important;min-width:0}
.notification-item>span:nth-child(2){display:grid;gap:5px;flex:1;min-width:0;overflow-wrap:anywhere}
.notification-item>span>span{font-size:.88rem;color:var(--muted)}
.notification-item strong{font-size:.95rem;color:var(--heading-ink)}
.notification-item>svg{width:18px;flex:0 0 18px}
.notification-icon{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;border:1px solid var(--icon-edge);border-radius:12px;background:var(--surface2);color:var(--heading-ink)}
.notification-item.is-unread{border-left:3px solid #498cdb}
.notification-read-label{font-size:.72rem;color:var(--muted)}
.notification-item.is-unread .notification-read-label{font-weight:600;color:var(--heading-ink)!important}
.notification-empty{padding:24px 12px;text-align:center}.notification-empty>svg{width:42px;height:42px;color:#29946c}
.notification-empty p{max-width:540px;margin:auto}
.notification-settings h2{display:flex;align-items:center;gap:9px}
.notification-settings p{font-size:.87rem;line-height:1.65}
.notification-buttons{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 22px}
.notification-preferences{display:grid;gap:18px;max-width:600px}
.notification-preferences>label{display:flex;align-items:center;gap:10px;font-size:.9rem}
.notification-preferences input[type="checkbox"]{width:19px;height:19px;flex:0 0 19px;accent-color:#2875dc}
.notification-preferences .notification-time{flex-wrap:wrap}.notification-time select{width:auto;min-width:110px}.notification-time small{overflow-wrap:anywhere}
.notification-preferences>.btn{justify-self:start}
.notification-setup-note{padding:12px 15px;border:1px solid var(--line);border-radius:12px;background:var(--surface2);color:var(--text)}
.notification-status:not(:empty){padding:12px;border:1px solid var(--line);border-radius:10px}
@media(max-width:900px){
 html[data-theme] body[data-authenticated="1"] .app-header .topbar-actions{gap:6px!important;flex-wrap:nowrap!important;flex:0 0 auto}
 html[data-theme] body[data-authenticated="1"] .app-header .header-person{min-width:0;flex:1 1 auto}
 html[data-theme] body[data-authenticated="1"] .app-header .header-identity{min-width:0}
 html[data-theme] body[data-authenticated="1"] .app-header .header-identity small{white-space:nowrap;font-size:.65rem}
 .notification-bell{width:36px;height:36px;flex-basis:36px;border-radius:11px}
 .notification-item{padding:12px;gap:10px}.notification-item strong{font-size:.86rem}.notification-item>span>span{font-size:.8rem}
 .notification-icon{width:34px;height:34px;flex-basis:34px}
}
@media(max-width:360px){
 html[data-theme] body[data-authenticated="1"] .app-header{gap:6px!important;padding:10px!important}
 html[data-theme] body[data-authenticated="1"] .app-header .header-person{gap:6px}
 html[data-theme] body[data-authenticated="1"] .app-header .profile-avatar{width:32px;height:32px;flex-basis:32px}
 html[data-theme] body[data-authenticated="1"] .app-header .header-identity strong{font-size:.8rem}
}
@media print, (forced-colors:active){.notification-bell,.notification-item,.notification-icon{background:Canvas!important;color:CanvasText!important;border:1px solid CanvasText!important}}
