/* Paleta Paraguai: azul #0038A8, branco, vermelho #D52B1E */
:root {
  --flag-blue: #0038a8;
  --flag-red: #d52b1e;
  --flag-white: #ffffff;
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* Tarja da bandeira (decoração) */
.flag-stripe {
  height: 5px;
  border-radius: 2px;
  background: linear-gradient(
    90deg,
    var(--flag-blue) 0%,
    var(--flag-blue) 33.33%,
    var(--flag-white) 33.33%,
    var(--flag-white) 66.66%,
    var(--flag-red) 66.66%,
    var(--flag-red) 100%
  );
  box-shadow: 0 1px 3px rgba(0, 56, 168, 0.25);
}

/* Botão primário (azul) — reforço visual + hover */
.btn-flag-primary {
  background: linear-gradient(180deg, #1e4fad 0%, var(--flag-blue) 45%, #002a7a 100%);
  color: #fff;
  box-shadow: 0 4px 14px rgba(0, 56, 168, 0.35);
  transition: transform 0.15s ease, box-shadow 0.2s ease, filter 0.2s ease;
}
.btn-flag-primary:hover {
  filter: brightness(1.08);
  box-shadow: 0 6px 20px rgba(0, 56, 168, 0.45);
}
.btn-flag-primary:active {
  transform: scale(0.98);
}

/* Botão destaque vermelho */
.btn-flag-red {
  background: linear-gradient(180deg, #e85545 0%, var(--flag-red) 50%, #9e2116 100%);
  color: #fff;
  box-shadow: 0 4px 14px rgba(213, 43, 30, 0.35);
  transition: transform 0.15s ease, box-shadow 0.2s ease, filter 0.2s ease;
}
.btn-flag-red:hover {
  filter: brightness(1.06);
  box-shadow: 0 6px 18px rgba(213, 43, 30, 0.45);
}
.btn-flag-red:active {
  transform: scale(0.98);
}

/* Cartões: leve brilho ao hover */
.card-flag-hover {
  transition: border-color 0.2s ease, box-shadow 0.25s ease, transform 0.2s ease;
}
.card-flag-hover:hover {
  border-color: rgba(0, 56, 168, 0.35);
  box-shadow: 0 8px 28px rgba(0, 56, 168, 0.12);
  transform: translateY(-2px);
}

/* Fundo da área logada */
body.app-flag-bg {
  background: linear-gradient(165deg, #f0f5ff 0%, #fafafa 40%, #fff5f5 100%);
}

.js-dropdown.is-open > .js-dropdown-btn {
  background-color: rgba(232, 238, 249, 0.95);
  color: #001f5c;
}

/* Itens de atendimento — lista em cards expansível */
#at-itens-list {
  overflow: visible;
}

.at-item-card {
  overflow: visible;
}

.at-item-card [data-procedimento-combobox] {
  overflow: visible;
}

.at-item-card [data-cb-list] {
  z-index: 100;
}

/* Guia de atendimento — impressão em 2 vias (uma folha por via) */
.guia-impressao-body {
  margin: 0;
  padding: 1rem;
}

.guia-print-wrap {
  margin: 0 auto;
}

.guia-print-sheet {
  margin-bottom: 2rem;
}

/* Elemento vazio só para forçar nova folha antes da via paciente */
.guia-page-break {
  display: none;
  height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  line-height: 0;
  font-size: 0;
}

.guia-linha-recorte {
  position: relative;
  border-top: 2px dashed #94a3b8;
  text-align: center;
}

.guia-linha-recorte__label {
  position: relative;
  top: -0.65rem;
  display: inline-block;
  background: #fff;
  padding: 0 0.75rem;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #64748b;
}

.guia-linha-recorte__label::before {
  content: "✂ ";
}

.guia-via-paciente .guia-header {
  border-color: #cbd5e1;
}

/* Tela: só logo “tela”; impressão usa .guia-logo-impressao */
.guia-logo-impressao {
  display: none;
}

@page {
  size: A4 portrait;
  margin: 12mm;
}

@media print {
  html,
  body {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    background: #fff !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  body.app-flag-bg,
  body.guia-impressao-body {
    background: #fff !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* Painel admin — não ocultar header.guia-header (logo da guia) */
  #backdrop,
  #sidebar,
  body.app-flag-bg header {
    display: none !important;
  }

  .guia-header {
    display: block !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .guia-logo-tela {
    display: none !important;
  }

  .guia-logo-impressao {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-height: 64px !important;
    width: auto !important;
    height: auto !important;
    margin: 0 auto 10px !important;
  }

  body > .flex.min-h-screen {
    display: block !important;
    min-height: 0 !important;
    height: auto !important;
  }

  body > .flex.min-h-screen > .flex.flex-1 {
    display: block !important;
  }

  main {
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    height: auto !important;
  }

  .guia-print-toolbar,
  .guia-linha-recorte {
    display: none !important;
  }

  .guia-print-wrap {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Nova folha antes da via paciente (elemento vazio entre as vias) */
  .guia-page-break {
    display: block !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    page-break-before: always !important;
    break-before: page !important;
  }

  .guia-print-sheet {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    page-break-inside: auto;
    break-inside: auto;
  }

  .guia-print-sheet--clinica {
    page-break-after: avoid;
    break-after: avoid;
  }

  .guia-via {
    border: 1px solid #cbd5e1 !important;
    box-shadow: none !important;
    page-break-inside: auto;
    break-inside: auto;
    font-size: 10pt;
    line-height: 1.35;
  }

  .guia-print-sheet--clinica .guia-via {
    padding: 8mm !important;
  }

  .guia-print-sheet--paciente .guia-via {
    padding: 8mm !important;
  }

  .guia-via table thead {
    display: table-header-group;
  }

  .guia-via table tr {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .guia-header__logo {
    max-height: 18mm !important;
    width: auto !important;
    height: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Relatórios — cabeçalho com logo na impressão */
  .relatorio-no-print,
  .relatorio-print-toolbar {
    display: none !important;
  }

  .relatorio-print-cabecalho {
    display: block !important;
  }

  .relatorio-print-logo,
  .guia-header__logo {
    display: block !important;
    visibility: visible !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .relatorio-print-logo {
    max-height: 18mm !important;
  }

  .relatorio-col-acoes {
    display: none !important;
  }
}