html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

/* (card #161) Utilitária de largura responsiva — w-md-auto.
   O Bootstrap só tem w-* estático (w-100 w-auto etc.), não tem versão responsiva.
   Sem esta regra, "w-100 w-md-auto" vira w-100 em TODAS as telas, esticando botões
   no desktop. Em telas >= 768px, o w-md-auto sobrepõe o w-100. */
@media (min-width: 768px) {
  .w-md-auto {
    width: auto !important;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
  background-color: whitesmoke;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/* Select2 — igualar borda ao form-control do Bootstrap */
.select2-container--default .select2-selection {
  border: 1px solid #ced4da !important;
  border-radius: 0.375rem !important;
}

.select2-container--default .select2-selection:focus,
.select2-container--default.select2-container--focus .select2-selection,
.select2-container--default.select2-container--open .select2-selection {
  border-color: #86b7fe !important;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important;
}

/* Indicador de campo obrigatório (card #303) */
label.obrigatorio::after {
    content: " *";
    color: #dc3545;
    font-weight: bold;
}

/* Card #364: tooltip nunca intercepta o clique do elemento de baixo */
.tooltip {
    pointer-events: none;
}

/* ── Card #377: contador de tempo economizado ─────────────────────────────
   Estilo escolhido pelo dono (10/10/2026): mesma paleta azul que o app usa nas
   notificações (Bootstrap `alert-primary`: #0D6EFD / #CFE2FF / #9EC5FE), flat,
   ícone de relógio em contorno SEM fundo. Conteúdo distribuído em coluna para
   preencher a altura do cartão (h-100), com textos maiores. */
.card-tempo-economizado {
    background: #CFE2FF;
    border: 2px solid #9EC5FE;
    border-radius: 16px;
    color: #0D6EFD;
}

.card-tempo-economizado .card-body {
    padding: 20px 22px;
}

.tempo-icone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: #0D6EFD;
}

.tempo-titulo {
    font-family: "Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: #0D6EFD;
}

.tempo-valor {
    font-family: Inter, "Segoe UI", system-ui, -apple-system, sans-serif;
    font-size: 34px;
    margin: 16px 0;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.02em;
    color: #0D6EFD;
    font-variant-numeric: tabular-nums;
    text-align: center;
}

.tempo-legenda {
    font-family: Inter, "Segoe UI", system-ui, -apple-system, sans-serif;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.02em;
    color: #0A58CA;
}

/* Card #377: número maior no desktop e respiro entre o cartão e o bloco de cima no mobile */
.tempo-col {
    margin-top: 16px;
}

@media (min-width: 768px) {
    .tempo-titulo {
        font-size: 22px;
    }

    .tempo-valor {
        font-size: 72px;
        margin: 0;
    }

    .tempo-col {
        margin-top: 0;
    }
}

/* Botão ✓ de iniciar atendimento desabilitado (atendimento não confirmado): cinza claro e sem cursor de clique */
.btn.disabled.js-iniciar-nao-confirmado {
    cursor: default;
}

/* Card #411: ✓ bloqueado por dia já passado — mesmo tratamento do #364 (sem cursor de clique). */
.btn.disabled.js-iniciar-dia-passado {
    cursor: default;
}