:root{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:#e9eef7;background:#0b0f14;color-scheme:dark
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#0b0f14}
body{min-width:320px}
a{color:#a99bff;text-decoration:none}
a:hover{color:#c3b9ff}
button,input,select,textarea{font:inherit}
.account-shell{min-height:100vh;display:grid;grid-template-columns:250px minmax(0,1fr)}
.account-sidebar{
  position:sticky;top:0;height:100vh;padding:24px 16px;
  border-right:1px solid #242b35;background:#10161e;
  display:flex;flex-direction:column;gap:26px
}
.account-brand{display:flex;align-items:center;padding:0 8px;color:#eef3fb}
.account-brand:hover{color:#fff}
.account-brand-logo{display:block;width:min(190px,100%);height:auto;border-radius:10px;background:#fff}
.account-brand-fallback{display:flex;align-items:center;gap:12px}
.account-brand-fallback[hidden]{display:none}
.account-brandmark{
  width:40px;height:40px;border-radius:12px;display:grid;place-items:center;
  background:#7c5cff;color:#fff;font-weight:800
}
.account-brand strong,.account-brand small{display:block}
.account-brand small{margin-top:2px;color:#8490a2;font-size:12px}
.account-nav{display:grid;gap:6px}
.account-nav a{
  padding:11px 13px;border-radius:10px;color:#aeb8c7;font-size:14px
}
.account-nav a:hover{background:#1b2430;color:#fff}
.account-nav .account-back{margin-bottom:8px;color:#c8c0ff}
.account-sidebar-footer{
  margin-top:auto;padding:10px 8px;display:grid;gap:8px;color:#7f8a9c;font-size:13px
}
.account-sidebar-footer a{color:#aeb8c7}
.account-main{min-width:0;padding:42px 34px}
.account-main-inner{width:min(900px,100%);margin:0 auto}
.account-card{
  border:1px solid #29313c;border-radius:18px;background:#10161e;
  padding:clamp(22px,4vw,40px);box-shadow:0 18px 50px rgba(0,0,0,.18)
}
.account-card h1{font-size:clamp(28px,3vw,36px);margin:0 0 24px;line-height:1.15}
.account-card h2{font-size:20px;margin:30px 0 12px}
.account-card h3{font-size:17px;margin:24px 0 10px}
.account-card p{color:#9eabba;line-height:1.6}
.account-card ul{padding-left:20px;color:#aab5c4}
.account-card li{margin:7px 0}
.account-card hr{border:0;border-top:1px solid #29313c;margin:26px 0}
.account-card form{display:grid;gap:16px;margin-top:16px}
.account-card label{display:grid;gap:7px;color:#aeb8c7;font-size:13px;font-weight:650}
.account-card input:not([type="checkbox"]):not([type="radio"]),
.account-card select,.account-card textarea{
  width:100%;min-height:44px;padding:10px 12px;border:1px solid #374251;
  border-radius:10px;background:#0d131a;color:#eef3fb;outline:none
}
.account-card input:focus,.account-card select:focus,.account-card textarea:focus{
  border-color:#8069ee;box-shadow:0 0 0 3px rgba(124,92,255,.15)
}
.account-card input[type="checkbox"],.account-card input[type="radio"]{accent-color:#7c5cff}
.account-card button,.account-card input[type="submit"],.account-card a[role="button"]{
  min-height:42px;padding:10px 14px;border:1px solid #7258e8;border-radius:10px;
  background:#7258e8;color:#fff;font-weight:700;cursor:pointer;text-decoration:none
}
.account-card button:hover,.account-card input[type="submit"]:hover{background:#8069ee;border-color:#8069ee}
.account-card button[type="button"],.account-card button.secondary{
  background:#151d27;border-color:#374251;color:#dce5f2
}
.account-card table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid #29313c;border-radius:12px;overflow:hidden}
.account-card th,.account-card td{padding:12px;border-bottom:1px solid #29313c;text-align:left}
.account-card tr:last-child td{border-bottom:0}
.account-card th{background:#0d131a;color:#8f9bad;font-size:12px;text-transform:uppercase}
.account-card code,.account-card pre{
  background:#0a1017;border:1px solid #29313c;border-radius:8px;color:#cbd6e5
}
.account-card code{padding:2px 5px}
.account-card pre{padding:14px;overflow:auto}
.account-card .errorlist{margin:0;padding:10px 12px;list-style:none;border:1px solid #713843;background:#2a151a;color:#ffc0c7;border-radius:9px}
.account-card .helptext{display:block;color:#7f8a9c;font-size:12px;line-height:1.5;margin-top:5px}
.account-messages{display:grid;gap:10px;margin-bottom:16px}
.account-message{padding:12px 14px;border-radius:10px;border:1px solid #3a475a;background:#111a26;color:#c8d5e7}
.account-message.success{border-color:#2f6848;background:#13271d;color:#b8ebcb}
.account-message.error{border-color:#713843;background:#2a151a;color:#ffc0c7}

/* allauth's element templates often produce simple sibling blocks rather than semantic cards */
.account-card>div{max-width:100%}
.account-card>form+form{margin-top:12px}
.account-card form>div{display:grid;gap:7px}
.account-card [class*="badge"]{
  display:inline-flex;align-items:center;border:1px solid #3d4a5b;border-radius:999px;
  padding:3px 8px;font-size:11px;color:#b7c3d3;background:#151d27
}

/* MFA/security settings read as individual settings sections */
.account-card h2+p,.account-card h3+p{margin-top:0}
.account-card h2~ul,.account-card h3~ul{margin-top:8px}
.account-card svg{max-width:100%}
.account-card img{max-width:100%;height:auto}

@media(max-width:900px){
  .account-shell{grid-template-columns:1fr}
  .account-sidebar{
    position:static;height:auto;border-right:0;border-bottom:1px solid #242b35;
    padding:14px 16px;gap:12px
  }
  .account-brand{display:flex;justify-content:center;padding:0}
  .account-brand-logo{width:min(180px,70vw)}
  .account-nav{display:flex;overflow:auto;gap:6px;padding-bottom:2px}
  .account-nav a{white-space:nowrap}
  .account-sidebar-footer{display:none}
  .account-main{padding:24px 18px 40px}
}
@media(max-width:600px){
  .account-main{padding:14px 10px 28px}
  .account-card{border-radius:14px;padding:20px 16px}
  .account-card h1{font-size:28px}
  .account-nav{margin:0 -6px;padding:0 6px 4px}
  .account-card button,.account-card input[type="submit"]{width:100%}
}

.account-nav-heading{padding:0 13px 6px;color:#6f7c8f;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.security-page-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:22px}
.security-page-head h1{margin-bottom:8px}
.security-page-head p{margin:0;max-width:650px}
.account-eyebrow{display:block;color:#9d8cff;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:8px}
.account-button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 14px;border:1px solid #3a4657;border-radius:10px;background:#151d27;color:#dfe7f3;font-weight:700}
.account-button.primary{background:#7258e8;border-color:#7258e8;color:#fff}
.account-button.danger{background:#2b171c;border-color:#6a3640;color:#ffb7c0}
.account-callout,.callback-box{border:1px solid #344052;border-radius:12px;background:#111925;padding:14px 16px;margin:18px 0}
.account-callout.compact{margin-top:8px}
.account-callout p,.callback-box p{margin:5px 0 0}
.callback-box span{display:block;color:#8794a6;font-size:11px;text-transform:uppercase;margin-bottom:7px}
.callback-box code{display:block;overflow-wrap:anywhere;padding:9px 10px}
.security-section{margin-top:28px}
.security-section-head,.provider-card-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.security-section-head h2{margin:0 0 4px}.security-section-head p{margin:0}
.status-pill{display:inline-flex;align-items:center;min-height:26px;padding:4px 9px;border:1px solid #3b4656;border-radius:999px;color:#a9b5c5;background:#151d27;font-size:11px}
.status-pill.status-on{border-color:#2c6a49;background:#12271c;color:#9ce0b7}
.provider-list{display:grid;gap:14px;margin-top:14px}
.oidc-provider-card{border:1px solid #29313c;border-radius:14px;background:#0d131a;padding:16px}
.oidc-provider-card strong,.oidc-provider-card small{display:block}.oidc-provider-card small{margin-top:3px;color:#7f8a9c}
.oidc-provider-card dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:16px 0 0;border:1px solid #29313c;border-radius:10px;overflow:hidden}
.oidc-provider-card dl>div{padding:10px 11px;border-bottom:1px solid #29313c}
.oidc-provider-card dl>div:nth-child(odd){border-right:1px solid #29313c}
.oidc-provider-card dl>div.wide{grid-column:1/-1;border-right:0}
.oidc-provider-card dt{color:#748196;font-size:10px;text-transform:uppercase}.oidc-provider-card dd{margin:4px 0 0;overflow-wrap:anywhere}
.provider-actions{display:flex;gap:8px;margin-top:14px}.provider-actions form{margin:0}
.account-empty{margin-top:14px;padding:20px;border:1px dashed #394657;border-radius:12px;background:#0d131a}
.account-empty p{margin-bottom:0}
.oidc-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.oidc-form-grid label.wide{grid-column:1/-1}
.field-error{color:#ffadb7;font-size:12px}
.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:8px}
@media(max-width:700px){
 .security-page-head{display:grid}.security-page-head>.account-button{width:100%}
 .oidc-provider-card dl,.oidc-form-grid{grid-template-columns:1fr}
 .oidc-provider-card dl>div,.oidc-provider-card dl>div:nth-child(odd){border-right:0;border-bottom:1px solid #29313c}
 .oidc-form-grid label.wide{grid-column:auto}
 .provider-actions,.form-actions{display:grid;grid-template-columns:1fr}
 .provider-actions .account-button,.provider-actions button,.form-actions>*{width:100%}
}

/* v0.3.5 OIDC form consistency */
.oidc-page-head{margin-bottom:18px}
.oidc-form{gap:22px}
.oidc-form-section{display:grid;gap:12px}
.oidc-form-section h2{margin:0;font-size:18px}
.oidc-form-grid{align-items:start}
.oidc-form-grid label{min-width:0}
.oidc-form-grid input[type="text"],
.oidc-form-grid input[type="url"],
.oidc-form-grid input[type="password"]{height:48px;min-height:48px}
.oidc-toggle-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.oidc-toggle-card{
  display:grid!important;grid-template-columns:auto minmax(0,1fr);gap:12px!important;align-items:start;
  min-height:96px;padding:14px;border:1px solid #334052;border-radius:12px;background:#0d131a;cursor:pointer
}
.oidc-toggle-card:hover{border-color:#55479d;background:#101724}
.oidc-toggle-card input{margin:3px 0 0;width:18px;height:18px}
.oidc-toggle-card strong,.oidc-toggle-card small{display:block}
.oidc-toggle-card strong{color:#e7edf7;font-size:14px}
.oidc-toggle-card small{margin-top:4px;color:#7f8a9c;line-height:1.45;font-size:12px}
.callback-box code{white-space:normal;word-break:break-all}
@media(max-width:760px){
  .oidc-toggle-grid{grid-template-columns:1fr}
}
