/* ===== ControlFintech minimal theme (v12.5 LTS) ===== */
*{box-sizing:border-box}html,body{height:100%}
:root{
  --bg:#f6f7fb; --card:#fff; --ink:#0f172a; --muted:#6b7280; --line:#e5e7eb;
  --brand:#2563eb; --brand-ink:#0b4fd9; --ok:#16a34a; --bad:#ef4444;
  --radius:12px; --shadow:0 6px 18px rgba(0,0,0,.05);
}
body{margin:0;background:var(--bg);color:var(--ink);
  font:15px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1120px;margin:18px auto;padding:0 16px}
.navbar{position:sticky;top:0;z-index:100;background:#fff;border-bottom:1px solid var(--line)}
.navbar-inner{display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 16px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800; padding:15px}
.brand .dot{width:8px;height:8px;border-radius:999px;background:var(--brand);display:inline-block}
.navlinks{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.navlinks a,.navlinks summary{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer}
.navlinks a:hover,.navlinks summary:hover{background:#f9fafb;text-decoration:none}
/* dropdown without JS */
.navlinks details{position:relative}
.navlinks details[open]>summary{background:#f3f4f6}
.navlinks details .menu{position:absolute;top:44px;left:0;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);min-width:220px;padding:6px;z-index:120}
.navlinks details .menu a{display:block;padding:8px 10px;border-radius:10px}
.navlinks details .menu a:hover{background:#f3f4f6}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px;margin:14px 0}
h1{font-size:1.35rem;margin:6px 0 10px} h2{font-size:1.1rem;margin:4px 0 8px}
.small{color:var(--muted);font-size:.92rem}
.stats{display:flex;gap:10px;flex-wrap:wrap}
.stat-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 2px 6px rgba(0,0,0,.03)}
.stat-chip .label{color:var(--muted);font-weight:600}.stat-chip .value{font-weight:800}
.btn{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:10px;border:1px solid var(--line);background:#fff}
.btn:hover{background:#f9fafb}.btn-primary{background:linear-gradient(180deg,var(--brand),var(--brand-ink));color:#fff;border-color:transparent;box-shadow:0 8px 20px rgba(37,99,235,.25)}
.input,select.input{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.table-wrap{overflow-x:auto}.table{width:100%;border-collapse:collapse}
.table th,.table td{border-bottom:1px solid var(--line);padding:12px 10px;text-align:left;vertical-align:middle}
.table thead th{background:#f9fafb;white-space:nowrap}
@media (max-width:768px){
  .table thead{display:none}
  .table tr{display:block;border:1px solid var(--line);border-radius:12px;margin-bottom:10px}
  .table td{display:flex;justify-content:space-between;border-bottom:1px solid var(--line)}
  .table td::before{content:attr(data-label);font-weight:600;color:var(--muted)}
  .table td:last-child{border-bottom:0}
}
.breadcrumb{color:var(--muted);font-size:.9rem;margin:6px 0}
.breadcrumb a{color:inherit;text-decoration:none}.breadcrumb span{margin:0 6px}


/* v12.6 footer + spacing + toolbar polish */
.page{ min-height: calc(100vh - 56px); padding-bottom: 72px; } /* leave room for footer */
.footer{
  position: relative; z-index: 1;
  margin-top: 24px; padding: 18px 0;
  background: #111827; color: #e5e7eb;
}
.footer .container{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.footer .brand{ color:#e5e7eb }
.footer a{ color:#e5e7eb; text-decoration:none }
.footer a:hover{ text-decoration:underline }

/* Toolbar alignment: inputs and buttons same height, aligned baseline */
.toolbar{ display:flex; gap:10px; flex-wrap:wrap; align-items:end }
.toolbar .input, .toolbar select.input{ height:42px }
.toolbar .btn, .toolbar .btn-primary{ height:42px; display:inline-flex; align-items:center }
.btn{ transition: transform .05s ease, background-color .15s ease, box-shadow .15s ease }
.btn:hover{ background:#f3f4f6 }
.btn:active{ transform: translateY(1px) }
.btn-primary{ background: linear-gradient(180deg, var(--brand), var(--brand-ink)); color:#fff; border-color:transparent; box-shadow: 0 8px 20px rgba(37,99,235,.25) }
.btn-primary:hover{ background:#bcbcbc; filter: brightness(.97); box-shadow: 0 10px 24px rgba(91,91,91) }
.btn-primary:active{ filter: brightness(.95) }

/* Small-screen navbar: wrap & horizontal scroll if needed */
.navbar-inner{ flex-wrap:wrap; height:auto; padding:8px 16px }
.navlinks{ gap:6px; overflow-x:auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px }
.navlinks a, .navlinks summary{ padding:7px 10px; border-radius:9px }
.navlinks details .menu{ left:auto; right:0 } /* keep menu visible on small screens */

/* Inputs stack label + input neatly in toolbar */
.toolbar label{ display:flex; flex-direction:column; gap:6px }