/* SPR India brand theme for SPR Leasing Desk — maroon + gold + ivory, same look as the Sky Booking app.
   Pure presentation: loaded after the inline styles, overrides colours/typography and adds motion. */
:root{
  --spr-deep:#3D001C; --spr-maroon:#580028; --spr-mid:#7B1041; --spr-light:#A8506A; --spr-pale:#FDF2F8;
  --spr-ivory:#FAF8F5; --spr-ivory-dark:#F0EBE3; --spr-gold:#C9A84C; --spr-gold-soft:#F6EBC8;
  --bg:#FAF8F5; --surface:#ffffff; --sunk:#F0EBE3; --line:#E8E1DA;
  --fg:#1A1A2E; --muted:#6B7280; --accent:#580028; --accent-ink:#ffffff; --accent-soft:#FDF2F8;
  --good:#047857; --good-soft:#D9F3E8; --warn:#9A6408; --warn-soft:#FBEFD0; --bad:#C62828; --bad-soft:#FBE1E1;
  --display:"Poppins",ui-sans-serif,system-ui,sans-serif;
  --body:"Poppins",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --shadow-sm:0 2px 12px rgba(88,0,40,.07); --shadow-md:0 10px 30px rgba(88,0,40,.14);
  --ease:cubic-bezier(.22,.8,.26,1);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#14090E; --surface:#201016; --sunk:#2B1620; --line:#43232F; --fg:#F4EDEF; --muted:#B9A2AB;
  --accent:#E3A6BC; --accent-ink:#3D001C; --accent-soft:#33141F;
  --good:#5fcf95; --good-soft:#12342A; --warn:#E9BE62; --warn-soft:#3a2b12; --bad:#F2817D; --bad-soft:#3d1c1c;
  --shadow-sm:0 2px 12px rgba(0,0,0,.4); --shadow-md:0 10px 30px rgba(0,0,0,.5)}}
:root[data-theme="dark"]{
  --bg:#14090E; --surface:#201016; --sunk:#2B1620; --line:#43232F; --fg:#F4EDEF; --muted:#B9A2AB;
  --accent:#E3A6BC; --accent-ink:#3D001C; --accent-soft:#33141F;
  --good:#5fcf95; --good-soft:#12342A; --warn:#E9BE62; --warn-soft:#3a2b12; --bad:#F2817D; --bad-soft:#3d1c1c;
  --shadow-sm:0 2px 12px rgba(0,0,0,.4); --shadow-md:0 10px 30px rgba(0,0,0,.5)}

html{scroll-behavior:smooth}
body{font-family:var(--body);letter-spacing:.005em;background:var(--bg);
  background-image:radial-gradient(900px 420px at 100% -10%,rgba(201,168,76,.10),transparent 60%),radial-gradient(800px 400px at -10% 0,rgba(88,0,40,.06),transparent 60%);
  background-attachment:fixed}
body::before{background:var(--spr-deep)}
::selection{background:var(--spr-gold);color:var(--spr-deep)}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--spr-light);border-radius:6px}

/* ---------- header ---------- */
header{background:linear-gradient(135deg,var(--spr-deep) 0%,var(--spr-maroon) 55%,var(--spr-mid) 100%);border-bottom:0;
  box-shadow:0 6px 24px rgba(61,0,28,.28);overflow:hidden}
header::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(105deg,transparent 35%,rgba(201,168,76,.10) 50%,transparent 65%);background-size:200% 100%;animation:sprShimmer 7s linear infinite}
header::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
  background:linear-gradient(90deg,var(--spr-deep),var(--spr-gold),#FAF8F5,var(--spr-gold),var(--spr-deep));background-size:200% 100%;animation:sprShimmer 6s linear infinite}
header .wrap{position:relative;z-index:1}
.bar{padding-block:14px}
h1{color:#fff;font-size:20px;font-weight:700;letter-spacing:.02em;display:flex;align-items:center;gap:14px}
h1 .logo{height:42px;width:auto;flex-shrink:0;filter:drop-shadow(0 2px 6px rgba(0,0,0,.3));transition:transform .5s var(--ease)}
h1:hover .logo{transform:scale(1.06) rotate(-1.5deg)}
h1 small{color:rgba(255,255,255,.62);font-size:10.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;margin-top:3px}
.me{color:rgba(255,255,255,.78)}
.me label{color:rgba(255,255,255,.7);font-size:12px}
.me select{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(201,168,76,.4);border-radius:20px;padding:6px 12px}
.me select option{color:#1A1A2E;background:#fff}
.me select:focus-visible{outline-color:var(--spr-gold)}
#meFixed{background:rgba(255,255,255,.1);border:1px solid rgba(201,168,76,.4);border-radius:20px;padding:5px 14px;color:#fff;font-weight:600}
nav{gap:2px}
nav button{color:rgba(255,255,255,.66);font-weight:500;font-size:13.5px;padding:12px 14px;border-bottom:3px solid transparent;position:relative;
  transition:color .25s,background .25s;border-radius:8px 8px 0 0}
nav button:hover{color:#fff;background:rgba(255,255,255,.07)}
nav button[aria-selected="true"]{color:#fff;font-weight:600;border-bottom-color:transparent;background:rgba(255,255,255,.1)}
nav button::after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--spr-gold);
  transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
nav button[aria-selected="true"]::after{transform:scaleX(1)}
nav .count{background:rgba(201,168,76,.22);color:#F6EBC8;border:1px solid rgba(201,168,76,.35)}

/* ---------- cards, panels ---------- */
h2{font-weight:600;color:var(--spr-maroon);letter-spacing:.005em}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) h2{color:var(--accent)}}
:root[data-theme="dark"] h2{color:var(--accent)}
.label{color:var(--muted);letter-spacing:.1em;font-weight:600}
.panel,.fcard,.kpi,.who,.fu{border-radius:16px;border:1px solid var(--line);box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .25s}
.panel{padding:18px;position:relative;overflow:hidden}
.panel::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--spr-gold),var(--spr-maroon));opacity:.0;transition:opacity .3s}
.panel:hover::before{opacity:.9}
.panel:hover,.fcard:hover,.kpi:hover,.fu:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--spr-light)}
.kpi{background:linear-gradient(160deg,var(--surface),var(--accent-soft))}
.kpi b,.big,.fcard .fbig{font-weight:700;color:var(--spr-maroon)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .kpi b,:root:not([data-theme="light"]) .big,:root:not([data-theme="light"]) .fcard .fbig{color:var(--accent)}}
:root[data-theme="dark"] .kpi b,:root[data-theme="dark"] .big,:root[data-theme="dark"] .fcard .fbig{color:var(--accent)}
.fcard[aria-pressed="true"]{border-color:var(--spr-gold);box-shadow:inset 0 0 0 1.5px var(--spr-gold),var(--shadow-md);background:linear-gradient(160deg,var(--surface),var(--spr-gold-soft))}
.banner{border-color:var(--spr-gold);background:linear-gradient(120deg,var(--accent-soft),var(--spr-gold-soft))}

/* ---------- controls ---------- */
input,select,textarea{border:1.5px solid var(--line);border-radius:10px;padding:8px 11px;transition:border-color .2s,box-shadow .2s,background .2s}
input:hover,select:hover,textarea:hover{border-color:var(--spr-light)}
input:focus,select:focus,textarea:focus,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none;border-color:var(--spr-maroon);box-shadow:0 0 0 3px rgba(88,0,40,.14)}
input[type=checkbox],input[type=radio]{accent-color:var(--spr-maroon)}
.btn{border-radius:12px;padding:9px 18px;font-weight:600;border:1.5px solid var(--spr-light);color:var(--spr-maroon);background:var(--surface);
  transition:transform .2s var(--ease),box-shadow .25s,background .2s,color .2s}
.btn:hover:not(:disabled){background:var(--spr-pale);box-shadow:0 4px 14px rgba(88,0,40,.16);transform:translateY(-1px)}
.btn:active:not(:disabled){transform:translateY(0) scale(.97)}
.btn.primary{background:linear-gradient(135deg,var(--spr-deep),var(--spr-maroon));border-color:transparent;color:#fff;box-shadow:0 4px 14px rgba(88,0,40,.32);position:relative;overflow:hidden}
.btn.primary::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%);transform:translateX(-120%)}
.btn.primary:hover:not(:disabled){background:linear-gradient(135deg,var(--spr-maroon),var(--spr-mid));box-shadow:0 8px 22px rgba(88,0,40,.42)}
.btn.primary:hover:not(:disabled)::after{transform:translateX(120%);transition:transform .7s var(--ease)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .btn{color:var(--accent)}:root:not([data-theme="light"]) .btn:hover:not(:disabled){background:var(--sunk)}}
:root[data-theme="dark"] .btn{color:var(--accent)}
.seg button{border-radius:999px;border:1.5px solid var(--line);transition:all .22s var(--ease)}
.seg button:hover{border-color:var(--spr-light);transform:translateY(-1px)}
.seg button[aria-pressed="true"]{background:linear-gradient(135deg,var(--spr-deep),var(--spr-maroon));border-color:var(--spr-gold);color:#fff;box-shadow:0 3px 10px rgba(88,0,40,.3)}
.chip{font-weight:600;letter-spacing:.01em}
.chip.acc{background:var(--accent-soft);color:var(--spr-maroon);border:1px solid rgba(88,0,40,.12)}
.ms summary,.ms-menu{border-radius:10px;border-width:1.5px}

/* ---------- tables ---------- */
.panel table{border-collapse:separate;border-spacing:0}
th{background:var(--accent-soft);color:var(--spr-maroon);font-weight:600;letter-spacing:.08em;border-bottom:2px solid var(--spr-gold)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) th{color:var(--accent)}}
:root[data-theme="dark"] th{color:var(--accent)}
td{transition:background .15s}
#unitsTable tbody tr,#signedTable tbody tr,#invTable tbody tr.link{transition:background .18s,box-shadow .18s}
#unitsTable tbody tr:hover,#signedTable tbody tr:hover,#invTable tbody tr.link:hover{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--spr-gold)}
tr.sect td{background:var(--spr-ivory-dark);color:var(--spr-maroon)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) tr.sect td{background:var(--sunk);color:var(--accent)}}
:root[data-theme="dark"] tr.sect td{background:var(--sunk);color:var(--accent)}

/* ---------- progress ---------- */
.meter{border-radius:8px;background:var(--sunk);box-shadow:inset 0 1px 3px rgba(0,0,0,.08)}
.meter i{background:linear-gradient(90deg,var(--spr-maroon),var(--spr-gold));border-radius:8px;transition:width .9s var(--ease);position:relative;overflow:hidden;animation:sprGrow 1.1s var(--ease) both}
.meter i::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);animation:sprShimmer 2.6s linear infinite;background-size:200% 100%}
.frow .b i,.pair .b i{background:linear-gradient(90deg,var(--spr-maroon),var(--spr-light));border-radius:5px;animation:sprGrow 1s var(--ease) both;transition:width .8s var(--ease)}

/* ---------- side sheet, toast ---------- */
.scrim{background:rgba(40,0,18,.5);backdrop-filter:blur(3px);animation:sprFade .25s ease both}
.sheet{border-left:3px solid var(--spr-gold);box-shadow:-18px 0 50px rgba(61,0,28,.28);animation:sprSlide .42s var(--ease) both}
.sheet h3{color:var(--spr-maroon);font-weight:600}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .sheet h3{color:var(--accent)}}
:root[data-theme="dark"] .sheet h3{color:var(--accent)}
.log{border-radius:14px;background:linear-gradient(160deg,var(--accent-soft),var(--spr-gold-soft));border:1px solid rgba(201,168,76,.4)}
.toast{background:linear-gradient(135deg,var(--spr-deep),var(--spr-maroon));color:#fff;border:1px solid var(--spr-gold);border-radius:14px;box-shadow:var(--shadow-md);animation:sprPop .4s var(--ease) both}
.hist div{transition:background .2s}.hist div:hover{background:var(--accent-soft)}
.fu,.who{background:var(--surface)}

/* ---------- entrance motion ---------- */
main>*,.floorcards>*,.kpis>*{animation:sprUp .6s var(--ease) both}
main>*:nth-child(2),.floorcards>*:nth-child(2),.kpis>*:nth-child(2){animation-delay:.07s}
main>*:nth-child(3),.floorcards>*:nth-child(3),.kpis>*:nth-child(3){animation-delay:.14s}
main>*:nth-child(4),.floorcards>*:nth-child(4),.kpis>*:nth-child(4){animation-delay:.21s}
main>*:nth-child(n+5),.floorcards>*:nth-child(n+5),.kpis>*:nth-child(n+5){animation-delay:.28s}
header{animation:sprDown .7s var(--ease) both}

/* ---------- sign-in screen (shim) ---------- */
html .sprl{background:radial-gradient(900px 500px at 85% 0,rgba(201,168,76,.22),transparent 60%),linear-gradient(135deg,#3D001C 0%,#580028 55%,#7B1041 100%);color:#1A1A2E;overflow:hidden;font-family:var(--body)}
html .sprl::before,html .sprl::after{content:"";position:absolute;border-radius:50%;pointer-events:none;filter:blur(60px);opacity:.55;animation:sprFloat 14s ease-in-out infinite}
html .sprl::before{width:380px;height:380px;background:rgba(201,168,76,.35);left:-100px;bottom:-120px}
html .sprl::after{width:320px;height:320px;background:rgba(168,80,106,.5);right:-80px;top:-100px;animation-delay:-6s}
html .sprl form{position:relative;z-index:1;background:rgba(255,255,255,.97);border:1px solid rgba(201,168,76,.5);border-radius:22px;padding:30px 28px;width:min(400px,92vw);
  box-shadow:0 30px 80px rgba(0,0,0,.45);animation:sprUp .8s var(--ease) both}
html .sprl .brand{display:grid;justify-items:center;gap:10px;padding-bottom:6px;border-bottom:3px solid transparent;border-image:linear-gradient(90deg,transparent,var(--spr-gold),transparent) 1}
html .sprl .brand img{height:46px;width:auto;box-sizing:content-box;padding:12px 22px;border-radius:16px;background:linear-gradient(135deg,var(--spr-deep),var(--spr-maroon) 60%,var(--spr-mid));box-shadow:0 8px 22px rgba(88,0,40,.35);animation:sprPop .9s var(--ease) both .15s}
html .sprl h1{color:var(--spr-maroon);font-size:19px;font-weight:700;text-align:center;letter-spacing:.03em;display:block}
html .sprl p{text-align:center;color:#6B7280}
html .sprl label{color:#6B7280;font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:600}
html .sprl input{border:1.5px solid #E8E1DA;border-radius:12px;padding:11px 13px;background:#fff;color:#1A1A2E;text-transform:none;letter-spacing:0}
html .sprl input:focus{border-color:var(--spr-maroon);box-shadow:0 0 0 3px rgba(88,0,40,.14);outline:none}
html .sprl button[type=submit]{background:linear-gradient(135deg,var(--spr-deep),var(--spr-maroon));border-radius:12px;padding:12px;box-shadow:0 6px 18px rgba(88,0,40,.35);
  transition:transform .2s var(--ease),box-shadow .25s}
html .sprl button[type=submit]:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 12px 26px rgba(88,0,40,.45)}
html .sprl button[type=submit]:active{transform:scale(.98)}
html .sprl .alt{color:var(--spr-maroon)}
html .sprl .err{color:#C62828}

@keyframes sprUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes sprDown{from{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:none}}
@keyframes sprFade{from{opacity:0}to{opacity:1}}
@keyframes sprSlide{from{transform:translateX(60px);opacity:0}to{transform:none;opacity:1}}
@keyframes sprPop{0%{opacity:0;transform:translateX(-50%) scale(.85)}100%{opacity:1;transform:translateX(-50%) scale(1)}}
@keyframes sprGrow{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes sprShimmer{from{background-position:200% 0}to{background-position:-200% 0}}
@keyframes sprFloat{0%,100%{transform:translate(0,0)}50%{transform:translate(40px,-30px)}}
html .sprl .brand img{animation-name:sprPopPlain}
@keyframes sprPopPlain{0%{opacity:0;transform:scale(.8)}100%{opacity:1;transform:scale(1)}}
@media (max-width:640px){h1 .logo{height:34px}h1{font-size:17px}nav button{padding:10px 11px;font-size:13px}.panel{padding:14px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
nav{scrollbar-width:none;-ms-overflow-style:none}nav::-webkit-scrollbar{display:none}
/* ---------- always light, wider canvas ---------- */
:root{color-scheme:light}
.wrap{max-width:min(1640px,96vw)}
main{gap:24px;padding-block:26px 80px}
#tab-today{grid-template-columns:minmax(340px,.62fr) minmax(0,1.38fr);gap:24px}
.sheet{width:min(680px,100%)}
.floorcards{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.kpis{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}
.panel{padding:22px}
th,td{padding:9px 14px}
@media (max-width:1100px){#tab-today{grid-template-columns:minmax(0,1fr)}}

/* top account bar */
html .sprchip{background:linear-gradient(90deg,#2a0013,#580028 55%,#7B1041);border-bottom:1px solid rgba(201,168,76,.55);padding:7px clamp(14px,3vw,32px);gap:12px;color:#fff}
html .sprchip .sprav{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#E3C878,#C9A84C);color:#3D001C;font-weight:700;font-size:14px;box-shadow:0 0 0 2px rgba(255,255,255,.18)}
html .sprchip .sprwho{display:flex;flex-direction:column;line-height:1.15}
html .sprchip .sprwho b{font-weight:600;font-size:13px}
html .sprchip .sprwho small{font-size:10.5px;color:#e9c9d6;opacity:.85}
html .sprchip .sprrole{padding:3px 10px;border-radius:999px;font-size:10.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;background:rgba(201,168,76,.18);border:1px solid rgba(201,168,76,.6);color:#F1D98E}
html .sprchip .sprgap{flex:1}
html .sprchip button{all:unset;box-sizing:border-box;cursor:pointer;padding:6px 14px;border-radius:999px;font:500 12px Poppins,sans-serif;color:#fff;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.08);transition:background .2s,transform .2s,border-color .2s}
html .sprchip button:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.55);transform:translateY(-1px)}
html .sprchip button.sprgold{background:linear-gradient(135deg,#E3C878,#C9A84C);color:#3D001C;border-color:transparent;font-weight:600}
html .sprchip button.sprgold:hover{filter:brightness(1.06)}
html .sprchip button.sprout{background:rgba(255,255,255,.14)}
@media(max-width:640px){html .sprchip{flex-wrap:wrap;gap:8px}html .sprchip .sprgap{display:none}html .sprchip button{padding:5px 10px;font-size:11px}}
