/* Telas de entrar e de senha (ramsons_auth_guard) — CSS da Design UX (Aurora), D-20261016-07.
   Carregado só nessas telas, pela moldura em views/login_templates.xml.
   O web.assets_frontend continua carregado (Bootstrap + estilos do site, por causa do user_switch
   e do medidor de senha): por isso tudo aqui fica sob body.o_rs_login_body, para ganhar deles.
   Tokens = família Creme do Design System (portal.css do Portal das Lojas). Só claro, de propósito.
   P778 (26/10/2026, aprovado pelo Paulo): aparência do Connect+ antigo (view 1968 do Odoo 17) - degradê
   #f5f7fa→#c3cfe2, cartão de vidro, cabeçalho Connect+ | Ramsons, botão pílula vermelho. O vidro sobe de
   .60 para .82 para o link vermelho passar no contraste (4,22 → 4,63 no ponto mais escuro do degradê). */

@font-face { font-family: "RsLogin Chillax"; src: url("../fonts/Chillax-Medium.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "RsLogin Chillax"; src: url("../fonts/Chillax-Bold.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "RsLogin Jakarta"; src: url("../fonts/PlusJakartaSans-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "RsLogin Jakarta"; src: url("../fonts/PlusJakartaSans-SemiBold.ttf") format("truetype"); font-weight: 600; font-display: swap; }
@font-face { font-family: "RsLogin Jakarta"; src: url("../fonts/PlusJakartaSans-Bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }

body.o_rs_login_body {
    --rs-bg: #FAF4EF; --rs-s1: #FFFFFF; --rs-s2: #FBF8F5; --rs-b1: #EADFD3; --rs-b2: #DCCBBB;
    --rs-t1: #1C1614; --rs-t2: #5F534C; --rs-t3: #75665D;
    --rs-red: #D9202D; --rs-red-d: rgba(217, 32, 45, .09); --rs-red-g: rgba(217, 32, 45, .22);
    --rs-gold: #DFA439;
    --rs-ok: #1B7049; --rs-ok-bg: #E4F4EC; --rs-warn: #9A4A06; --rs-warn-bg: #FDF0E1;
    --rs-info: #1F6282; --rs-info-bg: #E3F0F6; --rs-danger: #8E1420; --rs-danger-bg: #FCE8E9;
    --rs-fd: "RsLogin Chillax", "RsLogin Jakarta", "Segoe UI", system-ui, sans-serif;
    --rs-fb: "RsLogin Jakarta", "Segoe UI", system-ui, sans-serif;
    --rs-shl: 0 12px 36px rgba(0, 0, 0, .15);   /* sombra do cartão do Connect+ */
    --rs-grad-a: #f5f7fa; --rs-grad-b: #c3cfe2;  /* degradê do Connect+ (view 1968) */
    --rs-vidro: rgba(255, 255, 255, .82); --rs-vidro-borda: rgba(255, 255, 255, .6);
    --rs-campo-borda: #ced4da; --rs-rotulo: #374151; --rs-linha-fria: #d5dae3;
    --rs-red-escuro: #B8141F;
    --rs-trilho: #dfe3ea;                        /* trilho do medidor de senha (protótipo P778 §4) */
    --rs-focus: 0 0 0 3px rgba(217, 32, 45, .15);

    margin: 0; padding: 0; min-height: 100%; color-scheme: light;   /* padding 0: o hotsite.css do controle_promocao põe 76px no body de todo o site no celular (medido no teste05, P778) */
    background: linear-gradient(135deg, var(--rs-grad-a) 0%, var(--rs-grad-b) 100%) fixed; color: var(--rs-t1);
    font-family: var(--rs-fb); font-size: 15px; line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}
body.o_rs_login_body #wrapwrap,
body.o_rs_login_body #wrapwrap > main { background: transparent; min-height: 100%; }

/* fundo: o degradê do Connect+ (no body) de canto a canto */
body.o_rs_login_body .o_rs_login {
    position: relative; min-height: 100vh; min-height: 100dvh;
    display: flex; align-items: center; justify-content: center;
    padding: 40px max(16px, env(safe-area-inset-right, 0px)) 40px max(16px, env(safe-area-inset-left, 0px));
}

/* o cartão de vidro do Connect+ */
body.o_rs_login_body .o_rs_card {
    position: relative; z-index: 1; width: 100%; max-width: 400px;
    background: var(--rs-vidro); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
    border: 1px solid var(--rs-vidro-borda); border-radius: 16px;
    padding: 30px 28px 26px; box-shadow: var(--rs-shl);
    display: flex; flex-direction: column; align-items: center; text-align: center;
    animation: rsLoginSobe .5s cubic-bezier(.2, .7, .2, 1) both;
}
@keyframes rsLoginSobe { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
body.o_rs_login_body .o_rs_card > form,
body.o_rs_login_body .o_rs_card .oe_login_form,
body.o_rs_login_body .o_rs_card .oe_reset_password_form { width: 100%; max-width: none; margin: 0; text-align: left; }   /* o Odoo põe margin 50px auto nesses forms (medido no teste05, P542) */
/* cabeçalho: Connect+ | Ramsons */
body.o_rs_login_body .o_rs_marca { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; margin: 0 0 14px; }
body.o_rs_login_body .o_rs_connect { font: 700 28px/1 var(--rs-fd); letter-spacing: -.01em; color: var(--rs-t1); }
body.o_rs_login_body .o_rs_connect b { color: var(--rs-red); font-weight: 700; }
body.o_rs_login_body .o_rs_marca_sep { width: 1px; height: 34px; background: var(--rs-linha-fria); }
body.o_rs_login_body .o_rs_logo { height: 40px; width: auto; max-width: 100%; margin: 0; }

body.o_rs_login_body .o_rs_titulo {
    font: 700 21px/1.2 var(--rs-fd); letter-spacing: -.01em; color: var(--rs-t1);
    margin: 0 0 4px; text-align: center; text-wrap: balance;
}
body.o_rs_login_body .o_rs_sub { font: 400 13.5px/1.4 var(--rs-fb); color: var(--rs-t2); margin: 0 0 20px; text-align: center; }
body.o_rs_login_body .o_rs_pergunta { width: 100%; font: 700 13.5px/1.3 var(--rs-fb); color: var(--rs-rotulo); margin: 12px 0 10px; text-align: left; }
/* lema da Ramsons no pé do cartão de entrar */
body.o_rs_login_body .o_rs_lema { font: 700 10.5px/1.3 var(--rs-fb); letter-spacing: .22em; text-transform: uppercase; color: var(--rs-red); margin: 20px 0 0; text-align: center; }
body.o_rs_login_body .o_rs_texto { font-size: 14px; color: var(--rs-t2); margin: 6px 0 18px; text-align: center; }
body.o_rs_login_body .o_rs_texto b { color: var(--rs-t1); overflow-wrap: anywhere; }
body.o_rs_login_body .o_rs_miuda { font-size: 12.5px; color: var(--rs-t3); margin: 16px 0 0; text-align: center; }

/* selo (pedido feito / link inválido) */
body.o_rs_login_body .o_rs_selo { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; margin: 0 0 12px; }
body.o_rs_login_body .o_rs_selo svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
body.o_rs_login_body .o_rs_selo.info { background: var(--rs-info-bg); color: var(--rs-info); }
body.o_rs_login_body .o_rs_selo.warn { background: var(--rs-warn-bg); color: var(--rs-warn); }

/* credencial Ramsons (provedores OAuth) no topo */
body.o_rs_login_body .o_rs_sso { width: 100%; }
body.o_rs_login_body .o_rs_sso .o_login_auth > em { display: none !important; }   /* o "- or -" do Odoo; o .d-block dele é !important */
body.o_rs_login_body .o_rs_sso .o_auth_oauth_providers { display: flex; flex-direction: column; gap: 8px; margin: 0 !important; border: 0; border-radius: 0; }
body.o_rs_login_body .o_rs_sso .o_auth_oauth_providers .list-group-item {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    width: 100%; padding: 13px 16px !important; border: 0; border-radius: 999px !important;
    background: var(--rs-red); color: #fff; font: 700 15px/1.3 var(--rs-fb); text-align: center; text-decoration: none;
    box-shadow: 0 10px 24px var(--rs-red-g); transition: filter .15s, transform .15s;
}
body.o_rs_login_body .o_rs_sso .o_auth_oauth_providers .list-group-item:hover { filter: brightness(.95); transform: translateY(-1px); color: #fff; }
body.o_rs_login_body .o_rs_sso .o_auth_oauth_providers .list-group-item:focus-visible { outline: 3px solid var(--rs-t1); outline-offset: 2px; }
body.o_rs_login_body .o_rs_sso .o_auth_oauth_providers .list-group-item i { color: inherit; }

body.o_rs_login_body .o_rs_divisor {
    display: flex; align-items: center; gap: 10px; width: 100%; margin: 18px 0 8px;
    color: var(--rs-t3); font: 700 11px/1.3 var(--rs-fb); letter-spacing: .06em; text-transform: uppercase;
}
body.o_rs_login_body .o_rs_divisor::before,
body.o_rs_login_body .o_rs_divisor::after { content: ""; flex: 1; height: 1px; background: var(--rs-linha-fria); }

/* campos (classes nativas do Odoo, só dentro do cartão) */
body.o_rs_login_body .o_rs_card .mb-3 { margin-bottom: 12px !important; }
body.o_rs_login_body .o_rs_card .form-label,
body.o_rs_login_body .o_rs_card label {
    display: flex; justify-content: space-between; align-items: baseline; gap: 8px;
    font: 700 12px/1.3 var(--rs-fb); letter-spacing: .02em; color: var(--rs-rotulo); margin: 8px 0 6px;
}
body.o_rs_login_body .o_rs_card .form-control {
    display: block; box-sizing: border-box; width: 100%; height: 46px; padding: 0 14px;
    background: #fff; color: var(--rs-t1); border: 1px solid var(--rs-campo-borda); border-radius: 12px;
    font: 400 15px var(--rs-fb); box-shadow: none; transition: border-color .15s, box-shadow .15s, background .15s;
}
body.o_rs_login_body .o_rs_card .form-control::placeholder { color: #8a8f99; opacity: 1; }
body.o_rs_login_body .o_rs_card .form-control:focus { border-color: var(--rs-red); box-shadow: var(--rs-focus); background: #fff; outline: none; }
body.o_rs_login_body .o_rs_card .form-control[readonly] { background: var(--rs-bg); color: var(--rs-t2); }
body.o_rs_login_body .o_rs_esqueci,
body.o_rs_login_body .o_rs_link {
    color: var(--rs-red); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; letter-spacing: 0;
}
body.o_rs_login_body .o_rs_esqueci { font-size: 11.5px; }
body.o_rs_login_body .o_rs_link { display: inline-block; margin-top: 14px; font-size: 13.5px; padding: 4px; }
body.o_rs_login_body .o_rs_card form .o_rs_link { display: block; width: fit-content; margin: 12px auto 0; }
body.o_rs_login_body .o_rs_esqueci:hover, body.o_rs_login_body .o_rs_link:hover { color: var(--rs-red-escuro); }
body.o_rs_login_body .o_rs_esqueci:focus-visible, body.o_rs_login_body .o_rs_link:focus-visible { outline: 2px solid var(--rs-red); outline-offset: 2px; border-radius: 4px; }

/* regra e medidor da senha */
body.o_rs_login_body .o_rs_regra { font-size: 12.5px; font-weight: 600; color: var(--rs-t2); margin: -2px 0 6px; }
/* o auth_password_policy_signup põe o medidor DENTRO do campo (absolute, 4rem, translateY) e reserva
   padding à direita do #password; no desenho aprovado ele é uma barra abaixo do campo (medido no teste05, P565) */
body.o_rs_login_body .o_rs_card .field-password { position: static; }
body.o_rs_login_body .o_rs_card .field-password #password { padding-right: 14px; }
body.o_rs_login_body .o_rs_card owl-component[name="password_meter"] { display: block; }
body.o_rs_login_body .o_rs_card meter.o_password_meter { position: static; inset: auto; transform: none; inline-size: 100%; }
body.o_rs_login_body .o_rs_card meter { display: block; width: 100%; height: 6px; margin: 8px 0 0; border: 0; border-radius: 3px; background: var(--rs-trilho); }
body.o_rs_login_body .o_rs_card meter::-webkit-meter-bar { background: var(--rs-trilho); border: 0; border-radius: 3px; height: 6px; }
body.o_rs_login_body .o_rs_card meter::-webkit-meter-optimum-value { background: var(--rs-ok); border-radius: 3px; }
body.o_rs_login_body .o_rs_card meter::-webkit-meter-suboptimum-value { background: var(--rs-gold); border-radius: 3px; }
body.o_rs_login_body .o_rs_card meter::-webkit-meter-even-less-good-value { background: var(--rs-red); border-radius: 3px; }
body.o_rs_login_body .o_rs_card meter::-moz-meter-bar { border-radius: 3px; }

/* botões */
body.o_rs_login_body .o_rs_card .oe_login_buttons { padding-top: 6px !important; margin-top: 8px !important; gap: 8px; }
body.o_rs_login_body .o_rs_card .btn-primary {
    display: flex; align-items: center; justify-content: center; width: 100%; min-height: 48px;
    padding: 12px 16px; border: 0; border-radius: 999px;
    background: var(--rs-red); color: #fff; font: 700 15px/1.2 var(--rs-fb); box-shadow: 0 6px 18px rgba(217, 32, 45, .28); text-decoration: none;
    transition: background .15s, transform .15s;
}
body.o_rs_login_body .o_rs_card .btn-primary:hover { background: var(--rs-red-escuro); color: #fff; transform: translateY(-1px); }
/* com o SSO visível o vermelho fica nele: o Entrar vira contorno */
body.o_rs_login_body .o_rs_card .btn-primary.o_rs_contorno { background: #fff; color: var(--rs-t1); border: 1.5px solid var(--rs-campo-borda); box-shadow: none; }
body.o_rs_login_body .o_rs_card .btn-primary.o_rs_contorno:hover { border-color: var(--rs-red); color: var(--rs-red); background: #fff; }
body.o_rs_login_body .o_rs_card .btn-primary:active { transform: translateY(1px); }
body.o_rs_login_body .o_rs_card .btn-primary:focus-visible { outline: 3px solid var(--rs-t1); outline-offset: 2px; }
body.o_rs_login_body .o_rs_card .btn-primary:disabled { opacity: .6; }
body.o_rs_login_body .o_rs_card .o_rs_botao { margin-top: 4px; }
body.o_rs_login_body .o_rs_card .btn-link { color: var(--rs-t2); font-size: 13px; }

/* avisos do Odoo (erro de senha, "Usuário ou senha incorretos.") */
body.o_rs_login_body .o_rs_card .alert {
    width: 100%; margin: 4px 0 12px; padding: 10px 13px; border-radius: 10px;
    font-size: 12.5px; font-weight: 600; text-align: left;
}
body.o_rs_login_body .o_rs_card .alert-danger { background: var(--rs-danger-bg); border: 1px solid #F2B8BC; color: var(--rs-danger); }
body.o_rs_login_body .o_rs_card .alert-success { background: var(--rs-ok-bg); border: 1px solid #B9DFC8; color: var(--rs-ok); }

/* escolha de conta já usada neste navegador (web.user_switch): só cor e fonte, sem mexer na estrutura do Odoo */
body.o_rs_login_body .o_rs_card .o_user_switch,
body.o_rs_login_body .o_rs_card .o_user_switch * { font-family: var(--rs-fb); }
body.o_rs_login_body .o_rs_card .o_user_switch { width: 100%; text-align: left; }
body.o_rs_login_body .o_rs_card .o_user_switch .list-group-item { border-color: var(--rs-b1); }
body.o_rs_login_body .o_rs_card .o_user_switch .list-group-item:hover { background: var(--rs-s2); }

/* celular */
@media (max-width: 480px) {
    body.o_rs_login_body .o_rs_login { align-items: flex-start; padding-top: 24px; padding-bottom: 24px; }
    body.o_rs_login_body .o_rs_card { padding: 24px 20px 22px; border-radius: 16px; }
    body.o_rs_login_body .o_rs_connect { font-size: 24px; }
    body.o_rs_login_body .o_rs_logo { height: 32px; }
    body.o_rs_login_body .o_rs_marca_sep { height: 28px; }
    body.o_rs_login_body .o_rs_sso .o_auth_oauth_providers .list-group-item { font-size: 14px; padding: 12px 10px !important; }
}
@media (prefers-reduced-motion: reduce) {
    body.o_rs_login_body * { transition: none !important; }
    body.o_rs_login_body .o_rs_card { animation: none; }
}
