/* ============================================================
 * MyAnnita — Login v2  ·  /login/
 * DS v2.0 · fondo #191919, inputs cream #FEF7E7, CTA lima #DAFF02.
 * Scopeado a .mya-login-v2 (clase en el <section>) para no afectar
 * otras páginas que comparten .fr-sign-in-hero.
 * ============================================================ */

.mya-login-v2.fr-sign-in-hero,
section.mya-login-v2.fr-sign-in-hero {
    background-color: #191919 !important;
    color: #FEF7E7;
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

/* ── Inputs cream ──────────────────────────────────────────
 * padding-left:50px MUST match the parent theme's value so
 * the absolute-positioned .fr-sign-logo icon never overlaps
 * the placeholder text. Using shorthand padding:14px 16px
 * would nuke the left padding and push text under the icon.
 * --------------------------------------------------------- */
.mya-login-v2 .form-control,
.mya-login-v2 input[type="text"],
.mya-login-v2 input[type="email"],
.mya-login-v2 input[type="password"] {
    background-color: #FEF7E7 !important;
    color: #191919 !important;
    border: 1px solid rgba(25, 25, 25, 0.15) !important;
    border-radius: 10px !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;
    padding-right: 16px !important;
    padding-left: 50px !important;
    font-size: 15px !important;
    font-family: 'Inter', system-ui, sans-serif !important;
    box-shadow: none !important;
}
.mya-login-v2 input::placeholder {
    color: rgba(25, 25, 25, 0.45) !important;
    opacity: 1;
}
.mya-login-v2 input:focus,
.mya-login-v2 .form-control:focus {
    border-color: #DAFF02 !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(218, 255, 2, 0.15) !important;
}

/* ── Icon fix ──────────────────────────────────────────────
 * Parent theme places .fr-sign-logo (a PNG icon) absolutely
 * at top:18px, left:4% inside .fr-sign-form. On the dark
 * background the icon is barely visible. We tint it to a
 * readable mid-dark tone via CSS filter — no HTML changes.
 * --------------------------------------------------------- */
.mya-login-v2 .fr-sign-form .fr-sign-logo img {
    filter: brightness(0) saturate(100%) opacity(0.45) !important;
}

/* Placeholder color — parent theme.css sets color:#999 on
   .fr-sign-form .form-control::placeholder. On the cream
   (#FEF7E7) background #999 is too faint. Override here. */
.mya-login-v2 .fr-sign-form .form-control::placeholder {
    color: rgba(25, 25, 25, 0.45) !important;
}

/* ── CTA primario lima ───────────────────────────────────── */
.mya-login-v2 .btn-theme,
.mya-login-v2 #signin-btn,
.mya-login-v2 #forget_btn,
.mya-login-v2 a.btn-theme,
.mya-login-v2 button[type="button"].btn-theme {
    background-color: #DAFF02 !important;
    background-image: none !important;
    color: #191919 !important;
    border: none !important;
    border-radius: 10px !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    padding: 14px 24px !important;
}

/* ── Tipografía ─────────────────────────────────────────── */
.mya-login-v2 h1, .mya-login-v2 h2, .mya-login-v2 h3,
.mya-login-v2 .fs-title, .mya-login-v2 .multistep-title {
    color: #FEF7E7 !important;
    font-family: 'Hanken Grotesk', system-ui, sans-serif !important;
    font-weight: 900 !important;
}
.mya-login-v2 p,
.mya-login-v2 span,
.mya-login-v2 label,
.mya-login-v2 a:not(.btn-theme) {
    color: rgba(254, 247, 231, 0.82) !important;
}
.mya-login-v2 a:not(.btn-theme):hover { color: #DAFF02 !important; }

/* ── Checkbox "mantener sesión" ─────────────────────────── */
.mya-login-v2 input[type="checkbox"] {
    accent-color: #DAFF02 !important;
}

/* ── Password eye-toggle icon ───────────────────────────── */
.mya-login-v2 .fr-sign-form .field-icon {
    color: rgba(25, 25, 25, 0.45) !important;
}

/* ── Divisores / líneas ─────────────────────────────────── */
.mya-login-v2 hr { border-color: rgba(255, 255, 255, 0.07) !important; }