/* ==========================================================================
   rdo-auth-popup.css — Maskoten Auth Booknetic v1.0.0
   Estilos do popup de auth — integrado no tema Maskoten
   Autor: RedOcean <https://redocean.pt>
   ========================================================================== */
:root {
    --rdo-brown        : #7E5B34;
    --rdo-brown-light  : #EFBE86;
    --rdo-orange       : #EF4C24;
    --rdo-orange-h     : #d94320;
    --rdo-ease         : .2s ease;
}

/* Container do popup — ajuste de dimensão */
#popup .container {
    max-width : 52rem;
    padding   : 4rem;
}
@media (max-width: 600px) {
    #popup .container { padding: 3.2rem 2.4rem; width: 95%; max-height: 88vh; overflow-y: auto; }
}

/* Tabs signin / signup */
.rdo-auth-tabs {
    display: flex; border-bottom: 2px solid var(--rdo-brown-light);
    margin-bottom: 2.4rem; gap: 0.4rem;
}
.rdo-auth-tab {
    flex: 1; background: none; border: none;
    border-bottom: 3px solid transparent; margin-bottom: -2px;
    padding: 1rem 0; font-family: "Open Sans", sans-serif;
    font-size: 1.4rem; font-weight: 700; color: var(--rdo-brown-light);
    cursor: pointer; transition: color var(--rdo-ease), border-color var(--rdo-ease);
    text-align: center; text-transform: uppercase; letter-spacing: 0.05em;
}
.rdo-auth-tab--active, .rdo-auth-tab:hover { color: var(--rdo-brown); border-color: var(--rdo-brown); }

/* Painéis */
.rdo-auth-panel { animation: rdo-fade 0.18s ease; }
.rdo-auth-panel[hidden] { display: none; }
@keyframes rdo-fade { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: none; } }

/* Links de switch */
.rdo-auth-switch {
    text-align: center; margin-top: 1.4rem;
    font-family: "Open Sans", sans-serif; font-size: 1.4rem;
    color: var(--rdo-brown); opacity: 0.7;
}
.rdo-auth-switch--sm { margin-top: 0.6rem; }
.rdo-auth-switch__btn {
    background: none; border: none; padding: 0;
    font-family: "Open Sans", sans-serif; font-size: inherit;
    color: var(--rdo-orange); cursor: pointer; font-weight: 700;
    text-decoration: underline; text-decoration-color: transparent;
    transition: text-decoration-color var(--rdo-ease);
}
.rdo-auth-switch__btn:hover { text-decoration-color: var(--rdo-orange); }
.rdo-auth-forgot-intro {
    font-family: "Open Sans", sans-serif; font-size: 1.4rem;
    color: var(--rdo-brown); opacity: 0.8; text-align: center; margin-bottom: 1.6rem;
}

/* Loading — reutiliza .loadinganim do tema */
.rdo-loading { display: flex; align-items: center; justify-content: center; min-height: 80px; }
.rdo-loading .loadinganim { opacity: 1; position: relative; top: auto; left: auto; }

/* Formulários Booknetic */
#popup .rdo-bk-form-wrap { font-family: "Open Sans", sans-serif; font-size: 1.6rem; color: var(--rdo-brown); }
#popup .booknetic_header { display: none; }
#popup .booknetic_form_element { margin-bottom: 1.2rem; }

/* Labels — visually hidden (acessíveis para screen readers, invisíveis visualmente) */
#popup .booknetic_form_element > label,
#popup .booknetic_customer_info > label {
    position: absolute;
    width: 1px !important; height: 1px;
    padding: 0 !important; margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0 !important;
}

/* Inputs — anular !important de booknetic-signin.css / booknetic-signup.css */
body #popup .rdo-bk-form-wrap .booknetic_form_element input[type="text"],
body #popup .rdo-bk-form-wrap .booknetic_form_element input[type="email"],
body #popup .rdo-bk-form-wrap .booknetic_form_element input[type="password"],
body #popup .rdo-bk-form-wrap .booknetic_customer_info input[type="text"],
body #popup .rdo-bk-form-wrap .booknetic_form input[type="text"],
body #popup .rdo-bk-form-wrap .booknetic_form input[type="email"],
body #popup .rdo-bk-form-wrap .booknetic_form input[type="password"] {
    border: 1px solid #7E5B34 !important;
    width: 100% !important;
    -webkit-box-sizing: border-box !important;
    box-sizing: border-box !important;
    padding: 0.8rem 2.2rem !important;
    border-radius: 2.2rem !important;
    background: #ffffff !important;
    color: #7E5B34 !important;
    height: auto !important;
    font-family: "Open Sans", sans-serif !important;
    font-size: 1.6rem !important;
    outline: none !important;
}
body #popup .rdo-bk-form-wrap .booknetic_form_element input:focus,
body #popup .rdo-bk-form-wrap .booknetic_form input:focus {
    box-shadow: 0 0 0 2px rgba(126, 91, 52, 0.15) !important;
    border-color: #7E5B34 !important;
}

/* Password wrapper */
#popup .bkntc-password-input { position: relative; }
#popup .bkntc-password-input input[type="password"] { padding-right: 5rem; }
#popup .bkntc-toggle-password-visibility {
    position: absolute; right: 1.6rem; top: 50%; transform: translateY(-50%);
    background: none; border: none; cursor: pointer; padding: 0.4rem;
    color: var(--rdo-brown-light); display: flex; align-items: center;
    transition: color var(--rdo-ease); line-height: 0;
}
#popup .bkntc-toggle-password-visibility:hover { color: var(--rdo-brown); }

/* Botão primário Booknetic — estilo .btn.orange do tema */
#popup .booknetic_btn_primary,
#popup button.booknetic_login_btn,
#popup button.booknetic_signup_btn,
#popup button.booknetic_forgot_password_btn {
    display: inline-block !important;
    line-height: 1 !important;
    padding: 1.2rem 2.2rem !important;
    border-radius: 2.2rem !important;
    border: solid 1px transparent !important;
    background: var(--rdo-orange) !important;
    color: #ffffff !important;
    font-family: "Open Sans", sans-serif !important;
    font-size: 1.6rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    text-align: center !important;
    cursor: pointer !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-top: 1.6rem !important;
    transition: background var(--rdo-ease) !important;
    min-height: 4.4rem !important;
    height: unset !important;
}
#popup button.booknetic_login_btn:hover,
#popup button.booknetic_signup_btn:hover,
#popup button.booknetic_forgot_password_btn:hover {
    background: var(--rdo-orange-h) !important;
}

/* Link forgot — estilo secundário */
#popup .booknetic_forgot_password[href] {
    display: none; /* ocultar — temos o nosso tab */
}

/* Ocultar elementos desnecessários */
#popup .account_not_activated_step { display: none; }
#popup .booknetic_footer { display: none !important; }
#popup .booknetic_resend_activation {
    display: flex !important; align-items: center; justify-content: center;
    gap: 0.6rem; font-size: 1.4rem; color: var(--rdo-brown); opacity: 0.8; margin-top: 1.6rem;
}
#popup .booknetic_resend_activation a { color: var(--rdo-orange); font-weight: 700; text-decoration: none; }
#popup .booknetic_check_your_email {
    font-size: 1.4rem; color: var(--rdo-brown); text-align: center; line-height: 1.6; margin: 1.6rem 0;
}
#popup .booknetic_email_success { display: none; }

/* Reset dos wrappers Booknetic — anular !important de booknetic-signin.css e booknetic-signup.css */
body #popup .rdo-bk-form-wrap .booknetic_signup,
body #popup .rdo-bk-form-wrap .booknetic_login,
body #popup .rdo-bk-form-wrap .booknetic_forgot_password {
    width: auto !important;
    background-color: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    height: auto !important;
}

/* Reset padding do .booknetic_form */
body #popup .rdo-bk-form-wrap .booknetic_form {
    padding: 0 !important;
}

/* Remover max-width dos wrappers internos dos campos */
body #popup .rdo-bk-form-wrap .booknetic_form_element > div {
    max-width: unset !important;
}

/* Dois campos lado a lado */
#popup .booknetic_customer_info { flex: 1; min-width: 0; }
#popup .booknetic_form_element[style*="space-between"] { gap: 1.2rem; }

/* Erros */
#popup .booknetic_error_message,
#popup .booknetic_notification.error {
    border: 1.5px solid var(--rdo-orange); color: var(--rdo-orange);
    border-radius: 2.2rem; padding: 0.8rem 2.2rem;
    font-size: 1.4rem; margin-bottom: 1.2rem; background: #fff0ee;
}

/* Acessibilidade */
#popup button:focus-visible, #popup a:focus-visible, #popup input:focus-visible {
    outline: 2px solid var(--rdo-brown); outline-offset: 2px;
}


/* ============================================================
   Flash notices (since 1.4.37)
   Rendered server-side immediately after <body> via wp_body_open.
   ============================================================ */
.rdo-flash {
    margin: 0;
    padding: 1.2rem 2rem;
    text-align: center;
    font-family: "Open Sans", sans-serif;
    font-size: 1.5rem;
    line-height: 1.4;
    border-bottom: 1px solid rgba(0,0,0,0.05);
}
.rdo-flash--info    { background: #FBF6EE; color: #7E5B34; }
.rdo-flash--warning { background: #FFF4D6; color: #7A5A00; }
.rdo-flash--error   { background: #FCE8E6; color: #8B1F1A; }
.rdo-flash--success { background: #E6F4EA; color: #1B5E20; }

/* Reset-password mode (since 1.5.29).
   Triggered by data-rdo-mode="reset" on #popup when the user lands with a
   ?reset_token=. Hides the static popup title and the signin/signup tabs
   so the popup focuses exclusively on the reset step, and styles the
   alternative title injected inside the forgot panel. */
#popup[data-rdo-mode="reset"] .title.big,
#popup[data-rdo-mode="reset"] .rdo-auth-tabs,
#popup[data-rdo-mode="reset"] [data-rdo-panel="forgot"] > .rdo-auth-switch:not(.rdo-auth-reset-cancel) {
    display: none;
}
.rdo-auth-reset-title {
    font-family: "DynaPuff", system-ui, sans-serif;
    font-size: 2.4rem; color: var(--rdo-brown);
    text-align: center; margin: 0 0 2.4rem;
}
.rdo-auth-reset-cancel {
    margin-top: 1.4rem;
}

/* ============================================================
   Reset-password — SaaS tenant variant (bookneticsaas_*) and
   staff variant (.rdo-staff-reset). The popup form for tenant
   reset is rendered with the SaaS plugin's class names so the
   bundled JS can drive submit + step transitions; staff uses
   our own class names because the submit handler is theme-side.
   Both need the same visual chrome as the customer variant.
   ============================================================ */

/* Hide visible labels — keep accessible to screen readers */
#popup .bookneticsaas_form_element > label,
#popup .rdo-staff-reset .booknetic_form_element > label {
    position: absolute;
    width: 1px !important; height: 1px;
    padding: 0 !important; margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0 !important;
}

/* Form element spacing parity with customer variant */
#popup .bookneticsaas_form_element { margin-bottom: 1.2rem; }

/* Inputs — same look as customer */
body #popup .rdo-bk-form-wrap .bookneticsaas_form_element input[type="text"],
body #popup .rdo-bk-form-wrap .bookneticsaas_form_element input[type="email"],
body #popup .rdo-bk-form-wrap .bookneticsaas_form_element input[type="password"],
body #popup .rdo-bk-form-wrap .bookneticsaas_form input[type="text"],
body #popup .rdo-bk-form-wrap .bookneticsaas_form input[type="email"],
body #popup .rdo-bk-form-wrap .bookneticsaas_form input[type="password"],
body #popup .rdo-bk-form-wrap .rdo-staff-reset input[type="password"] {
    border: 1px solid #7E5B34 !important;
    width: 100% !important;
    -webkit-box-sizing: border-box !important;
    box-sizing: border-box !important;
    padding: 0.8rem 2.2rem !important;
    border-radius: 2.2rem !important;
    background: #ffffff !important;
    color: #7E5B34 !important;
    height: auto !important;
    font-family: "Open Sans", sans-serif !important;
    font-size: 1.6rem !important;
    outline: none !important;
}
body #popup .rdo-bk-form-wrap .bookneticsaas_form_element input:focus,
body #popup .rdo-bk-form-wrap .bookneticsaas_form input:focus,
body #popup .rdo-bk-form-wrap .rdo-staff-reset input:focus {
    box-shadow: 0 0 0 2px rgba(126, 91, 52, 0.15) !important;
    border-color: #7E5B34 !important;
}

/* Form padding reset (SaaS plugin defaults add inner padding) */
body #popup .rdo-bk-form-wrap .bookneticsaas_form { padding: 0 !important; }

/* SaaS-specific decorative containers — hide */
#popup .bookneticsaas_header { display: none; }
#popup .bookneticsaas_footer { display: none !important; }
#popup .bookneticsaas_email_success { display: none; }
#popup .bookneticsaas_forgot_password_completed,
#popup .bookneticsaas_forgot_password_completed > img { display: none; }
#popup .bookneticsaas_check_your_email {
    font-size: 1.4rem; color: var(--rdo-brown); text-align: center; line-height: 1.6; margin: 1.6rem 0;
}

/* Primary buttons — apply customer styles to SaaS + staff equivalents.
   .booknetic_btn_primary already covers both customer and staff (staff
   markup keeps the class). bookneticsaas_btn_primary is unique to SaaS. */
#popup .bookneticsaas_btn_primary,
#popup button.bookneticsaas_forgot_password_btn,
#popup button.bookneticsaas_complete_forgot_password_btn {
    display: inline-block !important;
    line-height: 1 !important;
    padding: 1.2rem 2.2rem !important;
    border-radius: 2.2rem !important;
    border: solid 1px transparent !important;
    background: var(--rdo-orange) !important;
    color: #ffffff !important;
    font-family: "Open Sans", sans-serif !important;
    font-size: 1.6rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    text-align: center !important;
    cursor: pointer !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-top: 1.6rem !important;
    transition: background var(--rdo-ease) !important;
    min-height: 4.4rem !important;
    height: unset !important;
}
#popup .bookneticsaas_btn_primary:hover,
#popup button.bookneticsaas_forgot_password_btn:hover,
#popup button.bookneticsaas_complete_forgot_password_btn:hover {
    background: var(--rdo-orange-h) !important;
}

/* Step 2 "success" — same congratulations layout for all three */
#popup .bookneticsaas_forgot_password_completed_title,
#popup .rdo-staff-reset__completed-title {
    font-size: 1.8rem; font-weight: 700; color: var(--rdo-brown);
    text-align: center; margin-top: 1.6rem;
}
#popup .bookneticsaas_forgot_password_completed_subtitle,
#popup .rdo-staff-reset__completed-text {
    font-size: 1.4rem; color: var(--rdo-brown); opacity: 0.8;
    text-align: center; margin-top: 0.8rem; line-height: 1.6;
}