/* Theme 2026 — Auth-CSS seitenspezifisch (templates/security/login.html.twig)
   Gemeinsames Fundament (Tokens, bg, Chrome, Stage, Hero, Card, .under, Media) → auth-base.css */

  .brand-mark .sep{width:1px; height:18px; background:var(--border-strong);}
  .brand-mark .prod{font-size:13px; font-weight:700; letter-spacing:.2px; color:var(--text);}
  .brand-mark .prod .x{color:var(--brand-pink-2);}

  .card-head{margin-bottom:26px;}
  .card-head .kicker{display:inline-block; font-size:11px; font-weight:600; letter-spacing:1.4px; text-transform:uppercase; color:var(--text-mute); margin-bottom:12px;}
  .card-head h1{margin:0 0 6px; font-size:21px; font-weight:700; letter-spacing:-.3px;}
  .card-head p{margin:0; color:var(--text-dim); font-size:13px; line-height:1.5;}

  .field-label{display:block; font-size:11px; font-weight:600; letter-spacing:.6px; text-transform:uppercase; color:var(--text-mute); margin:0 0 8px;}
  .field{display:flex; align-items:center; gap:10px; background:var(--panel-2); border:1px solid var(--border-strong); border-radius:var(--radius);
    padding:11px 13px; margin-bottom:18px; transition:border-color .13s, box-shadow .13s, background .13s;}
  .field:focus-within{border-color:var(--text-dim); background:var(--bg-2); box-shadow:0 0 0 3px color-mix(in srgb, var(--text) 8%, transparent);}
  .field > svg{width:17px; height:17px; color:var(--text-mute); flex-shrink:0;}
  .field input{flex:1; min-width:0; background:none; border:none; outline:none; color:var(--text); font-size:14px; font-family:inherit;}
  .field input::placeholder{color:var(--text-mute);}
  .field .eye{cursor:pointer; color:var(--text-mute); display:inline-flex;}
  .field .eye:hover{color:var(--text);}

  .row-between{display:flex; align-items:center; justify-content:space-between; margin:2px 0 22px;}
  .check{display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--text-dim); cursor:pointer; user-select:none;}
  .check input{width:15px; height:15px; accent-color:var(--text-dim); cursor:pointer;}
  .link{font-size:12.5px; color:var(--text-dim); text-decoration:none; border-bottom:1px solid color-mix(in srgb,var(--text-dim) 35%,transparent); padding-bottom:1px;}
  .link:hover{color:var(--text); border-color:var(--text-dim);}

  .btn-primary{width:100%; padding:12px 16px; border:none; border-radius:var(--radius); background:var(--text); color:#12151a;
    font-weight:600; font-size:14px; font-family:inherit; cursor:pointer; transition:background .13s, transform .05s;
    display:inline-flex; align-items:center; justify-content:center; gap:9px;}
  .btn-primary:hover{background:#fff;}
  .btn-primary:active{transform:translateY(1px);}
  .btn-primary svg{width:16px; height:16px;}

  .divider{height:1px; background:var(--border); margin:24px 0 16px;}
  .below{text-align:center; font-size:12.5px; color:var(--text-dim);}
  .below a{color:var(--text-dim); text-decoration:none; border-bottom:1px solid color-mix(in srgb,var(--text-dim) 35%,transparent);}
  .below a:hover{color:var(--text); border-color:var(--text-dim);}
