/* Listwell shared brand layer — loaded after each page's own styles.
   Brings inner pages in line with the landing-page design system. */

body{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:#101d33;
  background:radial-gradient(900px 380px at 92% -4%,#e8eeff,transparent 60%),
             radial-gradient(700px 380px at -6% 108%,#e9f8f3,transparent 55%),
             #f6f8fc;
}

/* --- Page header band (shared .header shell) --- */
.header{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,#0b1633,#152a5e 55%,#3f2d8f);
  border-radius:18px;padding:26px 28px;margin-bottom:22px;
  display:flex;align-items:center;gap:16px;
  box-shadow:0 20px 45px rgba(11,22,51,.28);
}
.header::before{ /* brand mark */
  content:'';flex:none;width:42px;height:42px;
  background:url('listwell-mark.svg') center/contain no-repeat;
  filter:drop-shadow(0 8px 18px rgba(63,99,242,.45));
}
.header::after{ /* subtle grid texture */
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:36px 36px;
  -webkit-mask-image:radial-gradient(480px 220px at 82% 20%,#000,transparent 75%);
  mask-image:radial-gradient(480px 220px at 82% 20%,#000,transparent 75%);
}
.header h1{font-size:20px;letter-spacing:-.5px;position:relative;z-index:1}
.header small{color:#a9bbdd}
.header>div{position:relative;z-index:1}
.header> :last-child{margin-left:auto}
.header a,.logout{
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);
  border-radius:10px;font-weight:700;transition:.2s;position:relative;z-index:1;
}
.header a:hover,.logout:hover{background:rgba(255,255,255,.24)}

/* --- Cards & panels --- */
.card{
  border:1px solid #e3e9f3;border-radius:18px;
  box-shadow:0 16px 36px rgba(11,22,51,.07);
}
.card h2{color:#0b1633;letter-spacing:-.4px}
.register-card{border:1px solid #e3e9f3;border-radius:22px;box-shadow:0 30px 70px rgba(2,8,30,.4)}
.doc{border:1px solid #e3e9f3;border-radius:20px;box-shadow:0 20px 50px rgba(11,22,51,.09)}
.doc h1{letter-spacing:-.8px}

/* --- Tabs --- */
.tab{border:1px solid #e3e9f3;border-radius:10px;font-weight:700;color:#4d5c79;transition:.18s}
.tab:hover{border-color:#b9c6ea;color:#0b1633}
.tab.active{
  background:linear-gradient(135deg,#5570f7,#3f63f2);border-color:transparent;color:#fff;
  box-shadow:0 8px 18px rgba(63,99,242,.35);
}

/* --- Buttons --- */
.btn,button[type=submit]:not(.secondary):not(.tab){
  border-radius:11px;
}
.btn:not(.secondary):not(.link-btn):not(.danger):not(.ghost){
  background:linear-gradient(135deg,#5570f7,#3f63f2 55%,#3454e0);
  box-shadow:0 10px 24px rgba(63,99,242,.3);font-weight:750;
}
.btn:not(.secondary):not(.link-btn):not(.danger):not(.ghost):hover{background:linear-gradient(135deg,#4d66ee,#3758ea);transform:translateY(-1px)}
.btn.danger{background:#fff;color:#d84e58;border:1px solid #f2c9cb;font-weight:750}
.btn.danger:hover{background:#fff0f0}
.btn.ghost{background:#fff;color:#4d66ee;border:1px solid #c9d6f2;font-weight:750}
.btn.ghost:hover{background:#eef2fe}
.lookup-btn{border-radius:10px;font-weight:700}

/* --- Fields --- */
.field input,.field select,.field textarea{
  border:1px solid #dce4ef;border-radius:10px;background:#fbfcfe;transition:border .15s,box-shadow .15s;
}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:#3f63f2;box-shadow:0 0 0 3px rgba(63,99,242,.14);outline:none;
}
input:focus{border-color:#3f63f2}

/* --- Selectables (plans, products, tenants) --- */
.plan.active,.product:has(input:checked),.tenant-btn.active{
  border-color:#3f63f2;background:#f0f4ff;
}

/* --- Doc/legal page top bar --- */
.top{margin-bottom:22px}
.top .brand{
  display:inline-flex;align-items:center;gap:10px;font-size:17px;letter-spacing:-.4px;color:#0b1633;
}
.top .brand::before{
  content:'';width:34px;height:34px;
  background:url('listwell-mark.svg') center/contain no-repeat;
  filter:drop-shadow(0 8px 16px rgba(63,99,242,.35));
}
.top a.back{color:#3f63f2}

/* --- Auth-style centered pages (register / reset) --- */
body.auth-page{
  background:radial-gradient(760px 340px at 78% 6%,rgba(111,132,255,.35),transparent 62%),
             radial-gradient(640px 320px at 10% 94%,rgba(20,200,168,.18),transparent 60%),
             #0b1633;
}
body.auth-page .register-card,body.auth-page .card{border:0}
.brandmark{background:url('listwell-mark.svg') center/contain no-repeat;font-size:0;color:transparent}
.auth-brand{display:flex;align-items:center;gap:10px;justify-content:center;margin-bottom:22px;color:#fff;font-weight:900;letter-spacing:-.4px;font-size:18px}
.auth-brand .mark{width:34px;height:34px;background:url('listwell-mark.svg') center/contain no-repeat;font-size:0;filter:drop-shadow(0 8px 16px rgba(63,99,242,.4))}
.auth-brand small{display:block;font-size:9px;letter-spacing:2px;color:#8ea0c4;font-weight:700}

/* --- Tables (legal docs) --- */
table th{background:#f1f5fd;color:#0b1633}
table th,table td{border-color:#e3e9f3}

/* --- Links & accents --- */
a{color:#3f63f2}

/* --- Password visibility toggle --- */
.pw-wrap{position:relative;display:block}
.pw-wrap>input{padding-right:38px !important}
.pw-eye{position:absolute;right:5px;top:50%;transform:translateY(-50%);background:none;border:0;cursor:pointer;padding:4px;color:#69778d;display:flex;align-items:center}
.pw-eye:hover{color:#172338}
.pw-eye .slash{display:none}
.pw-eye.on{color:#3468f5}
.pw-eye.on .slash{display:block}