/* Aikaa CRM v21 — approved palette: #30AFFF sky, #8FE8F8 aqua, #D6FFB8 lime, #C0F2C7 mint; all text black */
:root{
  --blue:#30AFFF;--blue-d:#1690e0;--blue-l:#e6f5ff;--aqua:#8FE8F8;--lime:#D6FFB8;--mint:#C0F2C7;
  --ink:#000;--ink-2:#3a3f45;--muted:#6b7280;--line:#e5e9ef;--bg:#f4f7fa;--card:#fff;
  --good:#1f9d55;--good-bg:#e3f8ea;--warn:#c47d00;--warn-bg:#fff4dc;--bad:#d6382e;--bad-bg:#fde8e6;
  --r:14px;--r-s:10px;--sh:0 1px 2px rgba(16,24,40,.05),0 6px 20px -8px rgba(16,24,40,.12);
  --side:232px;--font:Inter,"Segoe UI",system-ui,-apple-system,Roboto,"Noto Sans Devanagari",sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:15px;line-height:1.45}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
h1,h2,h3,h4{margin:0;line-height:1.2;letter-spacing:-.01em}
h2{font-size:18px;font-weight:700}
h3{font-size:15px;font-weight:700}
small{font-size:12px;color:var(--muted)}
.ic{width:20px;height:20px;flex:0 0 auto}
.muted{color:var(--muted)}
.right{text-align:right}
.nowrap{white-space:nowrap}
.hide,[hidden]{display:none!important}

/* ---------- shell ---------- */
.shell{display:flex;min-height:100vh}
.sidebar{position:fixed;inset:0 auto 0 0;width:var(--side);background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;padding:18px 14px;z-index:40}
.brand{display:flex;align-items:center;gap:10px;font-size:19px;padding:6px 8px 18px}
.brand b{font-weight:800}
.brand-mark{width:34px;height:34px;border-radius:10px;background:var(--blue);color:#fff;display:grid;place-items:center;font-weight:800;font-size:18px}
.side-nav{display:flex;flex-direction:column;gap:2px}
.side-link{display:flex;align-items:center;gap:11px;padding:10px 11px;border-radius:10px;font-weight:600;color:var(--ink-2);border:0;background:none;width:100%;text-align:left}
.side-link .ic{color:var(--muted)}
.side-link:hover{background:var(--bg)}
.side-link.on{background:var(--blue-l);color:var(--ink)}
.side-link.on .ic{color:var(--blue-d)}
.side-foot{margin-top:auto;border-top:1px solid var(--line);padding-top:12px}
.me{display:flex;gap:10px;align-items:center;padding:6px 8px 10px}
.me b,.me small{display:block}
.avatar{width:36px;height:36px;border-radius:50%;background:var(--mint);display:grid;place-items:center;font-weight:800;font-size:13px;flex:0 0 auto}
.main{margin-left:var(--side);flex:1;min-width:0;padding:0 28px 40px}
.main .content{max-width:1180px;margin:0 auto}
.main.wide .content{max-width:1500px}
.topbar{display:flex;align-items:center;gap:12px;padding:18px 0 14px;max-width:1180px;margin:0 auto}
.main.wide .topbar{max-width:1500px}
.topbar-title{font-size:22px;font-weight:800;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.topbar-date{font-size:13px;color:var(--muted)}
.topbar-out,.brand-mobile,.tabbar{display:none}
.back{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:#fff;border:1px solid var(--line)}
.impersonation{position:sticky;top:0;z-index:50;background:#000;color:#fff;padding:8px 16px;display:flex;justify-content:space-between;font-size:13px}
.impersonation a{color:var(--aqua);font-weight:700}

/* ---------- flash ---------- */
.flash{padding:12px 16px;border-radius:var(--r-s);margin:0 auto 14px;font-weight:600;max-width:1180px;display:flex;justify-content:space-between;gap:12px}
.flash.ok{background:var(--good-bg);border:1px solid #b7e8c5}
.flash.err{background:var(--bad-bg);border:1px solid #f3b5af}
.flash.info{background:var(--blue-l);border:1px solid #bfe3fb}

/* ---------- cards & grids ---------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:18px}
.card+.card{margin-top:14px}
.card-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.card-head p{margin:2px 0 0;color:var(--muted);font-size:13px}
.kicker{font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--blue-d)}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g-main{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
.stack{display:flex;flex-direction:column;gap:14px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.spread{display:flex;justify-content:space-between;align-items:center;gap:10px}
.mt{margin-top:14px}.mb{margin-bottom:14px}

/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.stat{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;box-shadow:var(--sh)}
.stat small{display:block;margin-bottom:6px;font-weight:600;color:var(--muted)}
.stat b{font-size:26px;font-weight:800;letter-spacing:-.02em;display:block;line-height:1.1}
.stat span{display:block;font-size:12px;color:var(--muted);margin-top:4px}
.stat.hero{background:linear-gradient(135deg,var(--blue) 0%,#5cc4ff 60%,var(--aqua) 100%);border:0}
.stat.hero small,.stat.hero span{color:#0a2a40}
.stat.good{background:var(--lime)}.stat.mint{background:var(--mint)}.stat.warn{background:var(--warn-bg)}.stat.bad{background:var(--bad-bg)}
.big{font-size:34px;font-weight:800;letter-spacing:-.03em;line-height:1}

/* ---------- bar ---------- */
.bar{height:8px;background:#e9eef4;border-radius:99px;overflow:hidden;position:relative}
.bar span{display:block;height:100%;border-radius:99px;background:var(--blue)}
.bar.good span{background:var(--good)}.bar.mid span{background:var(--blue)}.bar.low span{background:var(--warn)}
.bar .stretch{position:absolute;top:-2px;bottom:-2px;width:2px;background:#000;opacity:.5}

/* ---------- badges ---------- */
.badge{display:inline-block;padding:3px 9px;border-radius:99px;font-size:11.5px;font-weight:700;background:#eef1f5;white-space:nowrap}
.badge.good{background:var(--good-bg);color:#136b39}.badge.warn{background:var(--warn-bg);color:#8a5600}.badge.bad{background:var(--bad-bg);color:#9c2119}
.badge.blue{background:var(--blue-l);color:#0a5f96}.badge.mint{background:var(--mint)}.badge.lime{background:var(--lime)}.badge.dark{background:#000;color:#fff}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:10px;border:1px solid var(--line);background:#fff;font-weight:700;font-size:14px;line-height:1.2;white-space:nowrap}
.btn:hover{background:var(--bg)}
.btn.primary{background:var(--blue);border-color:var(--blue);color:#000}
.btn.primary:hover{background:var(--blue-d);color:#fff}
.btn.dark{background:#000;border-color:#000;color:#fff}
.btn.good{background:var(--lime);border-color:#b9ef8f}
.btn.danger{background:#fff;border-color:#f0b6b1;color:var(--bad)}
.btn.sm{padding:6px 11px;font-size:13px;border-radius:8px}
.btn.xl{padding:16px 22px;font-size:17px;border-radius:14px;width:100%}
.btn.block{width:100%}
.btn .ic{width:18px;height:18px}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.tel{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--blue-d)}
.tel .ic{width:16px;height:16px}

/* ---------- forms ---------- */
label.f{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:600;color:var(--ink-2)}
label.f>span.hint{font-weight:400;color:var(--muted)}
input:not([type=checkbox]):not([type=radio]),select,textarea{width:100%;border:1px solid #d5dbe3;background:#fff;border-radius:10px;padding:11px 12px;font-size:15px;outline:0;color:var(--ink)}
input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(48,175,255,.2)}
input[type=number]{-moz-appearance:textfield}
textarea{min-height:78px;resize:vertical}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.form-grid .span{grid-column:1/-1}
.inline-form{display:flex;gap:8px;align-items:end;flex-wrap:wrap}
.inline-form label.f{flex:1;min-width:140px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.chip span{display:inline-block;padding:9px 14px;border-radius:99px;border:1.5px solid #d5dbe3;background:#fff;font-weight:600;font-size:14px}
.chip input:checked+span{background:#000;color:#fff;border-color:#000}
.chip.good input:checked+span{background:var(--good);border-color:var(--good)}
.lines{display:flex;flex-direction:column;gap:8px}
.line{display:grid;grid-template-columns:minmax(0,1fr) 90px 100px 34px;gap:8px;align-items:center}
.line.simple{grid-template-columns:minmax(0,1fr) 100px 34px}
.line .x{width:34px;height:40px;border-radius:9px;border:1px solid var(--line);background:#fff;font-size:18px;line-height:1}
.qtybox{display:flex;align-items:center;gap:6px}
.qtybox button{width:38px;height:40px;border-radius:9px;border:1px solid #d5dbe3;background:#fff;font-size:20px;font-weight:700}
.qtybox input{text-align:center;padding:9px 4px}
.shelf{display:flex;flex-direction:column;gap:8px}
.shelf-head,.shelf-row{display:grid;grid-template-columns:minmax(0,1fr) 96px 96px;gap:8px;align-items:center}
.shelf-head{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700}
.shelf-row b{display:block}.shelf-row small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shelf-row input{padding:9px 8px;text-align:center}
.section{margin-top:18px}
.section>.kicker{display:block;margin-bottom:8px}
details.fold{border:1px solid var(--line);border-radius:var(--r-s);padding:0 14px;background:#fafcfe}
details.fold>summary{cursor:pointer;padding:12px 0;font-weight:700;list-style:none;display:flex;justify-content:space-between;align-items:center}
details.fold>summary::after{content:'+';font-size:20px;color:var(--muted)}
details.fold[open]>summary::after{content:'–'}
details.fold>.fold-body{padding:0 0 14px}

/* ---------- tables ---------- */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{text-align:left;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:11px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl tr:last-child td{border-bottom:0}
.tbl td.num,.tbl th.num{text-align:right;font-variant-numeric:tabular-nums}
.tbl tr.warn td{background:var(--warn-bg)}.tbl tr.bad td{background:var(--bad-bg)}.tbl tr.good td{background:var(--good-bg)}
.tbl .sub{display:block;font-size:12px;color:var(--muted)}
.tbl b.gap{font-variant-numeric:tabular-nums}
.gap-neg{color:var(--bad)}.gap-pos{color:var(--good)}

/* ---------- lists ---------- */
.list{display:flex;flex-direction:column}
.item{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.item:last-child{border-bottom:0}
.item>.body{flex:1;min-width:0}
.item b{display:block;font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.item small{display:block;margin-top:2px}
.item .end{text-align:right;flex:0 0 auto}
.item.link:hover{background:var(--bg);margin:0 -10px;padding:12px 10px;border-radius:10px}
.dot{width:10px;height:10px;border-radius:50%;background:var(--muted);flex:0 0 auto}
.dot.good{background:var(--good)}.dot.warn{background:var(--warn)}.dot.bad{background:var(--bad)}.dot.blue{background:var(--blue)}
.empty{padding:22px;text-align:center;color:var(--muted);border:1px dashed #d5dbe3;border-radius:var(--r-s);font-size:14px}
.alert-list .item{gap:10px}
.alert-list .ic{color:var(--warn)}
.feed .item{align-items:flex-start}
.feed time{font-size:12px;color:var(--muted);white-space:nowrap;min-width:64px}

/* ---------- quick actions ---------- */
.quick{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.quick a{display:flex;flex-direction:column;gap:6px;padding:16px;border-radius:var(--r);background:#fff;border:1px solid var(--line);box-shadow:var(--sh);font-weight:700}
.quick a .ic{width:24px;height:24px;color:var(--blue-d)}
.quick a small{font-weight:500}
.quick a.hi{background:var(--blue);border-color:var(--blue)}
.quick a.hi .ic{color:#000}
.quick a.hi small{color:#0a2a40}
.quick a.lime{background:var(--lime)}.quick a.mint{background:var(--mint)}.quick a.aqua{background:var(--aqua)}
.quick.big a{padding:22px 18px;font-size:18px}
.quick.big a .ic{width:30px;height:30px}

/* ---------- tabs ---------- */
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.tabs a{padding:8px 14px;border-radius:99px;border:1px solid var(--line);background:#fff;font-weight:600;font-size:13.5px}
.tabs a.on{background:#000;color:#fff;border-color:#000}
.month-nav{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:99px;padding:4px 6px}
.month-nav a{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;font-size:18px;font-weight:700}
.month-nav a:hover{background:var(--bg)}
.month-nav b{min-width:120px;text-align:center}

/* ---------- kanban ---------- */
.kanban{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(230px,1fr);gap:12px;overflow-x:auto;padding-bottom:6px}
.kcol{background:#eef2f6;border-radius:var(--r);padding:10px;min-height:120px}
.kcol h4{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:4px 6px 10px;display:flex;justify-content:space-between}
.kcard{background:#fff;border-radius:10px;padding:10px 12px;box-shadow:var(--sh);margin-bottom:8px}
.kcard b{display:block;font-size:14px}
.kcard small{display:block}
.kcard .row{margin-top:8px;gap:6px}

/* ---------- misc ---------- */
.hero{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:20px 22px;box-shadow:var(--sh);display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:20px;align-items:center}
.hero .big{font-size:44px}
.hero .bar{height:12px;margin:10px 0 8px}
.hero .legend{display:flex;gap:16px;font-size:13px;color:var(--muted);flex-wrap:wrap}
.hero .legend b{color:var(--ink)}
.callout{padding:12px 14px;border-radius:var(--r-s);background:var(--blue-l);font-size:13.5px}
.callout.warn{background:var(--warn-bg)}.callout.bad{background:var(--bad-bg)}.callout.good{background:var(--good-bg)}
.pill-nav{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px}
.note{font-size:13px;color:var(--muted)}
.divider{border:0;border-top:1px solid var(--line);margin:16px 0}
.stock-tile{display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:var(--r);background:#fff;border:1px solid var(--line);box-shadow:var(--sh)}
.stock-tile b{font-size:15px}
.stock-tile .n{font-size:28px;font-weight:800;letter-spacing:-.02em}
.stock-tile.low{background:var(--bad-bg);border-color:#f3b5af}
.stock-tile .type{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700}
.hindi{font-family:var(--font)}
.step{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.step i{width:28px;height:28px;border-radius:50%;background:#000;color:#fff;display:grid;place-items:center;font-style:normal;font-weight:800;font-size:13px}
.printable{display:none}

/* ---------- login ---------- */
.login{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(160deg,var(--blue-l),#fff 45%,var(--mint))}
.login .card{width:100%;max-width:400px;padding:28px}
.login .brand{justify-content:center;padding-bottom:6px;font-size:24px}
.login p{text-align:center;color:var(--muted);margin:0 0 20px}

/* ---------- responsive ---------- */
@media (max-width:1100px){.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:860px){
  .sidebar{display:none}
  .main{margin-left:0;padding:0 14px calc(84px + env(safe-area-inset-bottom))}
  .topbar{padding:12px 0 10px;position:sticky;top:0;background:var(--bg);z-index:30}
  .topbar-title{font-size:19px}
  .topbar-date{display:none}
  .topbar-out,.brand-mobile{display:flex}
  .topbar-out button{background:none;border:0;color:var(--muted);padding:6px}
  .tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom));z-index:40}
  .tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10.5px;font-weight:700;color:var(--muted);padding:4px 2px}
  .tab .ic{width:22px;height:22px}
  .tab.on{color:var(--blue-d)}
  .g2,.g3,.g4,.g-main,.hero{grid-template-columns:1fr}
  .hero .big{font-size:38px}
  .stats{grid-template-columns:repeat(2,1fr)}
  .stat b{font-size:22px}
  .card{padding:14px;border-radius:12px}
  .line{grid-template-columns:minmax(0,1fr) 80px 90px 30px}
  .line.simple{grid-template-columns:minmax(0,1fr) 90px 30px}
  .kanban{grid-auto-columns:minmax(240px,80vw)}
  .impersonation{position:relative}
}
@media print{
  .sidebar,.tabbar,.topbar,.flash,.no-print,.actions{display:none!important}
  .main{margin:0;padding:0}
  body{background:#fff}
  .card{box-shadow:none;border:0;padding:0}
  .printable{display:block}
}
