:root{
  --brand:#d9272e; --brand-600:#c51f26;
  --sidebar-w:256px; --sidebar-w-mini:78px;
  --topbar-h:56px;

  /* Ritmo / ícones */
  --item-h:48px;
  --icon-open:16px;
  --icon-mini:20px;
}

/* ===== Layout base ===== */
#fq-main{ margin-left:var(--sidebar-w); transition:margin-left .2s ease; }
body.sidebar-collapsed #fq-main{ margin-left:var(--sidebar-w-mini); }

#fq-sidebar{
  width:var(--sidebar-w);
  transition:width .2s ease, transform .2s ease;
  overflow-x:visible;
  z-index:40; /* acima do scrim */
}
body.sidebar-collapsed #fq-sidebar{ width:var(--sidebar-w-mini); }

@media (max-width:767px){
  #fq-main{ margin-left:0 }
}
body{ overflow-x:hidden; }

/* ===== Brand (logo) + toggle ===== */
.brand-wrap{
  height:var(--item-h);
  display:flex; align-items:center;
  justify-content:space-between;         /* seta à direita quando ABERTO */
  gap:.75rem; padding:0 .75rem;
  border-bottom:1px solid #e5e7eb; flex:0 0 auto;
}
.brand-left{ display:flex; align-items:center; gap:.75rem; min-width:0; }
.brand-logo{ height:40px; width:auto; object-fit:contain }
.brand-logo--small{ height:28px; }

/* slot do logo no topo (só aparece colapsado) */
.brand-top{ display:none; align-items:center; gap:.5rem }
body.sidebar-collapsed .brand-top{ display:flex }

/* Botão da seta (desktop) */
#sidebarToggle{
  height:36px; width:36px; border-radius:.75rem;
  border:1px solid #e5e7eb; background:#fff;
}

/* ===== Scroll interno ===== */
.sidebar-scroll{
  flex:1 1 auto; min-height:0;
  overflow-y:auto; overflow-x:visible;
  overscroll-behavior:contain; scrollbar-gutter:stable;
}
body.sidebar-collapsed #fq-sidebar .sidebar-scroll{ overflow-y:visible }

/* ===== Links do menu ===== */
.nav-link{
  display:flex; align-items:center; gap:.75rem;
  width:100%; overflow:hidden; border-radius:.75rem;
  padding:.5rem .75rem; height:var(--item-h);
}
.nav-link > i{
  font-size:var(--icon-open);
  width:1.25rem; text-align:center;
}

/* Quando COLAPSADO: ícone maior e centrado */
body.sidebar-collapsed .nav-link{
  justify-content:center; gap:0; padding-left:0; padding-right:0;
}
body.sidebar-collapsed .nav-link > i{
  font-size:var(--icon-mini); width:auto;
}

/* ===== Tooltips ===== */
.sidebar-collapsed .nav-item .label{ display:none }
.nav-item{ position:relative }
.nav-item .tooltip{
  display:none;
  position:absolute; left:calc(100% + 8px); top:50%;
  transform:translateY(-50%) translateX(-4px);
  background:#111827; color:#fff; font-size:12px; line-height:1;
  padding:.35rem .5rem; border-radius:.5rem; white-space:nowrap;
  box-shadow:0 10px 30px rgba(0,0,0,.15);
  opacity:0; pointer-events:none; transition:opacity .12s, transform .12s;
  z-index:60;
}
body.sidebar-collapsed .nav-item:hover .tooltip{
  display:block; opacity:1; transform:translateY(-50%) translateX(0);
  pointer-events:auto;
}

/* ===== Rodapé/Copy (©) ===== */
.copy-row{
  display:flex; align-items:center; gap:.5rem;
  padding:.75rem; border-top:1px solid #e5e7eb; color:#94a3b8; font-size:12px;
  position:relative; justify-content:center;   /* <- centra SEMPRE */
}
.copy-badge{
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border-radius:9999px; border:1px solid #e5e7eb;
  background:#fff; color:#64748b; cursor:default; flex:0 0 28px;
  font-size:14px;
}
.copy-text{ white-space:nowrap; }
body.sidebar-collapsed .copy-text{ display:none }
.copy-tip{
  position:absolute; left:calc(100% + 8px); bottom:.6rem;
  background:#111827; color:#fff; font-size:12px; line-height:1;
  padding:.35rem .5rem; border-radius:.5rem; white-space:nowrap;
  box-shadow:0 10px 30px rgba(0,0,0,.15);
  opacity:0; pointer-events:none; transition:opacity .12s, transform .12s;
  transform:translateX(-4px); z-index:60;
}
body.sidebar-collapsed .copy-row:hover .copy-tip{
  opacity:1; transform:translateX(0); pointer-events:auto;
}

/* === alturas do topo === */
:root{
  --topbar-h: 56px;
  --brand-pad: 8px;
}

/* slot do logo + botão dentro da sidebar — mesma altura da topbar */
.brand-wrap{
  height: var(--topbar-h);
  display:flex; align-items:center; justify-content: space-between;
  padding: 0 var(--brand-pad);
  border-bottom: 1px solid #e5e7eb;
}

/* LOGO: casar visualmente com a altura do topo */
.brand-logo{
  height: calc(var(--topbar-h) - (var(--brand-pad) * 2));
  width: auto;
  object-fit: contain;
}

/* BOTÃO: quadrado e centrado verticalmente, com mesma lógica de altura */
#sidebarToggle{
  height: calc(var(--topbar-h) - (var(--brand-pad) * 2));
  width:  calc(var(--topbar-h) - (var(--brand-pad) * 2));
  display: inline-flex;
  align-items:center; justify-content:center;
  border-radius: 12px;
}

/* quando COLAPSADO, o toggle pode ficar centrado (opcional) */
body.sidebar-collapsed .brand-wrap{
  justify-content: center;
}

/* SCRIM transição suave (controlado por classes no HTML) */
#sidebarScrim{
  transition: opacity .2s ease;
}


/* --- cartões/base --- */
.card-m{background:#fff;border:1px solid #e5e7eb;border-radius:16px;box-shadow:0 6px 18px rgba(0,0,0,.04)}
.card-m__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid #e5e7eb}
.card-m__title{margin:0;font-weight:700;font-size:1rem;letter-spacing:.02em}
.card-m__actions{display:flex;align-items:center;gap:8px}
.card-m__body{padding:16px}

/* --- grelhas --- */
.dash-wrap{max-width:1400px;margin:0 auto;padding:12px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:1024px){.grid-2{grid-template-columns:1fr}}

.mt-6{margin-top:1.25rem}.mt-8{margin-top:2rem}

/* --- botões --- */
.btn-pill{display:inline-flex;align-items:center;gap:.5rem;border-radius:999px;padding:.5rem .9rem;font-weight:600;border:1px solid transparent;text-decoration:none}
.btn-pill--primary{background:#d9272e;color:#fff;border-color:#d9272e}
.btn-pill--primary:hover{filter:brightness(0.95)}
.btn-pill--ghost{background:#fff;color:#334155;border-color:#e5e7eb}
.btn-pill--ghost:hover{background:#f8fafc}

/* --- tabelas --- */
.table-modern{width:100%;border-collapse:separate;border-spacing:0}
.table-modern thead th{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;background:#f8fafc;border-bottom:1px solid #e5e7eb;padding:.6rem .75rem;color:#475569}
.table-modern tbody td{padding:.6rem .75rem;border-bottom:1px solid #f1f5f9;vertical-align:middle}
.table-modern tr:hover td{background:#fcfcfd}

/* --- formulários --- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:1024px){.form-grid{grid-template-columns:1fr}}
.form-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:16px}

/* utilidades */
.text-right{text-align:right}


/*AQUI*/
.form-card { padding: 1.25rem 1.5rem; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1.25rem; }
.form-grid--single { grid-template-columns: 1fr; }
.form-label { font-weight: 600; margin-bottom: .375rem; }
.actions-sticky {
  position: sticky; bottom: 0; padding: .75rem 1rem;
  background: #fff; border-top: 1px solid #eef0f3; display: flex; justify-content: flex-end; gap: .5rem;
}

.input, .select, .textarea {
  outline: none; transition: box-shadow .15s ease, border-color .15s ease;
}
.input:focus, .select:focus, .textarea:focus, .btn:focus {
  box-shadow: 0 0 0 3px rgba(220, 53, 69,.15); /* vermelho suave do topo */
  border-color: #dc3545;
}

.req{ color:#dc3545; margin-left:.25rem; }
.help{ display:block; color:#6b7280; font-size:.825rem; margin-top:.25rem; }

.file-hidden{ position:absolute; left:-9999px; }
.file-row{ display:flex; align-items:center; gap:.75rem; }
.file-name{ color:#374151; font-size:.925rem; }


.is-invalid{ border-color:#ef4444 !important; }
.invalid-msg{ color:#ef4444; font-size:.825rem; margin-top:.25rem; }

@media (max-width: 1024px){ .form-grid{ grid-template-columns:1fr; } }


.btn[disabled]{ opacity:.7; cursor:not-allowed; }
.btn .spinner{ width:1rem; height:1rem; border:2px solid #fff; border-right-color:transparent; border-radius:50%; display:inline-block; animation:spin .7s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }

/* espaçamentos suaves */
.form-group.form-group--m { margin-bottom: 1rem; }

/* asterisco nos obrigatórios (reaproveita a tua classe) */
.requiredField::after{
  content:" *";
  color:#dc3545;
  margin-left:.25rem;
  font-weight:700;
}

/* look moderno só dentro de forms/cartões do dashboard */
.form-card .form-control,
.form-card .input,
.form-card .select,
.form-card .textarea{
  background:#f9fafb;
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:.75rem 1rem;
  outline:none;
  transition: box-shadow .15s ease, border-color .15s ease;
}
.form-card .form-control:focus,
.form-card .input:focus,
.form-card .select:focus,
.form-card .textarea:focus{
  box-shadow:0 0 0 3px rgba(220,53,69,.15);
  border-color:#dc3545;
}

/* mensagens de erro compactas */
.invalid-msg{ color:#ef4444; font-size:.825rem; margin-top:.25rem; }
.is-invalid{ border-color:#ef4444 !important; }

/* file input “bonito” */
.file-hidden{ position:absolute; left:-9999px; }
.file-row{ display:flex; align-items:center; gap:.75rem; }
.file-name{ color:#374151; font-size:.925rem; }

/* ajuda abaixo do campo */
.help{ display:block; color:#6b7280; font-size:.825rem; margin-top:.25rem; }

/* ===== Modo compacto de formulários ===== */
.form--compact .form-card {
  padding: 12px 14px;              /* era maior; reduzimos */
  border-radius: 12px;
}

.form--compact .form-group--m {
  margin-bottom: 12px;             /* espaço vertical entre campos */
}

/* labels mais sucintas e alinhadas */
.form--compact .form-label {
  margin-bottom: 6px;
  font-weight: 600;
  font-size: 0.95rem;
}

/* inputs um pouco mais baixos */
.form--compact .form-control {
  height: 44px;                    /* ~44px é confortável e compacto */
  padding: 8px 12px;
}

/* ajuda/erro com menos espaço extra */
.form--compact .help {
  margin-top: 6px;
  font-size: 0.85rem;
  color: #6b7280;                   /* cinza suave */
}

.form--compact .invalid-msg {
  margin-top: 6px;
  font-size: 0.85rem;
}

/* grelha: substitui gutters grandes por gap menor */
.form--compact .form-row {
  display: grid;
  grid-template-columns: repeat(12, minmax(0,1fr));
  gap: 16px;                       /* “gutter” compacto */
}

.form--compact .col-sm-6,
.form--compact .col-md-6 {
  grid-column: span 6;
}

/* Mobile/Tablet: 1 coluna */
@media (max-width: 1024px) {
  .form--compact .col-sm-6,
  .form--compact .col-md-6 {
    grid-column: span 12;
  }
}

/* ===== File input moderno ===== */
.file-row {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.file-hidden {
  position: absolute;
  left: -9999px;                  /* mantemos o input acessível mas invisível */
}

.btn-ghost {
  display: inline-flex;
  align-items: center;
  height: 40px;
  padding: 0 14px;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
  transition: box-shadow .15s ease, transform .02s ease;
  cursor: pointer;
}

.btn-ghost:hover {
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}

.file-name {
  font-size: 0.95rem;
  color: #374151;                 /* cinza 700 */
}

/* ===== Pequenos ajustes no “card” do form ===== */
.card-m__body {
  padding: 20px;                  /* era bem maior; isto deixa o card mais enxuto */
}

@media (max-width: 1024px) {
  .card-m__body {
    padding: 16px;
  }
}

/* Títulos de seção */
.form-section { margin-bottom: 18px; }
.form-section__title { font-size: 1.25rem; font-weight: 700; margin: 0 0 10px; }
.form-section__subtitle { font-size: 1.05rem; font-weight: 700; margin: 0 0 8px; }

/* Ações do form */
.form-actions { display: flex; justify-content: flex-end; margin-top: 8px; }

/* Acordeão (details/summary) */
.fold {
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
}

.fold__summary {
  cursor: pointer;
  padding: 12px 14px;
  font-weight: 600;
  list-style: none;
  position: relative;
}

.fold__summary::-webkit-details-marker { display: none; }
.fold__summary::after {
  content: '▸';
  position: absolute; right: 14px; top: 50%; transform: translateY(-50%) rotate(0deg);
  transition: transform .15s ease;
}
.fold[open] .fold__summary::after { transform: translateY(-50%) rotate(90deg); }

.fold__content { padding: 12px 14px 14px; border-top: 1px solid var(--border, #e5e7eb); }

/* Switch row (checkbox estilizado mas mantendo input real para acessibilidade) */
.switch-row {
  display: inline-flex; align-items: center; gap: 10px;
  user-select: none; cursor: pointer;
}
.switch-row input[type="checkbox"] { position: absolute; left: -9999px; }

.switch-fake {
  width: 38px; height: 22px; border-radius: 999px;
  background: #e5e7eb; position: relative; transition: background .15s ease;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.05);
}
.switch-fake::after {
  content: ''; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px;
  background: #fff; border-radius: 50%; box-shadow: 0 1px 2px rgba(0,0,0,.12);
  transition: transform .15s ease;
}
.switch-row input:checked + .switch-fake { background: #16a34a; }
.switch-row input:checked + .switch-fake::after { transform: translateX(16px); }

/* Ajustes já mencionados (se ainda não tens) */
.file-row { display:inline-flex; align-items:center; gap:12px; flex-wrap:wrap; }
.file-hidden { position:absolute; left:-9999px; }
.btn-ghost { display:inline-flex; align-items:center; height:40px; padding:0 14px;
  border:1px solid var(--border, #e5e7eb); border-radius:10px; background:#fff;
  box-shadow:0 1px 0 rgba(0,0,0,.02); transition: box-shadow .15s ease, transform .02s ease;
}
.btn-ghost:hover { box-shadow:0 2px 8px rgba(0,0,0,.06); }
.file-name { font-size:.95rem; color:#374151; }

/* ====== FORM GRID – compacto, moderno e consistente ====== */
.form-shell { padding: 18px 22px; }
.form-title { font-weight: 800; font-size: 20px; margin: 0 0 14px; }

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;     /* 2 colunas desktop */
  gap: 16px 24px;                      /* linha x coluna */
}

/* Um "field group" (label + input + ajuda/erro) */
.fg { display: flex; flex-direction: column; }
.fg label.form-label {
  font-weight: 700; font-size: 13.5px; color: #111827; margin-bottom: 6px;
}
.fg .help { margin-top: 6px; font-size: 12px; color:#6b7280; }
.fg .invalid-msg { color:#dc2626; font-size:12px; margin-top:6px; }

/* Inputs com altura consistente e look clean */
.fg .form-control {
  height: 42px; padding: 8px 12px;
  border-radius: 10px; border: 1px solid #e5e7eb;
  background: #f9fafb; box-shadow:none;
}
.fg .form-control:focus {
  background:#fff; border-color:#d1d5db;
  box-shadow: 0 0 0 3px rgba(239,68,68,.08);
}
.fg .is-invalid { border-color:#dc2626 !important; background:#fff5f5 !important; }

/* Campo que deve ocupar as duas colunas */
.span-2 { grid-column: 1 / -1; }

/* File inline e alinhado como os restantes */
.fg-file .file-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.fg-file .file-hidden { position:absolute; left:-9999px; }
.fg-file .file-name { font-size:14px; color:#374151; }
.btn-ghost {
  height: 40px; padding: 0 14px; border-radius: 10px;
  border: 1px solid #e5e7eb; background:#fff;
}
.btn-ghost:hover { background:#f9fafb; }

/* Botões finais colados à direita */
.form-actions { margin-top: 6px; display:flex; justify-content:flex-end; }

/* Responsivo: 1 coluna abaixo de 992px */
@media (max-width: 992px) {
  .form-grid { grid-template-columns: 1fr; gap: 14px; }
  .span-2 { grid-column: auto; }
}
/* ---------- Tabela moderna ---------- */
.table-wrap {
  /* se quiseres header “sticky” quando a lista for muito longa, ativa altura */
  /* max-height: 65vh; overflow: auto; */
}

.table-modern {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  background: #fff;
  font-size: 0.95rem;
}

.table-modern thead th {
  background: #fafbfc;
  color: #263238;
  font-weight: 700;
  border-bottom: 1px solid #e8edf2;
  padding: 0.9rem 1rem;
  position: sticky;      /* fixa o header ao rolar dentro de .table-wrap */
  top: 0;
  z-index: 2;
}

.table-modern tbody td {
  padding: 0.85rem 1rem;
  border-bottom: 1px solid #f0f3f6;
  vertical-align: middle;
  color: #2c3e50;
  white-space: nowrap;   /* evita quebrar números/curtos */
}

.table-modern tbody tr:hover {
  background: #f8fafc;
}

.table-modern tbody tr[style*="background-color:red"] {
  /* quando marcas updatedNew == 0, o antigo inline fica; suavizamos o contraste */
  background-color: #ffe7e7 !important;
  color: #a30000;
}

.admin_table i.fa-check {
  color: #12b886 !important;  /* verde consistente */
}

/* A coluna de ações à direita fica visualmente alinhada */
.table-modern th#actions,
.table-modern td:last-child {
  text-align: right;
}

/* Botão de menu (fa-bars) em versão mais “clean” */
.btn-secundary.dropdown-toggle {
  background: #fff;
  border: 1px solid #e6eaf0;
  padding: .35rem .55rem;
  line-height: 1;
  border-radius: 10px;
}
.btn-secundary.dropdown-toggle:hover {
  background: #f7f9fc;
  border-color: #dbe3ea;
}

/* ---------- Barra de busca compacta ---------- */
.table-tools{
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: .5rem 0 1rem;
}

.input-search{
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  background: #fff;
  border: 1px solid #e6eaf0;
  border-radius: 12px;
  padding: .25rem .35rem .25rem .6rem;
  box-shadow: 0 1px 2px rgba(16,24,40,.04);
}

.input-search__field{
  border: none;
  outline: none;
  font-size: .95rem;
  min-width: 180px;
  background: transparent;
}

.input-search__btn{
  border: none;
  background: #e9eef5;
  width: 36px; height: 32px;
  border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
}
.input-search__btn:hover{ background:#dde6f0; }

/* ---------- Paginação com pills ---------- */
.pagination { gap: .25rem; }
.page-item .page-link{
  border-radius: 10px !important;
  border: 1px solid #e6eaf0;
  color: #334155;
}
.page-item.active .page-link{
  background: #e11d48;       /* vermelho da tua paleta */
  border-color: #e11d48;
  color: #fff;
}

/* ---------- Responsivo ---------- */
/* Em ecrãs menores, reduzimos preenchimento e deixamos a tabela mais “compacta” */
@media (max-width: 992px){
  .table-modern thead th,
  .table-modern tbody td { padding: .7rem .8rem; font-size: 0.9rem; }
  .input-search__field{ min-width: 120px; }
}

/* Opcional: em mobile força quebra de texto para nomes longos */
@media (max-width: 576px){
  .table-modern tbody td { white-space: normal; }
}

/* ====== Forms – “beauty pass” sem quebrar JS ====== */
.form-group { margin-bottom: 1rem; }

.form-group > label,
.requiredField { 
  font-weight: 700; 
  color: #111827; 
  margin-bottom: .35rem; 
}

/* asterisco automático dos obrigatórios já usados */
.requiredField::after {
  content: " *";
  color: #e11d48; /* vermelho da tua paleta */
  font-weight: 800;
}

/* inputs genéricos */
.form-control {
  border: 1px solid #e6eaf0;
  border-radius: 12px;
  padding: .65rem .9rem;
  background: #f9fafb;
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.form-control:focus {
  background: #fff;
  border-color: #cbd5e1;
  box-shadow: 0 0 0 3px rgba(225, 29, 72, .15); /* glow vermelho suave */
  outline: 0;
}
/* campos informativos (não editáveis) */
.form-control[readonly],
.form-control[readonly="readonly"] {
  background: #eef1f4;   /* um cinza um pouco mais OPACO, menos branco */
  color: #475569;        /* texto mais escuro — lé o valor com clareza */
  border-color: #e2e8f0; /* borda ligeiramente mais definida */
  font-weight: 600;      /* visual “informativo”, não ghost */
  cursor: default;       /* eliminamos qualquer ilusão de “clicável” */
}


/* mensagens de validação server-side (@error ...) */
.invalid-msg {
  color: #e11d48;
  font-size: .85rem;
  margin-top: .25rem;
  display: block;
}
.form-control.is-invalid {
  border-color: #ef4444;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, .12);
}

/* “help text” que já usas em alguns campos */
.help {
  font-size: .85rem;
  color: #6b7280;
  margin-top: .25rem;
}

/* ====== Bootstrap datetimepicker (input-group) ====== */
.input-group .form-control {
  border-right: 0;
  border-radius: 12px 0 0 12px;
}
.input-group .input-group-append .input-group-text {
  border: 1px solid #e6eaf0;
  border-left: 0;
  border-radius: 0 12px 12px 0;
  background: #f3f4f6;
  color: #334155;
}
.input-group .input-group-append .input-group-text i {
  line-height: 1;
}

/* ====== Switches custom-control ====== */
.custom-control-label { padding-left: 2.25rem; }
.custom-control-label::before { border-radius: 50px; }
.custom-control-input:checked ~ .custom-control-label::before {
  background-color: #e11d48; border-color: #e11d48;
}

/* ====== Botões ====== */
.btn.btn-primary {
  background: #e11d48; border-color: #e11d48;
  border-radius: 14px; padding: .6rem 1rem;
}
.btn.btn-primary:hover { background: #be123c; border-color: #be123c; }

/* ====== Tabelas internas dos blocos (table-highlight) ====== */
.table-highlight thead th {
  background: #fafbfc;
  border-color: #e8edf2;
  font-weight: 700;
}
.table-highlight th,
.table-highlight td {
  padding: .5rem .6rem;
  vertical-align: middle;
  border-color: #f0f3f6;
}

/* números/percentagens readonly ficam visualmente “consolidados” */
.table-highlight input[readonly],
.table-highlight input[readonly="readonly"] {
  background: #f5f6f8;
  color: #475569;
}

/* ====== Pequenos ajustes responsivos ====== */
@media (min-width: 992px) {
  .form-row > .form-group.col-sm-6 { padding-right: 12px; padding-left: 12px; }
}
@media (max-width: 576px) {
  .table-highlight td input.form-control { min-width: 72px; }
}

/* ===== Switch (compatível com markup Bootstrap 4: custom-control custom-switch) ===== */

/* limpar as pseudo do BS para não “brigar” com o tema */
.custom-switch .custom-control-label::before,
.custom-switch .custom-control-label::after {
  content: none;
}

/* esconde o input, mas mantém acessível */
.custom-control.custom-switch .custom-control-input {
  position: absolute;
  left: -9999px;
}

/* “track” do switch */
.custom-control.custom-switch .custom-control-label {
  display: inline-block;
  position: relative;
  width: 48px;                  /* largura da pílula */
  height: 28px;                 /* altura da pílula */
  border-radius: 9999px;
  background: #e5e7eb;          /* cinza claro */
  box-shadow: inset 0 0 0 1px #d1d5db;
  vertical-align: middle;
  margin-right: 12px;           /* espaço para o texto à direita */
  cursor: pointer;
  transition: background .2s ease, box-shadow .2s ease;
}

/* “thumb” (o botão redondo) */
.custom-control.custom-switch .custom-control-label::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 24px;
  height: 24px;
  border-radius: 9999px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.2);
  transition: transform .2s ease;
}


/**/
.custom-control.custom-switch .custom-control-input ~ .custom-control-label {
 background: var(--brand-600, red);  /* usa tua cor de marca se existir */
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.05);
}

/* estado ativo (ligado) */
.custom-control.custom-switch .custom-control-input:checked ~ .custom-control-label {
 background: var(--kpi-green, #3cb179);  /* usa tua cor de marca se existir */
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.05);
}
.custom-control.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
  transform: translateX(20px);
}

/* foco acessível */
.custom-control.custom-switch .custom-control-input:focus ~ .custom-control-label {
  box-shadow: 0 0 0 3px rgba(209,31,43,.2), inset 0 0 0 1px #d1d5db;
}

/* disabled */
.custom-control.custom-switch .custom-control-input:disabled ~ .custom-control-label {
  opacity: .6;
  cursor: not-allowed;
}

/* alinhamento do texto com o switch (para o teu .inline-flex) */
.inline-flex {
  display: flex;
  align-items: center;
  gap: 12px;                    /* espaço consistente entre switch e rótulo */
}


 /* ===== Reports – layout de cards ===== */
.report-card {
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 10px 25px rgba(16,24,40,.06);
  padding: 22px;
  display: flex;
  flex-direction: column;
  min-height: 280px;          /* ajusta a altura conforme precisares */
  position: relative;
}
.report-card .card-title {
  font-weight: 700;
  font-size: 1.1rem;
  color: var(--ink-900, #0f172a);
  margin-bottom: 14px;
}
.report-card .form-row, 
.report-card .form-group {
  margin-bottom: 14px;
}

/* “Botões no canto inferior direito” */
.report-card .card-actions {
  margin-top: auto;                     /* empurra ações para o fim */
  display: flex;
  justify-content: flex-end;
  gap: .75rem;
}

/* Radios do cabeçalho (Puntos críticos) */
.report-card .inline-radios {
  display: flex;
  gap: 16px;
  align-items: center;
  margin: 2px 0 8px;
}
.report-card .inline-radios label {
  margin: 0;
  font-weight: 600;
  color: var(--ink-700, #344054);
}

/* Inputs com ícone à direita (calendário etc.) */
.input-with-append {
  position: relative;
}
.input-with-append .append {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  pointer-events: none; /* ícone decorativo; o datetimepicker já abre no input */
}

/* ===== Base de Datos (Total) – “chips” ===== */
.db-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  padding: 18px 6px 6px;
}
.btn-chip {
  background: var(--brand-600, #c5161d);
  color: #fff !important;
  border: none;
  border-radius: 999px;
  padding: 12px 18px;
  font-weight: 700;
  box-shadow: 0 3px 10px rgba(197,22,29,.18);
  transition: transform .08s ease, box-shadow .12s ease, background .12s ease;
}
.btn-chip:hover {
  background: var(--brand-700, #a50f15);
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(197,22,29,.25);
}
.btn-chip:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(197,22,29,.20);
}

/* Garante texto branco também se vier classe utilitária por engano */
.btn-chip * { color: #fff !important; }

.report-card{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:14px;box-shadow:0 4px 12px rgba(0,0,0,.05);padding:16px;}
.report-card .card-title{font-weight:700;margin:0 0 10px 0;padding:6px 8px;border-bottom:1px solid rgba(0,0,0,.05);}

select.form-control {
	height: auto !important;
	line-height: 1.35 !important;
	padding-top: 9px !important;
	padding-bottom: 9px !important;
}

