/* Anitish Technologies — AMC & Warranty Tracker */
:root{
  --navy:#0f2a4a; --navy-700:#16395f; --navy-500:#1f4e79;
  --blue:#1d6fb8; --blue-600:#175d9c; --blue-50:#eaf3fb;
  --slate-900:#1b2330; --slate-700:#3d4a5c; --slate-500:#64748b;
  --slate-300:#cbd5e1; --slate-200:#e2e8f0; --slate-100:#f1f5f9; --slate-50:#f8fafc;
  --green:#137a4b; --green-bg:#e7f5ee;
  --yellow:#8a6100; --yellow-bg:#fdf3d8;
  --amber:#a1560a; --amber-bg:#fdeddb;
  --red:#b3261e; --red-bg:#fdeaea;
  --grey:#5b6472; --grey-bg:#eef1f5;
  --radius:10px;
  --shadow:0 1px 2px rgba(15,42,74,.06), 0 4px 14px rgba(15,42,74,.06);
}
*{box-sizing:border-box}
body{margin:0;background:var(--slate-100);color:var(--slate-900);
  font:15px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  -webkit-text-size-adjust:100%}
a{color:var(--blue-600);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{margin:0 0 .5rem;line-height:1.25;color:var(--navy)}
h1{font-size:1.5rem} h2{font-size:1.2rem} h3{font-size:1.02rem}
p{margin:.4rem 0}
.muted{color:var(--slate-500)}
.small{font-size:.86rem}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.right{text-align:right} .center{text-align:center}
.nowrap{white-space:nowrap}

/* ---------- shell ---------- */
.topbar{background:var(--navy);color:#fff}
.topbar-in{max-width:1180px;margin:0 auto;padding:.65rem 1rem;display:flex;align-items:center;gap:1rem}
.brand{display:flex;align-items:center;gap:.6rem;color:#fff;font-weight:600;letter-spacing:.2px}
.brand:hover{text-decoration:none}
.brand img{height:34px;width:auto;display:block;border-radius:4px;background:#fff;padding:2px}
.brand .bname{font-size:1rem;line-height:1.1}
.brand .btag{display:block;font-size:.68rem;font-weight:500;color:#9fc3e6;letter-spacing:.06em;text-transform:uppercase}
.topbar .spacer{flex:1}
.whoami{font-size:.84rem;color:#b9d3ea;text-align:right;line-height:1.3}
.whoami b{color:#fff;display:block;font-weight:600}
.topbar a.out{color:#b9d3ea;font-size:.84rem}

nav.main{background:var(--navy-700);border-bottom:3px solid var(--blue)}
nav.main ul{max-width:1180px;margin:0 auto;padding:0 .5rem;list-style:none;display:flex;flex-wrap:wrap;gap:.15rem}
nav.main a{display:block;padding:.6rem .85rem;color:#cfe1f2;font-size:.9rem;font-weight:500;border-bottom:3px solid transparent;margin-bottom:-3px}
nav.main a:hover{color:#fff;text-decoration:none;background:rgba(255,255,255,.06)}
nav.main a.active{color:#fff;border-bottom-color:#fff;background:rgba(255,255,255,.09)}

main{max-width:1180px;margin:0 auto;padding:1.15rem 1rem 3rem}
.page-head{display:flex;align-items:flex-start;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.page-head .grow{flex:1;min-width:220px}
footer.site{max-width:1180px;margin:0 auto;padding:0 1rem 2rem;color:var(--slate-500);font-size:.8rem}

/* ---------- cards ---------- */
.card{background:#fff;border:1px solid var(--slate-200);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:1.1rem;overflow:hidden}
.card > h2, .card > .card-head{margin:0;padding:.75rem 1rem;border-bottom:1px solid var(--slate-200);background:var(--slate-50);
  font-size:.95rem;font-weight:600;color:var(--navy);display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.card-head .spacer{flex:1}
.pad{padding:1rem}
.grid{display:grid;gap:1.1rem}
.grid.c2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.grid.c3{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.grid.c4{grid-template-columns:repeat(auto-fit,minmax(185px,1fr))}
.grid.c6{grid-template-columns:repeat(auto-fit,minmax(158px,1fr))}

/* ---------- stat tiles ---------- */
.stat{background:#fff;border:1px solid var(--slate-200);border-left:4px solid var(--blue);border-radius:var(--radius);
  padding:.85rem 1rem;box-shadow:var(--shadow);display:block}
.stat:hover{text-decoration:none;border-color:var(--slate-300);box-shadow:0 2px 6px rgba(15,42,74,.1)}
.stat .n{font-size:1.85rem;font-weight:650;color:var(--navy);line-height:1.1;letter-spacing:-.02em}
.stat .l{font-size:.79rem;color:var(--slate-500);text-transform:uppercase;letter-spacing:.05em;margin-top:.15rem}
.stat.red{border-left-color:var(--red)} .stat.red .n{color:var(--red)}
.stat.amber{border-left-color:var(--amber)} .stat.amber .n{color:var(--amber)}
.stat.yellow{border-left-color:#c99700} .stat.yellow .n{color:var(--yellow)}
.stat.green{border-left-color:var(--green)} .stat.green .n{color:var(--green)}

/* ---------- tables ---------- */
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;font-size:.9rem}
th,td{padding:.55rem .7rem;text-align:left;border-bottom:1px solid var(--slate-200);vertical-align:top}
thead th{background:var(--slate-50);color:var(--slate-700);font-size:.74rem;text-transform:uppercase;
  letter-spacing:.05em;font-weight:650;white-space:nowrap;border-bottom:2px solid var(--slate-300);position:sticky;top:0}
tbody tr:hover{background:var(--blue-50)}
tbody tr:last-child td{border-bottom:none}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
.empty{padding:2.2rem 1rem;text-align:center;color:var(--slate-500)}

/* ---------- badges ---------- */
.badge{display:inline-block;padding:.15rem .5rem;border-radius:999px;font-size:.76rem;font-weight:600;white-space:nowrap}
.badge.green{background:var(--green-bg);color:var(--green)}
.badge.yellow{background:var(--yellow-bg);color:var(--yellow)}
.badge.amber{background:var(--amber-bg);color:var(--amber)}
.badge.red{background:var(--red-bg);color:var(--red)}
.badge.grey{background:var(--grey-bg);color:var(--grey)}
.badge.blue{background:var(--blue-50);color:var(--blue-600)}
.badge.purple{background:#efe9f7;color:#5b3a8e}

/* ---------- forms ---------- */
label{display:block;font-size:.82rem;font-weight:600;color:var(--slate-700);margin-bottom:.25rem}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=number],input[type=search],select,textarea{
  width:100%;padding:.5rem .6rem;border:1px solid var(--slate-300);border-radius:7px;background:#fff;
  font:inherit;font-size:.92rem;color:var(--slate-900)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(29,111,184,.15)}
input[readonly]{background:var(--slate-50);color:var(--slate-500)}
textarea{min-height:70px;resize:vertical}
.field{margin-bottom:.85rem}
.fieldrow{display:grid;gap:.85rem;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.hint{font-size:.78rem;color:var(--slate-500);margin-top:.2rem}
fieldset{border:1px solid var(--slate-200);border-radius:var(--radius);padding:.9rem;margin:0 0 1rem}
legend{font-size:.8rem;font-weight:700;color:var(--navy);text-transform:uppercase;letter-spacing:.05em;padding:0 .35rem}

.btn{display:inline-block;padding:.5rem .95rem;border-radius:7px;border:1px solid var(--blue-600);
  background:var(--blue);color:#fff;font:inherit;font-size:.9rem;font-weight:600;cursor:pointer;text-align:center}
.btn:hover{background:var(--blue-600);text-decoration:none;color:#fff}
.btn.sec{background:#fff;color:var(--navy);border-color:var(--slate-300)}
.btn.sec:hover{background:var(--slate-50);color:var(--navy)}
.btn.danger{background:var(--red);border-color:#8f1e18}
.btn.danger:hover{background:#8f1e18}
.btn.sm{padding:.3rem .6rem;font-size:.82rem}
.btn:disabled{opacity:.55;cursor:not-allowed}
.actions{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}

/* ---------- alerts ---------- */
.alert{padding:.7rem .9rem;border-radius:var(--radius);margin-bottom:1rem;border:1px solid;font-size:.9rem}
.alert.ok{background:var(--green-bg);border-color:#b9e0cc;color:#0d5c39}
.alert.err{background:var(--red-bg);border-color:#f3c3c0;color:#8f1e18}
.alert.warn{background:var(--yellow-bg);border-color:#eed99a;color:#6f4e00}
.alert.info{background:var(--blue-50);border-color:#c3ddf1;color:#14507f}
.alert ul{margin:.35rem 0 0 1.1rem;padding:0}

/* ---------- login ---------- */
.loginwrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1.5rem;
  background:linear-gradient(160deg,var(--navy) 0%,var(--navy-500) 55%,#2a6ea8 100%)}
.loginbox{width:100%;max-width:390px;background:#fff;border-radius:14px;padding:1.6rem;box-shadow:0 18px 45px rgba(6,20,38,.32)}
.loginbox .lb-brand{text-align:center;margin-bottom:1.2rem}
.loginbox .lb-brand img{height:52px;margin-bottom:.5rem}
.loginbox .lb-brand h1{font-size:1.12rem;margin:0}
.loginbox .lb-brand p{font-size:.8rem;color:var(--slate-500);margin:.1rem 0 0;text-transform:uppercase;letter-spacing:.08em}

/* ---------- review table ---------- */
.review td{padding:.4rem .45rem}
.review input[type=text],.review input[type=number],.review select{padding:.4rem .5rem;font-size:.88rem}
.review tr.off{opacity:.42}
.rawtext{max-height:330px;overflow:auto;background:var(--slate-50);border:1px solid var(--slate-200);
  border-radius:7px;padding:.7rem;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.78rem;white-space:pre-wrap;line-height:1.45}
details.raw summary{cursor:pointer;font-size:.85rem;font-weight:600;color:var(--blue-600);padding:.3rem 0}

.filters{display:flex;gap:.6rem;flex-wrap:wrap;align-items:flex-end}
.filters .field{margin-bottom:0;min-width:150px}
.pager{display:flex;gap:.35rem;flex-wrap:wrap;align-items:center;padding:.75rem 1rem;border-top:1px solid var(--slate-200);font-size:.86rem}
.pager a,.pager span{padding:.25rem .55rem;border-radius:6px;border:1px solid var(--slate-200)}
.pager span.cur{background:var(--navy);color:#fff;border-color:var(--navy)}

dl.kv{margin:0;display:grid;grid-template-columns:auto 1fr;gap:.35rem .9rem;font-size:.9rem}
dl.kv dt{color:var(--slate-500);font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;padding-top:.1rem}
dl.kv dd{margin:0;font-weight:500}

@media (max-width:640px){
  .topbar-in{padding:.55rem .75rem}
  .brand .btag{display:none}
  main{padding:.9rem .7rem 2.5rem}
  h1{font-size:1.25rem}
  .stat .n{font-size:1.5rem}
  th,td{padding:.5rem .5rem}
  nav.main a{padding:.55rem .6rem;font-size:.86rem}
}
@media print{
  .topbar,nav.main,.actions,.pager,.no-print{display:none!important}
  body{background:#fff}
  .card{box-shadow:none;border-color:#ccc}
}
