/* Ajustes de apresentação isolados para facilitar comparação e reversão. */
:root { --nf-focus: #cc9200; --nf-border: #dce2e9; }
body { background-color: #f4f6f8; }
body.dark-mode { --nf-border: #354253; }
.card { border-radius: 14px; box-shadow: 0 4px 20px rgba(21,34,53,.06); }
#menu-principal, #tela-agenda { box-sizing: border-box; width: 100%; max-width: 1320px; margin-left: auto; margin-right: auto; }
.menu-topo { border-radius: 12px; padding: 12px; gap: 8px; }
.menu-topo button { min-height: 42px; border-radius: 8px; }
.dia-card { border-radius: 12px; }
.dia-header { padding: 13px 15px; }
.agendamento-item { border-radius: 10px; }
input, select, textarea { border-radius: 8px; }
button { border-radius: 8px; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, a:focus-visible { outline: 3px solid var(--nf-focus); outline-offset: 3px; }
button:disabled { cursor: not-allowed; opacity: .65; }
.modal-content { box-sizing: border-box; border-radius: 16px; }
.modal-overlay { box-sizing: border-box; }
.login-box { border: 1px solid var(--nf-border); border-top: 4px solid #ffb800; box-shadow: 0 12px 40px rgba(0,0,0,.14); }
.login-box input { min-height: 48px; }
.login-box #form-login > button[type=submit] { background: #ffb800; color: #302600; border-radius: 10px; }
.login-destaque-card, .login-info-card { border-radius: 14px; }
#modal-agendamento .modal-link-secondary {
  width: auto;
  max-width: 100%;
  min-height: 44px;
  padding: 8px 4px;
  margin: 0 0 6px;
  border: 0;
  background: transparent;
  color: #6540a6;
  font-size: 14px;
  text-align: left;
  line-height: 1.4;
}
body.dark-mode #modal-agendamento .modal-link-secondary { color: #c4a7ff; }
@media (max-width: 600px) {
  .menu-topo button { min-height: 44px; }
  .modal-content { max-width: calc(100vw - 24px); }
  input, select, textarea { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* Smartphone: libera espaço para a agenda sem esconder ações. */
@media (max-width: 640px) {
  body { padding: 8px; }
  #menu-principal { padding: 8px; gap: 8px; margin-bottom: 14px; }
  #menu-principal > button,
  #menu-principal > .btn-sair-menu {
    flex: 1 1 calc(50% - 8px) !important;
    width: auto;
    max-width: none !important;
    min-width: 0;
    min-height: 44px;
    margin: 0 !important;
    padding: 10px 8px;
    font-size: 13px;
    line-height: 1.3;
  }
  #tela-agenda { padding: 12px 10px; }
  #tela-agenda > h3 { margin: 12px 0; }
  #tela-agenda .agenda-welcome-user { padding: 10px 12px; margin-bottom: 12px; }
  #tela-agenda > .filtro-visao { gap: 6px; margin-bottom: 8px; }
  #tela-agenda > .filtro-visao button { min-height: 44px; padding: 10px 6px; }
  #nav-periodo-container { padding: 0 4px; margin-bottom: 12px; }
  #nav-periodo-container > button { min-width: 44px; min-height: 44px; padding: 8px; }
  #label-periodo { font-size: 14px; text-align: center; }
  #container-agenda .agenda-legenda-status { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-bottom: 12px; }
  #container-agenda .agenda-legenda-card { min-width: 0; padding: 10px 6px; gap: 8px; border-radius: 10px; }
  #container-agenda .agenda-legenda-card-topo { gap: 4px; }
  #container-agenda .agenda-legenda-card-titulo { flex-basis: 100%; font-size: 12px; overflow-wrap: anywhere; }
  #container-agenda .agenda-legenda-card-quantidade-inline { font-size: 18px; }
  #container-agenda .agenda-legenda-card-valor { font-size: 12px; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
  #container-agenda .dia-header { min-height: 44px; box-sizing: border-box; padding: 10px; }
  .acoes-container { gap: 8px; }
  .acoes-container .btn-acao { min-height: 44px; box-sizing: border-box; white-space: normal; }
  .modal-overlay { padding: 12px 8px; overscroll-behavior-y: contain; }
  .modal-overlay > .modal-content { max-width: calc(100vw - 16px); margin-bottom: 12px; }
  .modal-close { min-width: 44px; min-height: 44px; top: 4px; right: 4px; }
  .modal-content > h3:first-of-type { padding-right: 36px; }
  .modal-overlay input:not([type=checkbox]):not([type=radio]),
  .modal-overlay select, .modal-overlay textarea,
  #overlay-login input:not([type=checkbox]):not([type=radio]) { font-size: 16px !important; min-height: 44px; }
  .btn-toggle-senha { width: 44px; height: 44px; right: 2px; }
  .senha-wrap input { padding-right: 50px; }
  .modal-content input, .modal-content select, .modal-content textarea { scroll-margin-block: 72px; }
  #modal-financeiro .fin-filtro-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  #modal-financeiro .fin-filtro-grid > div { min-width: 0; }
  #modal-financeiro .fin-filtro-grid button,
  #modal-financeiro .filtro-fin-btn,
  #modal-financeiro .fin-resumo-head-acoes button { min-height: 44px; }
  #modal-financeiro .fin-historico-scroll { max-height: none !important; overflow: visible !important; }
  #modal-financeiro .fin-historico-table { width: 100%; table-layout: fixed; border-collapse: collapse; }
  #modal-financeiro .fin-historico-table th,
  #modal-financeiro .fin-historico-table td { padding: 8px 6px; font-size: 12px; line-height: 1.35; vertical-align: middle; overflow-wrap: anywhere; }
  #modal-financeiro .fin-historico-table th:nth-child(1) { width: 27%; }
  #modal-financeiro .fin-historico-table th:nth-child(2) { width: 46%; }
  #modal-financeiro .fin-historico-table th:nth-child(3) { width: 27%; }
  #modal-financeiro .fin-historico-table td[data-label]::before { content: none; }
  #modal-financeiro .fin-historico-table button { min-height: 44px; width: auto; max-width: 100%; padding: 4px 2px !important; margin: 0 !important; white-space: normal; overflow-wrap: anywhere; }
  #container-agenda .agenda-mes-cell { min-height: 76px; margin: 0; padding: 6px 3px; border-radius: 0; gap: 4px; }
  #container-agenda .agenda-mes-dia-topo { flex-wrap: wrap; gap: 3px !important; }
  #container-agenda .agenda-mes-contador { box-sizing: border-box; max-width: 100%; min-width: 18px; height: auto; min-height: 18px; padding: 2px 4px; overflow-wrap: anywhere; }
  #container-agenda .agenda-mes-weekday { padding: 6px 2px; }
  .agenda-popup-dia-acoes button { min-height: 44px; }
}
@media (max-width: 360px) {
  #modal-financeiro .fin-filtro-grid { grid-template-columns: minmax(0, 1fr); }
}
/* Sistema: seções, leitura e controles consistentes nos dois temas. */
#modal-sistema .modal-content { padding:24px; width:calc(100% - 24px); max-height:90dvh; overflow:auto; }
#modal-sistema .modal-content > h3 { padding-right:40px; font-size:1.25rem; margin-bottom:20px; }
#modal-sistema .box-cupom { padding:20px !important; border-radius:12px !important; background:#f4f6f8 !important; border-color:#d4dce5 !important; }
#modal-sistema .box-cupom h4 { font-size:1.05rem; color:#202936; }
#modal-sistema .sistema-ajuda-texto { color:#526174; line-height:1.5; }
#modal-sistema label { display:block; font-size:14px; font-weight:600; color:#202936; }
#modal-sistema input, #modal-sistema select { min-height:46px; font-size:16px; }
#modal-sistema .senha-wrap { margin-bottom:12px; }
#modal-sistema .senha-wrap .btn-toggle-senha { top:auto; bottom:8px; transform:none; height:44px; min-height:44px; }
#modal-sistema .msg-sucesso { padding:12px; border-radius:8px; }
#modal-sistema .sistema-erro { background:#fee2e2; color:#991b1b; border:1px solid #fca5a5; }
body.dark-mode #modal-sistema .box-cupom { background:#101827 !important; border-color:#3b4b60 !important; }
body.dark-mode #modal-sistema .box-cupom h4, body.dark-mode #modal-sistema label { color:#f1f5f9; }
body.dark-mode #modal-sistema .sistema-ajuda-texto { color:#b3c0d1; }
body.dark-mode #modal-sistema .sistema-erro { background:#451a1a; color:#fecaca; border-color:#924040; }
@media(max-width:600px) {
 #modal-sistema .modal-content { padding:16px; }
 #modal-sistema .box-cupom { padding:14px !important; }
 #modal-sistema .grid-2, #modal-sistema .sistema-tema-grid { grid-template-columns:minmax(0,1fr); }
 #modal-sistema .grid-2 > div { min-width:0; }
 #modal-sistema .sistema-tema-acoes { flex-direction:column; }
}
#form-login .login-suporte-discreto { display:block; width:auto; margin:8px auto 0; min-height:44px; padding:8px 12px; background:transparent; color:#596579; border:0; font-size:13px; font-weight:400; text-decoration:underline; }
body.dark-mode #form-login .login-suporte-discreto { color:#aeb9c9; }
.login-destaque-controls { display:flex; justify-content:flex-end; }
.login-destaque-controls button { width:auto; min-height:44px; margin:0; padding:8px; background:transparent; color:#dbeafe; font-size:12px; text-decoration:underline; }
.login-destaque-dots { display:flex; gap:2px; }
.login-destaque-dots .login-destaque-seletor { position:relative; width:44px; height:44px; min-height:44px; padding:0; margin:0; background:transparent; border:0; }
.login-destaque-seletor::after { content:''; display:block; width:9px; height:9px; margin:auto; border-radius:50%; background:#8b9bb2; }
.login-destaque-seletor.active::after { background:#ffb800; width:22px; border-radius:8px; }
.login-info-content .login-conhecer { width:auto; min-height:44px; background:#ffb800; color:#302600; padding:10px 14px; margin:12px 0 0; font-size:14px; }
.login-destaque-title { min-height:2.5em; }
.login-destaque-text { min-height:4.5em; }
/* O conteúdo maior que a tela começa no topo, sem corte por centralização flex. */
#overlay-login { align-items:flex-start; height:100%; height:100dvh; padding-top:max(12px,env(safe-area-inset-top)); padding-bottom:max(20px,env(safe-area-inset-bottom)); scroll-padding-top:16px; }
#overlay-login .auth-shell { min-height:0; flex-shrink:0; align-items:flex-start; margin-top:0; margin-bottom:0; }
#overlay-login .auth-stage-simple { flex-shrink:0; }
#modal-termos .termos-box { line-height:1.65; overflow-wrap:anywhere; }
#modal-termos .termos-box h4 { margin:20px 0 8px; }
/* Ênfase discreta no preço Pix, sem alterar os demais meios de pagamento. */
#modal-plano-info .plano-pix-destaque { background:#edf8f0; border:1px solid #cee7d5; border-radius:7px; padding:7px 9px; margin:5px 0; color:#225d35; }
#modal-plano-info .plano-pix-destaque .plano-valor-pix { font-size:1.08em; font-weight:700; color:#216b37; }
body.dark-mode #modal-plano-info .plano-pix-destaque { background:#213329; border-color:#385643; color:#b7dec3; }
body.dark-mode #modal-plano-info .plano-pix-destaque .plano-valor-pix { color:#87d6a1; }
/* Orientação inicial: três pulsos suaves e indicação estática até a ação. */
.noflop-orientar { position:relative; outline:2px solid #e4ac25 !important; outline-offset:3px; animation:noflop-orientacao 1.5s ease-in-out 3; }
.noflop-orientar::after { content:attr(data-orientacao); display:block; position:absolute; top:calc(100% + 6px); right:0; z-index:10; padding:5px 8px; border-radius:6px; background:#ffcf64; color:#352600; font-size:12px; font-weight:600; line-height:1.3; white-space:nowrap; pointer-events:none; }
@keyframes noflop-orientacao { 0%,100% { box-shadow:0 0 0 0 rgba(228,172,37,.1); } 50% { box-shadow:0 0 0 6px rgba(228,172,37,.35); } }
@media(prefers-reduced-motion:reduce) { .noflop-orientar { animation:none; } }
#modal-sistema .sistema-tema-box { display:none !important; }
.feedback-junto-acao { box-sizing:border-box; width:100%; grid-column:1 / -1; flex-basis:100%; margin:8px 0 !important; padding:10px 12px; border-radius:8px; font-size:14px; line-height:1.45; overflow-wrap:anywhere; }
form .feedback-junto-acao { background:#edf8f0; color:#205b32; border:1px solid #c8e4d0; }
body.dark-mode form .feedback-junto-acao { background:#203329; color:#c5efd2; border-color:#385643; }
form [role="status"].feedback-junto-acao:not(.msg-sucesso):not(.plano-feedback-box) { background:#f1f5f9; color:#28384b; border-color:#cbd5e1; }
body.dark-mode form [role="status"].feedback-junto-acao:not(.msg-sucesso):not(.plano-feedback-box) { background:#172131; color:#e2e8f0; border-color:#46556b; }