/* XFLOWD Landings — chrome de la app (admin / panel / login) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
:root{
  --primary:#06697E; --primary-500:#00818B; --primary-deep:#054F5F; --tint:#E6F0F2;
  --ink:#0F2138; --ink-soft:#47566B; --muted:#8A97A8;
  --bg:#EEF1F4; --surface:#fff; --border:#E2E7EC; --border-strong:#CFD6DE;
  --success:#10B981; --error:#EF4444; --warn:#F59E0B;
  --r:10px; --r-lg:14px; --r-full:9999px; --shadow:0 1px 2px rgba(15,33,56,.05),0 6px 20px rgba(15,33,56,.06);
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:15px}
a{color:var(--primary-500);text-decoration:none}
a:hover{color:var(--primary-deep)}
.topbar{background:var(--surface);border-bottom:1px solid var(--border);height:58px;display:flex;align-items:center;gap:14px;padding:0 22px;position:sticky;top:0;z-index:10}
.topbar .logo{display:flex;align-items:center;gap:9px;font-weight:700}
.topbar .logo .dot{width:24px;height:24px;border-radius:7px;background:var(--primary);color:#fff;display:grid;place-items:center;font-size:14px}
.topbar .logo img{display:block}
.topbar .logo .logo-suffix{font-weight:600;color:var(--ink-soft);font-size:15px}
.topbar .sp{flex:1}
.topbar .who{color:var(--ink-soft);font-size:14px}
.wrap{max-width:1080px;margin:0 auto;padding:28px 22px}
.wrap.narrow{max-width:560px}
h1{font-size:26px;margin:0 0 4px}
h2{font-size:19px;margin:0 0 12px}
.muted{color:var(--muted)}
.sub{color:var(--ink-soft);margin:0 0 22px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:22px}
.card+.card{margin-top:16px}
.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.between{justify-content:space-between}
label{display:block;font-weight:600;font-size:13.5px;color:var(--ink-soft);margin:14px 0 6px}
input[type=text],input[type=email],input[type=password],input[type=url],select{
  width:100%;font:inherit;padding:11px 13px;border:1.5px solid var(--border-strong);border-radius:var(--r);background:#fff;color:var(--ink)}
input:focus,select:focus{outline:none;border-color:var(--primary-500);box-shadow:0 0 0 3px var(--tint)}
.hint{color:var(--muted);font-size:12.5px;margin-top:5px}
.btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border-strong);background:#fff;color:var(--ink);font-weight:600;font-size:14px;padding:10px 18px;border-radius:var(--r-full);cursor:pointer}
.btn:hover{border-color:var(--primary-500);color:var(--primary)}
.btn-primary{background:var(--primary-500);border-color:var(--primary-500);color:#fff}
.btn-primary:hover{background:var(--primary-deep);border-color:var(--primary-deep);color:#fff}
.btn-lg{padding:13px 24px;font-size:15px}
.btn-ghostdanger{color:var(--error);border-color:#F3C6C6}
.btn-ghostdanger:hover{color:#fff;background:var(--error);border-color:var(--error)}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--border);font-size:14px}
th{color:var(--muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.badge{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;padding:3px 10px;border-radius:var(--r-full)}
.badge.on{background:#DCFCE7;color:#15803D}
.badge.off{background:#F1F3F5;color:var(--muted)}
.flash{background:var(--tint);color:var(--primary-deep);border:1px solid #CFE6EA;border-radius:var(--r);padding:12px 14px;margin-bottom:16px;font-weight:500}
.tpl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-top:6px}
.tpl-opt{border:1.5px solid var(--border);border-radius:var(--r);padding:10px;cursor:pointer;background:#fff}
.tpl-opt input{display:none}
.tpl-opt .sw{height:30px;border-radius:6px;margin-bottom:8px}
.tpl-opt b{font-size:13.5px}
.tpl-opt.sel{border-color:var(--primary-500);box-shadow:0 0 0 3px var(--tint)}
.hr{height:1px;background:var(--border);margin:18px 0}
code.slug{background:var(--tint);color:var(--primary-deep);padding:2px 7px;border-radius:6px;font-size:13px}
