/* ODEM 33.6.27 — Patch de consolidação
   Ajustes visuais dos módulos alterados; nenhuma regra de negócio. */

/* Relatório Diário */
body:has(.ios-shell):not(.odem-tv-mode) .rel-layout-v2{display:block!important;max-width:none!important}
body:has(.ios-shell):not(.odem-tv-mode) .rel-primary-kpis{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:14px 0 10px;
}
body:has(.ios-shell):not(.odem-tv-mode) .rel-primary-kpis .rel-kpi{
  min-height:112px;padding:18px;border:1px solid var(--border);border-radius:16px;background:var(--surface);
  display:flex;flex-direction:column;justify-content:center;gap:6px;box-shadow:var(--shadow-sm);
}
body:has(.ios-shell):not(.odem-tv-mode) .rel-primary-kpis .rel-kpi span{font-size:11px;color:var(--text-2);font-weight:700}
body:has(.ios-shell):not(.odem-tv-mode) .rel-primary-kpis .rel-kpi b{font-size:clamp(20px,2.1vw,30px);line-height:1.05;color:var(--text);font-variant-numeric:tabular-nums}
body:has(.ios-shell):not(.odem-tv-mode) .rel-primary-kpis .rel-kpi small{font-size:10px;color:var(--text-3)}
body:has(.ios-shell):not(.odem-tv-mode) .rel-support-strip{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 0 14px;
}
body:has(.ios-shell):not(.odem-tv-mode) .rel-support-strip>div{
  display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;
  border:1px solid var(--border);border-radius:12px;background:color-mix(in srgb,var(--surface) 84%,var(--bg));
}
body:has(.ios-shell):not(.odem-tv-mode) .rel-support-strip span{font-size:10px;color:var(--text-2)}
body:has(.ios-shell):not(.odem-tv-mode) .rel-support-strip b{font-size:13px;color:var(--text);font-variant-numeric:tabular-nums}
body:has(.ios-shell):not(.odem-tv-mode) .rel-section{margin-top:12px;padding:16px!important}
body:has(.ios-shell):not(.odem-tv-mode) .rel-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px}
body:has(.ios-shell):not(.odem-tv-mode) .rel-section-head h3{margin:2px 0 0;font-size:15px}
body:has(.ios-shell):not(.odem-tv-mode) .rel-section-head>small{font-size:10px;color:var(--text-3);white-space:nowrap}
body:has(.ios-shell):not(.odem-tv-mode) .rel-eyebrow{font-size:9px;letter-spacing:.08em;font-weight:800;color:var(--text-3)}
body:has(.ios-shell):not(.odem-tv-mode) .rel-rep-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
body:has(.ios-shell):not(.odem-tv-mode) .rel-rep-grid>div{display:grid;gap:4px;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2)}
body:has(.ios-shell):not(.odem-tv-mode) .rel-rep-grid b{font-size:11px}.rel-rep-grid span{font-size:10px;color:var(--text-2)}
body:has(.ios-shell):not(.odem-tv-mode) .rel-rep-grid strong{font-size:14px;font-variant-numeric:tabular-nums}
body:has(.ios-shell):not(.odem-tv-mode) .rel-orders{display:grid;gap:7px}
body:has(.ios-shell):not(.odem-tv-mode) .rel-order{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 12px;border:1px solid var(--border);border-radius:11px;background:var(--surface-2)}
body:has(.ios-shell):not(.odem-tv-mode) .rel-order-main{min-width:0;display:grid;gap:2px}.rel-order-main b{font-size:11px}.rel-order-main span,.rel-order-main small{font-size:10px;color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body:has(.ios-shell):not(.odem-tv-mode) .rel-order-side{display:flex;align-items:center;gap:12px;white-space:nowrap}.rel-order-side strong{font-size:13px;font-variant-numeric:tabular-nums}
body:has(.ios-shell):not(.odem-tv-mode) .rel-timeline{display:grid;gap:0}
body:has(.ios-shell):not(.odem-tv-mode) .rel-timeline-item{display:grid;grid-template-columns:46px 12px minmax(0,1fr);gap:8px;align-items:start;min-height:42px}
body:has(.ios-shell):not(.odem-tv-mode) .rel-timeline-item time{font-size:9px;color:var(--text-3);padding-top:2px;font-variant-numeric:tabular-nums}
body:has(.ios-shell):not(.odem-tv-mode) .rel-timeline-item i{width:7px;height:7px;margin-top:4px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 14%,transparent);position:relative}
body:has(.ios-shell):not(.odem-tv-mode) .rel-timeline-item i:after{content:"";position:absolute;top:10px;left:3px;width:1px;height:32px;background:var(--border)}
body:has(.ios-shell):not(.odem-tv-mode) .rel-timeline-item:last-child i:after{display:none}
body:has(.ios-shell):not(.odem-tv-mode) .rel-timeline-item>div{display:grid;gap:1px;padding-bottom:9px}.rel-timeline-item b{font-size:10px}.rel-timeline-item span{font-size:10px;color:var(--text-2)}
body:has(.ios-shell):not(.odem-tv-mode) .rel-history-collapsible{position:static!important;max-height:none!important;overflow:visible!important;margin-top:12px;padding:0!important}
body:has(.ios-shell):not(.odem-tv-mode) .rel-history-collapsible>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;padding:14px 16px}
body:has(.ios-shell):not(.odem-tv-mode) .rel-history-collapsible>summary::-webkit-details-marker{display:none}
body:has(.ios-shell):not(.odem-tv-mode) .rel-history-collapsible>summary>div{display:grid;gap:2px}.rel-history-collapsible>summary strong{font-size:12px}.rel-history-collapsible>summary small,.rel-history-collapsible>summary>span{font-size:10px;color:var(--text-3)}
body:has(.ios-shell):not(.odem-tv-mode) .rel-history-collapsible[open]>summary{border-bottom:1px solid var(--border)}
body:has(.ios-shell):not(.odem-tv-mode) .rel-history-collapsible #rel-historico{padding:8px 10px 12px;display:grid;gap:5px}

/* Painel de Varejo — tooltip real sem alterar o gráfico */
.vr-evolution .ind-day{position:relative}
.vr-chart-tooltip{position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%) translateY(4px);z-index:8;min-width:132px;padding:8px 10px;border:1px solid var(--border);border-radius:10px;background:var(--surface);box-shadow:var(--shadow-md);display:grid;gap:2px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s ease,transform .12s ease;text-align:left}
.vr-chart-tooltip b{font-size:10px;color:var(--text)}.vr-chart-tooltip em{font-size:12px;font-style:normal;font-weight:800;color:var(--text)}.vr-chart-tooltip small{font-size:9px;color:var(--text-3)}
.vr-evolution .ind-day:hover .vr-chart-tooltip,.vr-evolution .ind-day:focus-within .vr-chart-tooltip{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}

/* Usuários — separação visual de conta e acessos */
.cfgx-account-edit-block,.cfgx-access-edit-block{padding:15px;border:1px solid var(--border);border-radius:15px;background:var(--surface);display:grid;gap:13px}
.cfgx-access-edit-block.is-locked{background:color-mix(in srgb,var(--surface-2) 72%,var(--surface))}
.cfgx-inline-save{display:flex;justify-content:flex-end;padding-top:2px}
.cfgx-perms-disabled{opacity:.58;pointer-events:none}

@media(max-width:760px){
  body:has(.ios-shell):not(.odem-tv-mode) .rel-primary-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  body:has(.ios-shell):not(.odem-tv-mode) .rel-primary-kpis .rel-kpi{min-height:94px;padding:13px}
  body:has(.ios-shell):not(.odem-tv-mode) .rel-support-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  body:has(.ios-shell):not(.odem-tv-mode) .rel-rep-grid{grid-template-columns:1fr}
  body:has(.ios-shell):not(.odem-tv-mode) .rel-order{align-items:flex-start;flex-direction:column;gap:8px}.rel-order-side{width:100%;justify-content:space-between}
  body:has(.ios-shell):not(.odem-tv-mode) .rel-section-head{flex-direction:column;gap:3px}.rel-section-head>small{white-space:normal}
  .vr-chart-tooltip{min-width:118px}
  .cfgx-inline-save .btn{width:100%}
}

/* ODEM 33.6.31 — Histórico completo como último quadro do Varejo/Comercial */
body:has(.ios-shell):not(.odem-tv-mode) .vr-history-panel{padding:20px!important;border-radius:18px!important}
body:has(.ios-shell):not(.odem-tv-mode) .vr-history-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 0 14px}
body:has(.ios-shell):not(.odem-tv-mode) .vr-history-summary>span{display:grid;gap:3px;padding:10px 12px;border:1px solid var(--border);border-radius:11px;background:var(--surface-2)}
body:has(.ios-shell):not(.odem-tv-mode) .vr-history-summary small{font-size:9px;color:var(--text-3)}
body:has(.ios-shell):not(.odem-tv-mode) .vr-history-summary strong{font-size:12px;color:var(--text);font-variant-numeric:tabular-nums}
body:has(.ios-shell):not(.odem-tv-mode) .vr-history-table{max-height:560px;overflow:auto;overscroll-behavior:contain}
body:has(.ios-shell):not(.odem-tv-mode) .vr-history-table thead{position:sticky;top:0;z-index:2}
body:has(.ios-shell):not(.odem-tv-mode) .vr-history-table table{min-width:980px}
body:has(.ios-shell):not(.odem-tv-mode) .vr-history-table td:first-child,body:has(.ios-shell):not(.odem-tv-mode) .vr-history-table td:nth-child(2){white-space:nowrap}
body.odem-tv-mode .vr-history-panel{display:none!important}
@media(max-width:760px){
  body:has(.ios-shell):not(.odem-tv-mode) .vr-history-panel{padding:14px!important;border-radius:15px!important}
  body:has(.ios-shell):not(.odem-tv-mode) .vr-history-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  body:has(.ios-shell):not(.odem-tv-mode) .vr-history-mobile{max-height:620px;overflow:auto;overscroll-behavior:contain;padding-right:2px}
}

/* 33.6.33 — notificações globais */
.toast-stack{position:fixed;right:18px;top:78px;z-index:1200;display:grid;gap:10px;width:min(360px,calc(100vw - 28px));pointer-events:none}
.toast-card{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:start;padding:13px 12px;border:1px solid var(--border);border-radius:14px;background:var(--surface-raised,var(--surface));color:var(--text);box-shadow:var(--shadow-lg);opacity:0;transform:translateY(-8px);transition:opacity .18s ease,transform .18s ease;pointer-events:auto}
.toast-card.show{opacity:1;transform:none}.toast-card-icon{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-weight:800;background:var(--surface-2);color:var(--text-2)}
.toast-success .toast-card-icon{background:rgba(24,153,103,.12);color:#15845d}.toast-warning .toast-card-icon{background:rgba(214,145,24,.14);color:#a66d00}.toast-error .toast-card-icon{background:rgba(192,51,68,.12);color:var(--brand)}
.toast-card-copy{display:grid;gap:3px;min-width:0}.toast-card-copy strong{font-size:13px}.toast-card-copy span{font-size:12px;line-height:1.4;color:var(--text-2);overflow-wrap:anywhere}.toast-card-close{border:0;background:transparent;color:var(--text-3);font-size:20px;line-height:1;cursor:pointer;padding:2px 4px}.toast-card-actions{grid-column:2/4}.toast-card-action{border:0;background:transparent;color:var(--brand-ink);font-weight:700;font-size:12px;padding:2px 0;cursor:pointer}
@media(max-width:700px){.toast-stack{top:auto;right:14px;bottom:calc(14px + env(safe-area-inset-bottom,0px));width:calc(100vw - 28px)}.toast-card{border-radius:13px}}

/* 33.6.33 — Configurações pessoais simples */
.cfgx-personal-only{max-width:900px;margin:0 auto}.cfgx-personal-only .cfgx-account-grid{grid-template-columns:minmax(0,1fr);gap:18px}.cfgx-personal-only .cfgx-profile-card,.cfgx-personal-only .cfgx-password{max-width:760px;width:100%;margin-inline:auto}.cfgx-personal-hero{margin-bottom:18px}.cfgx-personal-hero>div:last-child{display:none}
@media(max-width:700px){.cfgx-personal-only{padding-bottom:24px}.cfgx-personal-only .cfgx-account-card,.cfgx-personal-only .cfgx-password{padding:16px}.cfgx-personal-only .cfgx-profile-card{grid-template-columns:72px minmax(0,1fr)}.cfgx-personal-only .cfgx-profile-avatar{width:72px;height:72px}}

/* 33.6.33 — Login fixo: a viewport inteira é a tela, nunca uma página rolável. */
html:has(body.login-active),body.login-active{height:100%;overflow:hidden;overscroll-behavior:none}
body.login-active #app{height:100dvh;max-height:100dvh;overflow:hidden}
body.login-active .login-page{height:100dvh;min-height:0;max-height:100dvh;overflow:hidden;box-sizing:border-box}
body.login-active .login-brand-panel,body.login-active .login-access-panel{min-height:0;max-height:100%;overflow:hidden}
body.login-active .login-card-wrap{max-height:100%;min-height:0}
@media(max-width:760px){
  body.login-active .login-page{padding:max(8px,env(safe-area-inset-top,0px)) 8px max(8px,env(safe-area-inset-bottom,0px));gap:0}
  body.login-active .login-brand-panel{flex:0 0 auto;max-height:28%;padding:16px 18px;border-radius:18px 18px 0 0}
  body.login-active .login-brand-mark{width:30px;height:30px;margin-bottom:8px}
  body.login-active .login-brand-kicker{font-size:9px;padding:4px 8px}
  body.login-active .login-brand-panel h1{font-size:clamp(20px,5vw,28px);margin:9px 0 0;line-height:1.02}
  body.login-active .login-access-panel{flex:1 1 auto;padding:56px 18px 14px;border-radius:0 0 18px 18px;min-height:0}
  body.login-active .login-access-top{top:10px;right:12px}
  body.login-active .login-theme-btn{min-height:36px;padding:6px 10px}
  body.login-active .login-card-wrap{width:min(100%,390px)}
  body.login-active .login-logo-wrap{margin-bottom:12px}
  body.login-active .login-logo-wrap img{width:112px;max-height:46px}
  body.login-active .login-heading{margin-bottom:14px}
  body.login-active .login-heading h2{font-size:24px}
  body.login-active .login-heading p{margin-top:5px;font-size:12px}
  body.login-active .login-card .field{margin-bottom:11px}
  body.login-active .login-card .field-label{margin-bottom:5px}
  body.login-active .login-help-row{margin-top:10px}
  body.login-active .login-footer-note{margin-top:10px}
  body.login-active .login-install-card{margin-top:10px;padding:10px}
}
@media(max-width:760px) and (max-height:740px){
  body.login-active .login-brand-panel{display:none}
  body.login-active .login-access-panel{border:1px solid var(--login-line);border-radius:18px;padding-top:54px}
}
@media(max-height:570px){
  body.login-active .login-logo-wrap,body.login-active .login-heading p,body.login-active .login-footer-note,body.login-active .login-install-card{display:none!important}
  body.login-active .login-heading{margin-bottom:8px}
  body.login-active .login-heading h2{font-size:21px}
  body.login-active .login-card .field{margin-bottom:7px}
  body.login-active .login-help-row{margin-top:6px}
  body.login-active .login-access-panel{padding-top:48px;padding-bottom:8px}
}

/* 33.6.33 — Varejo executivo: faturamento, ranking e fluxo com leitura mais dinâmica */
.vr-executive-row{grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);align-items:stretch}.vr-executive-row>.vr-evolution,.vr-executive-row>.vr-panel{height:100%;margin:0}.vr-flow-full{margin-top:16px}.vr-flow-full .vr-flow-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 22px}.vr-kpis .vr-kpi strong{font-variant-numeric:tabular-nums}.vr-rep-meta span:first-child{font-weight:700}.vr-evolution summary{cursor:pointer}.vr-evolution[open] summary{border-bottom:1px solid var(--border)}
.rel-today-chip{align-self:center;display:grid;gap:2px;padding:10px 14px;border:1px solid var(--border);border-radius:12px;background:var(--surface);text-align:right}.rel-today-chip span{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-3);font-weight:700}.rel-today-chip strong{font-size:13px}
@media(max-width:1050px){.vr-executive-row{grid-template-columns:1fr}.vr-flow-full .vr-flow-list{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.vr-flow-full .vr-flow-list{grid-template-columns:1fr}.vr-kpis{grid-template-columns:1fr 1fr}.rel-today-chip{width:100%;text-align:left}.rel-seller-today .rel-toolbar{gap:12px}}
@media(max-width:460px){.vr-kpis{grid-template-columns:1fr}.vr-rep-meta{display:grid;grid-template-columns:1fr 1fr}.vr-rep-meta span:last-child{grid-column:1/-1}}

/* 33.6.38 — Login com arte ODEM fornecida pelo usuário.
   Desktop: arte integral na área visual. Mobile: arte vira fundo responsivo,
   mantendo o formulário sempre dentro da viewport e sem rolagem. */
body.login-active .login-page{
  position:relative;
  grid-template-columns:minmax(0,1.18fr) minmax(360px,.82fr);
  padding:clamp(10px,1.6vw,24px);
  background:#f1f2f5;
}
body[data-theme="dark"].login-active .login-page{background:#0d1015}
body.login-active .login-brand-art-panel{
  padding:clamp(14px,1.6vw,24px)!important;
  border-radius:24px 0 0 24px;
  background:linear-gradient(180deg,#c80f2d 0%,#a70923 100%);
  box-shadow:0 20px 56px rgba(83,8,24,.16);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
body.login-active .login-brand-art-panel::before,
body.login-active .login-brand-art-panel::after,
body.login-active .login-brand-glow{display:none!important}
body.login-active .login-brand-art{
  display:block;
  width:100%;height:100%;min-width:0;min-height:0;
  object-fit:contain;
  object-position:center center;
  border-radius:inherit;
}
body.login-active .login-access-panel{
  border-radius:0 24px 24px 0;
  padding-top:72px;
}
@media (min-width:761px) and (max-aspect-ratio:4/3){
  body.login-active .login-page{grid-template-columns:minmax(0,1fr) minmax(350px,.9fr)}
  body.login-active .login-brand-art{object-position:center center}
}
@media (max-width:760px){
  html:has(body.login-active),body.login-active,body.login-active #app{height:100%;min-height:0;overflow:hidden}
  body.login-active .login-page{
    display:flex;
    align-items:flex-end;
    justify-content:center;
    height:100dvh;min-height:0;max-height:100dvh;
    padding:max(8px,env(safe-area-inset-top,0px)) 8px max(8px,env(safe-area-inset-bottom,0px));
    overflow:hidden;
    background:#9f0922;
  }
  body.login-active .login-brand-art-panel{
    display:flex!important;
    position:absolute;
    inset:0;
    width:100%;height:100%;max-height:none;
    border-radius:0;
    opacity:1;
    z-index:0;
    padding:10px!important;
    align-items:flex-start;
    justify-content:center;
    background:linear-gradient(180deg,#c80f2d 0%,#99081f 100%);
  }
  body.login-active .login-brand-art{
    width:100%;height:100%;
    object-fit:contain;
    object-position:center top;
    border-radius:0;
  }
  body.login-active .login-brand-art-panel::after{
    content:""!important;
    display:block!important;
    position:absolute;inset:0;z-index:1;
    background:linear-gradient(to bottom,rgba(83,0,18,.04) 0%,rgba(83,0,18,.12) 26%,rgba(18,19,25,.40) 100%);
    pointer-events:none;
  }
  body.login-active .login-access-panel{
    position:relative;z-index:2;
    flex:0 1 auto;
    width:min(100%,470px);
    max-height:calc(100dvh - max(16px,env(safe-area-inset-top,0px)) - max(16px,env(safe-area-inset-bottom,0px)));
    overflow:hidden;
    padding:54px 18px 14px;
    border:1px solid rgba(255,255,255,.35)!important;
    border-radius:20px!important;
    background:color-mix(in srgb,var(--login-panel) 94%,transparent);
    box-shadow:0 20px 50px rgba(18,8,12,.28);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }
  body.login-active .login-access-top{top:10px;right:12px}
  body.login-active .login-card-wrap{width:min(100%,390px);max-height:100%;overflow:hidden}
  body.login-active .login-logo-wrap{margin-bottom:10px}
  body.login-active .login-logo-wrap img{width:108px;max-height:42px}
  body.login-active .login-heading{margin-bottom:12px}
  body.login-active .login-heading h2{font-size:23px}
  body.login-active .login-heading p{margin-top:4px;font-size:12px}
  body.login-active .login-card .field{margin-bottom:10px}
  body.login-active .login-card .field-label{margin-bottom:5px}
  body.login-active .login-help-row{margin-top:8px}
  body.login-active .login-footer-note{margin-top:8px}
  body.login-active .login-install-card{margin-top:8px;padding:9px}
}
@media (max-width:760px) and (max-height:720px){
  body.login-active .login-access-panel{padding-top:48px;padding-bottom:10px}
  body.login-active .login-logo-wrap{display:none!important}
  body.login-active .login-heading{margin-bottom:8px}
  body.login-active .login-heading p{display:none!important}
  body.login-active .login-card .field{margin-bottom:7px}
  body.login-active .login-help-row{margin-top:6px}
  body.login-active .login-footer-note,
  body.login-active .login-install-card{display:none!important}
}
@media (max-width:760px) and (max-height:560px){
  body.login-active .login-heading .login-eyebrow{display:none}
  body.login-active .login-heading h2{font-size:20px}
  body.login-active .login-access-panel{padding-top:44px}
  body.login-active .login-input{height:42px!important;min-height:42px!important}
  body.login-active .login-submit{min-height:42px;padding:9px 16px}
}


/* 33.6.40 — Refinamento final da tela de login.
   Desktop: painel visual enquadrado em bloco quadrado para preservar a arte.
   Acesso: redução de espaçamentos para manter todo o conteúdo visível, incluindo instalação. */
body.login-active .login-page{
  grid-template-columns:minmax(520px, min(58vw, 900px)) minmax(360px, 1fr);
  align-items:stretch;
  column-gap:0;
}
body.login-active .login-brand-art-panel{
  align-self:stretch;
  justify-self:end;
  height:100%;
  aspect-ratio:1/1;
  width:auto;
  max-width:100%;
  padding:0!important;
  background:#c80f2d;
}
body.login-active .login-brand-art{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}
body.login-active .login-access-panel{
  justify-content:flex-start;
  padding:52px clamp(20px,3vw,44px) 16px;
  overflow:hidden;
}
body.login-active .login-access-top{top:14px;right:16px}
body.login-active .login-card-wrap{width:min(100%,402px)}
body.login-active .login-logo-wrap{margin-bottom:14px}
body.login-active .login-logo-wrap img{width:140px;max-height:58px}
body.login-active .login-heading{margin-bottom:16px}
body.login-active .login-heading h2{font-size:clamp(24px,2.2vw,32px)}
body.login-active .login-heading p{margin-top:8px;font-size:13px}
body.login-active .login-card .field{margin-bottom:14px}
body.login-active .login-card .field-label{margin-bottom:6px}
body.login-active .login-help-row{margin-top:12px;gap:10px}
body.login-active .login-footer-note{margin-top:12px;font-size:10px}
body.login-active .login-install-card{margin-top:12px;padding:12px;gap:10px}
body.login-active .login-install-copy strong{font-size:12px}
body.login-active .login-install-copy span{font-size:11px}
@media (min-width:761px) and (max-width:1280px){
  body.login-active .login-page{grid-template-columns:minmax(430px, min(54vw, 760px)) minmax(330px, 1fr)}
  body.login-active .login-access-panel{padding:48px 22px 14px}
}
@media (min-width:761px) and (max-height:760px){
  body.login-active .login-access-panel{padding-top:44px;padding-bottom:12px}
  body.login-active .login-logo-wrap{margin-bottom:10px}
  body.login-active .login-logo-wrap img{width:126px;max-height:50px}
  body.login-active .login-heading{margin-bottom:12px}
  body.login-active .login-heading p{margin-top:6px;font-size:12px}
  body.login-active .login-card .field{margin-bottom:10px}
  body.login-active .login-help-row{margin-top:8px}
  body.login-active .login-install-card{margin-top:10px;padding:10px}
}
@media (min-width:761px) and (max-height:690px){
  body.login-active .login-footer-note{display:none!important}
  body.login-active .login-install-card{padding:9px;gap:8px}
  body.login-active .login-install-icon img{width:32px;height:32px}
}
@media (max-width:760px){
  body.login-active .login-page{display:grid;grid-template-columns:1fr;align-items:stretch;justify-items:stretch;padding:max(8px,env(safe-area-inset-top,0px)) 8px max(8px,env(safe-area-inset-bottom,0px));}
  body.login-active .login-brand-art-panel{
    position:relative;
    inset:auto;
    width:100%;
    height:auto;
    max-height:min(40dvh,320px);
    aspect-ratio:1/1;
    justify-self:center;
    align-self:start;
    z-index:1;
    border-radius:18px 18px 0 0;
    overflow:hidden;
    background:#c80f2d;
  }
  body.login-active .login-brand-art{width:100%;height:100%;object-fit:cover;object-position:center top}
  body.login-active .login-brand-art-panel::after{background:linear-gradient(to bottom,rgba(83,0,18,.02) 0%,rgba(18,19,25,.10) 100%)}
  body.login-active .login-access-panel{
    position:relative;z-index:2; width:min(100%,470px); max-height:none; overflow:hidden;
    margin:-2px auto 0; border-radius:0 0 20px 20px!important;
    padding:46px 16px 12px; background:var(--login-panel);
    border:1px solid var(--login-line)!important; box-shadow:0 18px 40px rgba(18,8,12,.18);
    backdrop-filter:none; -webkit-backdrop-filter:none;
  }
  body.login-active .login-card-wrap{width:min(100%,390px)}
  body.login-active .login-logo-wrap{margin-bottom:10px}
  body.login-active .login-logo-wrap img{width:112px;max-height:44px}
  body.login-active .login-heading{margin-bottom:10px}
  body.login-active .login-heading h2{font-size:22px}
  body.login-active .login-heading p{font-size:12px;margin-top:4px}
  body.login-active .login-card .field{margin-bottom:10px}
  body.login-active .login-help-row{margin-top:8px}
  body.login-active .login-footer-note{margin-top:8px}
  body.login-active .login-install-card{margin-top:8px;padding:10px}
}
@media (max-width:760px) and (max-height:780px){
  body.login-active .login-brand-art-panel{max-height:min(34dvh,270px)}
}
@media (max-width:760px) and (max-height:700px){
  body.login-active .login-logo-wrap{display:none!important}
  body.login-active .login-heading p, body.login-active .login-footer-note, body.login-active .login-install-card{display:none!important}
  body.login-active .login-access-panel{padding-top:40px;padding-bottom:10px}
}

/* 33.6.42 — Login final dimensionado pela proporção real da arte (2048x1944).
   Desktop: a coluna visual nasce da altura disponível, então a peça não é esticada
   nem ganha sobras laterais. Mobile: peça completa no topo e acesso no restante. */
@media (min-width:761px){
  body.login-active .login-page{
    display:grid!important;
    grid-template-columns:min(56vw,calc((100dvh - 32px) * 1.0535)) minmax(380px,1fr)!important;
    height:100dvh!important;min-height:0!important;max-height:100dvh!important;
    padding:16px!important;overflow:hidden!important;background:var(--login-bg,#f3f4f7)!important;
  }
  body.login-active .login-brand-art-panel{
    width:100%!important;height:100%!important;aspect-ratio:auto!important;padding:0!important;
    border-radius:24px 0 0 24px!important;background:#bd0f2c!important;overflow:hidden!important;
  }
  body.login-active .login-brand-art{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center center!important;border-radius:0!important}
  body.login-active .login-access-panel{
    height:100%!important;min-height:0!important;max-height:none!important;overflow:hidden!important;
    padding:48px clamp(28px,4vw,64px) 16px!important;border-radius:0 24px 24px 0!important;
    align-items:center!important;justify-content:center!important;
  }
  body.login-active .login-card-wrap{width:min(100%,420px)!important;max-height:none!important;overflow:visible!important}
  body.login-active .login-logo-wrap{margin-bottom:14px!important}.login-logo-wrap img{max-height:55px!important}
  body.login-active .login-heading{margin-bottom:15px!important}.login-heading p{margin-top:7px!important}
  body.login-active .login-card .field{margin-bottom:12px!important}.login-help-row{margin-top:10px!important}
  body.login-active .login-install-card{margin-top:10px!important;padding:10px 12px!important}.login-footer-note{margin-top:9px!important}
  body.login-active .login-access-top{top:14px!important;right:16px!important}
}
@media (min-width:761px) and (max-height:680px){
  body.login-active .login-page{grid-template-columns:min(53vw,calc((100dvh - 24px) * 1.0535)) minmax(360px,1fr)!important;padding:12px!important}
  body.login-active .login-access-panel{padding-top:40px!important;padding-bottom:10px!important}
  body.login-active .login-logo-wrap{margin-bottom:8px!important}.login-heading{margin-bottom:10px!important}.login-heading p{display:none!important}
  body.login-active .login-card .field{margin-bottom:8px!important}.login-install-card{margin-top:7px!important;padding:8px 10px!important}.login-footer-note{display:none!important}
}
@media (max-width:760px){
  html:has(body.login-active),body.login-active,body.login-active #app{height:100%;min-height:0;overflow:hidden}
  body.login-active .login-page{display:flex!important;flex-direction:column!important;height:100dvh!important;min-height:0!important;max-height:100dvh!important;padding:8px!important;gap:0!important;overflow:hidden!important;background:var(--login-bg,#f3f4f7)!important}
  body.login-active .login-brand-art-panel{position:relative!important;inset:auto!important;display:block!important;flex:0 0 min(40dvh,calc((100vw - 16px) * .9492))!important;width:100%!important;height:auto!important;max-height:none!important;aspect-ratio:auto!important;padding:0!important;border-radius:18px 18px 0 0!important;background:#bd0f2c!important;overflow:hidden!important;z-index:1!important}
  body.login-active .login-brand-art{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center center!important;border-radius:0!important}
  body.login-active .login-brand-art-panel::after{display:none!important}
  body.login-active .login-access-panel{position:relative!important;z-index:2!important;flex:1 1 auto!important;width:100%!important;min-height:0!important;max-height:none!important;margin:0!important;overflow:hidden!important;padding:42px 16px 10px!important;border:1px solid var(--login-line)!important;border-top:0!important;border-radius:0 0 18px 18px!important;background:var(--login-panel)!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;align-items:flex-start!important}
  body.login-active .login-card-wrap{width:min(100%,400px)!important;max-height:100%!important;overflow:visible!important}.login-access-top{top:8px!important;right:10px!important}
  body.login-active .login-logo-wrap{margin-bottom:7px!important}.login-logo-wrap img{width:104px!important;max-height:38px!important}.login-heading{margin-bottom:8px!important}.login-heading h2{font-size:21px!important}.login-heading p{margin-top:3px!important;font-size:11px!important}.login-card .field{margin-bottom:8px!important}.login-input{height:43px!important;min-height:43px!important}.login-submit{min-height:43px!important}.login-help-row{margin-top:6px!important}.login-install-card{margin-top:6px!important;padding:8px!important}.login-install-copy span{font-size:10px!important}.login-footer-note{margin-top:5px!important;font-size:9px!important}
}
@media (max-width:760px) and (max-height:700px){body.login-active .login-brand-art-panel{flex-basis:min(31dvh,calc((100vw - 16px) * .9492))!important}body.login-active .login-logo-wrap{display:none!important}body.login-active .login-heading p{display:none!important}body.login-active .login-access-panel{padding-top:38px!important}.login-footer-note{display:none!important}}


/* ODEM MOBILE-PARITY-01 — acesso ao guia PWA em navegadores mobile.
   Somente geometria/visibilidade da interface; respeita .hidden definido pelo JS
   quando PWA já está instalado. Desktop e fluxo de autenticacao intactos. */
@media (max-width:760px){
  html:has(body.login-active), body.login-active, body.login-active #app{
    height:auto!important;min-height:100%!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    overscroll-behavior-y:auto!important;
  }
  body.login-active .login-page{
    height:auto!important;min-height:100dvh!important;max-height:none!important;
    overflow:visible!important;
  }
  body.login-active .login-brand-art-panel{
    flex-basis:min(31dvh,calc((100vw - 16px) * .9492))!important;
  }
  body.login-active .login-access-panel{
    flex:0 0 auto!important;min-height:0!important;max-height:none!important;
    overflow:visible!important;
  }
  body.login-active .login-card-wrap{
    max-height:none!important;overflow:visible!important;
  }
  body.login-active .login-install-card:not(.hidden){display:grid!important}
  body.login-active #modal-instalar .modal-box{
    max-height:calc(100dvh - 32px)!important;
    overflow-y:auto!important;overscroll-behavior:contain;
  }
}
