/* Tema da MAXMIZE para o app do cliente (2026-11-05, layout aprovado em saidas/modelos-2026-11-05/layouts-maxmize).
   Mesma estrutura do app da PUBLI: só trocam cores, fonte, logo e acabamento. Carregado por último (scripts/montar-app-maxmize.js).
   Identidade: preto, creme e dourado, fonte Manrope, cantos de 8 e 12 px, linhas finas. O dourado fica em botões e destaques,
   nunca em texto pequeno (texto dourado usa o tom escuro #7a5a0b). */

.mp-app, .en-pagina, .trava-instalacao, .aceite-termos {
  --preto: #0d0c0a; --dourado: #cba135; --dourado-forte: #7a5a0b;
  --papel: #f4f1ea; --card: #fbf9f4; --linha: #e3ddcf; --ink: #17150f; --ink-soft: #4f493e; --ink-faint: #4f493e; --dark-mut: #b3ab9c;
  --sombra: none;
  font-family: "Manrope", "Segoe UI", system-ui, sans-serif;
}
html, body { background: #f4f1ea; }
body.en-pagina, html:has(body.en-pagina) { background: #0d0c0a; }

/* Títulos: Manrope 600, letras juntas */
.mp-app h1, .mp-app h2, .mp-app h3, .en-pagina h1, .mp-titulo-tela, .mp-numero b, .mp-data b, .mp-mes-nav b, .mp-folha h2, .mp-inativo h1 {
  font-family: "Manrope", "Segoe UI", system-ui, sans-serif; font-weight: 600; letter-spacing: -.03em;
}
.mp-bloco-titulo h2, .mp-aprov-info h3 { font-weight: 700; letter-spacing: -.01em; }
.mp-numero b { font-weight: 600; letter-spacing: -.04em; }

/* Abertura */
#splash { background: #0d0c0a; }
#splash img { width: 170px; }
#splash i::after { background: #cba135; }

/* Entrada (login, criar senha) */
.en-topo { position: relative; overflow: hidden; background: url("email/fundo-topo.png") no-repeat right bottom / 560px auto; }
.en-logo { position: relative; width: min(300px, 70vw); }
.en-btn { background: var(--dourado); color: #17150f; border-radius: 8px; }
.en-campo input { border-radius: 8px; border-color: #9b937f; }
.en-campo input:focus { border-color: #17150f; box-shadow: 0 0 0 3px rgba(203, 161, 53, .35); }
.en-painel h1 { font-size: 24px; }
.en-link a, .en-link button { color: var(--dourado-forte); text-decoration: underline; text-underline-offset: 3px; font-weight: 700; }
.en-painel { border-radius: 20px 20px 0 0; }
@media (min-width: 600px) { .en-painel { border-radius: 20px; } }
.legal-links a { text-underline-offset: 3px; }

/* Topo do app: logo no lugar do texto */
.mp-topo { border-bottom: 0; }
.mp-marca { display: flex; align-items: center; }
.mp-marca img { display: block; height: 19px; width: auto; }

/* Botões: o principal é dourado */
.mp-btn { border-radius: 8px; }
.mp-btn.pri { background: var(--dourado); color: #17150f; }
.mp-btn.sec { background: transparent; color: var(--ink); border: 1px solid #a9a18c; }
.mp-btn.baixar { background: transparent; border: 1px solid var(--dourado); color: var(--ink); }

/* Cartões, selos e avisos: linhas finas, cantos menores */
.mp-card, .mp-doc, .mp-vazio, .mp-folha-conteudo, .mp-opcao-data, .mp-endereco { border-radius: 12px; box-shadow: none; }
.mp-selo { border-radius: 6px; }
.mp-selo::before { display: none; }
.mp-atencao { background: var(--card); border: 1px solid var(--linha); border-left: 3px solid var(--dourado); border-radius: 8px; }
.mp-espera-linha:not([hidden]) ~ .mp-espera-linha:not([hidden]) { border-top-color: var(--linha); }
.mp-aviso-ajuste, .mp-aviso-revisao, .mp-extras { background: var(--creme, #f4f1ea); border: 0; border-left: 3px solid var(--dourado); border-radius: 0 8px 8px 0; }
.mp-extras { border-radius: 12px; border: 1px solid var(--linha); }
.mp-campo-bloco.mp-peso { background: var(--card); border: 1px solid var(--dourado); border-radius: 12px; }
.mp-selo-peso { background: var(--dourado); color: #17150f; border-radius: 6px; }

/* Números do mês: uma faixa só, separada por linhas finas */
.mp-numeros { gap: 0; border: 1px solid var(--linha); border-radius: 12px; background: var(--card); overflow: hidden; }
.mp-numero { border: 0; border-radius: 0; background: none; }
.mp-numero + .mp-numero { border-left: 1px solid var(--linha); }

/* Data ao lado do item */
.mp-data { background: none; border-radius: 0; border-right: 1px solid var(--linha); padding: 2px 12px 2px 0; width: 54px; }
.mp-data span { text-transform: none; letter-spacing: 0; font-size: 12px; }
.mp-semana { text-transform: none; letter-spacing: 0; font-size: 12.5px; }

/* Barra de baixo: clara, com a barra dourada em cima da aba ativa */
.mp-barra { background: var(--card); border-top: 1px solid var(--linha); }
.mp-aba { color: #6e6757; }
.mp-aba.ativa { color: var(--ink); font-weight: 800; }
.mp-contador { color: #17150f; }

/* Folhas de baixo, campos e opções */
.mp-folha { background: var(--papel); border-radius: 20px 20px 0 0; }
.mp-alca { background: #bdb6a2; }
.mp-opcao { border-radius: 8px; border-color: #b7af9b; }
.mp-opcao.on { background: var(--preto); border-color: var(--preto); color: #f2eee6; }
.mp-campo { border-radius: 8px; border-color: #9b937f; }
.mp-campo:focus { border-color: #17150f; box-shadow: 0 0 0 3px rgba(203, 161, 53, .35); }
.mp-opcao-data.on { border-color: var(--ink); background: #fff; }
.mp-opcao-data.on .mp-radio { border-color: var(--ink); }
.mp-opcao-data.on .mp-radio::after { background: var(--dourado); }
.mp-mes-nav button { border-radius: 8px; }
.mp-erro { border-radius: 8px; }

/* Instalação, avisos e termos */
.trava-instalacao button, .aceite-caixa button { border-radius: 8px; }

/* ===== Tema de cartão (login e interior): mesma estrutura da PUBLI, sem os brilhos amarelos, sem pílulas e sem a fonte pesada ===== */
:root { --papel: #f4f1ea; --linha: #e3ddcf; --sombra-card: none; }

/* Login: parte preta com a logo, folha creme lisa */
html.tema-login-card .en-lado { background: #0d0c0a; color: #f2eee6; }
html.tema-login-card .en-lado::before { content: ""; display: block; width: 210px; height: 38px; padding: 0; background: url("logo-maxmize.png") no-repeat left center / contain; }
html.tema-login-card .en-lado::after { background: none; }
html.tema-login-card .en-lado-selo { color: #cba135; }
html.tema-login-card .en-item::before { background: #cba135; }
html.tema-login-card .en-lado h2, html.tema-login-card .en-painel h1 { font-family: "Manrope", "Segoe UI", system-ui, sans-serif; font-weight: 600; letter-spacing: -.03em; }
html.tema-login-card .en-btn { border-radius: 8px; }
html.tema-login-card .en-campo input { border-radius: 8px; }
html.tema-login-card .en-painel { background: #f4f1ea; }
@media (min-width: 900px) {
  html.tema-login-card .en-pagina { background: #f4f1ea; border-radius: 20px; }
  html.tema-login-card .en-painel { background: none; }
}
@media (max-width: 899px) {
  html.tema-login-card .en-lado::before { width: 170px; height: 30px; }
  html.tema-login-card .en-lado { background: #0d0c0a; }
  html.tema-login-card .en-painel { border-radius: 20px 20px 0 0; background: #f4f1ea; }
}

/* Fundo da página no computador: creme liso, sem as "luzes" coloridas */
@media (min-width: 900px) {
  html.tema-login-card, html.tema-login-card:has(body.en-pagina), html.tema-login-card body:not(.en-pagina), html.tema-app-card, html.tema-app-card:has(body.eq-app-fixo), html.tema-app-card body, html.tema-app-card body.eq-app-fixo {
    background: #e4e0d6; background-attachment: scroll;
  }
  html.tema-login-card .en-pagina, html.tema-app-card .mp-app { box-shadow: 0 30px 60px -34px rgba(13, 12, 10, .45), inset 0 0 0 1px rgba(255, 255, 255, .4); }
  html.tema-app-card .mp-app { background: linear-gradient(90deg, #0d0c0a 0, #0d0c0a 292px, transparent 292px), #f4f1ea; border-radius: 20px; }
  html.tema-app-card .mp-topo .mp-marca img { height: 26px; }
  html.tema-app-card .mp-aba.ativa, html.tema-app-card body.eq-menu-topo .mp-aba.ativa { background: #cba135; color: #17150f; }
  html.tema-app-card .mp-aba { border-radius: 8px; }
  html.tema-app-card .eq-sino, html.tema-app-card .eq-avatar { background: #0d0c0a; color: #f2eee6; }
}

/* Interior: cartões, avisos, botões, títulos e campos */
html.tema-app-card .mp-card, html.tema-app-card .mp-doc { border-radius: 12px; box-shadow: none; background: #fbf9f4; border-color: #e3ddcf; }
html.tema-app-card .mp-atencao { background: #fbf9f4; border: 1px solid #e3ddcf; border-left: 3px solid #cba135; border-radius: 8px; box-shadow: none; }
html.tema-app-card .mp-data { background: none; border-radius: 0; }
html.tema-app-card .mp-btn { border-radius: 8px; }
html.tema-app-card .mp-btn.dou { background: #cba135; }
html.tema-app-card .mp-btn.sec { border-color: #a9a18c; }
html.tema-app-card .mp-titulo-tela, html.tema-app-card .mp-app h1 { font-family: "Manrope", "Segoe UI", system-ui, sans-serif; font-weight: 600; font-size: 26px; letter-spacing: -.03em; }
html.tema-app-card .mp-campo, html.tema-app-card .mp-app select, html.tema-app-card .mp-app input { border-radius: 8px; }
html.tema-app-card .mp-selo.neutro { background: #ebe7dc; color: #5b5548; }
html.tema-app-card .mp-card.eq-card-ouro { border-left-color: #cba135; }
html.tema-app-card .eq-sino, html.tema-app-card .eq-avatar { background: #0d0c0a; color: #f2eee6; }
html.tema-app-card .mp-contador { background: #cba135; color: #17150f; }
@media (max-width: 899px) {
  html.tema-app-card .mp-app { background: #0d0c0a; }
  html.tema-app-card #mp-telas { background: #f4f1ea; border-radius: 20px 20px 0 0; }
}