/* =========================================================================
   REINZ Market Insights — application stylesheet
   Automated by N.M.I Raisul Bari — All Rights Reserved.
   ========================================================================= */
:root{
  --navy:#071C3A; --navy2:#0A2547; --navy3:#123059;
  --blue:#0078E7; --blue-dk:#0063c0; --blue-lt:#E8F2FE;
  --ink:#16202e; --ink-2:#3d4a5c;
  --bg:#f2f5f9; --card:#ffffff; --line:#e2e8f0; --line-2:#cbd5e1;
  --muted:#5b6879;
  --green:#18884a; --green-lt:#e8f7ee;
  --red:#c62828;  --red-lt:#fdeaea;
  --amber:#a8730a; --amber-lt:#fff6e0;
  --yellow:#FDDA24;
  --shadow:0 1px 2px rgba(16,24,40,.04), 0 4px 12px rgba(16,24,40,.06);
  --shadow-lg:0 8px 28px rgba(16,24,40,.12);
  --radius:12px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:"Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:16px; line-height:1.55;
  background:var(--bg); color:var(--ink);
  -webkit-font-smoothing:antialiased;
}
a{color:var(--blue)}

/* ------------------------------------------------------------------ top bar */
.topbar{
  background:linear-gradient(180deg,var(--navy) 0%,var(--navy2) 100%);
  color:#fff; display:flex; justify-content:space-between; align-items:center;
  padding:14px 26px; gap:14px; flex-wrap:wrap;
  box-shadow:var(--shadow);
}
.brand{display:flex; align-items:baseline; gap:12px; flex-wrap:wrap}
.brand-mark{font-weight:800; font-size:21px; color:#fff; letter-spacing:.4px}
.brand-mark::after{content:"INSIGHTS"; color:var(--blue); margin-left:6px}
.brand-sub{font-size:14px; color:#a9bdd6}
.top-right{display:flex; align-items:center; gap:16px}
.owner{font-size:14px; color:#c4d3e6}
.who{font-size:14px; color:#fff; font-weight:600}

/* -------------------------------------------------------------------- layout */
.wrap{max-width:1000px; margin:26px auto 40px; padding:0 18px}
.card{
  background:var(--card); border:1px solid var(--line);
  border-radius:var(--radius); padding:22px 24px; margin-bottom:20px;
  box-shadow:var(--shadow);
}
.card h2{
  margin:0 0 6px; font-size:20px; font-weight:700; letter-spacing:-.01em;
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
.card > .muted:first-of-type{margin-top:0}
.muted{color:var(--muted); font-size:15px; margin:0 0 16px}
.err{color:var(--red); font-weight:600}

.banner{padding:13px 16px; border-radius:10px; margin-bottom:18px; font-size:15px}
.banner.warn{background:var(--amber-lt); border:1px solid #e8c56a; color:#6b4e00}

/* ------------------------------------------------------------------- buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:inherit; font-size:15px; font-weight:600; line-height:1;
  padding:11px 18px; border-radius:9px; border:1px solid transparent;
  cursor:pointer; text-decoration:none; transition:.15s ease;
  white-space:nowrap;
}
.btn:disabled{opacity:.5; cursor:not-allowed}
.btn-primary{background:var(--blue); color:#fff}
.btn-primary:not(:disabled):hover{background:var(--blue-dk)}
.btn-danger{background:var(--red); color:#fff}
.btn-danger:not(:disabled):hover{filter:brightness(.92)}
.btn-light{background:#fff; color:var(--ink-2); border-color:var(--line-2)}
.btn-light:not(:disabled):hover{background:#f6f8fb}
.btn-dark{background:rgba(255,255,255,.12); color:#fff; border-color:rgba(255,255,255,.28)}
.btn-dark:hover{background:rgba(255,255,255,.2)}
.btn-block{width:100%}
.inline-form{display:inline-block; margin:14px 10px 0 0}

/* ------------------------------------------------------- run form field grid */
.run-form{margin-top:14px}
.field-grid{display:flex; flex-wrap:wrap; gap:16px; align-items:flex-end}
.field{display:flex; flex-direction:column; gap:6px; min-width:190px; flex:1 1 190px}
.field label{font-size:.92rem; font-weight:600; color:var(--ink-2)}
.field input{
  padding:11px 12px; border:1px solid var(--line-2); border-radius:9px;
  font-family:inherit; font-size:1rem; color:var(--ink); background:#fff;
  transition:.15s ease;
}
.field input:hover{border-color:#9fb3cd}
.field input:focus{outline:none; border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(0,120,231,.16)}
.field .hint{font-size:.83rem; color:var(--muted)}
.field .req{color:var(--red); font-weight:700}
.field-action{flex:0 0 auto; min-width:auto}
@media (max-width:760px){
  .field, .field-action{flex:1 1 100%; width:100%}
  .field-action .btn{width:100%}
}

/* -------------------------------------------------------------------- status */
.badge{
  font-size:12.5px; font-weight:700; padding:4px 12px; border-radius:999px;
  text-transform:uppercase; letter-spacing:.04em;
}
.badge.idle{background:#eef2f7; color:var(--muted)}
.badge.running{background:var(--blue-lt); color:var(--blue-dk)}
.badge.done{background:var(--green-lt); color:var(--green)}
.badge.error{background:var(--red-lt); color:var(--red)}
.badge.stopped{background:var(--amber-lt); color:var(--amber)}

.progress-block{margin:16px 0 10px}
.progress{
  position:relative; height:22px; background:#e7edf5; border-radius:999px;
  overflow:hidden; border:1px solid var(--line);
}
.bar{height:100%; width:0; background:var(--line-2); border-radius:999px;
  transition:width .4s ease}
.bar.running{background:linear-gradient(90deg,var(--blue),#38a1ff)}
.bar.done{background:var(--green)}
.bar.err{background:var(--red)}
.pct{position:absolute; inset:0; text-align:center; font-size:12.5px;
  line-height:20px; font-weight:700; color:var(--ink)}
.eta{font-size:14px; color:var(--muted); margin-top:8px}

.logbox{
  background:#0b1220; color:#cbd8ec; font-family:Consolas,"SF Mono",monospace;
  font-size:13px; line-height:1.5; padding:16px; border-radius:10px;
  max-height:340px; overflow:auto; white-space:pre-wrap; margin:0;
}

/* ------------------------------------------------------------ latest reports */
.outputs{list-style:none; padding:0; margin:0}
.outputs li{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:14px 4px; border-bottom:1px solid var(--line); font-size:15px;
}
.outputs li:last-child{border-bottom:none}
.outputs a{color:var(--blue); text-decoration:none; font-weight:600}
.outputs a:hover{text-decoration:underline}
.rep-kind{
  display:inline-block; min-width:170px; font-weight:700; color:var(--ink-2);
  font-size:14px;
}
@media (max-width:720px){.rep-kind{min-width:auto; display:block}}

/* -------------------------------------------------------------------- footer */
.footer{max-width:1000px; margin:8px auto 44px; padding:0 18px;
  color:var(--ink-2); font-size:14px; text-align:center}
.footer .fine{color:var(--muted); font-size:13px; margin-top:6px}
.footer a{color:var(--blue)}
code{background:#eef2f7; padding:2px 6px; border-radius:5px; font-size:13px}

/* ===================================================================== auth  */
.auth-body{
  min-height:100vh; margin:0; display:flex; align-items:center;
  justify-content:center; padding:32px 18px;
  background:
    radial-gradient(1200px 500px at 50% -10%, #123059 0%, transparent 60%),
    linear-gradient(180deg,var(--navy) 0%, #05142b 100%);
}
.auth-shell{width:100%; max-width:440px}
.auth-card{
  background:#fff; border-radius:16px; padding:34px 32px;
  box-shadow:var(--shadow-lg);
}
.auth-brand{text-align:center; margin-bottom:22px}
.auth-logo{font-weight:800; font-size:23px; letter-spacing:-.02em; line-height:1.1}
.auth-logo .lg-a{color:var(--navy)}
.auth-logo .lg-b{color:var(--blue); margin-left:5px}
.auth-tag{margin:6px 0 0; font-size:11.5px; font-weight:700; letter-spacing:.12em;
  color:var(--ink-2)}
.auth-rule{display:flex; gap:6px; justify-content:center; margin-top:10px}
.auth-rule i{width:34px; height:4px; border-radius:2px; display:block}
.auth-rule i:nth-child(1){background:var(--blue)}
.auth-rule i:nth-child(2){background:var(--yellow)}
.auth-rule i:nth-child(3){background:#E3262F}

.auth-title{font-size:23px; font-weight:700; margin:0 0 4px; letter-spacing:-.01em;
  text-align:center}
.auth-sub{margin:0 0 20px; font-size:14.5px; color:var(--muted); text-align:center}
.auth-form{margin-top:20px; display:flex; flex-direction:column; gap:16px}
.fld{display:flex; flex-direction:column; gap:6px}
.fld > span{font-size:.92rem; font-weight:600; color:var(--ink-2)}
.fld input{
  padding:12px 13px; border:1px solid var(--line-2); border-radius:9px;
  font-family:inherit; font-size:1rem; background:#fff; color:var(--ink);
  transition:.15s ease;
}
.fld input:hover{border-color:#9fb3cd}
.fld input:focus{outline:none; border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(0,120,231,.16)}
.fld small{font-size:.82rem; color:var(--muted)}
.auth-form .btn{margin-top:4px; padding:13px 18px; font-size:15.5px}

.auth-links{margin-top:20px; text-align:center; font-size:14.5px}
.auth-links a{color:var(--blue); text-decoration:none; font-weight:600}
.auth-links a:hover{text-decoration:underline}
.auth-links .dot{color:var(--line-2); margin:0 8px}
.auth-alt{margin:16px 0 0; text-align:center; font-size:14.5px; color:var(--muted)}
.auth-alt a{font-weight:600; text-decoration:none}
.auth-alt a:hover{text-decoration:underline}
.auth-foot{margin:20px 0 0; text-align:center; font-size:12.5px; color:#8fa6c2}

.alert{padding:12px 14px; border-radius:9px; font-size:14.5px; margin-top:18px}
.alert-err{background:var(--red-lt); border:1px solid #f0b4b4; color:#8e1f1f}
.alert-ok{background:var(--green-lt); border:1px solid #a8ddbd; color:#10633a}

.msg{display:flex; gap:14px; align-items:flex-start; margin-top:12px;
  font-size:15px; color:var(--ink-2)}
.msg p{margin:0}
.msg-icon{
  flex:0 0 auto; width:34px; height:34px; border-radius:50%; font-weight:800;
  display:flex; align-items:center; justify-content:center; color:#fff;
}
.msg-ok .msg-icon{background:var(--green)}
.msg-err .msg-icon{background:var(--red)}

/* ---- Admin users table ---------------------------------------------- */
.admin-table{width:100%; border-collapse:collapse; font-size:14.5px}
.admin-table th,.admin-table td{text-align:left; padding:9px 8px; border-bottom:1px solid var(--line); vertical-align:middle}
.admin-table th{background:#f1f5fa; color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.4px}
.admin-table td form{display:inline-block}
.admin-table .btn{padding:6px 12px; font-size:13px}
