/*
4293	test_0. CSS — „polish final”
admin2	Site Wide Header	30 September 2025 at 06:52		css	10
*/

/* === CUCO – Modal polish FINAL (0–5,6,7, hover) === */
:root{
    --cuco-bg:#0F1422; --cuco-surface:#121829; --cuco-border:#23283B;
    --cuco-text:#E9EDF3; --cuco-dim:#AAB2C3; --cuco-gold:#D6B46C; --cuco-alert:#ff4d4f;
}

/* fereastra + overlay */
.cuco-modal{position:fixed; inset:0; display:none; z-index:9999;}
.cuco-modal[aria-hidden="false"]{display:block;}
.cuco-modal__overlay{position:absolute; inset:0; background:rgba(0,0,0,.55); backdrop-filter:saturate(120%) blur(2px);}

/* 1 & 3 & 5) card centrat, spațiu pentru X, dimensiune constantă */
.cuco-modal__card{
    position:relative; margin:0 auto; top:50%; transform:translateY(-50%);
    width:min(620px,94vw);
    background:var(--cuco-bg); color:var(--cuco-text);
    border:1px solid var(--cuco-border); border-radius:18px;
    box-shadow:0 24px 70px rgba(0,0,0,.5);
    padding:56px 28px 22px; /* loc pentru X sus */
}

/* 0) X – mai mare și centrat perfect */
.cuco-modal__close{
    position:absolute; top:12px; right:12px; width:40px; height:40px;
    display:grid; place-items:center; padding:0; line-height:1; font-size:22px; /* X mai mare */
    border-radius:999px; background:rgba(0,0,0,.38); color:var(--cuco-gold);
    border:1px solid rgba(214,180,108,.45); box-shadow:0 8px 20px rgba(0,0,0,.25);
    cursor:pointer;
}
.cuco-modal__close:hover{ filter:brightness(1.06); transform:translateY(-1px); }

/* Taburi: activ = fundal auriu (2) */
.cuco-tabs{display:flex; gap:12px; margin:4px 0 16px;}
.cuco-tab{
    flex:1; padding:14px 12px; border-radius:12px; cursor:pointer; font-weight:800;
    background:var(--cuco-surface); color:var(--cuco-text);
    border:1px dashed rgba(214,180,108,.45); letter-spacing:.2px;
}
.cuco-tab.is-active{
    background:var(--cuco-gold); color:#111; outline:1px solid var(--cuco-gold);
}

/* Panouri: aceeași „înălțime vizuală” pentru consistență (1) */
.cuco-panels{min-height:360px;}
.cuco-panel{display:none;}
.cuco-panel.is-active{display:grid; grid-template-columns:1fr; grid-auto-rows:auto; gap:10px;}
.cuco-panel label{display:flex; flex-direction:column; gap:8px; margin:6px 0;}
.cuco-panel span{font-size:13px; color:var(--cuco-dim);}
.req{color:var(--cuco-alert);}

/* Inputs */
.cuco-panel input[type="text"],
.cuco-panel input[type="email"],
.cuco-panel input[type="password"]{
    width:100%; padding:14px 16px; border-radius:12px;
    background:#0B1020; color:var(--cuco-text); border:1px solid #2A3148; line-height:1.2;
}
.cuco-panel input:focus{outline:1px solid var(--cuco-gold); box-shadow:0 0 0 2px rgba(214,180,108,.15);}
label.error input{border-color:var(--cuco-alert);}

/* 2 & 6) Checkbox și text pe aceeași linie, perfect vizibil + accent golden */
.cuco-check{
    display:flex; flex-direction:row; align-items:center; gap:10px;
    margin:8px 0 4px; color:var(--cuco-text); font-size:14px;
}
.cuco-check input[type="checkbox"]{
    margin:0; width:18px; height:18px; accent-color:var(--cuco-gold);
}

/* 4) Butoane jos pe aceeași orizontală (vizual) + hover frumos (4) */
.cuco-panel button[type="submit"]{
    margin-top:8px; padding:14px 20px; border:none; border-radius:14px;
    background:var(--cuco-gold); color:#111; font-weight:800; width:100%;
    box-shadow:0 10px 24px rgba(214,180,108,.18); cursor:pointer; transition:.15s ease;
}
.cuvo-panel button[type="submit"]:hover,
.cuco-panel button[type="submit"]:hover{
    transform:translateY(-1px);
    box-shadow:0 14px 30px rgba(214,180,108,.26);
    filter:saturate(105%);
}
.cuco-panel button[type="submit"]:active{ transform:translateY(0); }
.cuco-panel button[type="submit"][disabled]{opacity:.6; cursor:progress;}

/* Mesaje + linkuri */
.cuco-msg{min-height:22px; margin-top:6px; font-size:14px}
.cuco-msg.error{color:#ff7a7a}
.cuco-msg.success{color:#66d38f}
.cuco-link{display:inline-block; margin-top:6px; color:var(--cuco-gold); text-decoration:none}
.cuco-link:hover{text-decoration:underline}

@media (max-width:520px){
    .cuco-modal__card{padding:52px 18px 18px;}
    .cuco-tab{padding:12px 10px;}
}
/* === CUCO – Fix: same height on switch + checkbox left, single line === */
:root{ --cuco-panels-min: 400px; }           /* aceeași înălțime vizuală pentru ambele taburi */
.cuco-panels{ min-height: var(--cuco-panels-min); }
.cuco-panel{ display: none; }
.cuco-panel.is-active{
    display: grid;
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    gap: 10px;
    justify-items: stretch;                    /* stânga, nu centrat */
}

/* checkbox pe o singură linie, aliniat stânga sub „Parolă” */
.cuco-check{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;               /* stânga */
    gap: 10px;
    margin: 8px 0 4px;
    color: var(--cuco-text, #E9EDF3);
    font-size: 14px;
    justify-self: start;                       /* stânga în grid */
    text-align: left;                          /* previne centrare din moșteniri */
    white-space: nowrap;                       /* o singură linie */
    width: 100%;                               /* ocupă lățimea panoului */
}
.cuco-check input[type="checkbox"]{
    margin: 0;
    width: 18px; height: 18px;
    accent-color: var(--cuco-gold, #D6B46C);
    transform: translateY(1px);
}
.cuco-check{
    display:flex; flex-direction:row; align-items:center;
    justify-content:flex-start; gap:10px; white-space:nowrap;
    justify-self:start; text-align:left; margin:8px 0 4px; color:#E9EDF3; font-size:14px;
}
.cuco-check input[type="checkbox"]{ margin:0; width:18px; height:18px; accent-color:#D6B46C; transform:translateY(1px); }

/* CUCO — Chip + dropdown + welcome toast (dark + gold) */
:root{
    --cu-bg:#0F1422; --cu-surface:#0B1020; --cu-border:#23283B;
    --cu-text:#E9EDF3; --cu-dim:#AAB2C3; --cu-gold:#D6B46C; --cu-red:#ff6b6b;
}

/* CUCO — Post-OTP Onboarding (modal + blur) */
:root{
    --cu-bg:#0F1422; --cu-surface:#0B1020; --cu-border:#23283B;
    --cu-text:#E9EDF3; --cu-dim:#AAB2C3; --cu-gold:#D6B46C;
    --cu-red:#ff6b6b; --cu-green:#78e08f;
}

html.cuco-onb-open body::before{
    content:""; position:fixed; inset:0;
    background:rgba(3,6,14,.40);
    backdrop-filter:saturate(120%) blur(6px);
    z-index:9998;
}

/* container modal */
.cuco-onb{
    position:fixed; inset:0; z-index:9999;
    display:block;
}
.cuco-onb__overlay{ position:absolute; inset:0; }
.cuco-onb__card{
    position:relative; margin:10vh auto 0; max-width:640px;
    background:var(--cu-bg); border:1px solid var(--cu-border);
    border-radius:16px; padding:24px 22px;
    box-shadow:0 30px 90px rgba(0,0,0,.55);
    color:var(--cu-text);
}
.cuco-onb__close{
    position:absolute; right:10px; top:10px;
    width:36px; height:36px; border-radius:50%;
    border:1px solid rgba(214,180,108,.5); color:var(--cu-gold);
    background:transparent; cursor:pointer; font-size:20px; line-height:34px;
}
#cucoOnbTitle{ margin:0 0 6px; font-size:22px; }
.cuco-onb__lead{ margin:0 0 14px; color:var(--cu-dim); }

.cuco-onb__fields{ display:grid; gap:12px; margin:10px 0 4px; }
.cuco-onb__label{ display:block; font-size:14px; }
.cuco-onb__label .req{ color:#ff7; }
.cuco-onb__label input{
    width:100%; margin-top:6px;
    background:#10162A; color:var(--cu-text);
    border:1px solid #1e2540; border-radius:10px; padding:10px 12px;
    outline:none;
}
.cuco-onb__label input:focus{ border-color:#33406a; box-shadow:0 0 0 2px rgba(214,180,108,.15); }

.cuco-onb__actions{ display:flex; gap:12px; margin-top:14px; flex-wrap:wrap; }
.cuco-onb__btn{
    appearance:none; border:none; cursor:pointer; padding:10px 14px;
    border-radius:12px; font-weight:800; letter-spacing:.2px;
}
.cuco-onb__btn--primary{ background:var(--cu-gold); color:#111; box-shadow:0 12px 28px rgba(214,180,108,.20); }
.cuco-onb__btn--primary:hover{ filter:brightness(1.05); }
.cuco-onb__btn--ghost{ background:#1a2137; color:var(--cu-text); border:1px solid #2a3353; }
.cuco-onb__btn--ghost:hover{ background:#20294a; }

.cuco-onb__msg{ margin-top:10px; min-height:18px; color:var(--cu-dim); }
.cuco-onb__msg.is-ok{ color:var(--cu-green); }
.cuco-onb__msg.is-err{ color:var(--cu-red); }

@media (max-width: 720px){
    .cuco-onb__card{ margin:8vh 14px 0; padding:20px 16px; }
}

/* CUCO — Martor discret în header */
.cuco-hello{
    margin-left:12px; font-size:14px; color:#E9ECF4; opacity:.9; white-space:nowrap;
}
@media (max-width:768px){ .cuco-hello{ display:none; } }

/* ======== CUCO — Onboarding modal: centrare & vizibilitate (CORECTAT) ======== */
:root{ --cu-bg:#0F1422; --cu-border:#23283B; --cu-text:#E9EDF3; --cu-dim:#AAB2C3; --cu-gold:#D6B46C; }

html.cuco-onb-open body::before{
    content:""; position:fixed; inset:0; z-index:9998;
    background:rgba(3,6,14,.40); backdrop-filter:saturate(120%) blur(6px);
}

/* card centrat fix + înălțime minimă (nu mai “turtește” X-ul) */
.cuco-onb{ position:fixed; inset:0; z-index:9999; }
.cuco-onb__overlay{ position:absolute; inset:0; }
.cuco-onb__card{
    position:fixed; top:50%; left:50%; transform:translate(-50%,-50%);
    width:min(640px, calc(100vw - 28px));
    min-height:560px;                              /* <- important: păstrează înălțime ca Pop-up 1 */
    background:var(--cu-bg); border:1px solid var(--cu-border); border-radius:16px;
    padding:26px 22px; box-shadow:0 30px 90px rgba(0,0,0,.55); color:var(--cu-text);
    display:flex; flex-direction:column;
}
/* X rotund, centrat prin flex — nu se mai turtiește */
.cuco-onb__close{
    position:absolute; right:12px; top:12px; width:40px; height:40px; border-radius:50%;
    border:1px solid rgba(214,180,108,.55); color:var(--cu-gold);
    background:rgba(0,0,0,.15); cursor:pointer; font-size:20px; line-height:1;
    display:flex; align-items:center; justify-content:center;
}
.cuco-onb__close:hover{ background:rgba(214,180,108,.10); }

/* label & input vizibile */
.cuco-onb__label{ display:block; font-size:14px; color:var(--cu-text); }
.cuco-onb__label .req{ color:#ffdd77; }
.cuco-onb__label input{
    width:100%; margin-top:6px; background:#10162A; color:var(--cu-text);
    border:1px solid #1e2540; border-radius:10px; padding:10px 12px; outline:none;
}
.cuco-onb__label input::placeholder{ color:#c9d0e0; opacity:.75; }
.cuco-onb__label input:focus{ border-color:#33406a; box-shadow:0 0 0 2px rgba(214,180,108,.18); }

#cucoOnbTitle{ margin:0 0 8px; font-size:22px; }
.cuco-onb__lead{ margin:0 0 14px; color:var(--cu-dim); }
.cuco-onb__fields{ display:grid; gap:12px; margin:12px 0 4px; }

/* acțiuni jos, împinse de conținut */
.cuco-onb__actions{ display:flex; gap:12px; margin-top:auto; flex-wrap:wrap; }
.cuco-onb__btn{ appearance:none; border:none; cursor:pointer; padding:10px 14px; border-radius:12px; font-weight:800; }
.cuco-onb__btn--primary{ background:var(--cu-gold); color:#111; box-shadow:0 12px 28px rgba(214,180,108,.20); }
.cuco-onb__btn--primary:hover{ filter:brightness(1.05); }
.cuco-onb__btn--ghost{ background:#1a2137; color:var(--cu-text); border:1px solid #2a3353; }
.cuco-onb__btn--ghost:hover{ background:#20294a; }

.cuco-onb__msg{ margin-top:10px; min-height:18px; color:var(--cu-dim); }
.cuco-onb__msg.is-ok{ color:#78e08f; } .cuco-onb__msg.is-err{ color:#ff6b6b; }

@media (max-width:720px){
    .cuco-onb__card{ width:calc(100vw - 24px); min-height:520px; padding:22px 16px; }
    .cuco-onb__close{ width:36px; height:36px; font-size:18px; }
}
/* =========================================================================== */

/* CUCO — header badge vizibil pe fond închis */
.cuco-hello{
    display:inline-block;
    margin-left:12px;
    padding-left:12px;
    border-left:1px solid rgba(255,255,255,.12);
    font-size:14px;
    line-height:1;
    color:#ffffff;                  /* alb FORTAT pe dark */
    text-shadow:0 1px 0 rgba(0,0,0,.35);
    white-space:nowrap;
    z-index: 999;                   /* peste meniuri */
}
.cuco-hello a{ color:#F3D07A; text-decoration:none; border-bottom:1px dotted rgba(243,208,122,.5); }
.cuco-hello a:hover{ color:#ffd980; border-bottom-color:#ffd980; }

/* ultim fallback: vizibil fix sus-dreapta */
.cuco-hello--fixed{
    position:fixed; right:16px; top:10px;
    background:rgba(0,0,0,.35);
    padding:6px 10px; border-radius:10px;
    backdrop-filter: blur(4px);
}

/* pe mobile ascundem badge-ul ca să nu aglomerăm headerul */
@media (max-width: 768px){
    .cuco-hello{ display:none; }
}
/* === CUCO — Hotfix consolidate (final) === */

/* Checkbox + label: o singură linie, stânga, override dubluri */
#cucoAuthModal .cuco-check{
    display:flex !important; align-items:center !important; gap:10px !important;
    white-space:nowrap !important; justify-content:flex-start !important;
    margin:8px 0 4px !important; color:#E9EDF3 !important; font-size:14px !important;
}
#cucoAuthModal .cuco-check input[type="checkbox"]{
    margin:0 !important; width:18px !important; height:18px !important;
    accent-color:#D6B46C !important; transform:translateY(1px) !important;
}

/* Popup 2 (Onboarding) – dimensiuni premium & "X" corect */
.cuco-onb__card{ max-width:600px !important; min-height:auto !important; padding:22px 20px !important; }
.cuco-onb__close{ width:40px !important; height:40px !important; display:flex !important; align-items:center !important; justify-content:center !important; line-height:1 !important; }

/* "Ai uitat parola?" ascuns implicit în modal; JS îl va afișa doar când has_password=true */
#cucoAuthModal .cuco-panel a[href*="lost-password"]{ display:none; }
/* === CUCO — Fix X turtit (Onboarding close) === */
.cuco-onb__close{
    box-sizing: border-box !important;
    width: 40px !important;
    height: 40px !important;
    aspect-ratio: 1 / 1 !important;     /* forțează formă perfect rotundă */
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    transform: none !important;
}
.cuco-onb__close > * { pointer-events: none; }
/* CUCO — Onboarding: aerisire între câmpuri și acțiuni */
.cuco-onb__fields { gap: 14px !important; margin-bottom: 8px !important; }
.cuco-onb__actions { margin-top: 16px !important; } /* înlocuiește orice 'margin-top:auto' din stiluri anterioare */
/* === CUCO — Onboarding spacing & alignment (premium) === */
/* Card un pic mai sus pe ecran */
.cuco-onb__card{
    top:48% !important;
    transform:translate(-50%,-48%) !important;
    padding: 24px 20px 16px !important;  /* mai puțin jos */
}

/* Titlu cu spațiu față de marginea de sus */
#cucoOnbTitle{
    margin-top: 6px !important;
    margin-bottom: 10px !important;
}

/* Câmpuri & acțiuni – aerisite și simetrice */
.cuco-onb__fields{ gap: 14px !important; margin-bottom: 10px !important; }
.cuco-onb__actions{ margin-top: 16px !important; }

/* Pe ecrane joase revenim la centrare clasică, ca să nu iasă prea sus */
@media (max-height: 720px){
    .cuco-onb__card{ top:50% !important; transform:translate(-50%,-50%) !important; }
}
/* === CUCO — Onboarding: spacing & alignment (sus/jos simetrie) === */
.cuco-onb__card{
    top:48% !important; transform:translate(-50%,-48%) !important;
    padding: 24px 20px 16px !important;
}
#cucoOnbTitle{ margin-top:6px !important; margin-bottom:10px !important; }
.cuco-onb__fields{ gap:14px !important; margin-bottom:10px !important; }
.cuco-onb__actions{ margin-top:16px !important; }

/* === CUCO — Login modal: aliniază corect "Ține-mă minte" și întinde grid-ul la stânga */
#cucoAuthModal .cuco-panel.is-active{ justify-items: stretch !important; }
#cucoAuthModal .cuco-check{
    display:flex !important; align-items:center !important; gap:10px !important;
    justify-content:flex-start !important; white-space:nowrap !important;
    margin:8px 0 6px !important; text-align:left !important;
}
#cucoAuthModal .cuco-check input[type="checkbox"]{
    width:18px !important; height:18px !important; margin:0 !important; transform:translateY(1px) !important;
}

/* === CUCO — OTP overlay (iframe în aceeași fereastră) === */
#cucoOtpOverlay{ position:fixed; inset:0; z-index:10000; display:none; }
#cucoOtpOverlay.is-open{ display:block; }
#cucoOtpOverlay .cuco-otp__backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.55); backdrop-filter:blur(3px); }
#cucoOtpOverlay .cuco-otp__card{
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    width:min(720px, 96vw); height:min(560px, 86vh);
    background:#0F1422; border:1px solid #23283B; border-radius:16px; box-shadow:0 30px 90px rgba(0,0,0,.55);
    overflow:hidden;
}
#cucoOtpOverlay .cuco-otp__close{
    position:absolute; right:10px; top:10px; width:40px; height:40px; aspect-ratio:1/1;
    display:flex; align-items:center; justify-content:center;
    border-radius:50%; border:1px solid rgba(214,180,108,.5); color:#D6B46C; background:rgba(0,0,0,.15); cursor:pointer; font-size:20px; line-height:1;
    z-index:2;
}
#cucoOtpOverlay .cuco-otp__body{ position:absolute; inset:0; padding:48px 16px 16px; }
#cucoOtpOverlay .cuco-otp__spinner{
    position:absolute; inset:0; display:grid; place-items:center;
}
#cucoOtpOverlay .cuco-otp__spinner::after{
    content:""; width:32px; height:32px; border-radius:50%;
    border:3px solid rgba(214,180,108,.7); border-top-color:transparent; animation:cucoSpin .8s linear infinite;
}
#cucoOtpOverlay .cuco-otp__frame{
    position:absolute; inset:0; width:100%; height:100%; border:0; background:transparent;
}
@keyframes cucoSpin{ to{ transform:rotate(360deg); } }
/* === CUCO — OTP Overlay în Pop-up 1 === */
.cuco-otp{
    position: fixed; inset: 0; z-index: 10000; display: none;
}
.cuco-otp.is-on{ display:block; }
.cuco-otp__overlay{
    position:absolute; inset:0; background:rgba(3,6,14,.50); backdrop-filter: saturate(120%) blur(4px);
}
.cuco-otp__card{
    position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
    width:min(720px, 94vw); max-height:80vh;
    background:#0F1422; border:1px solid #23283B; border-radius:16px;
    box-shadow:0 30px 90px rgba(0,0,0,.55); color:#E9EDF3; display:flex; flex-direction:column;
}
.cuco-otp__close{
    position:absolute; right:10px; top:10px; width:40px; height:40px;
    display:flex; align-items:center; justify-content:center;
    border-radius:50%; border:1px solid rgba(214,180,108,.55); background:rgba(0,0,0,.15);
    color:#D6B46C; font-size:20px; line-height:1; cursor:pointer;
}
.cuco-otp__head{ padding:14px 18px 6px; font-weight:800; }
.cuco-otp__body{ padding:0 18px 18px; display:flex; flex-direction:column; gap:10px; }
.cuco-otp__status{ font-size:13px; color:#AAB2C3; min-height:18px; }
.cuco-otp__frame{
    width:100%; height:60vh; border:0; border-radius:12px; background:#0B1020;
}
@media (max-width:560px){
    .cuco-otp__card{ width:calc(100vw - 20px); }
    .cuco-otp__frame{ height:58vh; }
}
/* === CUCO — Mesaje Register vizibile în Pop-up 1 === */
#cucoAuthModal form[data-action="register"] .cuco-msg{
    margin-top: 6px; min-height: 18px; font-size: 14px; color:#ff6b6b; font-weight:600;
}
/* === CUCO — UI pentru "ochi" la parolă + Lost Password condiționat === */
.cuco-passwrap{ position:relative; }
.cuco-passwrap input[type="password"],
.cuco-passwrap input[type="text"]{ padding-right:44px !important; }
.cuco-pass-eye{
    position:absolute; right:10px; top:50%; transform:translateY(-50%);
    width:32px; height:32px; border-radius:8px; border:1px solid #2a3353;
    background:#161c2f; color:#E9EDF3; cursor:pointer; line-height:1;
    display:flex; align-items:center; justify-content:center;
}
.cuco-pass-eye.is-on{ background:#1f2741; }

/* Ascuns by default (regula veche) */
#cucoAuthModal .cuco-panel a[href*="lost-password"]{ display:none; }
/* Vizibil DOAR când panoul are "has-pass" (setat de JS când câmpul parolă e vizibil) */
#cucoAuthModal .cuco-panel.has-pass a[href*="lost-password"]{ display:inline-block !important; }
/* === CUCO — "Ține-mă minte" ultra-strict stânga (nu mai are voie să se centreze) === */
#cucoAuthModal form[data-action] .cuco-check{
    display:flex !important; align-items:center !important; justify-content:flex-start !important;
    gap:10px !important; text-align:left !important; white-space:nowrap !important;
    margin:8px 0 4px !important;
}
#cucoAuthModal form[data-action] .cuco-check *{ line-height:1.2 !important; }
#cucoAuthModal form[data-action] .cuco-check input[type="checkbox"]{
    margin:0 !important; transform: translateY(1px) !important;
}

/* === CUCO — OTP status: lizibil în overlay === */
.cuco-otp__status{
    font-size:14px !important; color:#cfd6e6 !important;
}

/* === CUCO — Pop-up 2: bullets/labels parolă mai vizibile === */
.cuco-onb__label,
.cuco-onb__lead{
    color:#d9e0f0 !important;
}
.cuco-onb__label input::placeholder{
    color:#c8cfe2 !important; opacity:0.9 !important;
}
