*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f5f8fc;color:#17253b}.layout{display:grid;grid-template-columns:240px 1fr;min-height:100vh}.sidebar{background:#081524;color:#b7c8da;padding:22px 16px;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:9px;color:#fff;margin:0 7px 26px}.brand img{width:42px;height:42px;object-fit:contain;background:#fff;border-radius:9px}.brand b{font-size:13px}.brand small{display:block;color:#7f94aa;font-size:9px;margin-top:3px}.menu{display:grid;gap:5px}.menu a{padding:11px 12px;border-radius:10px;color:#aebfd0;font-size:12px;text-decoration:none}.menu a:hover,.menu a.active{background:#10263e;color:#fff}.main{padding:24px}.top{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px}.top h1{font-size:24px;margin:0}.top .user{font-size:11px;color:#708198}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stat{background:#fff;border:1px solid #e1e9f2;border-radius:16px;padding:18px;box-shadow:0 12px 30px rgba(16,35,62,.04)}.stat small{display:block;color:#7b899c;font-size:10px}.stat b{font-size:26px;display:block;margin-top:5px}.panel{background:#fff;border:1px solid #e1e9f2;border-radius:16px;padding:20px;margin-bottom:16px;box-shadow:0 12px 30px rgba(16,35,62,.04)}.panel h2{font-size:15px;margin:0 0 16px}.table{width:100%;border-collapse:collapse;font-size:11px}.table th,.table td{padding:10px 8px;border-bottom:1px solid #edf1f5;text-align:left;vertical-align:top}.badge{padding:4px 7px;border-radius:999px;background:#eef5fc;color:#3f6287;font-size:9px;font-weight:700}.actions{display:flex;gap:7px;flex-wrap:wrap}.btn,.btn-sm{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:9px;padding:10px 13px;background:#0877d1;color:#fff;font-weight:800;font-size:11px;text-decoration:none;cursor:pointer}.btn-secondary{background:#eef3f8;color:#44566c}.btn-danger{background:#feecec;color:#a52b2b}.btn-green{background:#18a972}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field label{display:block;font-size:11px;font-weight:800;margin:0 0 6px}.field input,.field textarea,.field select{width:100%;padding:11px;border:1px solid #dbe4ee;border-radius:10px;background:#fff;font:inherit;font-size:11px}.field textarea{min-height:110px;resize:vertical}.field.full{grid-column:1/-1}.checkbox{display:flex;align-items:center;gap:8px;font-size:11px}.notice{padding:10px 12px;border-radius:10px;background:#edf7ff;color:#23537a;font-size:11px;margin-bottom:13px}.flash-success{background:#edfff5;color:#127049}.flash-error{background:#fff0f0;color:#9c2828}.login-wrap{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(135deg,#07111f,#12304a)}.login-card{width:min(410px,100%);background:#fff;border-radius:20px;padding:30px;box-shadow:0 30px 80px rgba(0,0,0,.22)}.login-card img{height:52px;width:auto;margin-bottom:18px}.login-card h1{font-size:23px;margin:0 0 5px}.login-card p{font-size:11px;color:#748399;margin:0 0 20px}.login-card label{display:block;font-size:11px;font-weight:800;margin:14px 0 6px}.login-card input{width:100%;padding:12px;border:1px solid #dce5ee;border-radius:10px}.login-card .btn{width:100%;margin-top:18px}.footer-note{font-size:9px;color:#8090a4;margin-top:30px}@media(max-width:900px){.layout{grid-template-columns:1fr}.sidebar{position:relative;height:auto;padding:12px}.menu{display:flex;overflow:auto}.grid{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:1fr}}@media(max-width:600px){.main{padding:15px}.grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.top{display:block}.user{margin-top:7px}}
.hint{font-size:10px;color:#7b899c;margin:10px 0 15px}.thumb{width:72px;height:48px;object-fit:cover;border-radius:8px;border:1px solid #e0e7ef;background:#f6f8fb}.color-input{display:flex;align-items:center;gap:8px}.color-input input{flex:1}.color-input span{width:32px;height:32px;border-radius:9px;border:1px solid #dbe4ee;display:block}.btn-danger{cursor:pointer}.table img{max-width:72px}@media(max-width:700px){.table{display:block;overflow:auto;white-space:nowrap}.menu{flex-wrap:nowrap}}

/* =========================================================
   TEL OMOYO CMS — DASHBOARD V4
   ========================================================= */
:root{
  --admin-bg:#f4f7fb;
  --admin-panel:#ffffff;
  --admin-ink:#13263e;
  --admin-muted:#75859a;
  --admin-line:#e3eaf2;
  --admin-blue:#0b78d1;
  --admin-green:#18a871;
  --admin-orange:#ef6b11;
  --admin-purple:#6d58d8;
  --admin-navy:#071625;
  --admin-shadow:0 15px 35px rgba(24,49,78,.055);
}
html{background:var(--admin-bg)}
body{background:var(--admin-bg);color:var(--admin-ink)}
.admin-shell{display:grid;grid-template-columns:252px minmax(0,1fr);min-height:100vh}
.sidebar{background:linear-gradient(180deg,#061321 0%,#091a2d 100%);color:#a9bacd;padding:18px 14px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;box-shadow:10px 0 40px rgba(4,17,30,.09);z-index:80}
.sidebar-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.brand{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none;padding:5px 7px 20px}
.brand-logo-wrap{width:45px;height:45px;background:#fff;border-radius:12px;padding:4px;display:grid;place-items:center;box-shadow:0 10px 25px rgba(0,0,0,.12)}
.brand img{width:100%;height:100%;object-fit:contain;background:transparent;border-radius:8px}
.brand b{display:block;font-size:12px;letter-spacing:.04em}.brand small{display:block;margin-top:4px;font-size:8px;color:#7f95aa}
.workspace-label{padding:8px 10px 6px;color:#61768b;font-size:8px;font-weight:800;letter-spacing:.18em}
.menu{display:grid;gap:4px;overflow:auto;padding-right:2px}
.menu a{display:flex;align-items:center;gap:10px;color:#aebfd0;text-decoration:none;font-size:11px;padding:10px 11px;border-radius:10px;transition:.15s}
.menu a:hover{background:rgba(255,255,255,.05);color:#fff}.menu a.active{background:linear-gradient(90deg,#12314f,#10304c);color:#fff;box-shadow:inset 3px 0 0 var(--admin-blue)}
.menu-icon{width:22px;height:22px;display:grid;place-items:center;border-radius:7px;color:#86a8c7;background:rgba(255,255,255,.035);font-size:11px}.menu a.active .menu-icon{color:#fff;background:rgba(11,120,209,.18)}
.sidebar-bottom{margin-top:auto;padding-top:13px;border-top:1px solid rgba(255,255,255,.07);display:grid;gap:4px}.sidebar-action{display:flex;gap:10px;align-items:center;padding:10px 11px;color:#93a9bd;text-decoration:none;font-size:10px;border-radius:10px}.sidebar-action:hover{background:rgba(255,255,255,.05);color:#fff}.sidebar-action.danger:hover{color:#ffb4b4}.sidebar-action span{width:20px;text-align:center}
.sidebar-close,.mobile-menu-btn{display:none}
.main{padding:24px 28px 40px;min-width:0}
.topbar-admin{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.topbar-page{min-width:0}.topbar-kicker{font-size:8px;color:var(--admin-blue);font-weight:800;letter-spacing:.2em;margin-bottom:4px}.topbar-admin h1{font-size:24px;line-height:1.1;margin:0;letter-spacing:-.03em}.topbar-user{display:flex;align-items:center;gap:10px}.visit-btn{display:inline-flex;align-items:center;justify-content:center;padding:9px 12px;border:1px solid var(--admin-line);border-radius:10px;background:#fff;color:#52657b;text-decoration:none;font-size:10px;font-weight:800}.visit-btn:hover{color:var(--admin-blue);border-color:#c8d9ea}.user-chip{display:flex;align-items:center;gap:8px;padding-left:5px}.user-chip .avatar{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#e8f3ff;color:var(--admin-blue);font-size:12px;font-weight:900}.user-chip b,.user-chip small{display:block}.user-chip b{font-size:10px}.user-chip small{font-size:8px;color:var(--admin-muted);margin-top:2px}
.notice{border-radius:11px;border:1px solid #dce8f2;padding:11px 13px;background:#eef7ff;color:#2a587c;font-size:10px;margin-bottom:15px}.flash-success{background:#edfff6;border-color:#c8efdd;color:#14704d}.flash-error{background:#fff2f2;border-color:#f0d1d1;color:#9d3333}
.dashboard-hero{position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:center;gap:30px;margin-bottom:18px;padding:29px 32px;border-radius:22px;background:linear-gradient(118deg,#071625 0%,#0b2138 60%,#0c4160 100%);color:#fff;box-shadow:0 18px 45px rgba(7,22,38,.18)}
.dashboard-hero:after{content:"";position:absolute;inset:auto -5% -75px;height:190px;background:repeating-linear-gradient(166deg,transparent 0 22px,rgba(66,214,164,.075) 23px 25px,transparent 26px 46px);transform:rotate(-3deg)}
.dashboard-hero-copy{position:relative;z-index:2;max-width:760px}.dashboard-kicker{font-size:8px;letter-spacing:.22em;font-weight:800;color:#ffbd21}.dashboard-hero h2{font-size:31px;line-height:1.08;letter-spacing:-.04em;margin:8px 0 8px}.dashboard-hero p{margin:0;color:#bfd0df;font-size:11px;max-width:690px}.dashboard-hero p strong{color:#fff}.dashboard-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.dashboard-hero-mark{position:relative;z-index:2;width:235px;text-align:center;padding:15px 17px;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:rgba(255,255,255,.055);backdrop-filter:blur(9px)}.dashboard-hero-mark img{width:180px;max-width:100%;margin:0 auto 9px}.dashboard-hero-mark span{display:block;color:#a9bbce;font-size:9px}
.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.kpi-card{position:relative;display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--admin-line);border-radius:17px;padding:17px;text-decoration:none;color:inherit;box-shadow:var(--admin-shadow);transition:.18s}.kpi-card:hover{transform:translateY(-1px);border-color:#cedce9;box-shadow:0 18px 40px rgba(24,49,78,.09)}.kpi-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;font-size:17px;font-weight:900}.kpi-icon.blue{background:#e8f3ff;color:var(--admin-blue)}.kpi-icon.green{background:#e8fbf3;color:var(--admin-green)}.kpi-icon.orange{background:#fff0e3;color:var(--admin-orange)}.kpi-icon.purple{background:#eeeaff;color:var(--admin-purple)}.kpi-data span,.kpi-data small{display:block}.kpi-data span{font-size:9px;color:#7b899c}.kpi-data strong{display:block;font-size:24px;line-height:1.05;margin:3px 0}.kpi-data small{font-size:8px;color:#a0adbb}.kpi-arrow{margin-left:auto;align-self:flex-start;color:#9aabba;font-size:12px}
.dashboard-grid-main{display:grid;grid-template-columns:1.25fr .75fr;gap:14px;margin-bottom:14px}.dashboard-grid-bottom{display:grid;grid-template-columns:1fr 1fr;gap:14px}.dashboard-panel{background:#fff;border:1px solid var(--admin-line);border-radius:18px;padding:20px;box-shadow:var(--admin-shadow);min-width:0}.panel-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:16px}.panel-kicker{display:block;color:#7d8da1;font-size:8px;font-weight:800;letter-spacing:.17em;margin-bottom:4px}.panel-title-row h3{margin:0;font-size:15px;letter-spacing:-.02em}.panel-link{font-size:9px;font-weight:800;color:var(--admin-blue);text-decoration:none;white-space:nowrap}.panel-link:hover{text-decoration:underline}
.health-panel{padding-bottom:18px}.health-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 8px;background:#edf9f4;color:#167450;border-radius:999px;font-size:8px;font-weight:800;white-space:nowrap}.health-pill i{width:6px;height:6px;border-radius:50%;background:var(--admin-green);box-shadow:0 0 0 4px rgba(24,169,113,.09)}.health-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.health-card{display:flex;align-items:center;gap:9px;padding:12px;border:1px solid #edf1f5;border-radius:13px;background:#fbfdff}.health-symbol{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:#eef5fb;color:var(--admin-blue);font-size:12px}.health-card small,.health-card strong{display:block}.health-card small{font-size:8px;color:#8898aa}.health-card strong{font-size:11px;margin-top:2px}.completion{margin-top:17px}.completion-head{display:flex;justify-content:space-between;gap:10px;font-size:9px;font-weight:800;color:#4e6177}.progress{height:7px;background:#edf2f6;border-radius:999px;overflow:hidden;margin-top:7px}.progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--admin-blue),var(--admin-green))}.completion-hint{font-size:8px;color:#95a1af;margin-top:6px}
.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.quick-item{display:flex;align-items:center;gap:8px;border:1px solid #edf1f5;border-radius:12px;padding:10px 9px;text-decoration:none;color:inherit;background:#fbfdff}.quick-item:hover{background:#f7fbff;border-color:#d8e5ef}.quick-item>span{width:30px;height:30px;border-radius:9px;background:#eef6fd;color:var(--admin-blue);display:grid;place-items:center;font-weight:900;font-size:13px}.quick-item b,.quick-item small{display:block}.quick-item b{font-size:9px}.quick-item small{font-size:7px;color:#8797a9;margin-top:1px}.quick-item em{margin-left:auto;color:#9aabba;font-style:normal;font-size:11px}
.plan-list{display:grid;gap:7px}.plan-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto auto 14px;gap:9px;align-items:center;padding:9px 10px;border:1px solid #edf1f5;border-radius:12px;text-decoration:none;color:inherit;background:#fbfdff}.plan-row:hover{background:#f8fbfe;border-color:#dce7f0}.plan-marker{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:11px;font-weight:900}.plan-marker.blue{background:#e8f3ff;color:var(--admin-blue)}.plan-marker.green{background:#e8fbf3;color:var(--admin-green)}.plan-marker.orange{background:#fff0e3;color:var(--admin-orange)}.plan-copy b,.plan-copy small{display:block}.plan-copy b{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.plan-copy small{font-size:8px;color:#8a99aa;margin-top:2px}.plan-price{text-align:right;font-size:10px;font-weight:800;color:#344b62}.plan-price small{font-size:7px;color:#95a2b1;font-weight:500}.status-dot{font-size:7px;font-weight:800;padding:5px 7px;border-radius:999px;white-space:nowrap}.status-dot.on{background:#ebfbf5;color:#16734e}.status-dot.off{background:#f1f4f7;color:#7c8998}.plan-row>em{font-style:normal;color:#a1afbc;font-size:11px}
.media-list{display:grid;gap:7px}.media-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:9px;align-items:center;padding:8px 0;border-bottom:1px solid #f0f3f6}.media-row:last-child{border-bottom:0}.media-thumb{width:42px;height:34px;border-radius:8px;overflow:hidden;background:#eef3f7;display:grid;place-items:center;color:#a63c3c;font-weight:900}.media-thumb img{width:100%;height:100%;object-fit:cover}.media-copy b,.media-copy small{display:block}.media-copy b{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.media-copy small{font-size:7px;color:#8a99aa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.mime{font-size:7px;color:#8897a8;padding:4px 6px;border:1px solid #e7edf2;border-radius:999px}
.checklist{display:grid;grid-template-columns:1fr 1fr;gap:7px}.check-item{display:grid;grid-template-columns:26px 1fr auto;gap:7px;align-items:center;padding:8px;border:1px solid #edf1f5;border-radius:11px}.check-item>span{width:25px;height:25px;border-radius:8px;display:grid;place-items:center;font-size:9px;font-weight:900}.check-item.ready>span{background:#e9fbf3;color:var(--admin-green)}.check-item.pending>span{background:#fff4df;color:#a96d00}.check-item b{font-size:8px}.check-item small{font-size:7px;color:#8493a4}.check-item.ready small{color:#18805a}.check-item.pending small{color:#9c7a39}
.empty-state{padding:22px;text-align:center;border:1px dashed #dbe4ed;border-radius:12px;color:#8391a1;font-size:10px;background:#fbfdff}
.mini-preview{border:1px solid #dfe8f0;border-radius:14px;overflow:hidden;background:#fff}.mini-preview-bar{height:31px;background:#0a1726;color:#a9bacb;display:flex;align-items:center;gap:5px;padding:0 9px}.mini-preview-bar>span{width:5px;height:5px;border-radius:50%;background:#5d7184}.mini-preview-bar b{margin-left:5px;font-size:7px;font-weight:700}.mini-preview-body{height:160px;display:grid;grid-template-columns:1fr 1.05fr;background:linear-gradient(90deg,#0a1c2f 0%,#0a243b 50%,#0f3550 100%)}.mini-preview-text{padding:21px 13px;color:#fff}.mini-preview-text i{display:block;width:18px;height:2px;background:var(--admin-green);margin-bottom:10px}.mini-preview-text b{display:block;font-size:7px;color:var(--admin-green);letter-spacing:.08em}.mini-preview-text strong{display:block;font-size:16px;line-height:1.02;letter-spacing:-.04em;margin:5px 0}.mini-preview-text span{display:block;font-size:7px;color:#90a8bd}.mini-preview-image{overflow:hidden}.mini-preview-image img{width:100%;height:100%;object-fit:cover;object-position:center}
@media(max-width:1120px){.kpi-grid{grid-template-columns:1fr 1fr}.dashboard-grid-main{grid-template-columns:1fr}.pricing{grid-template-columns:1fr 1fr!important}.package-layout{grid-template-columns:1fr!important}.nav-links{display:none}.main{padding:20px}.sidebar{position:fixed;left:-265px;transition:left .2s}.sidebar.open{left:0}.sidebar-close{display:block;border:0;background:rgba(255,255,255,.06);color:#fff;width:30px;height:30px;border-radius:9px;font-size:20px}.sidebar-backdrop{display:none}.sidebar-backdrop.show{display:block;position:fixed;inset:0;background:rgba(2,11,18,.48);z-index:70}.mobile-menu-btn{display:inline-grid;place-items:center;width:38px;height:38px;border:1px solid var(--admin-line);border-radius:10px;background:#fff;color:var(--admin-blue)}.topbar-admin{align-items:flex-start}.topbar-page{display:flex;gap:12px;align-items:flex-start}.topbar-page:before{content:'';display:block}.admin-shell{grid-template-columns:1fr}}
@media(max-width:760px){.main{padding:15px}.topbar-user .visit-btn{display:none}.dashboard-hero{display:block;padding:23px}.dashboard-hero-mark{margin-top:20px;width:100%;text-align:left;display:flex;align-items:center;gap:12px}.dashboard-hero-mark img{width:130px;margin:0}.kpi-grid{grid-template-columns:1fr 1fr}.dashboard-grid-bottom{grid-template-columns:1fr}.health-grid{grid-template-columns:1fr}.quick-grid,.checklist{grid-template-columns:1fr}.pricing{grid-template-columns:1fr!important}.topbar-admin h1{font-size:20px}.topbar-kicker{font-size:7px}.user-chip{padding:0}.hero-bottom-inner{display:none}.mini-preview-body{height:145px}.package-benefits{grid-template-columns:1fr!important}}
@media(max-width:470px){.kpi-grid{grid-template-columns:1fr}.dashboard-actions .btn{flex:1}.hero-copy h1{font-size:38px}.dashboard-hero-mark span{font-size:8px}.plan-row{grid-template-columns:38px minmax(0,1fr) auto}.plan-row>em{display:none}.status-dot{display:none}.topbar-page{gap:7px}.user-chip div{display:none}}

/* =========================================================
   DASHBOARD AUDIT V5 — targeted production-safe fixes
   ========================================================= */
.health-pill.good{background:#edf9f4;color:#167450}
.health-pill.warn{background:#fff5e7;color:#94620a}
.health-pill.warn i{background:#d9911b;box-shadow:0 0 0 4px rgba(217,145,27,.10)}
@media(max-width:760px){
  .topbar-admin{gap:10px}
  .topbar-page{flex:1;min-width:0}
  .topbar-user{flex:0 0 auto}
  .user-chip div{max-width:120px;overflow:hidden}
  .user-chip b,.user-chip small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .dashboard-panel{padding:16px}
  .panel-title-row{gap:10px}
  .panel-link{font-size:8px}
  .plan-row{grid-template-columns:38px minmax(0,1fr) auto}
  .plan-price{font-size:9px}
}
@media(max-width:520px){
  .topbar-admin{align-items:center}
  .topbar-admin h1{font-size:19px}
  .topbar-user .user-chip{display:none}
  .dashboard-hero{padding:20px}
  .dashboard-hero h2{font-size:26px}
  .dashboard-hero p{font-size:10px}
  .dashboard-actions{display:grid;grid-template-columns:1fr}
  .dashboard-actions .btn{width:100%}
  .health-card{padding:10px}
  .panel-title-row{align-items:center}
  .panel-title-row h3{font-size:14px}
}


/* CUSTOMER REGISTRATION ADMIN V1 */
.kpi-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.kpi-icon.cyan{background:#ecf9ff;color:#0788c9}.registration-dashboard-panel{grid-column:1/-1}.registration-summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:17px}.registration-summary-grid>div{background:#f8fbfe;border:1px solid #e3edf5;border-radius:14px;padding:13px 15px}.registration-summary-grid span,.registration-metrics span{display:block;font-size:9px;color:#7b8b9d;text-transform:uppercase;letter-spacing:.08em;font-weight:800}.registration-summary-grid strong,.registration-metrics b{display:block;font-size:23px;color:#173452;margin-top:3px}.pending-number{color:#e26d12!important}.success-number{color:#1a9c68!important}.registration-recent-list{display:grid;gap:7px}.registration-recent-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:10px;align-items:center;border:1px solid #e3edf5;border-radius:13px;padding:9px 11px;text-decoration:none;color:inherit}.registration-recent-row:hover{border-color:#bed9ee;background:#fbfdff}.registration-avatar{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#eaf4ff;color:var(--blue);font-weight:900;font-size:12px}.registration-avatar.large{width:54px;height:54px;border-radius:16px;font-size:18px}.registration-recent-copy{min-width:0}.registration-recent-copy b,.registration-recent-copy small{display:block}.registration-recent-copy b{font-size:11px;color:#173452}.registration-recent-copy small{font-size:9px;color:#7c8d9f;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.registration-status{display:inline-flex;align-items:center;justify-content:center;padding:6px 8px;border-radius:999px;font-size:8px;font-weight:900;white-space:nowrap;background:#edf3f8;color:#60768b}.status-baru{background:#fff4de;color:#a76608}.status-dihubungi{background:#edf5ff;color:#1768a8}.status-survey{background:#f0edff;color:#6651a9}.status-jadwal_pasang{background:#fff0e7;color:#bf5e12}.status-terpasang{background:#eaf9f2;color:#17764f}.status-batal{background:#fff0f0;color:#a24343}.registration-page-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(520px,1.45fr);gap:18px;align-items:start}.registration-detail-head{display:flex;gap:13px;align-items:center;padding:12px 0 18px}.registration-detail-head h3{font-size:21px;margin:0}.registration-detail-head p{font-size:10px;color:#7d8ea1;margin:5px 0 0}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:18px}.detail-grid>div{border:1px solid #e5edf4;border-radius:12px;padding:10px 12px;background:#fbfdff}.detail-grid>div:nth-child(5){grid-column:1/-1}.detail-grid span,.detail-grid b{display:block}.detail-grid span{font-size:8px;color:#8191a2;text-transform:uppercase;letter-spacing:.08em;font-weight:900}.detail-grid b{font-size:10px;color:#29445f;margin-top:4px;line-height:1.5}.registration-update-form{border-top:1px solid #e8eef4;padding-top:17px}.registration-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 16px}.registration-metrics>div{border:1px solid #e3edf5;background:#fbfdff;border-radius:12px;padding:12px}.registration-metrics b{font-size:18px}.registration-filter{display:grid;grid-template-columns:minmax(0,1fr) 180px auto auto;gap:8px;align-items:center;margin-bottom:14px}.registration-filter input,.registration-filter select{min-height:36px;border:1px solid #d8e3ed;border-radius:10px;padding:0 10px;font:inherit;font-size:10px}.registration-table-wrap{overflow:auto}.registration-table{min-width:820px}.registration-setup-note{border:1px solid #f0dfba;background:#fff9ea;color:#725b27;padding:14px 16px;border-radius:12px;font-size:10px;line-height:1.6}.registration-setup-note p{margin:7px 0 0}.integration-section{border:1px solid #e1eaf2;border-radius:15px;padding:17px;margin:15px 0}.integration-section h3{font-size:14px;margin:0 0 10px}.hint-inline{display:block;font-size:8px;color:#8394a6;margin-top:5px}.integration-contract{display:grid;gap:6px;padding:10px 12px;background:#f7fbff;border-radius:10px;margin-top:12px}.integration-contract b{font-size:9px}.integration-contract code{font-size:8px;color:#47647c;word-break:break-all}
@media(max-width:1180px){.kpi-grid{grid-template-columns:repeat(3,1fr)}.registration-page-grid{grid-template-columns:1fr}.registration-detail-panel{order:0}.registration-list-panel{order:1}}
@media(max-width:900px){.registration-summary-grid{grid-template-columns:repeat(2,1fr)}.registration-filter{grid-template-columns:1fr 1fr}.registration-filter input{grid-column:1/-1}}
@media(max-width:620px){.kpi-grid{grid-template-columns:1fr 1fr}.registration-summary-grid,.registration-metrics{grid-template-columns:1fr 1fr}.registration-recent-row{grid-template-columns:34px 1fr}.registration-status{grid-column:2;justify-self:start}.registration-filter{grid-template-columns:1fr}.registration-filter input,.registration-filter select{grid-column:auto}.detail-grid{grid-template-columns:1fr}.detail-grid>div:nth-child(5){grid-column:auto}}

.registration-page-grid:not(.has-detail) .registration-list-panel{grid-column:1/-1}

/* =========================================================
   ADMIN LAYOUT V1.6 — HARDENED DESKTOP/MOBILE SHELL
   Purpose: force sidebar-left / main-right regardless of
   conflicting legacy layout rules or browser zoom.
   ========================================================= */
html, body { min-height:100%; }
body { overflow-x:hidden; }
.admin-shell {
  display:flex !important;
  flex-direction:row !important;
  align-items:stretch !important;
  min-height:100vh !important;
  width:100% !important;
}
.admin-shell > .sidebar {
  order:0 !important;
  flex:0 0 252px !important;
  width:252px !important;
  max-width:252px !important;
  min-width:252px !important;
  min-height:100vh !important;
  height:100vh !important;
  position:sticky !important;
  top:0 !important;
  left:auto !important;
  right:auto !important;
  grid-column:auto !important;
  grid-row:auto !important;
  align-self:flex-start !important;
}
.admin-shell > .main {
  order:1 !important;
  flex:1 1 auto !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 !important;
  grid-column:auto !important;
  grid-row:auto !important;
}
.admin-shell > .sidebar-backdrop { order:2 !important; }
.topbar-admin, .dashboard-hero, .kpi-grid, .dashboard-grid-main,
.dashboard-grid-bottom, .panel, .registration-page-grid,
.registration-dashboard-panel { max-width:none; }

@media (max-width: 819px) {
  .admin-shell {
    display:block !important;
  }
  .admin-shell > .sidebar {
    position:fixed !important;
    top:0 !important;
    bottom:0 !important;
    left:-292px !important;
    width:280px !important;
    max-width:280px !important;
    min-width:280px !important;
    height:100vh !important;
    min-height:100vh !important;
    transition:left .22s ease !important;
    z-index:100 !important;
  }
  .admin-shell > .sidebar.open {
    left:0 !important;
  }
  .admin-shell > .main {
    width:100% !important;
    min-width:0 !important;
  }
  .sidebar-backdrop.show {
    position:fixed !important;
    inset:0 !important;
    z-index:90 !important;
  }
  .mobile-menu-btn { display:inline-grid !important; }
  .sidebar-close { display:block !important; }
}


/* =========================================================
   TEL OMOYO ADMIN V2 — CUSTOMER OPERATIONS
   Production-safe visual/UX layer; no DB schema changes.
   ========================================================= */
.menu a{position:relative}.menu-label{min-width:0}.menu-count{margin-left:auto;min-width:20px;height:18px;padding:0 6px;display:inline-grid;place-items:center;border-radius:999px;background:#ef6b11;color:#fff;font-size:8px;font-weight:900;box-shadow:0 4px 10px rgba(239,107,17,.2)}
.topbar-alert{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:0 10px;border-radius:10px;background:#fff4e7;border:1px solid #f4d9b8;color:#a95f10;text-decoration:none;font-size:9px;font-weight:900}
.operations-panel{grid-column:1/-1}.pipeline-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}.pipeline-card{display:block;text-decoration:none;color:inherit;border:1px solid #e0e9f2;border-radius:14px;background:#fbfdff;padding:12px;transition:.16s}.pipeline-card:hover,.pipeline-card.pipeline-urgent{transform:translateY(-1px);border-color:#c6d9e9;background:#fff;box-shadow:0 10px 25px rgba(21,51,79,.06)}.pipeline-card.pipeline-urgent{box-shadow:inset 0 0 0 1px rgba(239,107,17,.05)}.pipeline-top{display:flex;gap:6px;align-items:center;font-size:8px;font-weight:800;color:#667c92;min-height:26px}.pipeline-card strong{display:block;font-size:25px;letter-spacing:-.04em;color:#173452;margin-top:8px}.pipeline-card small{display:block;color:#93a1b1;font-size:8px;margin-top:1px}.pipeline-dot{width:9px;height:9px;border-radius:999px;background:#b4c1cd;box-shadow:0 0 0 4px rgba(180,193,205,.16)}.pipeline-dot.baru{background:#e39a24;box-shadow:0 0 0 4px rgba(227,154,36,.12)}.pipeline-dot.dihubungi{background:#2e83c9;box-shadow:0 0 0 4px rgba(46,131,201,.11)}.pipeline-dot.survey{background:#735bd7;box-shadow:0 0 0 4px rgba(115,91,215,.11)}.pipeline-dot.jadwal_pasang{background:#ef6b11;box-shadow:0 0 0 4px rgba(239,107,17,.11)}.pipeline-dot.terpasang{background:#18a871;box-shadow:0 0 0 4px rgba(24,168,113,.11)}.pipeline-dot.batal{background:#bf5b5b;box-shadow:0 0 0 4px rgba(191,91,91,.11)}
.registration-detail-panel-v2{padding:22px}.detail-toolbar{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:16px}.detail-toolbar-actions{display:flex;gap:7px;flex-wrap:wrap}.detail-identity{display:flex;align-items:center;gap:13px;padding:16px;border:1px solid var(--admin-line);background:linear-gradient(180deg,#fbfdff,#f7fbff);border-radius:17px}.registration-avatar.xl{width:62px;height:62px;border-radius:17px;font-size:19px}.detail-identity-copy{min-width:0;flex:1}.detail-identity-copy h2{margin:5px 0 3px;font-size:22px;letter-spacing:-.03em}.detail-identity-copy p{margin:0;font-size:9px;color:var(--admin-muted)}.registration-status.big{font-size:9px;padding:8px 10px}
.detail-info-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:15px 0}.detail-info-card{padding:11px 12px;border:1px solid #e2eaf2;border-radius:12px;background:#fbfdff;min-width:0}.detail-info-card:nth-child(7),.detail-info-card:nth-child(13),.detail-info-card:nth-child(14){grid-column:span 2}.detail-info-card span,.detail-info-card strong{display:block}.detail-info-card span{font-size:8px;text-transform:uppercase;letter-spacing:.08em;color:#8595a7;font-weight:900}.detail-info-card strong{font-size:9px;line-height:1.55;color:#2a465f;margin-top:4px;word-break:break-word}.registration-update-form-v2{padding-top:17px;border-top:1px solid #e7edf3}
.monitor-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.monitor-head h2{font-size:21px;margin:4px 0 4px}.monitor-head p{margin:0;color:var(--admin-muted);font-size:9px}.monitor-head-actions{display:flex;gap:7px;flex-wrap:wrap}.attention-banner{display:flex;justify-content:space-between;gap:14px;align-items:center;margin:16px 0;padding:12px 14px;border:1px solid #f0d8b5;background:#fff9ef;border-radius:13px}.attention-banner strong{display:block;color:#8f5a10;font-size:10px}.attention-banner span{display:block;color:#977b4e;font-size:8px;margin-top:3px}.attention-banner .btn-sm{background:#ef6b11}.registration-stage-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:15px 0 16px}.stage-card{position:relative;text-decoration:none;color:inherit;border:1px solid #e1e9f0;border-radius:13px;padding:11px 12px;background:#fbfdff;transition:.16s}.stage-card:hover,.stage-card.selected{background:#fff;box-shadow:0 10px 24px rgba(21,51,79,.05);border-color:#cbdce9}.stage-card.selected:after{content:'';position:absolute;left:10px;right:10px;bottom:-1px;height:2px;background:var(--admin-blue);border-radius:2px}.stage-card span{display:block;font-size:8px;font-weight:800;color:#74879b;min-height:26px}.stage-card strong{display:block;color:#173452;font-size:21px;line-height:1.05;margin-top:4px}.stage-card small{display:block;font-size:7px;color:#99a6b5;margin-top:2px}.stage-baru strong{color:#a76608}.stage-terpasang strong{color:#17805a}.monitor-subhead{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:4px 0 10px;font-size:9px;color:#7e8ea0}.monitor-subhead b{color:#173452;font-size:11px}.monitor-today strong{color:#173452}.registration-filter-v2{display:grid;grid-template-columns:minmax(280px,1.5fr) 150px 190px 130px 130px auto auto;gap:7px;align-items:center;margin:12px 0 15px}.filter-search{height:36px;display:flex;align-items:center;gap:7px;padding:0 10px;border:1px solid #d8e3ed;border-radius:10px;background:#fff}.filter-search span{font-size:15px;color:#7d91a5}.filter-search input{width:100%;border:0!important;padding:0!important;outline:0;background:transparent!important}.registration-filter-v2 select,.registration-filter-v2 input[type=date]{min-height:36px;border:1px solid #d8e3ed;border-radius:10px;padding:0 9px;background:#fff;font:inherit;font-size:9px;color:#42566d}.registration-filter-v2 input[type=date]{width:100%}.btn-disabled{background:#f3f6f8;color:#9caab8;cursor:default}.registration-table-wrap-v2{border:1px solid #e2e9f0;border-radius:14px}.registration-table-v2{min-width:1050px}.registration-table-v2 thead th{background:#f7fafc;color:#7c8d9e;font-size:8px;text-transform:uppercase;letter-spacing:.06em}.registration-table-v2 td{padding:12px 10px}.lead-cell{display:flex;align-items:center;gap:9px}.lead-cell b,.lead-cell small,.registration-table-v2 td>b,.registration-table-v2 td>small,.table-contact{display:block}.lead-cell b,.registration-table-v2 td>b{font-size:9px;color:#263f58}.lead-cell small,.registration-table-v2 td>small,.table-contact+small{font-size:8px;color:#8191a2;margin-top:2px}.table-contact{font-size:9px;font-weight:800;color:var(--admin-blue);text-decoration:none}.table-contact:hover{text-decoration:underline}.table-actions{display:flex;gap:5px;align-items:center}.icon-action{height:27px;min-width:28px;padding:0 7px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;background:#eaf9f2;color:#168055;text-decoration:none;font-size:8px;font-weight:900}.pagination{display:flex;justify-content:center;align-items:center;gap:10px;padding-top:15px;font-size:9px;color:#7c8d9e}.pagination>span:not(.btn-sm){padding:0 4px}.registration-empty{display:grid;place-items:center;gap:4px;padding:34px}.empty-symbol{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:#f2f6fa;color:#90a2b3;font-size:24px}.registration-empty b{font-size:10px;color:#4c6379}.registration-empty small{font-size:8px;color:#8999a8}.page-empty-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#fff4df;color:#a5680e;font-weight:900;margin-bottom:10px}
@media(max-width:1180px){.pipeline-grid,.registration-stage-grid{grid-template-columns:repeat(3,1fr)}.registration-filter-v2{grid-template-columns:minmax(240px,1fr) 1fr 1fr 1fr 1fr auto auto}.detail-info-grid{grid-template-columns:repeat(2,1fr)}.detail-info-card:nth-child(7),.detail-info-card:nth-child(13),.detail-info-card:nth-child(14){grid-column:1/-1}}
@media(max-width:760px){.monitor-head,.detail-toolbar,.attention-banner{display:block}.monitor-head-actions,.detail-toolbar-actions{margin-top:10px}.registration-stage-grid,.pipeline-grid{grid-template-columns:1fr 1fr}.registration-filter-v2{grid-template-columns:1fr 1fr}.filter-search{grid-column:1/-1}.registration-filter-v2 select,.registration-filter-v2 input[type=date]{width:100%}.monitor-subhead{display:block}.monitor-today{margin-top:5px}.detail-identity{align-items:flex-start;flex-wrap:wrap}.detail-identity-copy{min-width:calc(100% - 80px)}.registration-status.big{margin-left:75px}.detail-info-grid{grid-template-columns:1fr}.detail-info-card:nth-child(7),.detail-info-card:nth-child(13),.detail-info-card:nth-child(14){grid-column:auto}.topbar-alert{display:none}}
@media(max-width:480px){.registration-stage-grid,.pipeline-grid{grid-template-columns:1fr 1fr}.registration-filter-v2{grid-template-columns:1fr}.attention-banner .btn-sm{margin-top:9px}.detail-identity-copy h2{font-size:19px}.registration-status.big{margin-left:0}.topbar-user .visit-btn{display:none}}


/* =========================================================
   CUSTOMER OPERATIONS V2.1 — readability/refinement layer
   Extends the existing hardened V1.6 admin shell.
   ========================================================= */
.monitor-head{padding-bottom:2px}
.monitor-head h2{font-size:22px;line-height:1.2;letter-spacing:-.025em;color:var(--admin-ink)}
.monitor-head p{font-size:12px;line-height:1.5;color:var(--admin-muted)}
.monitor-head-actions .btn-sm{min-height:38px;padding:0 13px;font-size:10px}
.attention-banner{padding:15px 16px}
.attention-banner strong{font-size:12px}
.attention-banner span{font-size:10px;line-height:1.45}
.registration-stage-grid{gap:10px}
.stage-card{padding:14px 14px;min-height:94px}
.stage-card span{font-size:10px;line-height:1.25;min-height:30px}
.stage-card strong{font-size:26px}
.stage-card small{font-size:9px}
.monitor-subhead{font-size:11px}
.monitor-subhead b{font-size:13px}
.registration-filter-v2{gap:9px;margin:14px 0 17px}
.filter-search{min-height:40px;height:40px}
.filter-search span{font-size:16px}
.registration-filter-v2 select,.registration-filter-v2 input[type=date]{min-height:40px;font-size:10px}
.registration-filter-v2 .btn-sm{min-height:40px}
.registration-table-wrap-v2{border-radius:15px}
.registration-table-v2{min-width:1080px}
.registration-table-v2 thead th{font-size:9px;padding:11px 10px}
.registration-table-v2 td{padding:14px 10px;font-size:10px}
.lead-cell b,.registration-table-v2 td>b{font-size:10px}
.lead-cell small,.registration-table-v2 td>small,.table-contact+small{font-size:9px}
.table-contact{font-size:10px}
.icon-action{height:30px;min-width:30px;font-size:9px}
.registration-status{font-size:9px;padding:7px 9px}
@media(max-width:1180px){
  .registration-stage-grid{grid-template-columns:repeat(3,1fr)}
  .registration-filter-v2{grid-template-columns:minmax(240px,1fr) 1fr 1fr 1fr 1fr auto auto}
}
@media(max-width:760px){
  .monitor-head h2{font-size:20px}
  .monitor-head p{font-size:11px}
  .stage-card{min-height:86px;padding:12px}
  .stage-card span{font-size:9px}
  .stage-card strong{font-size:23px}
  .registration-filter-v2{grid-template-columns:1fr 1fr}
  .filter-search{grid-column:1/-1}
}

/* Registration Detail V2.2 */
.registration-detail-page{padding:20px}.registration-detail-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}.registration-detail-actions{display:flex;gap:8px;flex-wrap:wrap}.btn-green{background:#16a36f!important;color:#fff!important;border-color:#16a36f!important}.registration-detail-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 0 20px;border-bottom:1px solid #e6edf3}.registration-detail-identity{display:flex;align-items:center;gap:14px;min-width:0}.registration-detail-identity h2{font-size:25px;line-height:1.15;margin:4px 0 0;color:#163451}.registration-detail-identity p{font-size:10px;color:#7d8ea1;margin:5px 0 0}.detail-status{font-size:9px;padding:8px 11px}.registration-detail-columns{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr);gap:16px;margin-top:18px;align-items:start}.registration-detail-primary{display:grid;gap:14px;min-width:0}.registration-detail-side{display:grid;gap:14px}.detail-section{border:1px solid #e1eaf2;background:#fff;border-radius:15px;padding:16px}.detail-section-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.detail-section-head h3{margin:3px 0 0;font-size:16px;color:#163451}.detail-grid-profile,.detail-grid-package{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:0}.detail-grid-location{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:0}.detail-grid-location>div:first-child{grid-column:1/-1}.detail-note{padding:12px 13px;border-radius:11px;background:#f8fbfe;border:1px solid #e4edf4;color:#405a72;font-size:11px;line-height:1.65;min-height:44px}.detail-action-card{background:linear-gradient(180deg,#fbfdff 0%,#fff 100%)}.registration-update-form{display:grid;gap:12px}.registration-update-form .field{display:grid;gap:6px}.registration-update-form label{font-size:10px;font-weight:800;color:#35506a}.registration-update-form select,.registration-update-form textarea{width:100%;box-sizing:border-box;border:1px solid #d7e2ec;border-radius:11px;background:#fff;padding:10px 11px;font:inherit;font-size:11px;color:#173452}.registration-update-form textarea{resize:vertical;min-height:120px;line-height:1.55}.registration-update-form .btn{width:100%;justify-content:center}.detail-meta-card{padding:14px 16px}.detail-meta-row{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px dashed #e5edf4}.detail-meta-row:last-child{border-bottom:0}.detail-meta-row span{font-size:9px;color:#7e91a4}.detail-meta-row b{font-size:10px;color:#29445f;text-align:right}.registration-list-full{width:100%}
@media(max-width:1000px){.registration-detail-columns{grid-template-columns:1fr}.registration-detail-side{grid-template-columns:1fr 1fr}.detail-meta-card{height:max-content}}
@media(max-width:680px){.registration-detail-page{padding:14px}.registration-detail-toolbar,.registration-detail-hero{align-items:flex-start;flex-direction:column}.registration-detail-actions{width:100%}.registration-detail-actions .btn-sm{flex:1;text-align:center}.registration-detail-identity h2{font-size:21px}.detail-grid-profile,.detail-grid-location,.detail-grid-package{grid-template-columns:1fr}.detail-grid-location>div:first-child{grid-column:auto}.registration-detail-side{grid-template-columns:1fr}.detail-section{padding:13px}}


/* =========================================================
   TEL OMOYO ADMIN V2.3 — NOTIFICATION COUNTER HOTFIX
   ========================================================= */
.menu a{position:relative}
.menu-label{min-width:0}
.menu-count{margin-left:auto;min-width:22px;height:20px;padding:0 7px;display:inline-grid;place-items:center;border-radius:999px;background:#ef6b11;color:#fff;font-size:9px;line-height:1;font-weight:900;box-shadow:0 5px 12px rgba(239,107,17,.20)}
.topbar-user{display:flex;align-items:center;gap:10px}
.topbar-alert{display:inline-flex!important;align-items:center;justify-content:center;gap:5px;min-height:34px;padding:0 11px;border-radius:10px;background:#fff4e7;border:1px solid #f4d9b8;color:#a95f10;text-decoration:none;font-size:9px;font-weight:900;white-space:nowrap}
.topbar-alert:hover{background:#fff0db;color:#8d4f09;border-color:#edc896}
@media(max-width:760px){.topbar-alert{min-height:32px;padding:0 9px}.topbar-alert{font-size:8px}}


/* =========================================================
   TEL OMOYO CMS — DASHBOARD V2.4
   Monthly customer trend + recent customers
   ========================================================= */
.dashboard-chart-panel{margin-bottom:18px;padding-bottom:15px}
.dashboard-panel-subtitle{margin:4px 0 0;color:#8192a5;font-size:9px;line-height:1.55}
.chart-period{display:inline-flex;align-items:center;justify-content:center;padding:7px 10px;border:1px solid #dfe8f0;border-radius:999px;background:#f8fbfe;color:#62758a;font-size:8px;font-weight:800;white-space:nowrap}
.chart-legend{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:6px 0 10px;padding:10px 0 2px}
.legend-item{display:inline-flex;align-items:center;gap:6px;color:#4d6177;font-size:8px;line-height:1}
.legend-item i{width:8px;height:8px;border-radius:50%;display:inline-block;box-shadow:0 0 0 2px rgba(20,38,62,.035)}
.legend-item b{font-size:8px;font-weight:800}.legend-item small{font-size:8px;color:#91a0af;font-weight:700}
.dashboard-chart-wrap{position:relative;width:100%;overflow:hidden;border:1px solid #edf2f6;border-radius:15px;background:linear-gradient(180deg,#fbfdff 0%,#fff 100%)}
.dashboard-line-chart{display:block;width:100%;height:auto;min-height:260px}
.chart-grid-line{stroke:#e9eff4;stroke-width:1}
.chart-axis-label{fill:#90a0af;font-size:9px;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.chart-series{filter:drop-shadow(0 2px 3px rgba(16,37,61,.08))}
.recent-customers-panel{margin-bottom:18px}
.recent-customer-table-wrap{overflow:auto;border:1px solid #e6edf3;border-radius:15px}
.recent-customer-table{width:100%;border-collapse:separate;border-spacing:0;min-width:760px;font-size:9px}
.recent-customer-table th{padding:10px 11px;background:#f7fafc;color:#7e91a4;font-size:8px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;text-align:left;border-bottom:1px solid #e6edf3}
.recent-customer-table td{padding:10px 11px;border-bottom:1px solid #eef2f6;vertical-align:middle;color:#29445f}
.recent-customer-table tbody tr:last-child td{border-bottom:0}
.recent-customer-table tbody tr:hover{background:#fbfdff}
.recent-customer-table td>b,.recent-customer-table td>small{display:block}
.recent-customer-table td>small{font-size:7px;color:#8a9bac;margin-top:2px}
.customer-cell{display:flex;align-items:center;gap:9px;min-width:170px}
.customer-cell>div{min-width:0}.customer-cell b,.customer-cell small{display:block}.customer-cell b{font-size:9px;color:#173452;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.customer-cell small{font-size:7px;color:#8a9bac;margin-top:2px}
.recent-customer-actions{display:flex;align-items:center;gap:5px;white-space:nowrap}.recent-customer-actions .btn-sm{font-size:8px;padding:7px 8px}
.dashboard-quick-panel{margin-bottom:18px}
@media(max-width:900px){
  .chart-period{align-self:flex-start}
  .chart-legend{gap:10px}
  .dashboard-line-chart{min-height:230px}
}
@media(max-width:620px){
  .panel-title-row{align-items:flex-start}
  .chart-period{font-size:7px;padding:6px 8px}
  .dashboard-panel-subtitle{font-size:8px}
  .chart-legend{display:grid;grid-template-columns:1fr 1fr;gap:9px 12px}
  .dashboard-line-chart{min-height:205px}
  .recent-customer-table{min-width:700px}
  .recent-customer-table th,.recent-customer-table td{padding:9px 8px}
}

/* =========================================================
   TELOMOYO ADMIN — ELEGANT NAVY UI V3
   Visual-only layer. Backend, forms, actions and data flow stay intact.
   ========================================================= */
:root{
  --navy-950:#041225;
  --navy-900:#071a33;
  --navy-850:#0a2342;
  --navy-800:#0d2b50;
  --navy-700:#143e6b;
  --blue-600:#1769e0;
  --blue-500:#2f80ed;
  --blue-100:#e9f2ff;
  --blue-50:#f5f9ff;
  --slate-950:#10233e;
  --slate-700:#425b76;
  --slate-500:#74869b;
  --slate-300:#cfd9e5;
  --slate-200:#e2e9f1;
  --slate-100:#eef3f8;
  --surface:#ffffff;
  --page:#f3f6fa;
  --success:#14966b;
  --warning:#d88616;
  --danger:#cc4d5d;
  --radius-sm:10px;
  --radius-md:14px;
  --radius-lg:20px;
  --shadow-sm:0 1px 2px rgba(4,18,37,.03),0 8px 24px rgba(16,35,62,.045);
  --shadow-md:0 18px 48px rgba(7,26,51,.09);
  --admin-bg:var(--page);
  --admin-panel:var(--surface);
  --admin-ink:var(--slate-950);
  --admin-muted:var(--slate-500);
  --admin-line:var(--slate-200);
  --admin-blue:var(--blue-600);
  --admin-green:var(--success);
  --admin-orange:var(--warning);
  --admin-navy:var(--navy-900);
  --admin-shadow:var(--shadow-sm);
}

html{background:var(--page);scroll-behavior:smooth}
body{background:var(--page);color:var(--slate-950);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
.ui-icon{display:block;width:19px;height:19px;flex:0 0 auto}

/* Shell */
.admin-shell{display:flex!important;align-items:stretch!important;min-height:100vh!important;background:var(--page)}
.admin-shell>.sidebar{flex:0 0 280px!important;width:280px!important;min-width:280px!important;max-width:280px!important;height:100vh!important;min-height:100vh!important;padding:0!important;overflow:hidden;background:
  radial-gradient(circle at 20% 0%,rgba(47,128,237,.18),transparent 28%),
  linear-gradient(180deg,var(--navy-900) 0%,var(--navy-950) 100%)!important;
  border-right:1px solid rgba(255,255,255,.06);box-shadow:18px 0 55px rgba(4,18,37,.08);transition:width .22s ease,flex-basis .22s ease,min-width .22s ease;z-index:100}
.admin-shell>.main{flex:1 1 auto!important;width:auto!important;min-width:0!important;margin:0!important;padding:0 30px 44px!important;background:var(--page)}
.admin-content{width:100%;max-width:1680px;margin:0 auto}

/* Sidebar brand */
.sidebar-head{height:82px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px 12px;border-bottom:1px solid rgba(255,255,255,.07)}
.brand{min-width:0;display:flex;align-items:center;gap:12px;margin:0!important;padding:0!important;color:#fff;text-decoration:none}
.brand-logo-wrap{width:46px;height:46px;flex:0 0 46px;display:grid;place-items:center;padding:5px;border:1px solid rgba(255,255,255,.28);border-radius:14px;background:#fff;box-shadow:0 12px 28px rgba(0,0,0,.2)}
.brand-logo-wrap img{width:100%;height:100%;object-fit:contain;border-radius:9px;background:transparent}
.brand-copy{min-width:0;display:block}.brand-copy strong{display:block;font-size:13px;letter-spacing:.13em;line-height:1.2;color:#fff}.brand-copy small{display:block;margin-top:5px;font-size:9px;letter-spacing:.04em;color:#89a1bc;white-space:nowrap}
.sidebar-close{display:none;width:36px;height:36px;padding:0;place-items:center;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:rgba(255,255,255,.06);color:#dbe8f6;cursor:pointer}.sidebar-close .ui-icon{width:18px;height:18px}

.sidebar-workspace{display:flex;align-items:center;gap:10px;margin:15px 14px 10px;padding:11px 12px;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:rgba(255,255,255,.045);box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
.workspace-mark{width:32px;height:32px;display:grid;place-items:center;flex:0 0 32px;border-radius:10px;background:linear-gradient(145deg,#2f80ed,#1257ba);color:#fff;font-size:10px;font-weight:900;letter-spacing:.04em;box-shadow:0 7px 15px rgba(23,105,224,.24)}
.workspace-copy{min-width:0;display:block}.workspace-copy small,.workspace-copy strong{display:block}.workspace-copy small{font-size:8px;color:#6f89a5;text-transform:uppercase;letter-spacing:.12em}.workspace-copy strong{overflow:hidden;margin-top:2px;color:#dbe7f5;font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.workspace-status{width:8px;height:8px;margin-left:auto;flex:0 0 8px;border-radius:50%;background:#32d296;box-shadow:0 0 0 4px rgba(50,210,150,.1)}

/* Sidebar navigation */
.menu{display:block!important;flex:1 1 auto;min-height:0;overflow-x:hidden!important;overflow-y:auto!important;padding:2px 12px 14px!important;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.14) transparent}
.menu::-webkit-scrollbar{width:5px}.menu::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:20px}
.menu-group{display:block;margin:0 0 11px}.menu-group-title{padding:11px 10px 7px;color:#57718d;font-size:8px;font-weight:800;letter-spacing:.17em;text-transform:uppercase;white-space:nowrap}
.menu a.menu-item{position:relative;display:flex;align-items:center;gap:11px;min-height:42px;margin:2px 0;padding:8px 10px!important;border:1px solid transparent;border-radius:11px;color:#9eb1c6;font-size:11px;font-weight:600;text-decoration:none;transition:background .16s ease,color .16s ease,border-color .16s ease,transform .16s ease}
.menu a.menu-item:hover{transform:translateX(2px);background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.05);color:#f2f7fd}
.menu a.menu-item.active{background:linear-gradient(90deg,rgba(47,128,237,.24),rgba(47,128,237,.1));border-color:rgba(93,159,248,.22);color:#fff;box-shadow:inset 3px 0 0 #4b94f4,0 7px 18px rgba(0,0,0,.08)}
.menu-icon{width:30px;height:30px;display:grid!important;place-items:center;flex:0 0 30px;border-radius:9px;background:rgba(255,255,255,.045);color:#7f9dbd}
.menu-icon .ui-icon{width:17px;height:17px}.menu a:hover .menu-icon,.menu a.active .menu-icon{background:rgba(72,145,242,.16);color:#83b8ff}
.menu-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.menu-count{margin-left:auto;min-width:22px;height:20px;padding:0 7px;display:inline-grid;place-items:center;border:1px solid rgba(255,255,255,.14);border-radius:99px;background:#e98a20;color:#fff;font-size:9px;font-weight:900;box-shadow:0 5px 12px rgba(233,138,32,.2)}
.sidebar-bottom{display:grid;gap:4px;margin:0!important;padding:12px 14px 15px!important;border-top:1px solid rgba(255,255,255,.07);background:rgba(0,0,0,.07)}
.sidebar-action{min-height:40px;display:flex;align-items:center;gap:11px;padding:9px 11px!important;border:1px solid transparent;border-radius:11px;color:#91a8bf;text-decoration:none;font-size:10px;font-weight:700;transition:.16s}.sidebar-action .ui-icon{width:17px;height:17px}.sidebar-action:hover{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.06);color:#fff}.sidebar-action.danger:hover{background:rgba(204,77,93,.1);color:#ffb4bd}

/* Collapsed desktop sidebar */
.sidebar-collapsed .admin-shell>.sidebar{flex-basis:88px!important;width:88px!important;min-width:88px!important;max-width:88px!important}
.sidebar-collapsed .sidebar-head{justify-content:center;padding-left:10px;padding-right:10px}.sidebar-collapsed .brand-copy,.sidebar-collapsed .workspace-copy,.sidebar-collapsed .workspace-status,.sidebar-collapsed .menu-group-title,.sidebar-collapsed .menu-label,.sidebar-collapsed .menu-count,.sidebar-collapsed .sidebar-action span{display:none!important}
.sidebar-collapsed .brand-logo-wrap{width:44px;height:44px;flex-basis:44px}.sidebar-collapsed .sidebar-workspace{justify-content:center;margin-left:12px;margin-right:12px;padding:10px}.sidebar-collapsed .menu{padding-left:13px!important;padding-right:13px!important}.sidebar-collapsed .menu-group{margin-bottom:5px}.sidebar-collapsed .menu a.menu-item{justify-content:center;padding:7px!important}.sidebar-collapsed .menu a.menu-item:hover{transform:none}.sidebar-collapsed .sidebar-bottom{padding-left:13px!important;padding-right:13px!important}.sidebar-collapsed .sidebar-action{justify-content:center;padding:9px!important}

/* Topbar */
.topbar-admin{position:sticky;top:0;z-index:50;min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0 -30px 26px!important;padding:13px 30px;background:rgba(243,246,250,.91);border-bottom:1px solid rgba(207,217,229,.78);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.topbar-left,.topbar-user{display:flex;align-items:center;gap:11px;min-width:0}.sidebar-collapse-btn,.mobile-menu-btn,.notification-btn{width:40px;height:40px;padding:0;display:grid;place-items:center;flex:0 0 40px;border:1px solid var(--slate-200);border-radius:12px;background:#fff;color:#526a83;box-shadow:0 3px 12px rgba(7,26,51,.035);cursor:pointer;text-decoration:none;transition:.16s}.sidebar-collapse-btn:hover,.mobile-menu-btn:hover,.notification-btn:hover{border-color:#b9cbe0;background:var(--blue-50);color:var(--blue-600)}
.mobile-menu-btn{display:none}.sidebar-collapse-btn .ui-icon,.mobile-menu-btn .ui-icon,.notification-btn .ui-icon{width:18px;height:18px}.sidebar-collapsed .sidebar-collapse-btn .ui-icon{transform:rotate(180deg)}
.topbar-page{min-width:0}.topbar-breadcrumb{display:flex;align-items:center;gap:7px;margin-bottom:3px;color:#8595a6;font-size:9px;font-weight:700;white-space:nowrap}.topbar-breadcrumb i{color:#bcc7d2;font-style:normal}.topbar-breadcrumb strong{max-width:220px;overflow:hidden;color:var(--blue-600);font-weight:800;text-overflow:ellipsis}.topbar-admin h1{margin:0;color:var(--navy-900);font-size:23px;line-height:1.2;letter-spacing:-.035em}
.admin-clock{min-width:152px;display:flex;align-items:center;gap:9px;padding:7px 11px;border:1px solid var(--slate-200);border-radius:12px;background:rgba(255,255,255,.7);color:#667c92}.admin-clock>.ui-icon{width:17px;height:17px;color:var(--blue-600)}.admin-clock span,.admin-clock strong{display:block;line-height:1.25}.admin-clock span{font-size:8px;color:#8695a5}.admin-clock strong{margin-top:2px;font-size:10px;color:#344d67}
.notification-btn{position:relative}.notification-btn.has-notification{border-color:#f0d3a8;background:#fff9ef;color:#bb7212}.notification-count{position:absolute;top:-6px;right:-5px;min-width:19px;height:19px;padding:0 5px;display:grid;place-items:center;border:2px solid var(--page);border-radius:99px;background:#dc7c16;color:#fff;font-size:8px;font-weight:900}
.visit-btn{min-height:40px;display:inline-flex;align-items:center;gap:7px;padding:0 13px;border:1px solid var(--slate-200);border-radius:12px;background:#fff;color:#405a73;font-size:10px;font-weight:800;text-decoration:none;box-shadow:0 3px 12px rgba(7,26,51,.035)}.visit-btn .ui-icon{width:16px;height:16px}.visit-btn:hover{border-color:#b9cbe0;background:var(--blue-50);color:var(--blue-600)}
.user-chip{min-width:0;display:flex;align-items:center;gap:9px;padding:3px 0 3px 4px}.user-chip .avatar{width:38px;height:38px;display:grid;place-items:center;flex:0 0 38px;border:1px solid #cfe0f5;border-radius:12px;background:linear-gradient(145deg,#eaf3ff,#dceaff);color:#155fc8;font-size:12px;font-weight:900;box-shadow:0 4px 12px rgba(23,105,224,.08)}.user-chip-info{min-width:0}.user-chip-info strong,.user-chip-info small{display:block}.user-chip-info strong{max-width:140px;overflow:hidden;color:#263f59;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.user-chip-info small{margin-top:2px;color:#8b99a8;font-size:8px}

/* Flash */
.notice{min-height:48px;display:flex;align-items:center;gap:10px;margin:0 0 20px;padding:10px 12px;border:1px solid #cfe0f1;border-radius:13px;background:#f1f7fd;color:#315979;font-size:11px;box-shadow:var(--shadow-sm)}.notice-icon{width:29px;height:29px;display:grid;place-items:center;flex:0 0 29px;border-radius:9px;background:rgba(23,105,224,.1);color:var(--blue-600)}.notice-icon .ui-icon{width:16px;height:16px}.notice-text{flex:1}.notice-close{width:30px;height:30px;padding:0;display:grid;place-items:center;border:0;border-radius:9px;background:transparent;color:inherit;cursor:pointer}.notice-close:hover{background:rgba(0,0,0,.05)}.notice-close .ui-icon{width:15px;height:15px}.flash-success{border-color:#cbe9dc;background:#effbf6;color:#176a4e}.flash-success .notice-icon{background:#dff5ea;color:#14855e}.flash-error{border-color:#efd3d7;background:#fff4f5;color:#943b47}.flash-error .notice-icon{background:#fae4e7;color:#bc4352}

/* Cards, dashboard and content */
.panel,.dashboard-panel,.kpi-card,.stat{border:1px solid var(--slate-200)!important;border-radius:var(--radius-lg)!important;background:#fff!important;box-shadow:var(--shadow-sm)!important}
.panel{padding:22px!important;margin-bottom:18px!important}.panel h2,.panel h3{color:var(--navy-900);letter-spacing:-.02em}.panel h2{font-size:16px!important;margin:0 0 18px!important}.panel h3{font-size:15px}
.dashboard-hero{min-height:190px;margin-bottom:18px!important;padding:34px 36px!important;border:1px solid rgba(100,158,229,.15);border-radius:24px!important;background:
  radial-gradient(circle at 82% 18%,rgba(65,145,250,.34),transparent 28%),
  linear-gradient(120deg,#06172d 0%,#0a2b51 60%,#0c4472 100%)!important;box-shadow:0 22px 54px rgba(7,26,51,.18)!important}
.dashboard-hero:before{content:"";position:absolute;right:4%;top:-45%;width:360px;height:360px;border:1px solid rgba(255,255,255,.08);border-radius:50%;box-shadow:0 0 0 54px rgba(255,255,255,.025),0 0 0 108px rgba(255,255,255,.018)}.dashboard-hero:after{opacity:.55}.dashboard-hero h2{max-width:760px;margin:0 0 10px!important;font-size:32px!important;font-weight:750;line-height:1.12;letter-spacing:-.045em}.dashboard-hero p{max-width:700px;color:#b9cbe0!important;font-size:12px!important;line-height:1.7}
.kpi-grid{gap:16px!important;margin-bottom:18px!important}.kpi-card{min-height:112px;padding:19px!important;border-top:3px solid transparent!important;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.kpi-card:hover{transform:translateY(-3px);border-color:#cbd8e6!important;border-top-color:var(--blue-600)!important;box-shadow:var(--shadow-md)!important}.kpi-icon{width:46px!important;height:46px!important;flex:0 0 46px;border-radius:14px!important}.kpi-icon.blue,.kpi-icon.cyan{background:#e8f2ff!important;color:#1769e0!important}.kpi-icon.orange{background:#fff3e4!important;color:#d47a11!important}.kpi-icon.green{background:#e8f8f2!important;color:#148b64!important}.kpi-data span{font-size:10px!important;color:#74869b!important}.kpi-data strong{margin-top:4px!important;color:#102e4e;font-size:28px!important;letter-spacing:-.04em}
.dashboard-grid-main,.dashboard-grid-bottom{gap:16px!important}.dashboard-panel{padding:22px!important}.panel-title-row h3{font-size:16px!important}.panel-kicker{color:#8494a5!important}.panel-link{color:var(--blue-600)!important}

/* Forms */
.form-grid{gap:16px!important}.field{margin-bottom:14px}.field label{margin:0 0 7px!important;color:#334c65;font-size:10px!important;font-weight:800!important;letter-spacing:.01em}.field input:not([type=checkbox]):not([type=radio]),.field textarea,.field select{min-height:42px;width:100%;padding:10px 12px!important;border:1px solid #d6e0ea!important;border-radius:11px!important;background:#fff!important;color:#203a54!important;font-size:11px!important;outline:none;box-shadow:0 1px 2px rgba(7,26,51,.02);transition:border-color .15s,box-shadow .15s}.field textarea{min-height:120px!important;line-height:1.6}.field input:focus,.field textarea:focus,.field select:focus{border-color:#77a9eb!important;box-shadow:0 0 0 4px rgba(23,105,224,.09)!important}.field input[type=checkbox],.field input[type=radio]{accent-color:var(--blue-600)}
.btn,.btn-sm{gap:7px;border:1px solid transparent!important;border-radius:10px!important;background:linear-gradient(180deg,#2377e4,#155fc8)!important;color:#fff!important;font-weight:800!important;box-shadow:0 6px 14px rgba(23,105,224,.16);transition:transform .15s,box-shadow .15s,filter .15s}.btn{min-height:42px;padding:10px 16px!important;font-size:11px!important}.btn-sm{min-height:34px;padding:7px 11px!important;font-size:9px!important}.btn:hover,.btn-sm:hover{transform:translateY(-1px);filter:brightness(1.04);box-shadow:0 9px 20px rgba(23,105,224,.2)}.btn-secondary{border-color:#dbe4ed!important;background:#f2f6fa!important;color:#3e5871!important;box-shadow:none!important}.btn-danger{border-color:#f0d1d6!important;background:#fff0f2!important;color:#b43e4d!important;box-shadow:none!important}.btn-green{border-color:#148d65!important;background:linear-gradient(180deg,#1ba877,#13835e)!important;color:#fff!important}

/* Tables */
.table{width:100%;border-collapse:separate!important;border-spacing:0!important;font-size:11px!important}.table th{padding:11px 12px!important;border-top:1px solid var(--slate-200);border-bottom:1px solid var(--slate-200)!important;background:#f7f9fc;color:#6f8296;font-size:9px!important;font-weight:900;text-transform:uppercase;letter-spacing:.06em}.table th:first-child{border-left:1px solid var(--slate-200);border-radius:11px 0 0 0}.table th:last-child{border-right:1px solid var(--slate-200);border-radius:0 11px 0 0}.table td{padding:13px 12px!important;border-bottom:1px solid #e9eef4!important;color:#334d66;vertical-align:middle!important}.table tbody tr{transition:background .14s}.table tbody tr:hover{background:#f8fbff}.table tr:last-child td:first-child{border-radius:0 0 0 11px}.table tr:last-child td:last-child{border-radius:0 0 11px 0}.badge{display:inline-flex;align-items:center;padding:5px 8px!important;border:1px solid #d9e5f2;border-radius:999px!important;background:#edf5ff!important;color:#37638f!important;font-size:9px!important;font-weight:800!important}

/* Registration details: neutralize old inline presentation safely */
.registration-detail-page{padding:22px!important}.registration-detail-columns{display:grid!important;grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr)!important;gap:18px!important}.registration-detail-primary,.registration-detail-side{min-width:0!important;background:transparent!important;padding:0!important;border:0!important}.registration-detail-primary{display:grid!important}.registration-detail-side{display:block!important;align-self:start!important}.detail-section{padding:18px!important;border:1px solid var(--slate-200)!important;border-radius:15px!important;background:#fff!important}.registration-update-form select{border:1px solid #d6e0ea!important;font-weight:700!important}.registration-update-form .btn{margin-top:10px!important;background:linear-gradient(180deg,#2377e4,#155fc8)!important;font-size:11px!important;padding:10px 16px!important}

/* Task control tower — converted from harsh dark blocks to professional navy */
.tl-wrap{padding:24px!important;border:1px solid #d9e3ed!important;border-radius:20px!important;background:#fff!important;color:var(--slate-950)!important;box-shadow:var(--shadow-sm)}
.tl-head{margin-bottom:20px!important}.tl-head-left h2{color:var(--navy-900)!important;font-size:22px!important}.tl-head-left p{color:var(--slate-500)!important;font-size:11px!important}.tl-head-left span.icn{background:#eaf3ff!important;color:var(--blue-600)!important}.btn-kuning{border:1px solid #155fc8!important;border-radius:10px!important;background:linear-gradient(180deg,#2377e4,#155fc8)!important;color:#fff!important;font-size:11px!important;box-shadow:0 7px 16px rgba(23,105,224,.16)}
.kpi-grid-tl{gap:14px!important;margin-bottom:20px!important}.kpi-box{padding:17px!important;border:1px solid var(--slate-200)!important;border-radius:14px!important;background:#f9fbfd!important;color:var(--slate-950)!important}.kpi-box div span{color:#75879a!important}.kpi-box div b{color:#143553!important;font-size:28px!important}.kpi-box div p{color:#8c9aaa!important}
.tl-filter-box{padding:14px 16px!important;border:1px solid var(--slate-200)!important;border-radius:13px!important;background:#f7f9fc!important}.filter-group label{color:#647a90!important}.filter-group select,.filter-group input{border:1px solid #d3deea!important;background:#fff!important;color:#29445e!important}.btn-filter{border-radius:9px!important;background:var(--blue-600)!important}.btn-reset{border-radius:9px!important;background:#e9eef4!important;color:#425b74!important}
.tl-table-wrap{border:1px solid var(--slate-200)!important;border-radius:14px!important;background:#fff!important}.tl-table th{padding:13px!important;border-bottom:1px solid var(--slate-200)!important;background:#f4f7fa!important;color:#6e8195!important}.tl-table td{padding:13px!important;border-bottom:1px solid #e7edf3!important;color:#334d66!important}.tl-table tr:hover{background:#f8fbff!important}.job-title{color:#173955!important}.text-mute{color:#71869b!important}.team-badge{border-color:#d8e2ec!important;background:#f1f5f9!important;color:#4f667c!important}.team-badge.lead{border-color:#9bc1ed!important;color:#1769e0!important}.btn-report{border-color:#8ab6eb!important;background:#edf6ff!important;color:#1769e0!important}

/* Attendance */
.att-wrap{overflow:auto;padding:24px!important;border:1px solid #d9e3ed!important;border-radius:20px!important;background:#fff!important;color:var(--slate-950)!important;box-shadow:var(--shadow-sm)}.att-head h2{color:var(--navy-900)!important}.att-kpi{gap:14px!important}.att-card{border:1px solid var(--slate-200)!important;border-radius:14px!important;background:#f8fafc!important;color:#536b82!important}.att-card b{color:#153956!important}.att-table{min-width:760px}.att-table th{border-bottom:1px solid var(--slate-200)!important;background:#f4f7fa!important;color:#6e8195!important}.att-table td{border-bottom:1px solid #e7edf3!important;color:#334d66!important}

/* Login */
.login-wrap{background:radial-gradient(circle at 20% 10%,rgba(47,128,237,.28),transparent 30%),linear-gradient(135deg,#041225,#0a2b51)!important}.login-card{border:1px solid rgba(255,255,255,.6);border-radius:22px!important;box-shadow:0 34px 85px rgba(0,0,0,.28)!important}.login-card input{min-height:44px;border-radius:11px!important}.login-card input:focus{border-color:#77a9eb;outline:0;box-shadow:0 0 0 4px rgba(23,105,224,.09)}

@media(max-width:1180px){
  .admin-clock{display:none}
  .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(max-width:920px){
  body.sidebar-collapsed .admin-shell>.sidebar,.admin-shell>.sidebar{position:fixed!important;top:0!important;bottom:0!important;left:-292px!important;width:280px!important;min-width:280px!important;max-width:280px!important;height:100vh!important;transition:left .22s ease!important;z-index:110!important}
  .admin-shell>.sidebar.open{left:0!important}
  .admin-shell>.main{width:100%!important;padding:0 20px 36px!important}
  .topbar-admin{margin:0 -20px 22px!important;padding:12px 20px}
  .mobile-menu-btn{display:grid!important}.sidebar-collapse-btn{display:none}.sidebar-close{display:grid!important}
  .sidebar-collapsed .brand-copy,.sidebar-collapsed .workspace-copy,.sidebar-collapsed .workspace-status,.sidebar-collapsed .menu-group-title,.sidebar-collapsed .menu-label,.sidebar-collapsed .menu-count,.sidebar-collapsed .sidebar-action span{display:initial!important}
  .sidebar-collapsed .workspace-copy{display:block!important}.sidebar-collapsed .menu-group-title{display:block!important}.sidebar-collapsed .menu-label,.sidebar-collapsed .sidebar-action span{display:inline!important}.sidebar-collapsed .workspace-status,.sidebar-collapsed .menu-count{display:grid!important}
  .sidebar-collapsed .sidebar-head{justify-content:space-between}.sidebar-collapsed .sidebar-workspace{justify-content:flex-start;margin-left:14px;margin-right:14px;padding:11px 12px}.sidebar-collapsed .menu{padding-left:12px!important;padding-right:12px!important}.sidebar-collapsed .menu a.menu-item,.sidebar-collapsed .sidebar-action{justify-content:flex-start;padding:8px 10px!important}
  .sidebar-backdrop.show{display:block!important;position:fixed!important;inset:0!important;background:rgba(3,13,26,.58)!important;backdrop-filter:blur(3px);z-index:105!important}
  body.menu-open{overflow:hidden}
  .registration-detail-columns{grid-template-columns:1fr!important}
}

@media(max-width:700px){
  .admin-shell>.main{padding:0 14px 28px!important}.topbar-admin{min-height:70px;margin:0 -14px 18px!important;padding:10px 14px;gap:10px}.topbar-left{gap:8px}.topbar-breadcrumb{display:none}.topbar-admin h1{font-size:19px}.topbar-user{gap:7px}.visit-btn{width:40px;padding:0}.visit-btn span,.user-chip-info{display:none}.user-chip{padding-left:0}.user-chip .avatar{width:38px;height:38px}.notification-btn,.visit-btn,.mobile-menu-btn{width:38px;height:38px;flex-basis:38px}
  .dashboard-hero{min-height:170px;padding:26px 24px!important}.dashboard-hero h2{font-size:26px!important}.dashboard-hero p{font-size:11px!important}
  .kpi-grid{gap:11px!important}.kpi-card{min-height:100px;padding:15px!important}.kpi-icon{width:40px!important;height:40px!important;flex-basis:40px}.kpi-data strong{font-size:24px!important}
  .panel,.dashboard-panel{padding:17px!important;border-radius:16px!important}.form-grid{grid-template-columns:1fr!important}.table{display:block;overflow:auto;white-space:nowrap}
  .tl-wrap,.att-wrap{padding:17px!important;border-radius:16px!important}.registration-detail-page{padding:16px!important}
}

@media(max-width:480px){
  .topbar-user .visit-btn{display:none}.topbar-admin h1{max-width:145px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dashboard-hero{padding:23px 20px!important}.dashboard-hero h2{font-size:23px!important}
  .kpi-grid{grid-template-columns:1fr!important}.kpi-card{min-height:92px}.panel{padding:15px!important}
}

@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}


/* =========================================================
   SETTINGS V5 — COMPACT ATTENDANCE / OFFICE SETTINGS
   ========================================================= */
.settings-v5{display:grid;gap:14px}.settings-v5-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr);gap:14px}.settings-v5-card{margin:0!important;padding:19px;border:1px solid #dce5ee;border-radius:17px;background:#fff;box-shadow:0 10px 28px rgba(18,45,76,.045)}.settings-v5-head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:17px}.settings-v5-head h2{margin:2px 0 5px;font-size:16px;letter-spacing:-.02em;color:#102b47}.settings-v5-head p{max-width:560px;margin:0;color:#7a8da1;font-size:10px;line-height:1.55}.settings-v5-kicker{display:block;color:#1769e0;font-size:8px;font-weight:900;letter-spacing:.16em}.settings-v5-icon{width:36px;height:36px;display:grid;place-items:center;flex:0 0 36px;border-radius:11px;background:#edf5ff;color:#1769e0;font-size:17px;font-weight:900}.settings-v5-fields{display:grid;grid-template-columns:1fr 1fr;gap:11px}.settings-v5-field{display:block;min-width:0}.settings-v5-field-wide{grid-column:1/-1}.settings-v5-field>span{display:block;margin:0 0 6px;color:#4f657c;font-size:9px;font-weight:850}.settings-v5-field input{width:100%;min-height:40px;padding:9px 11px;border:1px solid #d8e2ec;border-radius:10px;background:#fff;color:#17324f;font:inherit;font-size:11px;outline:none}.settings-v5-field input:focus{border-color:#8bb9ef;box-shadow:0 0 0 4px rgba(23,105,224,.08)}.settings-v5-field small{display:block;margin-top:6px;color:#8a9aaa;font-size:8px;line-height:1.45}.settings-v5-number{display:flex;align-items:center;border:1px solid #d8e2ec;border-radius:10px;background:#fff;overflow:hidden}.settings-v5-number:focus-within{border-color:#8bb9ef;box-shadow:0 0 0 4px rgba(23,105,224,.08)}.settings-v5-number input{border:0!important;border-radius:0!important;box-shadow:none!important}.settings-v5-number em{padding:0 12px;color:#71869b;font-size:9px;font-style:normal;font-weight:800;white-space:nowrap}.settings-v5-rule{display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:8px;margin-top:14px;padding:9px 11px;border-radius:11px;background:#f7fafc;color:#667b90;font-size:8px}.settings-v5-rule strong{color:#1f6fcf;font-size:9px}.settings-v5-rule i{height:1px;background:linear-gradient(90deg,#9bc3f0,#efc071)}.settings-v5-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:14px;padding:12px 13px;border:1px solid #e2e9f1;border-radius:12px;background:#f8fbfe;cursor:pointer}.settings-v5-toggle-row span{min-width:0}.settings-v5-toggle-row strong,.settings-v5-toggle-row small{display:block}.settings-v5-toggle-row strong{color:#28445f;font-size:10px}.settings-v5-toggle-row small{margin-top:3px;color:#8595a6;font-size:8px;line-height:1.4}.settings-v5-toggle-row input{position:absolute;opacity:0;pointer-events:none}.settings-v5-toggle-row i{position:relative;width:42px;height:23px;flex:0 0 42px;border-radius:99px;background:#cfd9e4;transition:.18s}.settings-v5-toggle-row i:after{content:"";position:absolute;top:3px;left:3px;width:17px;height:17px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.18);transition:.18s}.settings-v5-toggle-row input:checked+i{background:#1769e0}.settings-v5-toggle-row input:checked+i:after{left:22px}.settings-v5-info{margin-top:12px;padding:10px 11px;border:1px solid #e2e9f1;border-radius:10px;background:#fbfcfe;color:#74869a;font-size:8px;line-height:1.5}.settings-v5-office-card{padding-bottom:14px}.settings-v5-office-head{align-items:center}.settings-v5-add{min-height:38px;padding:0 13px;border:1px solid #1769e0;border-radius:10px;background:#1769e0;color:#fff;font-size:9px;font-weight:850;cursor:pointer;white-space:nowrap}.settings-v5-add:hover{filter:brightness(1.05)}.settings-v5-office-list{display:grid;gap:8px}.settings-v5-office-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;align-items:center;gap:11px;min-height:60px;padding:9px 10px;border:1px solid #e2e9f1;border-radius:12px;background:#fbfdff}.settings-v5-pin{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#eaf3ff;color:#1769e0;font-size:15px}.settings-v5-office-copy{min-width:0}.settings-v5-office-copy strong,.settings-v5-office-copy small{display:block}.settings-v5-office-copy strong{overflow:hidden;color:#29445f;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.settings-v5-office-copy small{margin-top:3px;color:#8798a9;font-size:8px}.settings-v5-radius{padding:5px 8px;border:1px solid #dce6f0;border-radius:99px;background:#fff;color:#657b91;font-size:8px;white-space:nowrap}.settings-v5-radius b{color:#29445f}.settings-v5-office-actions{display:flex;gap:5px}.settings-v5-office-actions button{min-height:31px;padding:0 10px;border:1px solid #d8e2ec;border-radius:8px;background:#fff;color:#45617c;font-size:8px;font-weight:800;cursor:pointer}.settings-v5-office-actions button:hover{border-color:#a9c7e8;color:#1769e0}.settings-v5-office-actions button.danger:hover{border-color:#efc1c8;background:#fff4f5;color:#b23d4b}.settings-v5-website{padding:0;overflow:hidden}.settings-v5-website summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 18px;cursor:pointer}.settings-v5-website summary::-webkit-details-marker{display:none}.settings-v5-website summary div{min-width:0}.settings-v5-website summary strong,.settings-v5-website summary small{display:block}.settings-v5-website summary strong{margin-top:2px;color:#29445f;font-size:11px}.settings-v5-website summary small{margin-top:3px;color:#8798a9;font-size:8px}.settings-v5-website[open] summary{border-bottom:1px solid #e5ebf1}.settings-v5-website-body{padding:17px 18px}.settings-v5-savebar{position:sticky;bottom:12px;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:11px 12px 11px 15px;border:1px solid rgba(208,220,233,.9);border-radius:14px;background:rgba(255,255,255,.94);box-shadow:0 14px 38px rgba(15,43,73,.13);backdrop-filter:blur(14px)}.settings-v5-savebar strong,.settings-v5-savebar span{display:block}.settings-v5-savebar strong{color:#2b4660;font-size:9px}.settings-v5-savebar span{margin-top:2px;color:#8a99a8;font-size:8px}.settings-v5-savebar .btn{min-width:145px}.settings-v5-modal{position:fixed;inset:0;z-index:500;display:none;place-items:center;padding:24px}.settings-v5-modal.open{display:grid}.settings-v5-modal-backdrop{position:absolute;inset:0;background:rgba(4,18,35,.57);backdrop-filter:blur(4px)}.settings-v5-dialog{position:relative;width:min(760px,100%);max-height:calc(100vh - 48px);overflow:auto;border:1px solid rgba(255,255,255,.55);border-radius:19px;background:#fff;box-shadow:0 30px 90px rgba(0,0,0,.28)}.settings-v5-dialog-head,.settings-v5-dialog-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 17px}.settings-v5-dialog-head{border-bottom:1px solid #e4eaf1}.settings-v5-dialog-head h3{margin:2px 0 0;color:#17324e;font-size:15px}.settings-v5-dialog-body{padding:17px}.settings-v5-dialog-foot{border-top:1px solid #e4eaf1;background:#fafbfd}.settings-v5-close{width:34px;height:34px;border:1px solid #dce5ee;border-radius:10px;background:#fff;color:#526b84;font-size:20px;line-height:1;cursor:pointer}.settings-v5-modal-fields{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:13px}.settings-v5-map-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:7px;color:#8292a2;font-size:8px}.settings-v5-map-actions button{padding:7px 10px;border:1px solid #cbdced;border-radius:8px;background:#f5f9fd;color:#1769e0;font-size:8px;font-weight:850;cursor:pointer}.settings-v5-map{height:300px;overflow:hidden;border:1px solid #dbe4ed;border-radius:13px;background:#eef3f7}.settings-v5-map-loading,.settings-v5-map-error{height:100%;display:grid;place-items:center;padding:20px;color:#7b8c9d;font-size:9px;text-align:center}.settings-v5-cancel{min-height:40px;padding:0 14px;border:1px solid #d8e2ec;border-radius:10px;background:#fff;color:#4e667d;font-size:9px;font-weight:800;cursor:pointer}.settings-modal-open{overflow:hidden}
@media(max-width:900px){.settings-v5-grid{grid-template-columns:1fr}.settings-v5-dialog{width:min(680px,100%)}}
@media(max-width:650px){.settings-v5-card{padding:15px}.settings-v5-fields,.settings-v5-modal-fields{grid-template-columns:1fr}.settings-v5-field-wide{grid-column:auto}.settings-v5-office-row{grid-template-columns:34px minmax(0,1fr) auto}.settings-v5-office-actions{grid-column:2/-1}.settings-v5-radius{align-self:start}.settings-v5-office-head{align-items:flex-start}.settings-v5-savebar{bottom:7px}.settings-v5-savebar>div{display:none}.settings-v5-savebar .btn{width:100%}.settings-v5-modal{padding:10px}.settings-v5-dialog{max-height:calc(100vh - 20px)}.settings-v5-map{height:240px}.settings-v5-map-actions{align-items:flex-start;flex-direction:column}.settings-v5-dialog-foot{position:sticky;bottom:0}}

/* =========================================================
   ATTENDANCE V2 — MODERN ADMIN REPORT
   ========================================================= */
.attendance-v2{display:grid;gap:14px}
.attendance-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 260px;align-items:center;gap:26px;padding:25px 27px;border-radius:19px;background:linear-gradient(120deg,#071827 0%,#0b2945 62%,#0f5273 100%);color:#fff;box-shadow:0 18px 42px rgba(7,24,39,.16)}
.attendance-hero:after{content:"";position:absolute;width:350px;height:350px;right:-120px;top:-180px;border-radius:50%;border:1px solid rgba(255,255,255,.08);box-shadow:0 0 0 55px rgba(255,255,255,.025),0 0 0 110px rgba(255,255,255,.018)}
.attendance-hero-copy,.attendance-hero-score{position:relative;z-index:2}.attendance-kicker{display:block;margin-bottom:7px;color:#7ad7ff;font-size:8px;font-weight:900;letter-spacing:.18em}.attendance-hero h2{margin:0 0 7px;font-size:24px;letter-spacing:-.035em}.attendance-hero p{max-width:720px;margin:0;color:#b8cce0;font-size:10px;line-height:1.6}.attendance-schedule-chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:15px}.attendance-schedule-chips span{display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border:1px solid rgba(255,255,255,.1);border-radius:999px;background:rgba(255,255,255,.055);color:#aec6d9;font-size:8px}.attendance-schedule-chips b{color:#fff;font-size:8px}.attendance-hero-score{padding:17px;border:1px solid rgba(255,255,255,.12);border-radius:15px;background:rgba(255,255,255,.07);backdrop-filter:blur(10px)}.attendance-hero-score small,.attendance-hero-score span{display:block}.attendance-hero-score small{color:#a9c1d5;font-size:8px;font-weight:800}.attendance-hero-score strong{display:block;margin:4px 0 8px;font-size:28px;line-height:1;color:#fff}.attendance-hero-score span{margin-top:7px;color:#a8c0d2;font-size:8px}.attendance-progress{height:6px;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.12)}.attendance-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#39bdf7,#43d49b)}
.attendance-kpi-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.attendance-kpi-card{display:flex;align-items:center;gap:11px;min-height:92px;padding:14px;border:1px solid #e0e8f0;border-radius:15px;background:#fff;box-shadow:0 10px 28px rgba(16,48,80,.045)}.attendance-kpi-icon{width:38px;height:38px;display:grid;place-items:center;flex:0 0 38px;border-radius:11px;font-size:15px;font-weight:900}.attendance-kpi-card small,.attendance-kpi-card em{display:block}.attendance-kpi-card small{color:#7b8c9e;font-size:8px;font-weight:800}.attendance-kpi-card strong{display:block;margin:2px 0 1px;color:#163552;font-size:23px;line-height:1}.attendance-kpi-card em{color:#98a6b4;font-size:7px;font-style:normal}.attendance-kpi-card.blue .attendance-kpi-icon{background:#eaf4ff;color:#1671d8}.attendance-kpi-card.green .attendance-kpi-icon{background:#eafaf2;color:#159568}.attendance-kpi-card.orange .attendance-kpi-icon{background:#fff5e8;color:#df8017}.attendance-kpi-card.slate .attendance-kpi-icon{background:#f1f4f7;color:#607284}.attendance-kpi-card.cyan .attendance-kpi-icon{background:#eafaff;color:#1187ae}
.attendance-secondary-summary{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:10px 14px;border:1px solid #e2e9f0;border-radius:13px;background:#fff;color:#6d8094;font-size:8px}.attendance-secondary-summary span{display:inline-flex;align-items:center;gap:6px}.attendance-secondary-summary b{color:#26445f;font-size:9px}.attendance-secondary-summary .dot{width:7px;height:7px;border-radius:50%;display:inline-block}.attendance-secondary-summary .dot.green{background:#22a06b}.attendance-secondary-summary .dot.orange{background:#e6902d}.attendance-secondary-summary .dot.blue{background:#2f80ed}.attendance-secondary-summary .dot.red{background:#dc5a68}
.attendance-filter-card,.attendance-table-card{border:1px solid #dfe8f0;border-radius:17px;background:#fff;box-shadow:0 12px 30px rgba(15,48,78,.045)}.attendance-filter-card{padding:17px}.attendance-filter-heading,.attendance-table-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.attendance-filter-heading{margin-bottom:13px}.attendance-filter-heading span,.attendance-section-kicker{display:block;color:#74879b;font-size:7px;font-weight:900;letter-spacing:.16em}.attendance-filter-heading h3,.attendance-table-head h3{margin:3px 0 0;color:#163551;font-size:14px;letter-spacing:-.02em}.attendance-period-links{display:flex;gap:6px}.attendance-period-links a,.attendance-reset-btn{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 10px;border:1px solid #d7e3ee;border-radius:9px;background:#f8fbfe;color:#3b6286;text-decoration:none;font-size:8px;font-weight:850}.attendance-period-links a:hover,.attendance-reset-btn:hover{border-color:#9fc4e8;color:#1769d2;background:#f3f9ff}.attendance-filter-form{display:grid;grid-template-columns:minmax(180px,1.15fr) minmax(130px,.75fr) minmax(145px,.8fr) minmax(145px,.8fr) auto;gap:9px;align-items:end}.attendance-filter-field{min-width:0}.attendance-filter-field label{display:block;margin:0 0 5px;color:#526a82;font-size:8px;font-weight:850}.attendance-filter-field select,.attendance-filter-field input{width:100%;min-height:38px;padding:8px 10px;border:1px solid #d9e3ec;border-radius:9px;background:#fff;color:#203e5a;font:inherit;font-size:9px;outline:none}.attendance-filter-field select:focus,.attendance-filter-field input:focus{border-color:#8cb8e6;box-shadow:0 0 0 3px rgba(23,105,210,.07)}.attendance-filter-actions{display:flex;gap:6px}.attendance-filter-actions .btn{min-height:38px;padding:0 13px;font-size:8px;border-radius:9px}.attendance-reset-btn{min-height:38px;background:#fff}
.attendance-table-card{overflow:hidden}.attendance-table-head{padding:17px 18px 14px;border-bottom:1px solid #e6edf3}.attendance-table-head p{margin:4px 0 0;color:#8b9aaa;font-size:8px}.attendance-row-count{display:inline-flex;align-items:center;justify-content:center;min-height:29px;padding:0 9px;border:1px solid #dce7f0;border-radius:999px;background:#f8fbfd;color:#5d748b;font-size:8px;font-weight:850;white-space:nowrap}.attendance-table-wrap{overflow:auto}.attendance-table{width:100%;min-width:1120px;border-collapse:separate;border-spacing:0}.attendance-table th{position:sticky;top:0;z-index:1;padding:10px 12px;border-bottom:1px solid #dfe8f0;background:#f7fafe;color:#6f8295;text-align:left;font-size:7px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}.attendance-table td{padding:11px 12px;border-bottom:1px solid #edf2f6;color:#38526b;font-size:9px;vertical-align:middle}.attendance-table tbody tr:last-child td{border-bottom:0}.attendance-table tbody tr:hover{background:#fbfdff}.attendance-user{display:flex;align-items:center;gap:9px;min-width:150px}.attendance-avatar{width:34px;height:34px;display:grid;place-items:center;flex:0 0 34px;border-radius:10px;background:linear-gradient(135deg,#e9f4ff,#dff1ff);color:#1769d2;font-size:11px;font-weight:900}.attendance-user strong,.attendance-user small{display:block}.attendance-user strong{max-width:160px;overflow:hidden;color:#1e3e5b;font-size:9px;text-overflow:ellipsis;white-space:nowrap}.attendance-user small{margin-top:2px;color:#8b9aaa;font-size:7px}.attendance-date,.attendance-day{display:block}.attendance-date{color:#2c4964;font-size:9px;font-weight:800;white-space:nowrap}.attendance-day{margin-top:2px;color:#98a5b3;font-size:7px}.attendance-presence,.attendance-pill,.attendance-mini-status{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;white-space:nowrap;font-weight:850}.attendance-presence{padding:5px 8px;font-size:7px}.attendance-presence.is-hadir{background:#eafaf2;color:#16835b}.attendance-presence.is-izin{background:#eef4ff;color:#3468b8}.attendance-presence.is-sakit{background:#fff0f2;color:#b54d5a}.attendance-time{display:block;color:#223f5b;font-size:10px;font-weight:900}.attendance-time.muted{color:#9aa8b5}.attendance-pill{margin-top:4px;padding:4px 6px;font-size:6.5px}.attendance-pill.is-ontime{background:#ebf8f1;color:#177a58}.attendance-pill.is-late{background:#fff3de;color:#a7660c}.attendance-pill.is-neutral{background:#f2f5f8;color:#8a99a8}.attendance-mini-status{margin-top:4px;padding:4px 6px;font-size:6.5px}.attendance-mini-status.done{background:#edf7f2;color:#1f7d5c}.attendance-mini-status.active{background:#eaf6ff;color:#176ca7}.attendance-duration{color:#536b82;font-size:8px;font-weight:800;white-space:nowrap}.attendance-photo-link{width:38px;height:38px;display:block;overflow:hidden;border:1px solid #dce5ed;border-radius:10px;background:#f2f6fa;box-shadow:0 3px 9px rgba(18,48,78,.06)}.attendance-photo-link img{width:100%;height:100%;display:block;object-fit:cover;transition:.18s}.attendance-photo-link:hover img{transform:scale(1.06)}.attendance-no-photo,.attendance-no-location{color:#9aa8b6;font-size:7px}.attendance-location-cell{max-width:240px}.attendance-map-btn{display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:0 8px;border:1px solid #d5e4f2;border-radius:8px;background:#f7fbff;color:#246cae;text-decoration:none;font-size:7px;font-weight:850;white-space:nowrap}.attendance-map-btn:hover{border-color:#9cc3e6;background:#eef7ff}.attendance-note{display:block;max-width:230px;margin-top:5px;overflow:hidden;color:#8d9cab;font-size:7px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.attendance-empty{display:grid;place-items:center;gap:5px;padding:42px 18px;text-align:center}.attendance-empty span{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;background:#eef5fb;color:#5d7c98;font-size:18px}.attendance-empty strong{color:#304d68;font-size:10px}.attendance-empty small{color:#8c9aa8;font-size:8px}
@media(max-width:1180px){.attendance-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.attendance-filter-form{grid-template-columns:repeat(2,minmax(0,1fr))}.attendance-filter-actions{grid-column:1/-1}.attendance-filter-actions .btn{min-width:120px}}
@media(max-width:900px){.attendance-hero{grid-template-columns:1fr}.attendance-hero-score{width:100%}.attendance-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.attendance-v2{gap:11px}.attendance-hero{padding:20px 18px;border-radius:16px}.attendance-hero h2{font-size:21px}.attendance-schedule-chips{gap:5px}.attendance-kpi-grid{grid-template-columns:1fr 1fr;gap:8px}.attendance-kpi-card{min-height:83px;padding:11px}.attendance-kpi-icon{width:34px;height:34px;flex-basis:34px}.attendance-kpi-card strong{font-size:20px}.attendance-secondary-summary{gap:11px}.attendance-filter-card{padding:14px}.attendance-filter-heading{align-items:flex-start;flex-direction:column}.attendance-period-links{width:100%}.attendance-period-links a{flex:1}.attendance-filter-form{grid-template-columns:1fr}.attendance-filter-actions{grid-column:auto}.attendance-filter-actions .btn,.attendance-reset-btn{flex:1}.attendance-table-head{padding:14px}.attendance-table-head p{max-width:210px}.attendance-table{min-width:1030px}}
@media(max-width:430px){.attendance-kpi-grid{grid-template-columns:1fr}.attendance-hero-score strong{font-size:25px}.attendance-secondary-summary{display:grid;grid-template-columns:1fr 1fr}.attendance-filter-actions{width:100%}}

/* =========================================================
   TELOMOYO ATTENDANCE REPORT V3 — READABILITY + PDF EXPORT
   ========================================================= */
.attendance-v2{font-size:13px}
.attendance-kicker{font-size:9px;letter-spacing:.16em}
.attendance-hero h2{font-size:28px;line-height:1.12}
.attendance-hero p{font-size:12px;line-height:1.65}
.attendance-schedule-chips span,.attendance-schedule-chips b{font-size:9px}
.attendance-hero-score small{font-size:10px}.attendance-hero-score strong{font-size:32px}.attendance-hero-score span{font-size:9px}
.attendance-kpi-card small{font-size:10px}.attendance-kpi-card strong{font-size:28px}.attendance-kpi-card em{font-size:9px}
.attendance-secondary-summary{font-size:10px}.attendance-secondary-summary b{font-size:11px}
.attendance-filter-heading span,.attendance-section-kicker{font-size:8px}
.attendance-filter-heading h3,.attendance-table-head h3{font-size:17px}
.attendance-filter-field label{font-size:10px}
.attendance-filter-field select,.attendance-filter-field input{min-height:42px;font-size:11px;padding:9px 11px}
.attendance-filter-actions .btn,.attendance-reset-btn{min-height:42px;font-size:10px;padding:0 15px}
.attendance-period-links a{min-height:36px;padding:0 12px;font-size:9px}
.attendance-period-links .attendance-export-pdf{border-color:#b8d5f5;background:#eaf4ff;color:#145fbd}
.attendance-period-links .attendance-export-pdf:hover{border-color:#6ba7e9;background:#dcecff;color:#0f53a6}
.attendance-table-head p{font-size:10px}.attendance-row-count{font-size:9px}
.attendance-table{min-width:1180px}
.attendance-table th{padding:11px 13px;font-size:9px}
.attendance-table td{padding:12px 13px;font-size:11px}
.attendance-user{min-width:175px}.attendance-user strong{font-size:11px}.attendance-user small{font-size:9px}
.attendance-date{font-size:11px}.attendance-day{font-size:9px}
.attendance-presence{padding:5px 9px;font-size:8.5px}
.attendance-time{font-size:12px}
.attendance-pill,.attendance-mini-status{font-size:8px;padding:4px 7px}
.attendance-duration{font-size:10px}
.attendance-map-btn{min-height:30px;padding:0 9px;font-size:8.5px}
.attendance-note{font-size:9px;line-height:1.45}
.attendance-no-photo,.attendance-no-location{font-size:9px}
.attendance-empty strong{font-size:12px}.attendance-empty small{font-size:10px}

@media(max-width:650px){
  .attendance-hero h2{font-size:24px}
  .attendance-hero p{font-size:11px}
  .attendance-kpi-card small{font-size:9px}
  .attendance-kpi-card strong{font-size:24px}
  .attendance-kpi-card em{font-size:8px}
  .attendance-filter-heading h3,.attendance-table-head h3{font-size:16px}
  .attendance-period-links{display:grid;grid-template-columns:1fr 1fr 1fr}
  .attendance-period-links a{width:100%}
  .attendance-table{min-width:1120px}
}
@media(max-width:430px){
  .attendance-period-links{grid-template-columns:1fr 1fr}
  .attendance-period-links .attendance-export-pdf{grid-column:1/-1}
}