/* ==========================================================================
   WOW24 — sign-in pages (login, forgot / reset password), design B · Vitrina.
   Markup: resources/views/auth/b/*.blade.php · JS: public/js/auth-b.js
   Tokens: site-designs.css (--x1..x8, --t-*, --ink … --paper, --tap)
   Controllers pass hideHeader, so the live header/footer are off; the B header
   still renders (site-designs body-start). Production CSS sets span/p colour +
   16px, i{font-family:Wow24}, body flex — text here is styled explicitly.
   ========================================================================== */

html[data-pdp-design="b"] .ah-section{
    width:100%; align-self:stretch; display:flex; flex-direction:column; flex:1 0 auto;
    margin:0 !important; padding:0 !important; background:var(--paper);
}
html[data-pdp-design="b"] .ah-page{
    --ah-title:clamp(32px, 1.6vw + 22px, 48px);
    --ah-field:#8c9095;          /* input border: 3.2:1 on white */
    --ah-err:#b3261e;
    width:100%; max-width:520px; margin:0 auto; padding:var(--x8) var(--x6) var(--x8);
    box-sizing:border-box; flex:1 0 auto;
    font-family:'Jost',sans-serif; font-size:15px; line-height:1.55; color:var(--ink);
    -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
html[data-pdp-design="b"] .ah-page--split{
    display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 var(--x8); align-items:start; max-width:1080px;
}
html[data-pdp-design="b"] .ah-page *,
html[data-pdp-design="b"] .ah-page *::before,
html[data-pdp-design="b"] .ah-page *::after{ box-sizing:border-box; border-radius:0 !important; }
html[data-pdp-design="b"] .ah-page :is(h1,h2,p,a,span,label,button,input,li,ul,strong){ font-family:'Jost',sans-serif; }
html[data-pdp-design="b"] .ah-page :is(h1,h2,p,ul){ margin:0; padding:0; }
html[data-pdp-design="b"] .ah-page svg{ display:block; flex:0 0 auto; }
html[data-pdp-design="b"] .ah-main{ min-width:0; }

/* ------------------------------------------------------------------ type */
html[data-pdp-design="b"] .ah-page .ah-back{
    display:inline-flex; align-items:center; gap:var(--x2); min-height:var(--tap); margin:calc(var(--x5) * -1) 0 var(--x4);
    color:var(--muted) !important; text-decoration:none !important;
}
html[data-pdp-design="b"] .ah-page .ah-back span{
    font-size:var(--t-sm) !important; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:inherit !important;
}
html[data-pdp-design="b"] .ah-page .ah-back:hover{ color:var(--ink) !important; }
html[data-pdp-design="b"] .ah-page .ah-title{
    font-size:var(--ah-title) !important; font-weight:200 !important; line-height:1.05 !important;
    letter-spacing:-.02em !important; text-transform:none !important; color:var(--ink) !important;
}
html[data-pdp-design="b"] .ah-page .ah-lede{
    margin-top:var(--x4) !important; font-size:var(--t-lg) !important; line-height:1.55 !important; color:var(--ink2) !important;
}
html[data-pdp-design="b"] .ah-page .ah-lede strong{ font-weight:500; color:var(--ink) !important; overflow-wrap:anywhere; }

/* --------------------------------------------------------------- notices */
html[data-pdp-design="b"] .ah-page .ah-note{
    margin-top:var(--x5) !important; padding:var(--x3) var(--x4) !important; border-left:2px solid var(--ink);
    background:var(--surface); font-size:var(--t-base) !important; line-height:1.5; color:var(--ink) !important;
}
html[data-pdp-design="b"] .ah-page .ah-note--err{ border-left-color:var(--ah-err); }
html[data-pdp-design="b"] .ah-page .ah-note p{ font-size:inherit !important; color:inherit !important; }
html[data-pdp-design="b"] .ah-page .ah-note p + p{ margin-top:var(--x1) !important; }

/* ---------------------------------------------------------------- fields */
html[data-pdp-design="b"] .ah-form{ display:flex; flex-direction:column; gap:var(--x5); margin-top:var(--x6); }
html[data-pdp-design="b"] .ah-field{ display:flex; flex-direction:column; min-width:0; }
html[data-pdp-design="b"] .ah-field-top{ display:flex; align-items:baseline; justify-content:space-between; gap:var(--x3); }
html[data-pdp-design="b"] .ah-page .ah-field label{
    display:block; margin:0 0 var(--x2) !important; padding:0 !important;
    font-size:var(--t-xs) !important; font-weight:500 !important; line-height:1.4 !important; letter-spacing:.16em !important;
    text-transform:uppercase !important; color:var(--ink2) !important;
}
html[data-pdp-design="b"] .ah-page .ah-field input{
    display:block; width:100% !important; height:52px !important; margin:0 !important; padding:0 var(--x4) !important;
    border:1px solid var(--ah-field) !important; background:var(--paper) !important; box-shadow:none !important; outline:none;
    font-size:16px !important; line-height:1.4 !important; color:var(--ink) !important;
    transition:border-color .2s ease, box-shadow .2s ease;
}
html[data-pdp-design="b"] .ah-page .ah-field input:hover{ border-color:var(--ink) !important; }
html[data-pdp-design="b"] .ah-page .ah-field input:focus{ border-color:var(--ink) !important; box-shadow:inset 0 0 0 1px var(--ink) !important; }
html[data-pdp-design="b"] .ah-page .ah-field input[aria-invalid="true"]{ border-color:var(--ah-err) !important; }
html[data-pdp-design="b"] .ah-page .ah-hint{ margin-top:var(--x2) !important; font-size:var(--t-sm) !important; color:var(--muted) !important; }

html[data-pdp-design="b"] .ah-pass{ position:relative; }
html[data-pdp-design="b"] .ah-page .ah-pass input{ padding-right:88px !important; }
html[data-pdp-design="b"] .ah-page .ah-pass-toggle{
    position:absolute; top:1px; right:1px; bottom:1px; min-width:80px; margin:0; padding:0 var(--x4);
    border:0; background:transparent; cursor:pointer; -webkit-appearance:none; appearance:none;
    font-size:var(--t-sm) !important; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--ink2);
}
html[data-pdp-design="b"] .ah-page .ah-pass-toggle:hover{ color:var(--ink); text-decoration:underline; text-underline-offset:3px; }

/* checkbox: 20px square, ink when on */
html[data-pdp-design="b"] .ah-page .ah-check{
    position:relative; display:inline-flex; align-items:center; gap:var(--x3); min-height:var(--tap); margin:calc(var(--x3) * -1) 0 !important;
    align-self:flex-start; cursor:pointer; text-transform:none !important; letter-spacing:0 !important;
}
html[data-pdp-design="b"] .ah-check input{ position:absolute; opacity:0; width:20px; height:20px; margin:0; }
html[data-pdp-design="b"] .ah-check-box{
    position:relative; flex:0 0 20px; width:20px; height:20px; border:1px solid var(--ink); background:var(--paper); transition:background-color .15s ease;
}
html[data-pdp-design="b"] .ah-check input:checked + .ah-check-box{ background:var(--ink); }
html[data-pdp-design="b"] .ah-check input:checked + .ah-check-box::after{
    content:""; position:absolute; left:6px; top:2px; width:6px; height:11px;
    border:solid var(--paper); border-width:0 1.5px 1.5px 0; transform:rotate(45deg);
}
html[data-pdp-design="b"] .ah-check input:focus-visible + .ah-check-box{ outline:2px solid var(--ink); outline-offset:2px; }
html[data-pdp-design="b"] .ah-page .ah-check-text{ font-size:var(--t-base) !important; color:var(--ink2) !important; }

/* --------------------------------------------------------------- buttons */
html[data-pdp-design="b"] .ah-page .ah-btn{
    display:flex; align-items:center; justify-content:center; width:100%; min-height:56px; margin:0; padding:0 var(--x5);
    background:var(--ink); border:1px solid var(--ink); color:var(--paper) !important; cursor:pointer; text-decoration:none !important;
    -webkit-appearance:none; appearance:none;
    font-size:var(--t-base) !important; font-weight:500; letter-spacing:.16em; text-transform:uppercase;
    transition:background-color .2s ease, color .2s ease;
}
html[data-pdp-design="b"] .ah-page .ah-btn:hover{ background:var(--paper); color:var(--ink) !important; }
html[data-pdp-design="b"] .ah-page .ah-btn.is-busy{ opacity:.55; cursor:progress; }
html[data-pdp-design="b"] .ah-page .ah-btn--line{ background:transparent; color:var(--ink) !important; }
html[data-pdp-design="b"] .ah-page .ah-btn--line:hover{ background:var(--ink); color:var(--paper) !important; }

html[data-pdp-design="b"] .ah-page .ah-link{
    font-size:var(--t-md) !important; color:var(--ink) !important;
    text-decoration:underline !important; text-underline-offset:4px; text-decoration-thickness:1px; text-decoration-color:var(--rule) !important;
}
html[data-pdp-design="b"] .ah-page .ah-link:hover{ text-decoration-color:var(--ink) !important; }
html[data-pdp-design="b"] .ah-page .ah-link--quiet{ color:var(--ink2) !important; }

/* ------------------------------------------------------ register side panel */
html[data-pdp-design="b"] .ah-side{
    align-self:stretch; display:flex; flex-direction:column; min-width:0;
    padding:var(--x7) var(--x6); background:var(--surface);
}
html[data-pdp-design="b"] .ah-page .ah-side-title{
    font-size:var(--t-2xl) !important; font-weight:300 !important; line-height:1.2 !important; letter-spacing:-.01em;
    text-transform:none !important; color:var(--ink) !important;
}
html[data-pdp-design="b"] .ah-perks{ list-style:none; margin:var(--x5) 0 var(--x6) !important; border-top:1px solid var(--rule); }
html[data-pdp-design="b"] .ah-page .ah-perks li{
    position:relative; margin:0 !important; padding:var(--x3) 0 var(--x3) var(--x6) !important; border-bottom:1px solid var(--rule);
    font-size:var(--t-base) !important; line-height:1.5; color:var(--ink2) !important;
}
html[data-pdp-design="b"] .ah-perks li::before{
    content:""; position:absolute; left:2px; top:calc(var(--x3) + 5px); width:6px; height:11px;
    border:solid var(--ink); border-width:0 1.5px 1.5px 0; transform:rotate(45deg);
}
html[data-pdp-design="b"] .ah-side .ah-btn{ margin-top:auto; }

/* ------------------------------------------------------------------ foot */
html[data-pdp-design="b"] .ah-section .ah-foot{
    margin:0 !important; padding:var(--x5) var(--x6) !important; border-top:1px solid var(--rule); text-align:center;
    font-family:'Jost',sans-serif; font-size:var(--t-sm) !important; color:var(--muted) !important;
}

/* ------------------------------------------------------ tablet / phone */
@media (max-width:991.98px){
    html[data-pdp-design="b"] .ah-page--split{ grid-template-columns:minmax(0,1fr); max-width:560px; row-gap:var(--x7); }
    html[data-pdp-design="b"] .ah-side{ padding:var(--x6) var(--x5); }
}
@media (max-width:767.98px){
    html[data-pdp-design="b"] .ah-page{ padding:var(--x6) var(--x4) var(--x7); }
    html[data-pdp-design="b"] .ah-page .ah-back{ margin-top:calc(var(--x4) * -1); }
    html[data-pdp-design="b"] .ah-page .ah-lede{ font-size:15px !important; }
    html[data-pdp-design="b"] .ah-side{ margin:0 calc(var(--x4) * -1); padding:var(--x6) var(--x4); }
}

/* ------------------------------------------------------ focus · motion */
html[data-pdp-design="b"] .ah-page :is(a, button):focus-visible{ outline:2px solid var(--ink) !important; outline-offset:2px; }
@media (prefers-reduced-motion:reduce){
    html[data-pdp-design="b"] .ah-page *{ transition:none !important; }
}

/* ------------------------------------------------------------ register */
html[data-pdp-design="b"] .ah-page .ah-check--wrap{ align-items:flex-start; margin:0 !important; min-height:0; }
html[data-pdp-design="b"] .ah-check--wrap .ah-check-box{ margin-top:2px; }
html[data-pdp-design="b"] .ah-check input[aria-invalid="true"] + .ah-check-box{ border-color:var(--ah-err); box-shadow:0 0 0 1px var(--ah-err); }
html[data-pdp-design="b"] .ah-page .ah-check--wrap .ah-check-text{ line-height:1.55; }
html[data-pdp-design="b"] .ah-page .ah-check-text .ah-link{ font-size:inherit !important; color:var(--ink) !important; }
html[data-pdp-design="b"] .ah-page .ah-side-note{ margin:0 0 var(--x3) !important; font-size:var(--t-base) !important; color:var(--ink2) !important; }
html[data-pdp-design="b"] .ah-side .ah-side-note{ margin-top:auto !important; }
html[data-pdp-design="b"] .ah-side .ah-side-note + .ah-btn{ margin-top:0; }

/* touch size for the small "forgot password" link next to the label */
html[data-pdp-design="b"] .ah-page .ah-field-top .ah-link{ display:inline-flex; align-items:center; min-height:40px; margin:-10px 0; }

/* status mark above the title (verify e-mail, account confirmed) */
html[data-pdp-design="b"] .ah-page .ah-mark{
    display:flex; align-items:center; justify-content:center; width:56px; height:56px; margin-bottom:var(--x5); border:1px solid var(--ink); color:var(--ink);
}

/* "Pamiršau slaptažodį" now sits under the password field (keyboard order) */
html[data-pdp-design="b"] .ah-page .ah-forgot{ display:inline-flex; align-items:center; min-height:40px; margin:var(--x1) 0 calc(var(--x2) * -1); }
/* focus line on sign-in fields: site-designs.css removes every field's focus shadow with a very
   specific selector (to kill Bootstrap's glow), which also removed this 2px line — so it is
   stated here with a more specific selector (QA 2026-09-22: focus was only a 1px colour change) */
html[data-pdp-design="b"] .ah-page .ah-field :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=submit]):not([type=button])):is(:focus, :focus-visible){
    border-color:var(--ink) !important; box-shadow:inset 0 0 0 1px var(--ink) !important;
}