/* Lucanta — sign-in screens (login, two-step verification, company selector).
   Static theme CSS, not compiled by Mix; linked only from the Lucanta auth views
   (layouts/auth_lucanta). Lucanta Nítido (Oct 2026): one family, weights 400/500/600,
   a flat navy brand panel, no gradients, glows or floating decoration, 44px fields,
   one 48px primary action and AA contrast in both themes. */
:root{
  --brand:#00438b; --brand-strong:#003470; --brand-on:#ffffff; --brand-soft:#e6eef8; --brand-link:#0060d1;
  --teal:#00b9b0; --teal-text:#00756f; --teal-soft:#e0f5f3;
  --ink:#0e1a2b; --ink-2:#2b3850; --ink-3:#5f6b7e;
  --bg:#f5f7fa; --surface:#ffffff; --surface-2:#f8f9fb;
  --border:#e4e8ee; --border-2:#d5dbe3;
  --red:#b42318; --red-soft:#fdecea;
  /* Brand panel: the darkest neutral, the same in both themes. */
  --panel:#0e1a2b; --panel-text:#ffffff; --panel-text-2:#c9d3e1; --panel-line:rgba(255,255,255,.14);
  /* Self-hosted only (F9): the family comes from auth/lucanta-auth.css (--font-sans). */
  --font:var(--font-sans,Inter,system-ui,-apple-system,"Segoe UI",sans-serif);
  --display:var(--font);
  --r:10px; --focus:0 0 0 3px #d6e4f7;
}
[data-theme="dark"]{
  --brand:#8cbdf5; --brand-strong:#b9d6fa; --brand-on:#0b1220; --brand-soft:rgba(140,189,245,.16); --brand-link:#8cbdf5;
  --teal:#3fd1c3; --teal-text:#9be8df; --teal-soft:rgba(63,209,195,.16);
  --ink:#e6ecf4; --ink-2:#c9d3e1; --ink-3:#a9b6c8;
  --bg:#0b1220; --surface:#121b2b; --surface-2:#162133;
  --border:#223047; --border-2:#2f3e57;
  --red:#f38b80; --red-soft:rgba(243,139,128,.16);
  --panel:#070c16; --panel-line:rgba(255,255,255,.10);
  --focus:0 0 0 3px rgba(140,189,245,.32);
}
*{box-sizing:border-box;}
html,body{margin:0;height:100%;}
body{
  font-family:var(--font); color:var(--ink); background:var(--bg);
  font-feature-settings:"tnum" 1;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit;}
a{color:var(--brand-link);text-decoration:none;}
a:hover{color:var(--brand);text-decoration:underline;}
svg{display:block;}
:focus-visible{outline:2px solid var(--brand-link);outline-offset:2px;}

/* ===== Layout ===== */
.auth{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:100vh;width:100%;}

/* ===== Brand panel (left): logo + one sentence ===== */
.brand-panel{
  position:relative; overflow:hidden; color:var(--panel-text);
  background:var(--panel);
  display:flex; flex-direction:column; justify-content:space-between; gap:32px;
  /* Safe areas (installed PWA / iOS app, viewport-fit=cover): 0 everywhere else. */
  padding:calc(48px + env(safe-area-inset-top,0px)) 56px calc(48px + env(safe-area-inset-bottom,0px)) max(56px, env(safe-area-inset-left,0px));
}
.bp-inner{position:relative;}
.bp-wm{height:32px;width:auto;}
.bp-wm path[fill="#00438B"]{fill:#ffffff;}
.bp-wm path[fill="#00B9B0"]{fill:#00b9b0;}

.bp-head{position:relative;max-width:460px;margin:auto 0;}
.bp-eyebrow{
  display:block;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--panel-text-2);margin-bottom:16px;
}
.bp-title{
  font-family:var(--display);font-weight:600;
  font-size:28px;line-height:1.25;letter-spacing:-.01em;margin:0;color:var(--panel-text);
}
.bp-title .hl{color:var(--panel-text);}
.bp-sub{font-size:16px;line-height:1.55;color:var(--panel-text-2);margin:16px 0 0;max-width:420px;}

.bp-feats{position:relative;display:flex;flex-direction:column;gap:16px;margin:32px 0 0;}
.bp-feat{display:flex;align-items:flex-start;gap:12px;}
.bp-feat .chk{
  width:24px;height:24px;border-radius:6px;flex:none;margin-top:1px;
  background:rgba(0,185,176,.18);
  display:grid;place-items:center;color:#3fd1c3;
}
.bp-feat .chk svg{width:14px;height:14px;}
.bp-feat .ft{font-size:14px;font-weight:600;color:var(--panel-text);}
.bp-feat .fs{font-size:13px;color:var(--panel-text-2);margin-top:2px;}

.bp-foot{position:relative;display:flex;align-items:center;gap:24px;flex-wrap:wrap;
  font-size:13px;color:var(--panel-text-2);padding-top:20px;border-top:1px solid var(--panel-line);}
.bp-stat{display:flex;flex-direction:column;gap:2px;}
.bp-stat b{font-family:var(--display);font-size:16px;font-weight:600;color:var(--panel-text);}
.bp-stat span{font-size:12px;color:var(--panel-text-2);}
.bp-divider{width:1px;height:28px;background:var(--panel-line);}

/* The floating "live" cards were decoration with invented figures: gone. */
.bp-card{display:none;}

/* ===== Form panel (right) ===== */
.form-panel{
  position:relative;display:flex;flex-direction:column;
  background:var(--surface);padding:calc(32px + env(safe-area-inset-top,0px)) max(40px, env(safe-area-inset-right,0px)) calc(32px + env(safe-area-inset-bottom,0px)) 40px;
}
.fp-top{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.fp-mark{display:flex;align-items:center;gap:10px;min-width:0;}
.fp-mark img{height:32px;width:32px;border-radius:8px;flex:none;}
.fp-mark .nm{font-family:var(--display);font-weight:600;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.fp-top-actions{display:flex;align-items:center;gap:8px;}
.icon-btn{
  width:44px;height:44px;border-radius:var(--r);display:grid;place-items:center;
  color:var(--ink-2);border:1px solid var(--border-2);background:var(--surface);
  transition:background-color .15s,border-color .15s,color .15s;
}
.icon-btn:hover{color:var(--ink);background:var(--surface-2);}
.icon-btn svg{width:18px;height:18px;}
.fp-help{font-size:13px;font-weight:600;color:var(--ink-2);padding:0 4px;}
.fp-help:hover{color:var(--brand);}

.fp-body{flex:1;display:flex;flex-direction:column;justify-content:center;
  width:100%;max-width:400px;margin:0 auto;padding:32px 0;}
.fp-title{font-family:var(--display);font-weight:600;font-size:28px;line-height:1.2;letter-spacing:-.01em;margin:0;}
.fp-sub{font-size:14px;line-height:1.55;color:var(--ink-2);margin:8px 0 0;}
.fp-sub b{font-weight:600;color:var(--ink);}

form{margin-top:24px;}
.field{margin-bottom:16px;}
.field label{display:block;font-size:13px;font-weight:500;color:var(--ink-2);margin-bottom:6px;}
.inp{position:relative;display:flex;align-items:center;}
.inp .lead{position:absolute;left:12px;color:var(--ink-3);pointer-events:none;}
.inp .lead svg{width:18px;height:18px;}
.inp input{
  width:100%;height:44px;border-radius:var(--r);border:1px solid var(--border-2);
  background:var(--surface);color:var(--ink);font-family:inherit;font-size:16px;
  padding:0 12px 0 40px;outline:none;transition:border-color .15s,box-shadow .15s;
}
.inp input::placeholder{color:var(--ink-3);}
.inp input:hover{border-color:var(--ink-3);}
.inp input:focus{border-color:var(--brand);box-shadow:var(--focus);}
.inp.err input{border-color:var(--red);}
.inp.err input:focus{box-shadow:0 0 0 3px var(--red-soft);}
/* 44px target (WCAG 2.5.8), centred by the flex container. */
.inp .toggle{position:absolute;right:0;width:44px;height:44px;border-radius:var(--r);display:grid;place-items:center;color:var(--ink-3);}
.inp .toggle:hover{color:var(--ink-2);background:var(--surface-2);}
.inp .toggle svg{width:18px;height:18px;}
.field-err{font-size:13px;color:var(--red);margin-top:6px;display:none;}
.inp.err ~ .field-err{display:block;}

.row-between{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:4px 0 24px;}
.remember{display:inline-flex;align-items:center;gap:8px;min-height:44px;cursor:pointer;font-size:13px;color:var(--ink-2);user-select:none;}
.remember input{position:absolute;opacity:0;width:0;height:0;}
.remember .box{width:18px;height:18px;border-radius:5px;border:1.5px solid var(--border-2);background:var(--surface);display:grid;place-items:center;transition:background-color .15s,border-color .15s;}
.remember .box svg{width:12px;height:12px;color:var(--brand-on);opacity:0;}
.remember input:checked + .box{background:var(--brand);border-color:var(--brand);}
.remember input:checked + .box svg{opacity:1;}
.remember input:focus-visible + .box{box-shadow:var(--focus);}
.link{font-size:13px;font-weight:600;color:var(--brand-link);}

.btn-primary{
  width:100%;height:48px;border-radius:var(--r);background:var(--brand);color:var(--brand-on);
  font-size:15px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  box-shadow:none;transition:background-color .15s;
}
.btn-primary:hover{background:var(--brand-strong);}
.btn-primary:active{transform:translateY(1px);}
.btn-primary svg{width:18px;height:18px;}
.btn-primary[disabled]{opacity:.55;cursor:default;}
.btn-primary .spin{width:18px;height:18px;border-radius:50%;border:2.5px solid currentColor;border-top-color:transparent;opacity:.85;animation:sp .7s linear infinite;}
@keyframes sp{to{transform:rotate(360deg)}}

/* Quiet one-line help under the form ("¿Eres contador? …"). */
.fp-note{font-size:13px;line-height:1.55;color:var(--ink-3);margin:16px 0 0;text-align:center;}
.fp-foot{font-size:13px;color:var(--ink-2);margin-top:24px;text-align:center;}
.fp-legal{margin-top:auto;padding-top:24px;font-size:12px;color:var(--ink-3);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.fp-legal a{color:var(--ink-3);}
.fp-legal a:hover{color:var(--ink-2);}

/* Entrance: a short rise, never on reduced motion. */
@media (prefers-reduced-motion:no-preference){
  .anim{animation:rise .4s cubic-bezier(.2,.7,.3,1);}
  .a1{animation-delay:.02s}.a2{animation-delay:.06s}.a3{animation-delay:.10s}.a4{animation-delay:.14s}
  @keyframes rise{from{transform:translateY(8px)}to{transform:none}}
}

/* ===== Responsive ===== */
@media (max-width:980px){
  .brand-panel{padding:calc(40px + env(safe-area-inset-top,0px)) 40px calc(40px + env(safe-area-inset-bottom,0px)) max(40px, env(safe-area-inset-left,0px));}
  .form-panel{padding:calc(24px + env(safe-area-inset-top,0px)) max(32px, env(safe-area-inset-right,0px)) calc(24px + env(safe-area-inset-bottom,0px)) 32px;}
}
@media (max-width:840px){
  .auth{grid-template-columns:1fr;grid-template-rows:auto 1fr;}
  .brand-panel{padding:calc(24px + env(safe-area-inset-top,0px)) max(24px, env(safe-area-inset-right,0px)) 24px max(24px, env(safe-area-inset-left,0px));gap:16px;}
  .form-panel{padding:24px max(32px, env(safe-area-inset-right,0px)) calc(24px + env(safe-area-inset-bottom,0px)) max(32px, env(safe-area-inset-left,0px));}
  .bp-head{margin:8px 0 0;}
  .bp-eyebrow{display:none;}
  .bp-title{font-size:20px;}
  .bp-title br{display:none;}
  .bp-sub,.bp-feats,.bp-foot{display:none;}
  .fp-mark{display:none;}
  .fp-top{justify-content:flex-end;}
  .fp-body{justify-content:flex-start;padding:8px 0 24px;}
}
@media (max-width:480px){
  .brand-panel{padding:calc(20px + env(safe-area-inset-top,0px)) max(16px, env(safe-area-inset-right,0px)) 20px max(16px, env(safe-area-inset-left,0px));}
  .form-panel{padding:16px max(16px, env(safe-area-inset-right,0px)) calc(16px + env(safe-area-inset-bottom,0px)) max(16px, env(safe-area-inset-left,0px));}
  .fp-title{font-size:20px;}
}
