/* AngellVoicy Auth — layout integrado, fonte única de estilos */
#screen-auth.auth-screen {
  display:flex; flex-direction:column; position:relative; isolation:isolate;
  width:100%; height:100dvh; min-height:0; overflow:hidden;
  background:#260b25 url('/assets/login.png?v=20261027-layout4') center center / 100% 100% no-repeat;
}
#screen-auth * { box-sizing:border-box; }
#screen-auth .auth-hero {
    background: transparent; position:relative; flex:0 0 auto; min-height:0; height:clamp(164px,29dvh,260px); padding:calc(12px + var(--safe-top,0px)) 18px 0; background:transparent; overflow:visible; }
#screen-auth .auth-topbar { position:relative; z-index:2; display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
#screen-auth .brand-mini { display:flex; align-items:center; gap:8px; min-width:0; max-width:76%; }
#screen-auth .angellvoicy-logo-mini { width:clamp(38px,10vw,58px); height:clamp(38px,10vw,58px); object-fit:contain; flex-shrink:0; }
#screen-auth .angellvoicy-name-image-mini { width:min(52vw,240px); height:auto; max-height:68px; object-fit:contain; }
#screen-auth .language-pill { display:flex; align-items:center; gap:4px; padding:6px 8px; border:1px solid #ffffff20; border-radius:999px; background:#280d2abf; color:#fff; font-size:10px; white-space:nowrap; }
#screen-auth .hero-content { position:relative; z-index:1; margin:clamp(13px,2.4dvh,28px) 0 0 1px; max-width:75%; }
#screen-auth .hero-eyebrow { display:block; color:#e6d9e9; font-size:clamp(8px,1.35dvh,12px); font-weight:750; letter-spacing:clamp(2px,.5vw,4px); margin-bottom:clamp(8px,1.4dvh,14px); }
#screen-auth .hero-content h2 { margin:0; font-size:clamp(25px,5.9vw,43px); line-height:1.05; letter-spacing:-1.2px; color:#fff; font-weight:850; text-shadow:0 1px 4px #19081955; }
#screen-auth .hero-content h2 span { color:#f443a0; }
#screen-auth .hero-content > p, #screen-auth .hero-features, #screen-auth .hero-orb, #screen-auth .hero-wave { display:none; }
#screen-auth .auth-panel { position:relative; z-index:2; display:flex; flex-direction:column; justify-content:flex-start; flex:1 1 auto; min-height:0; width:100%; max-width:480px; margin:0 auto; padding:clamp(8px,1.5dvh,14px) 19px calc(10px + var(--safe-bottom,0px)); border:0; border-radius:0; background:transparent; box-shadow:none; }
#screen-auth .auth-tabs { flex:0 0 auto; display:grid; grid-template-columns:1fr 1fr; gap:4px; padding:4px; margin:0 0 clamp(15px,2.5dvh,25px); border:1px solid #b57da25c; border-radius:22px; background:#1b091ac9; }
#screen-auth .auth-tab { position:relative; min-height:clamp(41px,6.2dvh,55px); padding:0 6px; border-radius:18px; color:#e9d9e9; background:transparent; font-size:clamp(13px,2.2dvh,16px); font-weight:750; }
#screen-auth .auth-tab-active { color:#fff; background:linear-gradient(105deg,#f04499,#ab79ed); }
#screen-auth .auth-tab-active::after { display:none; }
#screen-auth .auth-form { display:none; min-height:0; }
#screen-auth .auth-form-active { display:block; }
#screen-auth .form-message { display:none; }
#screen-auth .form-message.show { display:block; margin:0 0 7px; padding:7px 9px; border-radius:9px; font-size:12px; }
#screen-auth .form-message.error { color:#ffd3dd; background:#a0203850; }
#screen-auth .form-message.success { color:#baf4d2; background:#217b4b50; }
#screen-auth .input-group { display:block; margin:0 0 clamp(11px,2dvh,18px); }
#screen-auth .input-label { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
#screen-auth .input-shell { display:flex; align-items:center; min-height:clamp(46px,7.2dvh,64px); padding:0 13px; border:1px solid #ae719b7d; border-radius:18px; background:#ffffff09; transition:border-color .2s, background .2s; }
#screen-auth .input-shell:focus-within { border-color:#f75bac; background:#ffffff12; }
#screen-auth .input-icon { flex:0 0 29px; width:29px; color:#f2b9db; font-size:19px; }
#screen-auth .input-shell input { flex:1; min-width:0; width:100%; height:clamp(44px,7dvh,62px); padding:0; border:0; outline:0; color:white; background:transparent; font-size:16px; }
#screen-auth .input-shell input::placeholder { color:#b39aad; opacity:1; }
#screen-auth .password-toggle { flex:0 0 36px; height:36px; background:transparent; color:#eac3dd; cursor:pointer; font-size:19px; }
#screen-auth .auth-options { display:flex; align-items:center; margin:0 0 clamp(12px,2dvh,19px); }
#screen-auth .remember-option { display:flex; align-items:center; gap:9px; color:#fff; font-size:13px; }
#screen-auth .remember-option input { position:absolute; opacity:0; pointer-events:none; }
#screen-auth .custom-checkbox { position:relative; display:block; width:22px; height:22px; border:1px solid #ad7597; border-radius:6px; background:#ffffff18; }
#screen-auth .remember-option input:checked + .custom-checkbox { background:#ee4199; border-color:#ee4199; }
#screen-auth .remember-option input:checked + .custom-checkbox::after { content:'✓'; position:absolute; inset:0; display:grid; place-items:center; color:#fff; font-weight:800; }
#screen-auth .primary-button { display:flex; align-items:center; justify-content:center; gap:12px; width:100%; min-height:clamp(46px,7.5dvh,64px); margin:0; padding:0 16px; border:0; border-radius:19px; background:linear-gradient(100deg,#f0439d,#ad7ff2 55%,#76c6fa); box-shadow:none; color:white; font-size:clamp(16px,2.5dvh,20px); font-weight:800; cursor:pointer; }
#screen-auth .button-arrow { font-size:24px; }
#screen-auth .google-auth-section { flex:0 0 auto; margin:clamp(14px,2.6dvh,23px) 0 0; }
#screen-auth .google-auth-divider { display:flex; align-items:center; gap:10px; margin:0 0 11px; color:#e5d3e4; font-size:12px; white-space:nowrap; }
#screen-auth .google-auth-divider::before, #screen-auth .google-auth-divider::after { content:''; height:1px; background:#ad7b9c70; flex:1; }
#screen-auth .google-signin-button { display:flex; justify-content:center; width:100%; min-height:40px; overflow:hidden; }
#screen-auth .google-signin-button iframe { max-width:100%; }
#screen-auth .google-auth-message { margin:5px 0 0; color:#ffc2df; font-size:11px; text-align:center; }
#screen-auth .google-auth-message:empty { display:none; }
#screen-auth .auth-footer { flex:0 0 auto; max-width:360px; margin:clamp(12px,2.2dvh,22px) auto 0; color:#e4cfe0; text-align:center; font-size:11px; line-height:1.4; }
/* Cadastro: quatro campos, mesmas proporções, densidade maior */
#screen-auth .auth-panel:has(#register-form.auth-form-active) .auth-tabs { margin-bottom:9px; }
#screen-auth #register-form .input-group { margin-bottom:8px; }
#screen-auth #register-form .input-shell { min-height:clamp(39px,6dvh,52px); }
#screen-auth #register-form .input-shell input { height:clamp(37px,5.8dvh,50px); }
#screen-auth .auth-panel:has(#register-form.auth-form-active) .google-auth-section { margin-top:9px; }
#screen-auth .auth-panel:has(#register-form.auth-form-active) .auth-footer { margin-top:7px; }
@media (min-width:700px) {
  #screen-auth.auth-screen { background-size:cover; background-position:center; }
  #screen-auth .auth-hero { height:clamp(190px,32dvh,330px); }
  #screen-auth .auth-panel { max-width:480px; }
}
@media (max-height:720px) and (max-width:699px) {
  #screen-auth .auth-hero { height:clamp(135px,27dvh,192px); }
  #screen-auth .hero-content { margin-top:10px; }
  #screen-auth .hero-eyebrow { margin-bottom:5px; }
  #screen-auth .auth-panel { padding-top:5px; }
  #screen-auth .auth-tabs { margin-bottom:11px; }
  #screen-auth .input-group { margin-bottom:9px; }
  #screen-auth .google-auth-section { margin-top:10px; }
  #screen-auth .auth-footer { margin-top:8px; }
}
/* Acessibilidade: com teclado ou telas extremamente baixas, campos nunca ficam inacessíveis */
@media (max-height:540px) {
  #screen-auth.auth-screen { overflow-x:hidden; overflow-y:auto; }
  #screen-auth .auth-hero { height:112px; }
  #screen-auth .auth-panel { flex:0 0 auto; padding-bottom:18px; }
}


/* Cabeçalho transparente: utiliza o fundo principal login.png */
#screen-auth .auth-hero,
#screen-auth .auth-topbar {
    background: transparent;
    background-image: none;
    box-shadow: none;
}

/* ANGELLVOICY: TOPO SEM CAMADA */

/* Remove fundos, degradês e filtros do cabeçalho */
#screen-auth .auth-hero,
#screen-auth .auth-topbar,
#screen-auth .hero-content {
    background: none !important;
    background-image: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* Remove camadas decorativas que cobrem a imagem */
#screen-auth .auth-hero::before,
#screen-auth .auth-hero::after,
#screen-auth .auth-topbar::before,
#screen-auth .auth-topbar::after {
    content: none !important;
    display: none !important;
}

/* Preserva logo e textos */
#screen-auth .auth-topbar,
#screen-auth .hero-content {
    position: relative;
    z-index: 2;
}

/* ANGELLVOICY AJUSTE FINO DO TOPO */

@media (max-width: 699px) {

    /* Não alterar a altura do cabeçalho */
    #screen-auth .auth-hero {
        overflow: visible;
    }

    /* Aumentar e deslocar a foto */
    #screen-auth .angellvoicy-logo-mini {
        transform: translateX(5%);
        scale: 1.12;
        transform-origin: center;
    }

    /* Aumentar o nome sem deslocar a foto */
    #screen-auth .angellvoicy-name-image-mini {
        scale: 1.10;
        transform-origin: left center;
    }

    /* Descer levemente o slogan e o título */
    #screen-auth .hero-content {
        transform: translateY(4%);
    }
}

/* ANGELLVOICY ACABAMENTO FINAL DOS BOTOES */

/* Botões principais: rosa e roxo mais intensos */
#screen-auth .primary-button {
    background: linear-gradient(
        105deg,
        #f02c91 0%,
        #d43bca 48%,
        #9251e9 100%
    ) !important;
    color: #ffffff;
    border: 1px solid rgba(255, 180, 240, 0.24);
    border-radius: 18px;
    box-shadow: 0 5px 18px rgba(175, 38, 151, 0.16);
}

/* Contêiner do botão Google */
#screen-auth .google-signin-button {
    width: 100%;
    max-width: 100%;
    border-radius: 18px;
    overflow: hidden;
}

/* Arredondamento do conteúdo incorporado pelo Google */
#screen-auth .google-signin-button iframe {
    display: block;
    max-width: 100%;
    border-radius: 18px !important;
    overflow: hidden;
}

/* Ocultar login durante a validacao da sessao */
#screen-auth.auth-screen:not(.screen-active) {
    display: none !important;
}