/* Mawgood mobile visual system. Local SVG icons; no new CDN dependency. */
:root { --accent:#009fc7; --accent-hover:#007d9e; --mw-brand:#0087ad; --mw-brand-hover:#006f90; }
[data-theme="light"] {
 --bg-primary:#f7f9fc; --bg-secondary:#fff; --bg-card:#fff;
 --text-primary:#11243a; --text-secondary:#52647a; --border:#e1e8f0;
 --input-bg:#f7f9fc; --input-border:#c5d2df;
 --shadow:0 6px 22px rgba(17,36,58,.045);
}
.mw-icon { width:22px; height:22px; display:inline-block; vertical-align:middle; flex-shrink:0; }
i:has(> .mw-icon)::before { display:none!important; }
i:has(> .mw-icon) { font-style:normal; line-height:1; }
.mw-brand { display:flex; align-items:center; flex-shrink:0; }
.mw-brand img { width:126px; height:50px; object-fit:contain; }
.mw-logo-light { display:none; } .mw-logo-dark { display:block; }
[data-theme="light"] .mw-logo-light { display:block; }
[data-theme="light"] .mw-logo-dark { display:none; }
.top-bar { padding:12px 16px; gap:10px; flex-wrap:wrap; background:var(--bg-secondary); border-bottom:1px solid var(--border); }
.top-bar > div:last-child { margin-inline-start:auto; gap:8px!important; }
.btn-topbar-icon,.btn-smart-id { background:transparent; border:1px solid var(--border); color:var(--text-primary); min-width:40px; }
.avatar { background:#d8f1fa; color:#11243a; }
.mw-day-heading { margin:4px 0 20px; }
.mw-day-heading h1 { font-size:1.6rem; font-weight:750; letter-spacing:-.025em; color:var(--text-primary); margin-bottom:5px; }
.mw-day-heading p { font-size:.9rem; color:var(--text-secondary); margin-bottom:0; }
#page-home { max-width:580px; margin-inline:auto; padding:20px 16px 110px; }
#page-home .m-card { border:1px solid var(--border); border-radius:20px; box-shadow:var(--shadow); }
#page-home .shift-gauge-card { background:var(--bg-card); padding:20px 16px; border-color:var(--border); }
#page-home .gauge-timer-display { color:var(--text-primary); text-shadow:none; font-variant-numeric:tabular-nums; }
#page-home .gauge-status-badge { color:var(--text-primary); background:rgba(0,159,199,.08); border:0; }
#page-home .gauge-subtext,#page-home .text-muted { color:var(--text-secondary)!important; }
#page-home .gauge-bg-circle { stroke:var(--border); }
#page-home .geofence-radar-card { background:var(--bg-card); border-color:var(--border); border-radius:16px; box-shadow:none; }
[data-theme="light"] #page-home .geofence-radar-card.in-range { background:#f0faf4; border-color:#c6e9d1; }
[data-theme="light"] #page-home .text-white { color:var(--text-primary)!important; }
[data-theme="light"] #page-home .text-white-50 { color:var(--text-secondary)!important; }
#page-home .radar-badge { color:var(--text-primary); background:rgba(0,159,199,.08); }
#page-home .punch-slider-track { border:2px solid #97deed; background:rgba(0,159,199,.075); box-shadow:none; height:68px; }
#page-home .slider-hint-text { color:var(--text-primary); font-size:.95rem; font-weight:700; }
#page-home .slider-handle { background:#009fc7; color:#fff; box-shadow:0 3px 10px rgba(0,159,199,.2); }
#page-home .slider-fill { background:rgba(0,159,199,.13); }
#sliderHandleIcon .mw-icon { width:28px; height:28px; }
#sliderHandleIcon .mw-icon-logout { display:none; }
#sliderHandleIcon.fa-sign-out-alt .mw-icon-fingerprint { display:none; }
#sliderHandleIcon.fa-sign-out-alt .mw-icon-logout { display:inline-block; }
.mw-receipt { display:flex; align-items:center; gap:9px; padding:12px 14px; margin-bottom:18px; border:1px solid #c6e9d1; border-radius:14px; background:rgba(22,163,74,.07); color:#166534; font-size:.85rem; }
.mw-receipt[hidden] { display:none; }
.mw-receipt[data-state="pending"] { border-color:#efd69c; background:rgba(245,158,11,.08); color:#854d0e; }
.mw-receipt[data-state="rejected"] { border-color:#efb5b5; background:rgba(239,68,68,.08); color:#b91c1c; }
html:not([data-theme="light"]) .mw-receipt { color:#86efac; }
html:not([data-theme="light"]) .mw-receipt[data-state="pending"] { color:#fcd34d; }
html:not([data-theme="light"]) .mw-receipt[data-state="rejected"] { color:#fca5a5; }
.bottom-nav { left:8px; right:8px; bottom:8px; max-width:620px; margin-inline:auto; background:#11243a; border:1px solid #203950; border-radius:22px; padding:8px 5px calc(8px + env(safe-area-inset-bottom,0px)); box-shadow:0 8px 28px rgba(17,36,58,.16); gap:3px; }
.bottom-nav .nav-item { color:#c4d2df; gap:5px; padding:7px 3px; border-radius:14px; min-height:52px; }
.bottom-nav .nav-item.active { background:#007f9f; color:#fff; }
.bottom-nav .mw-icon { width:23px; height:23px; }
.gps-indicator { color:var(--text-secondary); background:transparent; padding:8px 16px; font-size:.78rem; }
[data-theme="light"] .modal-content-custom { color:var(--text-primary); background:var(--bg-card); }
[data-theme="light"] .login-header { color:var(--text-primary); }
[data-theme="light"] #page-home .badge.bg-primary { background:#e5f5fa!important; color:#006c87; }
@media(max-width:360px) {
 .mw-brand img { width:108px; height:43px; }
 .btn-smart-id span { display:none; }
 .top-bar { padding:10px 12px; }
 .bottom-nav .nav-item { font-size:.61rem; }
}

.login-header .mw-brand,#splash-screen .mw-brand { justify-content:center; margin:0 auto 18px; }
.login-header .mw-brand img,#splash-screen .mw-brand img { width:180px; height:72px; }
#gaugeGradActive stop:first-child { stop-color:#009fc7; }
#gaugeGradActive stop:last-child { stop-color:#007f9f; }
[data-theme="light"] #app-screen .text-white { color:var(--text-primary)!important; }
[data-theme="light"] #app-screen .text-white-50 { color:var(--text-secondary)!important; }

#page-home .shift-gauge-wrapper { width:180px; height:180px; }
#page-home .gauge-progress-circle { filter:none; }
#page-home .shift-gauge-card { padding:16px; }
.mw-day-heading { margin-bottom:14px; }

[data-theme="light"] .ewa-card .text-white, [data-theme="light"] .payslip-summary-box .text-white, [data-theme="light"] .smart-id-card .text-white { color:#f8fafc!important; }
[data-theme="light"] .ewa-card .text-white-50, [data-theme="light"] .payslip-summary-box .text-white-50, [data-theme="light"] .smart-id-card .text-white-50 { color:#cbd5e1!important; }
[data-theme="light"] .payslip-row, [data-theme="light"] .daily-row-item { border-bottom-color:var(--border); }
[data-theme="light"] .offline-sync-banner { background:#fffbeb; border-bottom:1px solid #fcd34d; color:#92400e; }
[data-theme="light"] .offline-sync-banner .btn-outline-warning { color:#92400e; border-color:#d97706; }
[data-theme="light"] #notificationsModal .text-white { color:var(--text-primary)!important; }
[data-theme="light"] .notif-item { background:#f8fafc; border:1px solid var(--border); }
[data-theme="light"] .notif-item.unread { background:#f0f9ff; border-right:4px solid var(--accent); }
[data-theme="light"] .notif-title { color:var(--text-primary); }
[data-theme="light"] .notif-body { color:var(--text-secondary); }
[data-theme="light"] .notif-icon-approved { background:#dcfce7; color:#15803d; }
[data-theme="light"] .notif-icon-rejected { background:#fee2e2; color:#b91c1c; }
[data-theme="light"] .notif-icon-advance { background:#fef3c7; color:#b45309; }
[data-theme="light"] .notif-icon-payroll { background:#e0e7ff; color:#4338ca; }
[data-theme="light"] .badge-approved { background:#dcfce7; color:#15803d; }
[data-theme="light"] .badge-pending { background:#fef3c7; color:#b45309; }
[data-theme="light"] .badge-rejected { background:#fee2e2; color:#b91c1c; }