﻿*{box-sizing:border-box}
:root{
  --primary:#173b78;
  --primary-2:#234f9a;
  --secondary:#d5222a;
  --gold:#f3b51b;
  --ink:#152238;
  --muted:#738096;
  --soft:#f5f7fb;
  --line:#e8edf5;
  --white:#fff;
  --success:#178a55;
  --warning:#c77b09;
  --danger:#c93a3a;
  --radius:18px;
  --shadow:0 12px 30px rgba(24,48,91,.08);
}
html,body{margin:0;padding:0;background:#f4f7fb;color:var(--ink);font-family:"Segoe UI","Noto Sans Devanagari",Arial,sans-serif}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
.sp-hidden{display:none!important}

/* ===== SHELL ===== */
.sp-shell{min-height:100vh;display:grid;grid-template-columns:280px minmax(0,1fr)}
.sp-sidebar{
  position:sticky;top:0;height:100vh;overflow:auto;
  background:
    radial-gradient(circle at 20% 0%,rgba(255,255,255,.12),transparent 25%),
    linear-gradient(180deg,#173b78 0%,#102f63 58%,#0c2754 100%);
  color:#fff;padding:20px 15px 18px;box-shadow:12px 0 36px rgba(20,46,91,.11);z-index:30
}
.sp-brand{display:flex;align-items:center;gap:12px;padding:4px 8px 20px;border-bottom:1px solid rgba(255,255,255,.13)}
.sp-brand img{width:58px;height:58px;object-fit:contain;background:#fff;border-radius:18px;padding:4px;box-shadow:0 8px 20px rgba(0,0,0,.18)}
.sp-brand-title{font-size:15px;font-weight:800;line-height:1.35;max-width:150px}
.sp-brand-sub{font-size:11px;margin-top:4px;color:#b9cbec;font-weight:600;letter-spacing:.03em}
.sp-nav{padding-top:14px}
.sp-nav-section{padding:14px 12px 6px;color:#8fa9d7;text-transform:uppercase;letter-spacing:.12em;font-size:9px;font-weight:800}
.sp-nav a{
  display:flex;align-items:center;gap:12px;margin:3px 0;padding:12px 13px;border-radius:12px;
  color:#d9e5fa;font-size:13px;font-weight:650;transition:.2s ease;position:relative
}
.sp-nav a:hover{background:rgba(255,255,255,.09);color:#fff;transform:translateX(2px)}
.sp-nav a.active{background:#fff;color:var(--primary);box-shadow:0 8px 22px rgba(6,23,52,.20)}
.sp-nav a.active:after{content:"";position:absolute;right:-15px;width:4px;height:27px;border-radius:4px;background:var(--gold)}
.sp-nav .ico{width:22px;text-align:center;font-size:16px;opacity:.95}
.sp-sidebar-footer{margin-top:20px;padding:14px 11px;border-radius:14px;background:rgba(255,255,255,.07);font-size:11px;line-height:1.5;color:#bfd0ed}

.sp-main{min-width:0}
.sp-topbar{
  height:76px;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;
  padding:0 28px;position:sticky;top:0;z-index:25
}
.sp-search-wrap{position:relative;width:min(540px,47vw)}
.sp-search-wrap:before{content:"⌕";position:absolute;left:15px;top:9px;font-size:19px;color:#8a96a8}
.sp-search{width:100%;height:44px;border:1px solid #dde4ee;background:#f8fafc;border-radius:14px;padding:0 15px 0 43px;outline:none;color:var(--ink)}
.sp-search:focus{background:#fff;border-color:#aac0e8;box-shadow:0 0 0 4px rgba(35,79,154,.08)}
.sp-top-actions{display:flex;align-items:center;gap:10px}
.sp-top-icon{width:42px;height:42px;border:1px solid var(--line);border-radius:13px;background:#fff;display:grid;place-items:center;position:relative}
.sp-top-icon .dot{position:absolute;right:8px;top:8px;width:7px;height:7px;background:var(--secondary);border:2px solid #fff;border-radius:50%}
.sp-user{display:flex;align-items:center;gap:10px;padding:4px 8px}
.sp-avatar{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#e9f0ff,#d9e6ff);color:var(--primary);font-weight:900}
.sp-user-name{font-size:13px;font-weight:800}.sp-user-role{font-size:10px;color:var(--muted);margin-top:2px;max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-btn{border:0;border-radius:12px;min-height:42px;padding:0 16px;font-weight:750;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.sp-btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;box-shadow:0 8px 18px rgba(23,59,120,.18)}
.sp-btn-primary:hover{filter:brightness(.97);transform:translateY(-1px)}
.sp-btn-soft{background:#edf3ff;color:var(--primary)}
.sp-btn-outline{background:#fff;border:1px solid var(--line);color:#4a566a}

/* ===== PAGE ===== */
.sp-page{padding:26px 30px 40px;max-width:1700px;margin:0 auto}
.sp-page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:20px}
.sp-page-head h1{font-size:28px;margin:0 0 4px;font-weight:850;letter-spacing:-.02em}
.sp-page-head p{margin:0;color:var(--muted);font-size:13px}
.sp-actions{display:flex;gap:10px;flex-wrap:wrap}

/* ===== HERO ===== */
.sp-hero{
  position:relative;overflow:hidden;border-radius:24px;padding:27px 30px;margin-bottom:20px;color:#fff;
  background:
    radial-gradient(circle at 88% 24%,rgba(243,181,27,.22),transparent 16%),
    radial-gradient(circle at 72% 120%,rgba(255,255,255,.14),transparent 34%),
    linear-gradient(120deg,#14366f 0%,#1c4b94 54%,#233f77 100%);
  box-shadow:0 18px 40px rgba(23,59,120,.18)
}
.sp-hero:after{content:"";position:absolute;width:270px;height:270px;border:1px solid rgba(255,255,255,.11);border-radius:50%;right:-90px;top:-110px;box-shadow:0 0 0 42px rgba(255,255,255,.025),0 0 0 90px rgba(255,255,255,.02)}
.sp-hero-top{display:flex;align-items:center;justify-content:space-between;gap:18px;position:relative;z-index:2}
.sp-hero-kicker{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:#c8d8f7;font-weight:800}
.sp-hero h2{font-size:25px;margin:6px 0 7px}
.sp-hero p{margin:0;color:#dce7fb;font-size:13px}
.sp-hero-badge{display:flex;align-items:center;gap:9px;padding:10px 14px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.09);border-radius:999px;font-size:12px;font-weight:700}
.sp-hero-badge:before{content:"";width:9px;height:9px;background:#38d47f;border-radius:50%;box-shadow:0 0 0 5px rgba(56,212,127,.12)}
.sp-hero-meta{display:flex;gap:30px;margin-top:22px;position:relative;z-index:2;flex-wrap:wrap}
.sp-hero-meta .v{font-size:22px;font-weight:900}.sp-hero-meta .l{font-size:10px;color:#bfd0ef;text-transform:uppercase;letter-spacing:.08em;margin-top:2px}

/* ===== STATS ===== */
.sp-grid{display:grid;gap:16px}
.sp-stats{grid-template-columns:repeat(6,minmax(0,1fr));margin-bottom:18px}
.sp-stat{
  background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 4px 14px rgba(29,48,86,.035);
  min-height:132px;position:relative;overflow:hidden;transition:.2s ease
}
.sp-stat:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.sp-stat:after{content:"";position:absolute;width:80px;height:80px;border-radius:50%;right:-25px;top:-30px;background:rgba(23,59,120,.045)}
.sp-stat-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;margin-bottom:15px;font-size:17px;background:#eef4ff;color:var(--primary)}
.sp-stat:nth-child(2) .sp-stat-icon{background:#ebf9f1;color:#168556}
.sp-stat:nth-child(3) .sp-stat-icon{background:#fff5e8;color:#b76f08}
.sp-stat:nth-child(4) .sp-stat-icon{background:#fff1f1;color:#c93a3a}
.sp-stat:nth-child(5) .sp-stat-icon{background:#f2edff;color:#7446bb}
.sp-stat:nth-child(6) .sp-stat-icon{background:#fff8df;color:#a57800}
.sp-stat-label{font-size:11px;font-weight:800;color:#7a879b;text-transform:uppercase;letter-spacing:.04em}
.sp-stat-value{font-size:29px;font-weight:900;margin-top:4px;line-height:1}.sp-stat-note{font-size:10px;color:#9aa5b5;margin-top:7px}

/* ===== CARDS ===== */
.sp-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:19px;box-shadow:0 5px 18px rgba(25,45,82,.035)}
.sp-card-lg{padding:21px}
.sp-two-col{grid-template-columns:minmax(0,1.5fr) minmax(320px,.75fr);margin-bottom:16px}
.sp-section-title{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:13px}
.sp-section-title h3{font-size:15px;margin:0;font-weight:850}
.sp-section-sub{font-size:11px;color:var(--muted);margin-top:3px}
.sp-link{color:var(--primary);font-size:11px;font-weight:800}
.sp-table{width:100%;border-collapse:collapse}
.sp-table th{font-size:9px;text-transform:uppercase;letter-spacing:.08em;text-align:left;color:#8a96a7;border-bottom:1px solid var(--line);padding:10px 8px}
.sp-table td{padding:12px 8px;border-bottom:1px solid #f1f3f7;font-size:12px;color:#465268}.sp-table tr:last-child td{border-bottom:0}
.sp-table strong{color:#243148}
.sp-badge{display:inline-flex;padding:4px 8px;border-radius:999px;font-size:9px;font-weight:800;background:#f2f4f7;color:#475467}
.sp-badge-green{background:#eaf8f1;color:#13734b}.sp-badge-yellow{background:#fff6df;color:#a66d05}.sp-badge-blue{background:#eaf2ff;color:#24569b}
.sp-empty{padding:28px 8px;text-align:center;color:#98a2b3;font-size:12px}
.sp-empty .icon{font-size:30px;margin-bottom:6px;opacity:.65}

/* ===== QUICK ACTIONS ===== */
.sp-quick{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}
.sp-quick a{
  border:1px solid var(--line);border-radius:15px;padding:14px;background:linear-gradient(180deg,#fff,#fbfcfe);
  font-size:12px;font-weight:800;display:flex;align-items:center;gap:11px;transition:.18s ease
}
.sp-quick a:hover{border-color:#c4d3ef;box-shadow:0 8px 18px rgba(23,59,120,.07);transform:translateY(-1px)}
.sp-quick .qico{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#eef4ff;color:var(--primary);font-size:16px}

/* ===== ORG LEVELS ===== */
.sp-level-list{display:grid;gap:9px}
.sp-level-row{display:flex;align-items:center;justify-content:space-between;padding:11px 12px;border:1px solid #edf0f5;border-radius:12px;background:#fbfcfe}
.sp-level-name{font-size:12px;font-weight:800}.sp-level-count{font-size:11px;color:var(--primary);font-weight:900;background:#eef4ff;padding:4px 8px;border-radius:999px}

/* ===== MOBILE ===== */
@media(max-width:1300px){.sp-stats{grid-template-columns:repeat(3,1fr)}}
@media(max-width:960px){
  .sp-shell{grid-template-columns:1fr}.sp-sidebar{display:none}
  .sp-topbar{padding:0 16px}.sp-page{padding:20px}
  .sp-two-col{grid-template-columns:1fr}.sp-search-wrap{width:52vw}
}
@media(max-width:720px){
  .sp-page{padding:15px}.sp-page-head{flex-direction:column}.sp-search-wrap{display:none}
  .sp-stats{grid-template-columns:repeat(2,1fr)}
  .sp-hero{padding:22px}.sp-hero-top{align-items:flex-start;flex-direction:column}
  .sp-user-role{display:none}
}
@media(max-width:480px){
  .sp-stats{grid-template-columns:1fr}.sp-quick{grid-template-columns:1fr}
  .sp-topbar{height:66px}.sp-page-head h1{font-size:24px}
}

/* ===== LOGIN (retain compatibility) ===== */
.sp-login-page{min-height:100vh;display:grid;place-items:center;background:linear-gradient(145deg,#edf3ff,#fff5f5);padding:24px}
.sp-login-shell{width:min(1040px,100%);display:grid;grid-template-columns:1.05fr .95fr;background:#fff;border-radius:26px;overflow:hidden;box-shadow:0 24px 70px rgba(28,39,68,.16)}
.sp-login-brand{padding:54px;background:linear-gradient(150deg,var(--primary),#123f88);color:#fff}
.sp-login-logo{width:116px;height:116px;object-fit:contain;background:#fff;border-radius:50%;padding:7px}
.sp-login-brand h1{font-size:34px;line-height:1.25;margin:26px 0 8px}.sp-login-brand p{opacity:.9;font-size:16px;line-height:1.7}
.sp-product{display:inline-flex;margin-top:28px;padding:9px 14px;border-radius:999px;background:rgba(255,255,255,.12);font-weight:700}
.sp-login-panel{padding:52px 48px;display:flex;flex-direction:column;justify-content:center}
.sp-login-panel h2{font-size:28px;margin:0 0 8px}.sp-subtitle{color:var(--muted);margin-bottom:28px}
.sp-field{margin-bottom:17px}.sp-field label{display:block;font-size:13px;font-weight:700;margin-bottom:7px}
.sp-input{width:100%;height:48px;border:1px solid #d0d5dd;border-radius:12px;padding:0 14px;outline:none}
.sp-error{background:#fff0f0;border:1px solid #ffc9c9;color:#b42318;border-radius:10px;padding:11px 13px;margin-bottom:15px;font-size:14px}
.sp-info{background:#eff8ff;border:1px solid #b2ddff;color:#175cd3;border-radius:10px;padding:11px 13px;margin-bottom:15px;font-size:14px}
.sp-small-link{font-size:13px;color:var(--primary);font-weight:700;margin-top:14px;display:inline-block}
@media(max-width:720px){.sp-login-shell{grid-template-columns:1fr}.sp-login-brand{padding:32px}.sp-login-panel{padding:34px 26px}}


/* ===== FULL CORE MODULE UI ===== */
.sp-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.sp-filterbar{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.sp-filterbar .sp-input{height:40px;min-width:180px}
.sp-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.sp-form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.sp-field label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.04em;font-weight:800;color:#667085;margin-bottom:6px}
.sp-input,.sp-select,.sp-textarea{width:100%;border:1px solid #dce3ed;background:#fff;border-radius:11px;padding:0 12px;color:#253149;outline:none}
.sp-input,.sp-select{height:42px}.sp-textarea{min-height:110px;padding:11px 12px;resize:vertical}
.sp-input:focus,.sp-select:focus,.sp-textarea:focus{border-color:#9db5df;box-shadow:0 0 0 4px rgba(35,79,154,.07)}
.sp-form-actions{display:flex;gap:9px;margin-top:14px;flex-wrap:wrap}
.sp-alert{padding:12px 14px;border-radius:12px;margin-bottom:14px;font-size:12px;font-weight:650}.sp-alert-ok{background:#eaf8f1;color:#13734b;border:1px solid #c7ecd9}.sp-alert-error{background:#fff1f1;color:#b42318;border:1px solid #ffd2d2}.sp-alert-info{background:#edf4ff;color:#24569b;border:1px solid #d6e4fb}
.sp-chip{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;background:#f2f5fa;color:#4d596d;font-size:10px;font-weight:750}
.sp-module-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:16px}.sp-side-card{position:sticky;top:94px;align-self:start}
.sp-tree-name{font-weight:800;color:#26334a}.sp-tree-meta{font-size:10px;color:#8a96a7;margin-top:3px}.sp-indent{display:inline-block;width:18px}
.sp-kpi-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:10px 0 16px}.sp-kpi-mini>div{padding:11px;border:1px solid var(--line);border-radius:12px;background:#fbfcfe}.sp-kpi-mini b{display:block;font-size:19px}.sp-kpi-mini span{font-size:9px;color:#8390a3;text-transform:uppercase}
.sp-profile{display:flex;align-items:center;gap:15px}.sp-profile-photo{width:74px;height:74px;border-radius:18px;background:#eef3fb;display:grid;place-items:center;font-size:28px;color:var(--primary);font-weight:900}.sp-profile h2{margin:0 0 5px;font-size:21px}.sp-profile p{margin:3px 0;color:#6f7c90;font-size:12px}
.sp-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:16px 0}.sp-tabs a{padding:8px 11px;border:1px solid var(--line);border-radius:10px;font-size:11px;font-weight:750;background:#fff}.sp-tabs a.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.sp-scroll{overflow:auto}.sp-nowrap{white-space:nowrap}.sp-right{text-align:right}.sp-center{text-align:center}
.sp-danger{color:#b42318}.sp-success{color:#13734b}.sp-muted{color:#8a96a7}.sp-code{font-family:Consolas,monospace;font-size:11px;background:#f6f8fb;padding:3px 6px;border-radius:6px}
.sp-network-path{font-size:11px;color:#667085;margin-top:5px}.sp-network-card{border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:10px;background:#fff}
.sp-report-table{width:100%;border-collapse:collapse}.sp-report-table th,.sp-report-table td{padding:10px;border-bottom:1px solid #eef1f5;text-align:left;font-size:12px}.sp-report-table th{font-size:10px;color:#768398;text-transform:uppercase}
@media(max-width:1050px){.sp-module-grid{grid-template-columns:1fr}.sp-side-card{position:static}.sp-form-grid.three{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.sp-form-grid,.sp-form-grid.three{grid-template-columns:1fr}.sp-kpi-mini{grid-template-columns:1fr 1fr}}
