/*
  HDES / APTNEO branding layer
  - Centraliza palette e tokens de cor
  - Corrige contrastes no dark mode (Tabler)
  - Evita filtros/tints em ilustrações (usar SVG css-autodark)
*/

/*
  Theme visibility helpers
  ------------------------
  Tabler has similar helpers in newer builds, but we define them here
  to ensure logos swap correctly purely based on data-bs-theme.
*/
.hide-theme-dark { display: inline-block; }
.hide-theme-light { display: none; }

html[data-bs-theme="dark"] .hide-theme-dark { display: none !important; }
html[data-bs-theme="dark"] .hide-theme-light { display: inline-block !important; }

html[data-bs-theme="light"] .hide-theme-dark { display: inline-block !important; }
html[data-bs-theme="light"] .hide-theme-light { display: none !important; }

/* ------------------------------------------------------------------
   Parenteris logo hardening
   Alguns estilos do Tabler (autodark + filters) podem tornar SVGs
   invisíveis. Como usamos variantes light/dark, forçamos render normal.
------------------------------------------------------------------- */
.parenteris-logo {
  display: inline-block !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  /*
    IMPORTANT (Safari): nao definir height:auto em <img src="*.svg">.
    Muitos SVGs exportados do Illustrator nao tem width/height no root;
    em Safari isso pode resultar em tamanho intrinseco 0 => logo invisivel.
    Usamos alturas explicitas por contexto.
  */
  width: auto !important;
  height: 46px !important;
  max-width: none;
}

/* Variacao maior (ex.: login) */
.parenteris-logo.parenteris-logo-lg { height: 82px !important; }
.parenteris-logo.parenteris-logo-md { height: 48px !important; }

/* Evitar que o Tabler limite a largura a 0 em alguns layouts */
.navbar-brand .parenteris-logo { flex: 0 0 auto; }

/* Sidebar brand aligned to the same left rhythm as menu labels */
.navbar-vertical .navbar-brand,
.navbar-vertical .sidebar-brand {
  width: 100%;
  margin: 0 !important;
  padding: 1rem .75rem 1rem 1.5rem !important;
  justify-content: flex-start !important;
  text-align: left;
}

.navbar-vertical .navbar-brand > a,
.navbar-vertical .sidebar-brand-link {
  display: flex !important;
  align-items: center;
  justify-content: flex-start !important;
  width: 100%;
  gap: .5rem;
  padding-left: .25rem !important;
}

.navbar-vertical .sidebar-brand-link .parenteris-logo,
.navbar-vertical .navbar-brand > a .parenteris-logo {
  display: block;
  transform: translateX(.375rem);
}


/* ------------------------------------------------------------------
   Header action icons
   Make the top-right action icons visually uniform and avoid uneven
   spacing caused by mixed margins / empty nav items.
------------------------------------------------------------------- */
.aptneo-header-actions {
  gap: .625rem;
}

.aptneo-header-actions .aptneo-header-action {
  margin-right: 0 !important;
}

.aptneo-header-actions .aptneo-header-icon {
  width: 2.5rem;
  height: 2.5rem;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border-radius: .75rem;
  line-height: 1;
}

.aptneo-header-actions .aptneo-header-icon > .ti {
  font-size: 1.15rem;
}

.aptneo-header-actions #notif-btn {
  position: relative;
}

.aptneo-header-actions #notif-badge {
  position: absolute;
  top: .15rem;
  right: .1rem;
  margin-left: 0 !important;
}

:root {
  /* Bootstrap primary overrides (some components still rely on BS variables) */
  --bs-primary: var(--hdes-primary);
  --bs-primary-rgb: var(--hdes-primary-rgb);
  --bs-link-color: var(--hdes-primary);
  --bs-link-hover-color: var(--hdes-primary);

  /* Alias tokens consumed by dashboard scripts */
  --brand-primary: var(--hdes-primary);
  /* Secondary accent (used by charts / widgets). Keep explicit token to avoid JS fallbacks. */
  --brand-accent: var(--hdes-secondary);
  --brand-warm: var(--hdes-orange);
  --brand-pink: var(--hdes-pink);
  --brand-magenta: var(--hdes-magenta);
  --brand-purple: var(--hdes-purple);
  --brand-deep: var(--hdes-deep);

  /* Dopely palette (provided) */
  --hdes-orange: #F3A45F;
  --hdes-pink:   #E14571;
  --hdes-magenta:#9C3286;
  --hdes-purple: #67327F;
  --hdes-deep:   #411150;

  /* Dark mode base (recommended) */
  --hdes-dark-bg:#261c29;

  /* Primary token (UI accent) */
  --hdes-primary: var(--hdes-purple);
  --hdes-primary-rgb: 103, 50, 127;
  --hdes-secondary: var(--hdes-magenta);
  --hdes-secondary-rgb: 156, 50, 134;

  /* App-level tokens (para JS/CSS inline) */
  --aptneo-primary: var(--hdes-primary);
  --aptneo-primary-2: var(--hdes-secondary);
  --aptneo-sidebar-bg: #f6f8fb; /* cinzento claro (light) */
  --aptneo-sidebar-bg-dark: #1f2937; /* cinzento (dark) */
}

/* --------------------
   Tabler token overrides (light)
   -------------------- */
:root {
  /* Primary theme */
  --tblr-primary: var(--hdes-primary);
  --tblr-primary-rgb: var(--hdes-primary-rgb);

  /* Secondary accent */
  --tblr-secondary: var(--hdes-secondary);
  --tblr-secondary-rgb: var(--hdes-secondary-rgb);

  /* Reduce default greens/blues across UI */
  --tblr-success: var(--hdes-orange);
  --tblr-success-rgb: 243, 164, 95;

  --tblr-info: var(--hdes-magenta);
  --tblr-info-rgb: 156, 50, 134;

  --tblr-warning: var(--hdes-orange);
  --tblr-warning-rgb: 243, 164, 95;

  --tblr-danger: var(--hdes-pink);
  --tblr-danger-rgb: 225, 69, 113;

  /* Links */
  --tblr-link-color: var(--hdes-primary);
  --tblr-link-hover-color: var(--hdes-magenta);

  /* Illustrations: CSS variable used by svg-css-autodark */
  --tblr-illustrations-primary: var(--hdes-primary);
}

/*
  Buttons
  ------
  Use Tabler button CSS variables for consistent theming.
  IMPORTANT: do not apply filled styles to outline variants (it breaks contrast in light mode).
*/

/* Filled primary */
.btn-primary {
  --tblr-btn-bg: var(--hdes-primary);
  --tblr-btn-border-color: var(--hdes-primary);
  --tblr-btn-color: #ffffff;

  --tblr-btn-hover-bg: var(--hdes-magenta);
  --tblr-btn-hover-border-color: var(--hdes-magenta);
  --tblr-btn-hover-color: #ffffff;

  --tblr-btn-active-bg: var(--hdes-deep);
  --tblr-btn-active-border-color: var(--hdes-deep);
  --tblr-btn-active-color: #ffffff;
}

/* Outline primary */
.btn-outline-primary {
  --tblr-btn-bg: transparent;
  --tblr-btn-border-color: var(--hdes-primary);
  --tblr-btn-color: var(--hdes-primary);

  --tblr-btn-hover-bg: var(--hdes-primary);
  --tblr-btn-hover-border-color: var(--hdes-primary);
  --tblr-btn-hover-color: #ffffff;

  --tblr-btn-active-bg: var(--hdes-primary);
  --tblr-btn-active-border-color: var(--hdes-primary);
  --tblr-btn-active-color: #ffffff;
}

/* --------------------
   Dark theme overrides
   -------------------- */
html[data-bs-theme="dark"] {

  /* In dark mode we want the accent to switch to orange */
  --hdes-primary: var(--hdes-orange);
  --hdes-primary-rgb: 243, 164, 95;

  /* Bootstrap tokens: eliminar azuis residuais (alerts, badges, helpers) */
  --bs-primary: var(--hdes-primary);
  --bs-primary-rgb: var(--hdes-primary-rgb);
  --bs-info: var(--hdes-primary);
  --bs-info-rgb: var(--hdes-primary-rgb);
  --bs-link-color: var(--hdes-primary);
  --bs-link-hover-color: #ffffff;

  /* Remove remaining "roxo" accents in dark mode: secondary + legacy purple/magenta become orange.
     (Warnings/OK/BAD keep their own palette via dedicated classes below.) */
  --hdes-secondary: var(--hdes-orange);
  --hdes-secondary-rgb: 243, 164, 95;
  --hdes-magenta: var(--hdes-orange);
  --hdes-purple: var(--hdes-orange);
  /* Backgrounds */
  --tblr-body-bg: var(--hdes-dark-bg);
  --tblr-bg-surface: #2d2430; /* cards / surfaces */
  --tblr-card-bg: #2d2430;
  /* Tabler surfaces (secondary/tertiary) podem vir azuladas no dark; alinhar com o tinte laranja */
  --tblr-bg-surface-secondary: rgba(var(--hdes-primary-rgb), 0.08);
  --tblr-bg-surface-tertiary: rgba(var(--hdes-primary-rgb), 0.12);

  /* Forms (evitar caixas azuladas do Tabler no dark) */
  --tblr-bg-forms: #1f1724;
  --tblr-bg-forms-hover: #241a28;


  /* Text */
  --tblr-body-color: rgba(255,255,255,.92);
  --tblr-secondary: var(--hdes-secondary);
  --tblr-secondary-rgb: var(--hdes-secondary-rgb);
  --tblr-muted: rgba(255,255,255,.74);

  /* Borders */
  --tblr-border-color: rgba(255,255,255,.10);
  --tblr-border-color-translucent: rgba(255,255,255,.08);

  /* Keep accents consistent */
  --tblr-primary: var(--hdes-primary);
  --tblr-primary-rgb: var(--hdes-primary-rgb);

  /* Remove remaining blues in menus/widgets that still use Tabler palette tokens */
  --tblr-blue: var(--hdes-orange);
  --tblr-indigo: var(--hdes-orange);
  --tblr-purple: var(--hdes-orange);
  --tblr-azure: var(--hdes-orange);
  --tblr-cyan: var(--hdes-orange);

  /* Some components still use "info" as accent; in dark mode keep it aligned with orange branding */
  --tblr-info: var(--hdes-orange);
  --tblr-info-rgb: 243, 164, 95;

  --tblr-link-color: var(--hdes-orange);
  --tblr-link-hover-color: #ffffff;



  /* Illustrations */
  --tblr-illustrations-primary: var(--hdes-primary);

  /* Sidebar */
  --aptneo-sidebar-bg: var(--aptneo-sidebar-bg-dark);
}

/* Sidebar: manter cinzento como antes (light e dark) */
.navbar-vertical,
.navbar.navbar-vertical {
  background-color: var(--aptneo-sidebar-bg) !important;


}

html[data-bs-theme="dark"] .navbar-vertical,
html[data-bs-theme="dark"] .navbar.navbar-vertical {
  background-color: var(--aptneo-sidebar-bg-dark) !important;
}

/* Dark mode: botões outline com contraste */
html[data-bs-theme="dark"] .btn-outline-secondary,
html[data-bs-theme="dark"] .btn-outline-light {
  color: rgba(255,255,255,.92) !important;
  border-color: rgba(255,255,255,.22) !important;
}
html[data-bs-theme="dark"] .btn-outline-secondary:hover,
html[data-bs-theme="dark"] .btn-outline-light:hover {
  background-color: rgba(255,255,255,.08) !important;
}

/* Ensure body + main surfaces follow the tokens (some Tabler elements use direct colors) */
html[data-bs-theme="dark"] body {
  background: var(--tblr-body-bg) !important;
}
html[data-bs-theme="dark"] .card,
html[data-bs-theme="dark"] .navbar,
html[data-bs-theme="dark"] .dropdown-menu,
html[data-bs-theme="dark"] .modal-content {
  background-color: var(--tblr-bg-surface) !important;
}

/* Dark mode: top bar (header) icons should be orange for quick affordance.
   Scope only to the top header to avoid touching sidebar/menu icons. */
html[data-bs-theme="dark"] header.navbar .nav-link .ti,
html[data-bs-theme="dark"] header.navbar .nav-link .icon,
html[data-bs-theme="dark"] header.navbar .nav-link svg,
html[data-bs-theme="dark"] header.navbar .dropdown-menu .ti {
  color: var(--brand-warm) !important;
}

/* Dark mode: top bar user/menu text should follow the orange accent (avoid leftover roxo/azul).
   Keep role line muted (text-muted) for readability. */
html[data-bs-theme="dark"] header.navbar .navbar-nav.flex-row.order-md-last .nav-item.dropdown > a.nav-link {
  color: var(--brand-warm) !important;
}
html[data-bs-theme="dark"] header.navbar .navbar-nav.flex-row.order-md-last .nav-item.dropdown > a.nav-link .d-none.d-xl-block > div:first-child {
  color: var(--brand-warm) !important;
}

/* Dropdown (header + menus): remove default blue hover/active states */
html[data-bs-theme="dark"] .dropdown-menu .dropdown-item:hover,
html[data-bs-theme="dark"] .dropdown-menu .dropdown-item:focus {
  background-color: rgba(var(--hdes-primary-rgb), 0.14) !important;
  color: rgba(255,255,255,.92) !important;
}
html[data-bs-theme="dark"] .dropdown-menu .dropdown-item.active,
html[data-bs-theme="dark"] .dropdown-menu .dropdown-item:active {
  background-color: rgba(var(--hdes-primary-rgb), 0.22) !important;
  color: rgba(255,255,255,.92) !important;
}

/* Widgets/headings: ensure "roxo" utility colors map to orange in dark mode, without touching status colors */
html[data-bs-theme="dark"] .page-pretitle,
html[data-bs-theme="dark"] .text-purple,
html[data-bs-theme="dark"] .text-indigo,
html[data-bs-theme="dark"] .text-blue,
html[data-bs-theme="dark"] .text-azure,
html[data-bs-theme="dark"] .text-cyan {
  color: var(--brand-warm) !important;
}

/* Dark mode readability: common low-contrast helpers */
html[data-bs-theme="dark"] .text-muted,
html[data-bs-theme="dark"] .form-hint,
html[data-bs-theme="dark"] .form-text,
html[data-bs-theme="dark"] .helptext,
html[data-bs-theme="dark"] small {
  color: var(--tblr-muted) !important;
}
html[data-bs-theme="dark"] .form-control::placeholder,
html[data-bs-theme="dark"] textarea::placeholder {
  color: rgba(255,255,255,.55) !important;
}
html[data-bs-theme="dark"] .form-control,
html[data-bs-theme="dark"] .form-select,
html[data-bs-theme="dark"] .input-group-text {
  color: rgba(255,255,255,.92);
  background-color: var(--tblr-bg-forms);
  border-color: rgba(255,255,255,.12);
}

html[data-bs-theme="dark"] .form-control::placeholder {
  color: rgba(255,255,255,.40);
}

html[data-bs-theme="dark"] .form-control:focus,
html[data-bs-theme="dark"] .form-select:focus {
  background-color: var(--tblr-bg-forms);
  border-color: rgba(var(--hdes-primary-rgb), .55);
  box-shadow: 0 0 0 .25rem rgba(var(--hdes-primary-rgb), .15);
}

/* Botões/links: evitar o foco azul (Safari/WebKit) e alinhar com o branding */
html[data-bs-theme="dark"] .btn:focus,
html[data-bs-theme="dark"] .btn:focus-visible,
html[data-bs-theme="dark"] a:focus,
html[data-bs-theme="dark"] a:focus-visible,
html[data-bs-theme="dark"] .nav-link:focus,
html[data-bs-theme="dark"] .nav-link:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 .25rem rgba(var(--hdes-primary-rgb), .20) !important;
}

html[data-bs-theme="dark"] .btn-close:focus,
html[data-bs-theme="dark"] .btn-close:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 .25rem rgba(var(--hdes-primary-rgb), .20) !important;
}


/* Safari: tornar o indicador do datepicker visível no dark */
html[data-bs-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator,
html[data-bs-theme="dark"] input[type="time"]::-webkit-calendar-picker-indicator {
  filter: invert(1) saturate(0) brightness(0.85);
  opacity: .8;
}
/* Tables (dark mode): Tabler defaults podem cair em tons azulados (thead/table-secondary).
   Forçamos um tinte laranja sutil (branding) e mantemos OK/WARN/BAD intocados. */
html[data-bs-theme="dark"] .table > thead > tr > th {
  background-color: rgba(var(--hdes-primary-rgb), 0.10) !important;
  color: var(--brand-warm) !important;
}
html[data-bs-theme="dark"] .table > thead > tr > th a {
  color: var(--brand-warm) !important;
}
html[data-bs-theme="dark"] .table-secondary {
  --bs-table-bg: rgba(var(--hdes-primary-rgb), 0.10) !important;
  --bs-table-striped-bg: rgba(var(--hdes-primary-rgb), 0.13) !important;
  --bs-table-hover-bg: rgba(var(--hdes-primary-rgb), 0.16) !important;
  --bs-table-border-color: rgba(255,255,255,.10) !important;
  --bs-table-color: rgba(255,255,255,.92) !important;
}

/* Notificações (modal): Tabler/Bootstrap podem aplicar hover/focus com azul.
   Forçamos um hover neutro (tinte laranja subtil) e removemos o tap highlight azul do Safari. */
html[data-bs-theme="dark"] #notificationsModal * {
  -webkit-tap-highlight-color: transparent;
}
html[data-bs-theme="dark"] #notificationsModal .table-hover tbody tr:hover > * {
  background-color: rgba(var(--hdes-primary-rgb), 0.10) !important;
}
html[data-bs-theme="dark"] #notificationsModal .table-hover tbody tr:focus-within > * {
  background-color: rgba(var(--hdes-primary-rgb), 0.12) !important;
}

/* Toasts (notificações no canto superior direito):
   No Safari/Tabler o header pode herdar tons azulados. Forçamos tokens neutros. */
html[data-bs-theme="dark"] .toast {
  --bs-toast-bg: var(--tblr-bg-surface);
  --bs-toast-header-bg: rgba(255,255,255,.04);
  --bs-toast-border-color: rgba(255,255,255,.10);
  --bs-toast-header-color: rgba(255,255,255,.92);
  color: rgba(255,255,255,.92);
  background-color: var(--tblr-bg-surface) !important;
  border-color: rgba(255,255,255,.10) !important;
}
html[data-bs-theme="dark"] .toast .toast-header {
  background-color: rgba(255,255,255,.04) !important;
  color: rgba(255,255,255,.92) !important;
  border-bottom-color: rgba(255,255,255,.10) !important;
}
html[data-bs-theme="dark"] .toast .toast-body {
  color: rgba(255,255,255,.90) !important;
}
html[data-bs-theme="dark"] .toast .btn-close {
  filter: invert(1) grayscale(1) brightness(1.05);
}

/* Status pills used in validations / resumo */
.aptneo-state {
  display:inline-block;
  align-items:center;
  gap:.35rem;
  padding:.15rem .5rem;
  border-radius:999px;
  font-weight:600;
  font-size:.75rem;
}
.aptneo-ok   { background: rgba(103, 50, 127, .14); color: var(--hdes-deep); }
.aptneo-warn { background: rgba(243, 164, 95, .22); color: #7a3c00; }
.aptneo-bad  { background: rgba(225, 69, 113, .18); color: #7a1f37; }

html[data-bs-theme="dark"] .aptneo-ok   { background: rgba(103, 50, 127, .22); color: rgba(255,255,255,.92); }
html[data-bs-theme="dark"] .aptneo-warn { background: rgba(243, 164, 95, .25); color: rgba(255,255,255,.92); }
html[data-bs-theme="dark"] .aptneo-bad  { background: rgba(225, 69, 113, .22); color: rgba(255,255,255,.92); }

/* --------------------
   Success hero illustration (Tabler svg-css-autodark)
   -------------------- */
.aptneo-illus-wrap{display:inline-block; line-height:0;}
.aptneo-illus-svg{height:64px; width:auto; display:block;}

/* Ilustrações: evitar filtros globais (podem distorcer tons). */

/* Logo swap (light/dark) */
.brand-logo-dark{display:none;}
html[data-bs-theme="dark"] .brand-logo-light{display:none;}
html[data-bs-theme="dark"] .brand-logo-dark{display:inline-block;}

/* --------------------
   Dark mode: sidebar + dashboard polish
   -------------------- */

/* Sidebar: keep the same surface tone as the UI, but ensure text contrast */
html[data-bs-theme="dark"] .navbar-vertical,
html[data-bs-theme="dark"] .navbar.navbar-vertical {
  background-color: var(--tblr-bg-surface) !important;
}

html[data-bs-theme="dark"] .navbar-vertical .nav-link {
  color: rgba(255, 255, 255, 0.78) !important;
}
html[data-bs-theme="dark"] .navbar-vertical .nav-link:hover {
  color: rgba(255, 255, 255, 0.92) !important;
}
html[data-bs-theme="dark"] .navbar-vertical .nav-link.active,
html[data-bs-theme="dark"] .navbar-vertical .nav-link[aria-current="page"] {
  color: #fff !important;
  background: rgba(var(--hdes-primary-rgb), 0.16) !important;
  border-radius: .5rem;
}

/* Force logo to render white on dark sidebar */
html[data-bs-theme="dark"] .navbar-vertical .navbar-brand img,
html[data-bs-theme="dark"] .navbar-vertical .navbar-brand-img {
  filter: none !important;
}

/* Dashboard header helper text: higher-contrast accent */
html[data-bs-theme="dark"] .page-header .text-secondary {
  color: #f3a45f !important;
}

/* "Ver todas" uses btn-outline-primary: ensure legible in dark mode */
html[data-bs-theme="dark"] .btn.btn-outline-primary {
  color: #fff !important;
  border-color: rgba(var(--hdes-primary-rgb), 0.70) !important;
}
html[data-bs-theme="dark"] .btn.btn-outline-primary:hover,
html[data-bs-theme="dark"] .btn.btn-outline-primary:focus {
  background: rgba(var(--hdes-primary-rgb), 0.22) !important;
  border-color: rgba(var(--hdes-primary-rgb), 0.90) !important;
}

/* ---------------------------------------------------------------------
   Dark mode: eliminar de vez fundos "azuis" do Tabler
   - Alguns badges/headers usam classes *-lt (blue/azure/primary-lt) que
     referenciam tokens "*_lt" não cobertos por --tblr-blue.
   - Forçamos todos os "lt" da família azul para um tinte de marca (laranja).
------------------------------------------------------------------------ */

html[data-bs-theme="dark"] .bg-blue-lt,
html[data-bs-theme="dark"] .bg-azure-lt,
html[data-bs-theme="dark"] .bg-indigo-lt,
html[data-bs-theme="dark"] .bg-cyan-lt,
html[data-bs-theme="dark"] .bg-info-lt,
html[data-bs-theme="dark"] .bg-teal-lt,
html[data-bs-theme="dark"] .bg-sky-lt,
html[data-bs-theme="dark"] .bg-primary-lt {
  background-color: rgba(var(--hdes-primary-rgb), 0.14) !important;
  color: rgba(255,255,255,.92) !important;
}

html[data-bs-theme="dark"] .badge.bg-blue-lt,
html[data-bs-theme="dark"] .badge.bg-azure-lt,
html[data-bs-theme="dark"] .badge.bg-indigo-lt,
html[data-bs-theme="dark"] .badge.bg-cyan-lt,
html[data-bs-theme="dark"] .badge.bg-info-lt,
html[data-bs-theme="dark"] .badge.bg-teal-lt,
html[data-bs-theme="dark"] .badge.bg-sky-lt,
html[data-bs-theme="dark"] .badge.bg-primary-lt {
  border: 1px solid rgba(var(--hdes-primary-rgb), 0.22) !important;
}

/* Card headers com bg-*-lt: manter contraste e coerência */
html[data-bs-theme="dark"] .card-header.bg-blue-lt,
html[data-bs-theme="dark"] .card-header.bg-azure-lt,
html[data-bs-theme="dark"] .card-header.bg-indigo-lt,
html[data-bs-theme="dark"] .card-header.bg-cyan-lt,
html[data-bs-theme="dark"] .card-header.bg-info-lt,
html[data-bs-theme="dark"] .card-header.bg-teal-lt,
html[data-bs-theme="dark"] .card-header.bg-sky-lt,
html[data-bs-theme="dark"] .card-header.bg-primary-lt {
  background-color: rgba(var(--hdes-primary-rgb), 0.12) !important;
  color: rgba(255,255,255,.92) !important;
}

/* Dark mode: neutralizar classes "info"/"primary" que ainda puxam azul do Bootstrap/Tabler */
html[data-bs-theme="dark"] .bg-info,
html[data-bs-theme="dark"] .text-bg-info,
html[data-bs-theme="dark"] .badge.bg-info,
html[data-bs-theme="dark"] .btn-info,
html[data-bs-theme="dark"] .alert.alert-info {
  background-color: rgba(var(--hdes-primary-rgb), 0.14) !important;
  border-color: rgba(var(--hdes-primary-rgb), 0.22) !important;
  color: rgba(255,255,255,.92) !important;
}

html[data-bs-theme="dark"] .btn-info:hover,
html[data-bs-theme="dark"] .btn-info:focus {
  background-color: rgba(var(--hdes-primary-rgb), 0.22) !important;
  border-color: rgba(var(--hdes-primary-rgb), 0.32) !important;
}



/* Unified status badge (brand accent): purple in light, orange in dark */
.badge-status {
  background: var(--hdes-primary) !important;
  border-color: var(--hdes-primary) !important;
  color: #ffffff !important;
}
/* Dashboard (dark mode) contrast + charts */
html[data-bs-theme="dark"] .dashboard-medico .text-secondary {
  color: var(--brand-primary, #f3a45f) !important;
}
html[data-bs-theme="dark"] .dashboard-medico .form-select {
  background-color: rgba(38, 28, 41, .65) !important; /* #261c29 */
  color: rgba(255,255,255,.92) !important;
  border-color: rgba(255,255,255,.14) !important;
}
html[data-bs-theme="dark"] .dashboard-medico .form-select:focus {
  border-color: var(--brand-primary, #f3a45f) !important;
  box-shadow: 0 0 0 .25rem rgba(var(--hdes-primary-rgb), .20) !important;
}
html[data-bs-theme="dark"] .dashboard-medico .btn-dashboard-ver-todas {
  color: rgba(255,255,255,.92) !important;
}
html[data-bs-theme="dark"] .dashboard-medico .apexcharts-canvas,
html[data-bs-theme="dark"] .dashboard-medico .apexcharts-svg,
html[data-bs-theme="dark"] .dashboard-medico .apexcharts-inner {
  background: transparent !important;
}
html[data-bs-theme="dark"] .dashboard-medico .apexcharts-legend-text {
  color: rgba(255,255,255,.92) !important;
}
html[data-bs-theme="dark"] .dashboard-medico .apexcharts-text.apexcharts-legend-text {
  fill: rgba(255,255,255,.92) !important;
}
html[data-bs-theme="dark"] .dashboard-medico .apexcharts-datalabel,
html[data-bs-theme="dark"] .dashboard-medico .apexcharts-datalabel-label,
html[data-bs-theme="dark"] .dashboard-medico .apexcharts-datalabel-value {
  fill: rgba(255,255,255,.92) !important;
}

/* =========================
   Dashboard Médico – refinamentos de contraste (light + dark)
   ========================= */

.dashboard-medico .table thead th,
.dashboard-medico .table thead th a {
  color: var(--brand-primary) !important;
}

.dashboard-medico .btn-open-prescription {
  color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
  background: transparent !important;
}
.dashboard-medico .btn-open-prescription:hover,
.dashboard-medico .btn-open-prescription:focus {
  background: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
  color: #261c29 !important;
}

/* Sidebar (modo normal): texto cinzento, ativo em roxo */
html[data-bs-theme='light'] .navbar-vertical .nav-link {
  color: #6b7280; /* cinzento */
}
html[data-bs-theme='light'] .navbar-vertical .nav-link:hover {
  color: var(--brand-primary);
}
html[data-bs-theme='light'] .navbar-vertical .nav-link.active,
html[data-bs-theme='light'] .navbar-vertical .nav-link[aria-current='page'] {
  color: var(--brand-primary);
}

/* Ver todas: garantir contraste no dark */
html[data-bs-theme='dark'] .dashboard-medico .btn-dashboard-ver-todas {
  color: #ffffff !important;
}

/* ApexCharts: legendas/labels legíveis no dark */
html[data-bs-theme='dark'] .dashboard-medico .apexcharts-legend-text,
html[data-bs-theme='dark'] .dashboard-medico .apexcharts-text,
html[data-bs-theme='dark'] .dashboard-medico .apexcharts-datalabel {
  fill: #ffffff !important;
}

/* ApexCharts: fundo transparente (evitar cartões brancos) */
.dashboard-medico .apexcharts-canvas,
.dashboard-medico .apexcharts-svg {
  background: transparent !important;
}

/* ============================================================
   Widgets / Relações clínicas (esquema de cores baseline)
   ============================================================ */

/* Inputs auto-preenchidos/recalculados: realce leve */
.aptneo-autofilled {
  animation: aptneo-flash 0.9s ease-in-out 1;
}

@keyframes aptneo-flash {
  0%   { box-shadow: 0 0 0 0 rgba(243, 164, 95, 0.0); }
  35%  { box-shadow: 0 0 0 6px rgba(243, 164, 95, 0.18); }
  100% { box-shadow: 0 0 0 0 rgba(243, 164, 95, 0.0); }
}

/* ---------- Widgets / Resumo de Cálculo (Tempo Real) ---------- */

/* Cards */
.aptneo-metric-card {
  border-left: 4px solid rgba(243, 164, 95, 0.75);
  background: rgba(255, 255, 255, 0.02);
}

html[data-bs-theme="dark"] .aptneo-metric-card {
  background: rgba(255, 255, 255, 0.03);
  border-left-color: rgba(243, 164, 95, 0.95);
}

/* Estados (ok/warn/bad) — usados pelas validações em tempo real */
.aptneo-metric-card.state-ok {
  border-left-color: rgba(43, 162, 114, 0.85);
}

.aptneo-metric-card.state-warn {
  border-left-color: rgba(243, 164, 95, 0.95);
}

.aptneo-metric-card.state-bad {
  border-left-color: rgba(212, 77, 77, 0.9);
}

html[data-bs-theme="dark"] .aptneo-metric-card.state-ok {
  border-left-color: rgba(43, 162, 114, 0.95);
}

html[data-bs-theme="dark"] .aptneo-metric-card.state-bad {
  border-left-color: rgba(212, 77, 77, 0.95);
}

/* Badges */
.aptneo-badge-ok {
  background: rgba(43, 162, 114, 0.18);
  color: #2ba272;
  border: 1px solid rgba(43, 162, 114, 0.22);
}

.aptneo-badge-warn {
  background: rgba(243, 164, 95, 0.22);
  color: #f3a45f;
  border: 1px solid rgba(243, 164, 95, 0.25);
}

.aptneo-badge-bad {
  background: rgba(212, 77, 77, 0.18);
  color: #d44d4d;
  border: 1px solid rgba(212, 77, 77, 0.22);
}

/* Progress */
/*
  Nota: nos widgets de "Relações clínicas" o markup é:
    <div class="progress"><div class="progress-bar aptneo-progress" ...></div></div>
  Ou seja, a classe aptneo-progress está no .progress-bar (não no container).
  Suportamos ambos os padrões (container OU bar) para evitar regressões.
*/

/* Track (scoped to metric cards to not interfere with other progress components) */
.aptneo-metric-card .progress,
.aptneo-metric-card .progress.aptneo-progress {
  height: 6px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.06);
}

html[data-bs-theme="dark"] .aptneo-metric-card .progress,
html[data-bs-theme="dark"] .aptneo-metric-card .progress.aptneo-progress {
  background: rgba(255, 255, 255, 0.12);
}

/* Default fill (current markup: class on bar) */
.aptneo-metric-card .progress .progress-bar.aptneo-progress {
  border-radius: 999px;
  background: linear-gradient(90deg, var(--hdes-orange), var(--hdes-magenta));
}

.aptneo-metric-card .progress .progress-bar.aptneo-progress.aptneo-ok {
  background: linear-gradient(90deg, #2ba272, var(--hdes-orange));
}

.aptneo-metric-card .progress .progress-bar.aptneo-progress.aptneo-bad {
  background: linear-gradient(90deg, #d44d4d, var(--hdes-magenta));
}

.aptneo-metric-card .progress .progress-bar.aptneo-progress.aptneo-warn {
  background: linear-gradient(90deg, var(--hdes-orange), #2ba272);
}

/* Alternate markup support (if aptneo-progress is moved to the container in the future) */
.aptneo-metric-card .progress.aptneo-progress .progress-bar {
  border-radius: 999px;
  background: linear-gradient(90deg, var(--hdes-orange), var(--hdes-magenta));
}

.aptneo-metric-card .progress.aptneo-progress.aptneo-ok .progress-bar {
  background: linear-gradient(90deg, #2ba272, var(--hdes-orange));
}

.aptneo-metric-card .progress.aptneo-progress.aptneo-bad .progress-bar {
  background: linear-gradient(90deg, #d44d4d, var(--hdes-magenta));
}

.aptneo-metric-card .progress.aptneo-progress.aptneo-warn .progress-bar {
  background: linear-gradient(90deg, var(--hdes-orange), #2ba272);
}

/* ------------------------------------------------------------
   Prescription form: solution separators (Solução I / II)
------------------------------------------------------------- */

.aptneo-solution-sep td {
  background: rgba(var(--tblr-primary-rgb), 0.06) !important;
  color: var(--tblr-body-color) !important;
  border-top: 1px solid rgba(var(--tblr-border-color-rgb), 0.6);
  border-bottom: 1px solid rgba(var(--tblr-border-color-rgb), 0.6);
}

html[data-bs-theme="dark"] .aptneo-solution-sep td {
  background: rgba(255, 255, 255, 0.06) !important;
  color: rgba(255, 255, 255, 0.9) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

/* ------------------------------------------------------------
   Litepicker (Tabler date picker): dark mode styling
------------------------------------------------------------- */

html[data-bs-theme="dark"] .litepicker {
  color: rgba(255, 255, 255, 0.92);
}

html[data-bs-theme="dark"] .litepicker .container__main {
  background: rgba(18, 16, 24, 0.98);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 10px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
}

html[data-bs-theme="dark"] .litepicker .container__months,
html[data-bs-theme="dark"] .litepicker .container__days {
  background: transparent;
}

html[data-bs-theme="dark"] .litepicker .month-item-header,
html[data-bs-theme="dark"] .litepicker .month-item-weekdays-row > div {
  color: rgba(255, 255, 255, 0.75);
}

html[data-bs-theme="dark"] .litepicker .button-previous-month,
html[data-bs-theme="dark"] .litepicker .button-next-month {
  color: rgba(255, 255, 255, 0.85);
}

html[data-bs-theme="dark"] .litepicker .day-item {
  color: rgba(255, 255, 255, 0.9);
}

html[data-bs-theme="dark"] .litepicker .day-item:hover {
  background: rgba(var(--aptneo-accent-rgb), 0.18);
  border-radius: 8px;
}

html[data-bs-theme="dark"] .litepicker .day-item.is-today {
  color: rgba(255, 255, 255, 0.95);
  outline: 1px solid rgba(var(--aptneo-accent-rgb), 0.45);
  border-radius: 8px;
}

html[data-bs-theme="dark"] .litepicker .day-item.is-start-date,
html[data-bs-theme="dark"] .litepicker .day-item.is-end-date,
html[data-bs-theme="dark"] .litepicker .day-item.is-in-range {
  background: rgba(var(--aptneo-accent-rgb), 0.35);
  color: rgba(255, 255, 255, 0.98);
  border-radius: 8px;
}

/* ------------------------------------------------------------
   ApexCharts tooltips: improve readability in dark mode
   (patient history sparklines, dashboards)
------------------------------------------------------------ */
html[data-bs-theme="dark"] .apexcharts-tooltip {
  background: rgba(17, 24, 39, 0.92) !important; /* slate-900 */
  color: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45) !important;
}
html[data-bs-theme="dark"] .apexcharts-tooltip .apexcharts-tooltip-title {
  background: transparent !important;
  color: rgba(255, 255, 255, 0.82) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
}
html[data-bs-theme="dark"] .apexcharts-tooltip-text,
html[data-bs-theme="dark"] .apexcharts-tooltip-text-y-value,
html[data-bs-theme="dark"] .apexcharts-tooltip-text-y-label,
html[data-bs-theme="dark"] .apexcharts-tooltip-text-z-value {
  color: rgba(255, 255, 255, 0.92) !important;
}


/* ---------------------------------------------------------------------
   Dark mode: remove remaining native blue accents (inputs / toggles)
   - File input button is user-agent styled (often blue). Override.
------------------------------------------------------------------------ */

html[data-bs-theme="dark"] input[type="file"]::file-selector-button,
html[data-bs-theme="dark"] input[type="file"]::-webkit-file-upload-button {
  background: var(--hdes-primary) !important;
  border: 1px solid var(--hdes-primary) !important;
  color: #ffffff !important;
  border-radius: .5rem;
  padding: .35rem .75rem;
  margin-right: .75rem;
}

html[data-bs-theme="dark"] input[type="file"]::file-selector-button:hover,
html[data-bs-theme="dark"] input[type="file"]::-webkit-file-upload-button:hover {
  filter: brightness(.95);
}

html[data-bs-theme="dark"] .form-check-input:checked {
  background-color: var(--hdes-primary) !important;
  border-color: var(--hdes-primary) !important;
}
html[data-bs-theme="dark"] .form-check-input:focus {
  border-color: rgba(var(--hdes-primary-rgb), .65) !important;
  box-shadow: 0 0 0 .25rem rgba(var(--hdes-primary-rgb), .20) !important;
}

html[data-bs-theme="dark"] .form-control:focus,
html[data-bs-theme="dark"] .form-select:focus {
  border-color: rgba(var(--hdes-primary-rgb), .65) !important;
  box-shadow: 0 0 0 .25rem rgba(var(--hdes-primary-rgb), .20) !important;
}


/* --------------------
   Dashboard Admin - logs tabs / pre dark mode polish
   Evita tons azuis residuais do Tabler nas tabs e no bloco <pre>.
   -------------------- */
html[data-bs-theme="dark"] .aptneo-log-tabs {
  border-bottom-color: rgba(255,255,255,.08) !important;
}

html[data-bs-theme="dark"] .aptneo-log-tabs .nav-link {
  color: rgba(255,255,255,.68) !important;
  border: 1px solid transparent !important;
  border-bottom: 0 !important;
  background: transparent !important;
  margin-bottom: -1px;
}

html[data-bs-theme="dark"] .aptneo-log-tabs .nav-link:hover,
html[data-bs-theme="dark"] .aptneo-log-tabs .nav-link:focus {
  color: #fff !important;
  background: rgba(var(--hdes-primary-rgb), .10) !important;
  border-color: rgba(var(--hdes-primary-rgb), .22) !important;
}

html[data-bs-theme="dark"] .aptneo-log-tabs .nav-link.active,
html[data-bs-theme="dark"] .aptneo-log-tabs .nav-link[aria-selected="true"] {
  color: #fff !important;
  background: rgba(var(--hdes-primary-rgb), .16) !important;
  border-color: rgba(var(--hdes-primary-rgb), .26) !important;
  box-shadow: inset 0 0 0 1px rgba(243,164,95,.12);
}

html[data-bs-theme="dark"] .aptneo-log-tab-content {
  background: transparent !important;
}

html[data-bs-theme="dark"] .aptneo-log-scroll {
  scrollbar-color: rgba(var(--hdes-primary-rgb), .45) rgba(255,255,255,.04);
}

html[data-bs-theme="dark"] .aptneo-log-pre,
html[data-bs-theme="dark"] .aptneo-log-pre code,
html[data-bs-theme="dark"] .card .aptneo-log-pre {
  background: rgba(23, 17, 28, .92) !important;
  color: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(255,255,255,.06) !important;
  border-radius: .75rem;
  padding: 1rem !important;
}

html[data-bs-theme="dark"] .card .text-secondary small code,
html[data-bs-theme="dark"] .card .text-secondary code {
  background: rgba(var(--hdes-primary-rgb), .14) !important;
  color: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(var(--hdes-primary-rgb), .18) !important;
}



/* ------------------------------------------------------------------
   Phase 80 — validation layout cleanup
   - matching button removed from prescription detail (auto-matching on validation)
   - validation page uses three clearer columns on desktop
   - tighter, more even spacing between validation / prescription / widgets
------------------------------------------------------------------- */
.prescription-validate-grid > [class*="col-"] {
  min-width: 0;
}

.prescription-validate-grid .card {
  min-width: 0;
}

.prescription-validate-grid .table-responsive {
  min-width: 0;
}

.prescription-widgets-sticky > .card {
  margin-bottom: 0 !important;
}

@media (min-width: 1200px) {
  .prescription-validate-grid {
    --tblr-gutter-x: 1rem;
    --tblr-gutter-y: 1rem;
  }

  .prescription-validate-grid > .col-xl-4 > .card,
  .prescription-validate-grid > .col-xl-4 > .position-sticky > .card {
    height: 100%;
  }
}


/* Phase126: mensagens compactas e ações fora do canto superior direito */
.aptneo-illus-wrap svg{
  width: 88px !important;
  height: auto !important;
  max-width: 18vw !important;
  max-height: 82px !important;
  display: block !important;
}
.aptneo-success-hero{
  min-height: auto !important;
  padding: .85rem 1rem !important;
  overflow: hidden;
}
.aptneo-action-strip{
  margin-top: .75rem;
  margin-bottom: 1rem;
}
.aptneo-action-card{
  border: 1px solid rgba(var(--hdes-primary-rgb), .18);
  border-radius: 14px;
  background: linear-gradient(90deg, rgba(var(--hdes-primary-rgb), .055), rgba(243,164,95,.06));
}
.aptneo-action-card .avatar{
  background: rgba(var(--hdes-primary-rgb), .10);
  color: var(--hdes-primary);
}
.aptneo-countdown-card{
  border-left: 3px solid var(--hdes-primary);
}
html[data-bs-theme="dark"] .aptneo-action-card{
  background: linear-gradient(90deg, rgba(var(--hdes-primary-rgb), .18), rgba(243,164,95,.10));
  border-color: rgba(var(--hdes-primary-rgb), .34);
}


/* Phase127: remove “core” actions from the far-right header slot.
   Header actions now sit under the page title/description and align left,
   matching the operational workflow copy. */
.page-header > .row > .col-auto.ms-auto.d-print-none {
  margin-left: 0 !important;
  flex: 0 0 100%;
  width: 100%;
  margin-top: .65rem;
  order: 3;
}
.page-header > .row > .col-auto.ms-auto.d-print-none .btn-list,
.page-header > .row > .col-auto.ms-auto.d-print-none.d-flex {
  justify-content: flex-start !important;
  flex-wrap: wrap;
}
.page-header > .row > .col-auto.ms-auto.d-print-none .btn,
.page-header > .row > .col-auto.ms-auto.d-print-none button.btn {
  margin-left: 0;
}

/* Phase127: dashboard countdown cards behave like the other KPI widgets. */
.aptneo-countdown-card {
  border-left: 0 !important;
}
.aptneo-countdown-card .card-body {
  min-height: 7rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.aptneo-countdown-card .text-secondary {
  line-height: 1.25;
}

/* Phase128: contextual dashboard welcome, action spacing and dynamic KPI cards. */
.aptneo-welcome-title {
  letter-spacing: -0.015em;
}

/* Keep contextual page actions after the workflow description, but with a safe
   breathing space before the first rounded card/hero below. */
.page-header > .row > .col-auto.ms-auto.d-print-none {
  margin-top: .9rem !important;
  margin-bottom: 1.25rem !important;
}
.page-header + .row,
.page-header + .card,
.page-header + .aptneo-action-strip {
  margin-top: .35rem;
}
.page-header + .row.row-cards,
.page-header + .row.row-deck {
  margin-top: .65rem;
}

.aptneo-dashboard-grid > [class*="col-"] {
  display: flex;
}
.aptneo-dashboard-grid > [class*="col-"] > .card,
.dashboard-tsdt .row-cards > [class*="col-"] > .card.card-sm,
.dashboard-farmaceutico .row-cards > [class*="col-"] > .card.card-sm,
.dashboard-medico .row-cards > [class*="col-"] > .card.card-sm,
.dashboard-enfermeiro .row-cards > [class*="col-"] > .card.card-sm {
  width: 100%;
  height: 100%;
}

.aptneo-kpi-card {
  --aptneo-kpi-rgb: var(--hdes-primary-rgb);
  --aptneo-kpi-solid: var(--hdes-primary);
  position: relative;
  overflow: hidden;
  border-left: 4px solid rgba(var(--aptneo-kpi-rgb), .88) !important;
  box-shadow:
    0 10px 28px rgba(var(--aptneo-kpi-rgb), .09),
    0 2px 8px rgba(18, 24, 38, .04) !important;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.aptneo-kpi-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(var(--aptneo-kpi-rgb), .075), transparent 52%);
  opacity: .95;
}
.aptneo-kpi-card > .card-body,
.aptneo-kpi-card > .card-header,
.aptneo-kpi-card > .card-footer {
  position: relative;
  z-index: 1;
}
.aptneo-kpi-card.card-sm > .card-body,
.aptneo-kpi-card .card-body {
  min-height: 7.6rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.aptneo-kpi-card .subheader,
.aptneo-kpi-card .font-weight-medium {
  color: rgb(var(--aptneo-kpi-rgb)) !important;
}
.aptneo-kpi-card .text-secondary,
.aptneo-kpi-card .text-muted {
  line-height: 1.25;
}
.aptneo-kpi-card:hover {
  transform: translateY(-1px);
  box-shadow:
    0 14px 34px rgba(var(--aptneo-kpi-rgb), .13),
    0 4px 12px rgba(18, 24, 38, .06) !important;
}

.aptneo-kpi--primary { --aptneo-kpi-rgb: 103, 50, 127; --aptneo-kpi-solid: #67327F; }
.aptneo-kpi--clinical { --aptneo-kpi-rgb: 156, 50, 134; --aptneo-kpi-solid: #9C3286; }
.aptneo-kpi--production { --aptneo-kpi-rgb: 243, 164, 95; --aptneo-kpi-solid: #F3A45F; }
.aptneo-kpi--qc { --aptneo-kpi-rgb: 80, 151, 177; --aptneo-kpi-solid: #5097B1; }
.aptneo-kpi--transport { --aptneo-kpi-rgb: 92, 119, 188; --aptneo-kpi-solid: #5C77BC; }
.aptneo-kpi--maintenance { --aptneo-kpi-rgb: 103, 50, 127; --aptneo-kpi-solid: #67327F; }
.aptneo-kpi--micro { --aptneo-kpi-rgb: 156, 50, 134; --aptneo-kpi-solid: #9C3286; }
.aptneo-kpi--success { --aptneo-kpi-rgb: 59, 154, 101; --aptneo-kpi-solid: #3B9A65; }
.aptneo-kpi--warning { --aptneo-kpi-rgb: 243, 164, 95; --aptneo-kpi-solid: #F3A45F; }
.aptneo-kpi--danger { --aptneo-kpi-rgb: 225, 69, 113; --aptneo-kpi-solid: #E14571; }

.aptneo-countdown-card {
  border-left: 4px solid rgba(var(--aptneo-kpi-rgb), .88) !important;
}
.aptneo-countdown-card .card-body {
  min-height: 7.6rem;
  justify-content: center;
}

html[data-bs-theme="dark"] .aptneo-kpi-card {
  box-shadow:
    0 12px 30px rgba(var(--aptneo-kpi-rgb), .18),
    0 0 0 1px rgba(var(--aptneo-kpi-rgb), .12) !important;
}
html[data-bs-theme="dark"] .aptneo-kpi-card::before {
  background: linear-gradient(90deg, rgba(var(--aptneo-kpi-rgb), .16), transparent 58%);
  opacity: .8;
}
html[data-bs-theme="dark"] .aptneo-kpi-card .subheader,
html[data-bs-theme="dark"] .aptneo-kpi-card .font-weight-medium {
  color: rgb(var(--aptneo-kpi-rgb)) !important;
}

@media (max-width: 767.98px) {
  .page-header > .row > .col-auto.ms-auto.d-print-none {
    margin-bottom: 1rem !important;
  }
  .aptneo-kpi-card.card-sm > .card-body,
  .aptneo-kpi-card .card-body {
    min-height: 6.6rem;
  }
}

/* ------------------------------------------------------------------
   Phase129 — dashboard card spacing + flat dark mode
   - Removes the internal gradient wash from dashboard/action cards.
   - Keeps the contextual left colour rail and dynamic status colour.
   - Normalises gutters and card heights across dashboard grids.
------------------------------------------------------------------- */
.aptneo-dashboard-grid,
.row.row-cards.aptneo-dashboard-grid,
.row.row-deck.aptneo-dashboard-grid {
  --tblr-gutter-x: 1.15rem;
  --tblr-gutter-y: 1.15rem;
  row-gap: var(--tblr-gutter-y);
}

.aptneo-dashboard-grid + .card,
.aptneo-dashboard-grid + .table-responsive,
.aptneo-dashboard-grid + .row,
.dashboard-tsdt .aptneo-dashboard-grid + .card,
.dashboard-farmaceutico .aptneo-dashboard-grid + .card {
  margin-top: 1.35rem !important;
}

.aptneo-kpi-card,
.aptneo-countdown-card {
  background: var(--tblr-card-bg, #fff) !important;
  background-image: none !important;
  border-top: 1px solid rgba(18, 24, 38, .055) !important;
  border-right: 1px solid rgba(18, 24, 38, .055) !important;
  border-bottom: 1px solid rgba(18, 24, 38, .055) !important;
  border-left-width: 4px !important;
  min-height: 7.15rem;
}

.aptneo-kpi-card::before,
.aptneo-countdown-card::before {
  display: none !important;
  content: none !important;
  background: none !important;
}

.aptneo-kpi-card.card-sm > .card-body,
.aptneo-kpi-card .card-body,
.aptneo-countdown-card .card-body {
  min-height: 7.15rem;
  padding: 1.05rem 1.15rem !important;
  justify-content: center;
}

.aptneo-kpi-card .subheader {
  margin-bottom: .35rem;
  letter-spacing: .045em;
}

.aptneo-kpi-card .h1,
.aptneo-kpi-card .h2 {
  line-height: 1.05;
}

.aptneo-kpi-card .text-secondary,
.aptneo-kpi-card .text-muted {
  margin-top: .25rem;
}

.aptneo-action-strip {
  margin-top: 1rem;
  margin-bottom: 1.35rem;
}

.aptneo-action-card {
  background: var(--tblr-card-bg, #fff) !important;
  background-image: none !important;
  border-color: rgba(var(--hdes-primary-rgb), .18) !important;
  box-shadow: 0 8px 24px rgba(18, 24, 38, .045) !important;
}

html[data-bs-theme="dark"] {
  --tblr-body-bg: #211827;
  --tblr-bg-surface: #2b2130;
  --tblr-card-bg: #302635;
}

html[data-bs-theme="dark"] body {
  background: #211827 !important;
}

html[data-bs-theme="dark"] .page-wrapper,
html[data-bs-theme="dark"] .page-body,
html[data-bs-theme="dark"] .page {
  background: #211827 !important;
}

html[data-bs-theme="dark"] .card,
html[data-bs-theme="dark"] .modal-content,
html[data-bs-theme="dark"] .dropdown-menu {
  background-color: #302635 !important;
  border-color: rgba(255,255,255,.10) !important;
}

html[data-bs-theme="dark"] .aptneo-kpi-card,
html[data-bs-theme="dark"] .aptneo-countdown-card {
  background: #302635 !important;
  background-image: none !important;
  border-top-color: rgba(255,255,255,.09) !important;
  border-right-color: rgba(255,255,255,.09) !important;
  border-bottom-color: rgba(255,255,255,.09) !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.20) !important;
}

html[data-bs-theme="dark"] .aptneo-kpi-card:hover {
  box-shadow: 0 14px 30px rgba(0,0,0,.24) !important;
}

html[data-bs-theme="dark"] .aptneo-kpi-card .h1,
html[data-bs-theme="dark"] .aptneo-kpi-card .h2,
html[data-bs-theme="dark"] .aptneo-kpi-card .h3 {
  color: rgba(255,255,255,.93) !important;
}

html[data-bs-theme="dark"] .aptneo-kpi-card .text-secondary,
html[data-bs-theme="dark"] .aptneo-kpi-card .text-muted,
html[data-bs-theme="dark"] .aptneo-countdown-card .text-secondary {
  color: rgba(255,255,255,.74) !important;
}

html[data-bs-theme="dark"] .aptneo-action-card {
  background: #302635 !important;
  background-image: none !important;
  border-color: rgba(var(--hdes-primary-rgb), .32) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.22) !important;
}

html[data-bs-theme="dark"] .aptneo-action-card .avatar {
  background: rgba(var(--hdes-primary-rgb), .15) !important;
  color: var(--hdes-primary) !important;
}

html[data-bs-theme="dark"] .table,
html[data-bs-theme="dark"] .table-responsive {
  color: rgba(255,255,255,.88) !important;
}

@media (min-width: 1200px) {
  .dashboard-tsdt .aptneo-dashboard-grid,
  .dashboard-farmaceutico .aptneo-dashboard-grid,
  .dashboard-enfermeiro .aptneo-dashboard-grid {
    --tblr-gutter-x: 1.25rem;
    --tblr-gutter-y: 1.25rem;
  }
}

@media (max-width: 767.98px) {
  .aptneo-dashboard-grid,
  .row.row-cards.aptneo-dashboard-grid,
  .row.row-deck.aptneo-dashboard-grid {
    --tblr-gutter-x: .9rem;
    --tblr-gutter-y: .9rem;
  }
  .aptneo-kpi-card.card-sm > .card-body,
  .aptneo-kpi-card .card-body,
  .aptneo-countdown-card .card-body {
    min-height: 6.5rem;
  }
}


/* ------------------------------------------------------------------
   Phase130 — vertical rhythm + compact periodicity cards
   - One section gap for page header actions, KPI rows and cards.
   - Page actions that use a generic col-auto are also moved below
     the title instead of floating to the far right.
   - Compact, equal-height periodicity/KPI cards.
------------------------------------------------------------------- */
:root {
  --aptneo-section-gap: 1.35rem;
  --aptneo-card-gap: 1.15rem;
}

.page-header.d-print-none {
  margin-bottom: var(--aptneo-section-gap) !important;
}

/* Catch action groups that are not using ms-auto but still render in the
   upper-right header slot, e.g. Microbiologia / Periodicidade pages. */
.page-header > .row > .col-auto.d-flex.gap-2,
.page-header > .row > .col-auto.d-flex.gap-2.flex-wrap {
  flex: 0 0 100%;
  width: 100%;
  margin-left: 0 !important;
  margin-top: .9rem !important;
  margin-bottom: .15rem !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;
  order: 3;
}

/* Generic vertical rhythm between page sections. This deliberately targets
   the common page-level blocks only, avoiding nested cards/tables. */
.page-header + .row,
.page-header + .card,
.page-header + form,
.page-header + .aptneo-action-strip {
  margin-top: 0 !important;
}

.page-body .container-xl > .row.row-cards + .card,
.page-body .container-xl > .row.row-cards + .row.row-cards,
.page-body .container-xl > .card + .card,
.page-body .container-xl > .card + .row.row-cards,
.page-body .container-xl > form + .card,
.page-body .container-xl > form + .row.row-cards,
.aptneo-page-stack > * + * {
  margin-top: var(--aptneo-section-gap) !important;
}

.row.row-cards,
.row.row-deck,
.aptneo-dashboard-grid {
  --tblr-gutter-x: var(--aptneo-card-gap);
  --tblr-gutter-y: var(--aptneo-card-gap);
}

/* Equal-height compact statistic cards outside dashboards too
   (Documents, Microbiologia, Manutenção, Config). */
.aptneo-kpi-card.card-sm > .card-body,
.aptneo-kpi-card .card-body,
.aptneo-countdown-card .card-body {
  min-height: 7.25rem;
}

.aptneo-kpi-card .aptneo-kpi-meta,
.aptneo-kpi-meta {
  line-height: 1.22;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.aptneo-periodicity-kpi .card-body {
  min-height: 7.25rem;
}

.aptneo-periodicity-kpi .aptneo-periodicity-line {
  display: flex;
  gap: .4rem;
  align-items: baseline;
  line-height: 1.2;
  white-space: nowrap;
}

.aptneo-periodicity-kpi .aptneo-periodicity-label {
  min-width: 4.7rem;
  color: var(--tblr-secondary-color);
}

.aptneo-operational-settings .card {
  height: 100%;
}

.aptneo-operational-settings .card-body {
  min-height: 15.5rem;
  display: flex;
  flex-direction: column;
}

.aptneo-operational-settings .form-hint {
  min-height: 2.2rem;
  line-height: 1.25;
}

.aptneo-operational-settings .aptneo-last-notification {
  margin-top: auto;
  padding-top: .75rem;
}

html[data-bs-theme="dark"] .aptneo-periodicity-kpi .aptneo-periodicity-label {
  color: rgba(255,255,255,.64);
}

/* Phase130 correction: a single gap below page-level action strips. */
.page-header > .row > .col-auto.ms-auto.d-print-none,
.page-header > .row > .col-auto.d-flex.gap-2,
.page-header > .row > .col-auto.d-flex.gap-2.flex-wrap {
  margin-bottom: .15rem !important;
}

/* ------------------------------------------------------------------
   Phase131 — compact KPI cards + corrected dark-mode contrast
   - Reverts dashboard KPI density closer to the clinical metric cards.
   - Removes the excessive vertical rhythm introduced in Phase129/130.
   - Keeps flat card surfaces; no internal gradients.
   - Uses lighter semantic label colours in dark mode so titles remain legible.
------------------------------------------------------------------- */
:root {
  --aptneo-section-gap: .9rem;
  --aptneo-card-gap: .72rem;
  --aptneo-kpi-height: 5.65rem;
  --aptneo-kpi-padding-y: .78rem;
  --aptneo-kpi-padding-x: .95rem;
}

/* More compact page rhythm. */
.page-header.d-print-none {
  margin-bottom: .85rem !important;
}

.page-header > .row > .col-auto.ms-auto.d-print-none,
.page-header > .row > .col-auto.d-flex.gap-2,
.page-header > .row > .col-auto.d-flex.gap-2.flex-wrap {
  margin-top: .65rem !important;
  margin-bottom: 0 !important;
}

.aptneo-action-strip {
  margin-top: .7rem !important;
  margin-bottom: .9rem !important;
}

.page-body .container-xl > .row.row-cards + .card,
.page-body .container-xl > .row.row-cards + .row.row-cards,
.page-body .container-xl > .card + .card,
.page-body .container-xl > .card + .row.row-cards,
.page-body .container-xl > form + .card,
.page-body .container-xl > form + .row.row-cards,
.aptneo-page-stack > * + * {
  margin-top: .9rem !important;
}

.aptneo-dashboard-grid + .card,
.aptneo-dashboard-grid + .table-responsive,
.aptneo-dashboard-grid + .row,
.dashboard-tsdt .aptneo-dashboard-grid + .card,
.dashboard-farmaceutico .aptneo-dashboard-grid + .card {
  margin-top: .9rem !important;
}

.row.row-cards,
.row.row-deck,
.aptneo-dashboard-grid,
.row.row-cards.aptneo-dashboard-grid,
.row.row-deck.aptneo-dashboard-grid {
  --tblr-gutter-x: var(--aptneo-card-gap) !important;
  --tblr-gutter-y: var(--aptneo-card-gap) !important;
  row-gap: var(--aptneo-card-gap) !important;
}

/* Compact KPI card anatomy. */
.aptneo-kpi-card,
.aptneo-countdown-card {
  min-height: var(--aptneo-kpi-height) !important;
  border-left-width: 3px !important;
  box-shadow: 0 6px 16px rgba(18, 24, 38, .055) !important;
}

.aptneo-kpi-card.card-sm > .card-body,
.aptneo-kpi-card .card-body,
.aptneo-countdown-card .card-body,
.aptneo-periodicity-kpi .card-body {
  min-height: var(--aptneo-kpi-height) !important;
  padding: var(--aptneo-kpi-padding-y) var(--aptneo-kpi-padding-x) !important;
  justify-content: center !important;
}

.aptneo-kpi-card .subheader,
.aptneo-kpi-card .font-weight-medium {
  margin-bottom: .18rem !important;
  font-size: .72rem !important;
  line-height: 1.08 !important;
  letter-spacing: .035em !important;
  font-weight: 700 !important;
}

.aptneo-kpi-card .h1,
.aptneo-kpi-card .h2 {
  margin-top: 0 !important;
  margin-bottom: .05rem !important;
  line-height: 1.0 !important;
}

.aptneo-kpi-card .h1 {
  font-size: 1.55rem !important;
}

.aptneo-kpi-card .h2 {
  font-size: 1.25rem !important;
}

.aptneo-kpi-card .text-secondary,
.aptneo-kpi-card .text-muted,
.aptneo-countdown-card .text-secondary {
  margin-top: .12rem !important;
  line-height: 1.18 !important;
  font-size: .82rem !important;
}

.aptneo-kpi-card .small,
.aptneo-countdown-card .small {
  font-size: .75rem !important;
}

.aptneo-kpi-card .avatar {
  width: 2.1rem !important;
  height: 2.1rem !important;
  min-width: 2.1rem !important;
}

.aptneo-kpi-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 9px 20px rgba(18, 24, 38, .075) !important;
}

/* Preserve the clinical-card style: flat card, coloured rail, readable label. */
.aptneo-kpi-card::before,
.aptneo-countdown-card::before {
  display: none !important;
  background: none !important;
  content: none !important;
}

/* Dark mode: lighter surfaces, readable semantic titles, no muddy gradients. */
html[data-bs-theme="dark"] {
  --tblr-body-bg: #1f1725;
  --tblr-bg-surface: #281f2e;
  --tblr-card-bg: #2c2332;
}

html[data-bs-theme="dark"] body,
html[data-bs-theme="dark"] .page-wrapper,
html[data-bs-theme="dark"] .page-body,
html[data-bs-theme="dark"] .page {
  background: #1f1725 !important;
}

html[data-bs-theme="dark"] .aptneo-kpi-card,
html[data-bs-theme="dark"] .aptneo-countdown-card {
  background: #2c2332 !important;
  background-image: none !important;
  border-top-color: rgba(255,255,255,.085) !important;
  border-right-color: rgba(255,255,255,.085) !important;
  border-bottom-color: rgba(255,255,255,.085) !important;
  box-shadow: 0 6px 16px rgba(0,0,0,.18) !important;
}

html[data-bs-theme="dark"] .aptneo-kpi-card:hover {
  box-shadow: 0 9px 20px rgba(0,0,0,.22) !important;
}

html[data-bs-theme="dark"] .aptneo-kpi-card .h1,
html[data-bs-theme="dark"] .aptneo-kpi-card .h2,
html[data-bs-theme="dark"] .aptneo-kpi-card .h3 {
  color: rgba(255,255,255,.96) !important;
}

html[data-bs-theme="dark"] .aptneo-kpi-card .text-secondary,
html[data-bs-theme="dark"] .aptneo-kpi-card .text-muted,
html[data-bs-theme="dark"] .aptneo-countdown-card .text-secondary {
  color: rgba(255,255,255,.78) !important;
}

/* Semantic label contrast in dark mode. These override the raw RGB values,
   which were too dark against the purple surface. */
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--primary .subheader,
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--primary .font-weight-medium { color: #d9b6ec !important; }
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--clinical .subheader,
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--clinical .font-weight-medium { color: #f0a8df !important; }
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--micro .subheader,
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--micro .font-weight-medium { color: #f0a8df !important; }
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--production .subheader,
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--production .font-weight-medium { color: #ffbd83 !important; }
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--warning .subheader,
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--warning .font-weight-medium { color: #ffbd83 !important; }
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--qc .subheader,
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--qc .font-weight-medium { color: #8fd4ea !important; }
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--transport .subheader,
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--transport .font-weight-medium { color: #a8bdff !important; }
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--maintenance .subheader,
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--maintenance .font-weight-medium { color: #d9b6ec !important; }
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--success .subheader,
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--success .font-weight-medium { color: #8be0b4 !important; }
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--danger .subheader,
html[data-bs-theme="dark"] .aptneo-kpi-card.aptneo-kpi--danger .font-weight-medium { color: #ff9fbd !important; }

/* Ensure any forced utility colour inside a KPI does not become illegible. */
html[data-bs-theme="dark"] .aptneo-kpi-card .text-warning { color: #ffbd83 !important; }
html[data-bs-theme="dark"] .aptneo-kpi-card .text-danger { color: #ff9fbd !important; }
html[data-bs-theme="dark"] .aptneo-kpi-card .text-success { color: #8be0b4 !important; }

@media (min-width: 1200px) {
  .dashboard-tsdt .aptneo-dashboard-grid,
  .dashboard-farmaceutico .aptneo-dashboard-grid,
  .dashboard-enfermeiro .aptneo-dashboard-grid {
    --tblr-gutter-x: .82rem !important;
    --tblr-gutter-y: .82rem !important;
  }
}

@media (max-width: 767.98px) {
  :root {
    --aptneo-card-gap: .65rem;
    --aptneo-kpi-height: 5.35rem;
    --aptneo-kpi-padding-y: .72rem;
    --aptneo-kpi-padding-x: .85rem;
  }
}

/* ------------------------------------------------------------------
   Phase132 — dashboard grid redesign
   - Replaces the Bootstrap column drift in Farmácia/TSDT dashboards
     with explicit 5/4-column KPI grids.
   - Compact clinical-widget rhythm, equal card heights, optional icons.
   - Stronger dark-mode contrast without gradients inside cards.
------------------------------------------------------------------- */
:root {
  --aptneo-dashboard-grid-gap: .95rem;
  --aptneo-dashboard-grid-row-gap: .95rem;
  --aptneo-dashboard-kpi-height: 6.15rem;
}

.dashboard-farmaceutico .page-header.d-print-none,
.dashboard-tsdt .page-header.d-print-none {
  margin-bottom: 1.05rem !important;
}

.aptneo-dashboard-kpi-stack {
  display: flex;
  flex-direction: column;
  gap: var(--aptneo-dashboard-grid-row-gap);
}

.aptneo-kpi-grid {
  display: grid;
  width: 100%;
  gap: var(--aptneo-dashboard-grid-gap);
  align-items: stretch;
}

.aptneo-kpi-grid--5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.aptneo-kpi-grid--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.aptneo-dashboard-kpi-stack .aptneo-dashboard-table-card {
  margin-top: .25rem;
}

.aptneo-dashboard-kpi-stack .aptneo-kpi-card,
.aptneo-dashboard-kpi-stack .aptneo-countdown-card {
  height: 100%;
  min-height: var(--aptneo-dashboard-kpi-height) !important;
  border-left-width: 4px !important;
  background-image: none !important;
  box-shadow: 0 8px 18px rgba(18, 24, 38, .065) !important;
}

.aptneo-dashboard-kpi-stack .aptneo-kpi-card::before,
.aptneo-dashboard-kpi-stack .aptneo-countdown-card::before {
  display: none !important;
  content: none !important;
}

.aptneo-kpi-card--icon > .card-body,
.aptneo-dashboard-kpi-stack .aptneo-kpi-card.card-sm > .card-body,
.aptneo-dashboard-kpi-stack .aptneo-kpi-card .card-body,
.aptneo-dashboard-kpi-stack .aptneo-countdown-card .card-body {
  min-height: var(--aptneo-dashboard-kpi-height) !important;
  padding: .86rem 1.05rem !important;
}

.aptneo-kpi-card--icon > .card-body {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: .85rem !important;
}

.aptneo-kpi-copy {
  min-width: 0;
  flex: 1 1 auto;
}

.aptneo-kpi-card--icon .subheader {
  margin: 0 0 .22rem !important;
  font-size: .70rem !important;
  line-height: 1.12 !important;
  letter-spacing: .045em !important;
  font-weight: 760 !important;
  color: var(--aptneo-kpi-solid) !important;
}

.aptneo-kpi-card--icon .h1,
.aptneo-kpi-card--icon .h2 {
  margin: 0 !important;
  font-size: 1.65rem !important;
  line-height: .98 !important;
  font-weight: 720 !important;
}

.aptneo-kpi-card--icon .text-secondary,
.aptneo-kpi-card--icon .text-muted {
  display: block;
  margin-top: .22rem !important;
  font-size: .80rem !important;
  line-height: 1.16 !important;
  color: rgba(var(--aptneo-kpi-rgb), .95) !important;
}

.aptneo-kpi-card--icon .small {
  margin-top: .06rem !important;
  font-size: .72rem !important;
}

.aptneo-kpi-icon {
  flex: 0 0 auto;
  width: 2.65rem;
  height: 2.65rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: .75rem;
  color: var(--aptneo-kpi-solid);
  background: rgba(var(--aptneo-kpi-rgb), .12);
  font-size: 1.42rem;
}

.aptneo-kpi-icon .ti {
  font-size: 1.42rem;
  line-height: 1;
}

/* Stronger semantic values for dark mode; titles were previously too muted. */
.aptneo-kpi--primary { --aptneo-kpi-title-dark: #e1bcf2; }
.aptneo-kpi--clinical { --aptneo-kpi-title-dark: #f5a9e1; }
.aptneo-kpi--production { --aptneo-kpi-title-dark: #ffc184; }
.aptneo-kpi--qc { --aptneo-kpi-title-dark: #9bdced; }
.aptneo-kpi--transport { --aptneo-kpi-title-dark: #b4c7ff; }
.aptneo-kpi--maintenance { --aptneo-kpi-title-dark: #e1bcf2; }
.aptneo-kpi--micro { --aptneo-kpi-title-dark: #f5a9e1; }
.aptneo-kpi--success { --aptneo-kpi-title-dark: #92e4ba; }
.aptneo-kpi--warning { --aptneo-kpi-title-dark: #ffc184; }
.aptneo-kpi--danger { --aptneo-kpi-title-dark: #ffa7c2; }

html[data-bs-theme="dark"] .aptneo-dashboard-kpi-stack .aptneo-kpi-card,
html[data-bs-theme="dark"] .aptneo-dashboard-kpi-stack .aptneo-countdown-card {
  background: #2e2534 !important;
  background-image: none !important;
  border-top-color: rgba(255,255,255,.085) !important;
  border-right-color: rgba(255,255,255,.085) !important;
  border-bottom-color: rgba(255,255,255,.085) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.19) !important;
}

html[data-bs-theme="dark"] .aptneo-kpi-card--icon .subheader {
  color: var(--aptneo-kpi-title-dark, #f1e5f8) !important;
  opacity: 1 !important;
}

html[data-bs-theme="dark"] .aptneo-kpi-card--icon .h1,
html[data-bs-theme="dark"] .aptneo-kpi-card--icon .h2 {
  color: rgba(255,255,255,.97) !important;
}

html[data-bs-theme="dark"] .aptneo-kpi-card--icon .text-secondary,
html[data-bs-theme="dark"] .aptneo-kpi-card--icon .text-muted {
  color: rgba(255,255,255,.76) !important;
}

html[data-bs-theme="dark"] .aptneo-kpi-icon {
  color: var(--aptneo-kpi-title-dark, #f1e5f8);
  background: rgba(var(--aptneo-kpi-rgb), .20);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.055);
}

html[data-bs-theme="dark"] .aptneo-dashboard-table-card {
  background: #2e2534 !important;
  border-color: rgba(255,255,255,.085) !important;
}

html[data-bs-theme="dark"] .aptneo-dashboard-table-card .card-header {
  border-bottom-color: rgba(255,255,255,.09) !important;
}

html[data-bs-theme="dark"] .aptneo-dashboard-table-card thead th {
  color: #ffc184 !important;
  background: rgba(243,164,95,.09) !important;
}

@media (max-width: 1399.98px) {
  .aptneo-kpi-grid--5 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 1199.98px) {
  .aptneo-kpi-grid--5,
  .aptneo-kpi-grid--4 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 991.98px) {
  .aptneo-kpi-grid--5,
  .aptneo-kpi-grid--4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 575.98px) {
  :root {
    --aptneo-dashboard-grid-gap: .72rem;
    --aptneo-dashboard-grid-row-gap: .72rem;
    --aptneo-dashboard-kpi-height: 5.8rem;
  }

  .aptneo-kpi-grid--5,
  .aptneo-kpi-grid--4 {
    grid-template-columns: 1fr;
  }

  .aptneo-kpi-icon {
    width: 2.35rem;
    height: 2.35rem;
    font-size: 1.22rem;
  }
}


/* ------------------------------------------------------------------
   Phase133 — refined dashboard grid typography + prescription search
   - Keep the improved grid, but return KPI typography closer to the
     clinical widgets: lighter subheaders, less bold values and tighter rhythm.
------------------------------------------------------------------- */
:root {
  --aptneo-dashboard-grid-gap: .82rem;
  --aptneo-dashboard-grid-row-gap: .82rem;
  --aptneo-dashboard-kpi-height: 5.55rem;
}

.aptneo-dashboard-kpi-stack .aptneo-kpi-card,
.aptneo-dashboard-kpi-stack .aptneo-countdown-card {
  border-left-width: 3px !important;
}

.aptneo-kpi-card--icon > .card-body,
.aptneo-dashboard-kpi-stack .aptneo-kpi-card.card-sm > .card-body,
.aptneo-dashboard-kpi-stack .aptneo-kpi-card .card-body,
.aptneo-dashboard-kpi-stack .aptneo-countdown-card .card-body {
  min-height: var(--aptneo-dashboard-kpi-height) !important;
  padding: .70rem .90rem !important;
}

.aptneo-kpi-card--icon > .card-body {
  gap: .65rem !important;
}

.aptneo-kpi-card--icon .subheader,
.aptneo-dashboard-kpi-stack .aptneo-kpi-card .subheader {
  margin: 0 0 .16rem !important;
  font-size: .70rem !important;
  line-height: 1.10 !important;
  letter-spacing: .035em !important;
  font-weight: 600 !important;
}

.aptneo-kpi-card--icon .h1,
.aptneo-kpi-card--icon .h2,
.aptneo-dashboard-kpi-stack .aptneo-kpi-card .h1,
.aptneo-dashboard-kpi-stack .aptneo-kpi-card .h2 {
  margin: 0 !important;
  font-size: 1.42rem !important;
  line-height: 1.0 !important;
  font-weight: 600 !important;
}

.aptneo-kpi-card--icon .text-secondary,
.aptneo-kpi-card--icon .text-muted,
.aptneo-dashboard-kpi-stack .aptneo-kpi-card .text-secondary,
.aptneo-dashboard-kpi-stack .aptneo-kpi-card .text-muted {
  margin-top: .14rem !important;
  font-size: .78rem !important;
  line-height: 1.14 !important;
}

.aptneo-kpi-card--icon .small {
  margin-top: .02rem !important;
  font-size: .70rem !important;
}

.aptneo-kpi-icon {
  width: 2.25rem !important;
  height: 2.25rem !important;
  border-radius: .65rem !important;
}

.aptneo-kpi-icon .ti {
  font-size: 1.18rem !important;
}

html[data-bs-theme="dark"] .aptneo-kpi-card--icon .subheader,
html[data-bs-theme="dark"] .aptneo-dashboard-kpi-stack .aptneo-kpi-card .subheader {
  color: var(--aptneo-kpi-title-dark, #eadcf0) !important;
  font-weight: 600 !important;
}

html[data-bs-theme="dark"] .aptneo-kpi-card--icon .text-secondary,
html[data-bs-theme="dark"] .aptneo-kpi-card--icon .text-muted,
html[data-bs-theme="dark"] .aptneo-dashboard-kpi-stack .aptneo-kpi-card .text-secondary,
html[data-bs-theme="dark"] .aptneo-dashboard-kpi-stack .aptneo-kpi-card .text-muted {
  color: rgba(255,255,255,.80) !important;
}

#patient-history-open {
  white-space: nowrap;
}

@media (max-width: 575.98px) {
  :root {
    --aptneo-dashboard-grid-gap: .68rem;
    --aptneo-dashboard-grid-row-gap: .68rem;
    --aptneo-dashboard-kpi-height: 5.35rem;
  }
}


/* Phase135 — patient search affordance in prescription form */
#patient-search-modal .list-group-item.patient-db-pick {
  border-left: 3px solid transparent;
}
#patient-search-modal .list-group-item.patient-db-pick:hover,
#patient-search-modal .list-group-item.patient-db-pick:focus {
  border-left-color: var(--tblr-primary, #7b2c8f);
}
#patient-history-open.btn-icon {
  flex: 0 0 auto;
}
html[data-bs-theme="dark"] #patient-search-modal .list-group-item.patient-db-pick {
  background: var(--tblr-bg-surface, #241b27);
}

/* Phase139 · longitudinal + reports compact polish */
.aptneo-longitudinal-card .card-body { padding-top: 0.9rem; padding-bottom: 0.9rem; }
.aptneo-longitudinal-chart { min-height: 230px; }
.aptneo-longitudinal-card .aptneo-clinical-widget {
  border: 1px solid var(--tblr-border-color);
  border-left: 3px solid var(--tblr-primary);
  border-radius: var(--tblr-border-radius);
  padding: .65rem .75rem;
  height: 100%;
  background: var(--tblr-card-bg);
}
html[data-bs-theme="dark"] .aptneo-longitudinal-card .aptneo-clinical-widget {
  background: var(--tblr-bg-surface);
  border-color: rgba(255,255,255,.12);
}
html[data-bs-theme="dark"] .aptneo-longitudinal-card .subheader,
html[data-bs-theme="dark"] .aptneo-longitudinal-card .card-title {
  color: rgba(255,255,255,.86) !important;
}
html[data-bs-theme="dark"] .aptneo-longitudinal-card .card-subtitle,
html[data-bs-theme="dark"] .aptneo-longitudinal-card .text-secondary,
html[data-bs-theme="dark"] .aptneo-longitudinal-card .text-muted {
  color: rgba(255,255,255,.62) !important;
}


/* Phase141 — legal/login logo sizing and batch production flow */
.parenteris-logo.parenteris-logo-login { height: 64px !important; max-width: min(320px, 88vw); object-fit: contain; }
.parenteris-legal-logo { height: 48px !important; max-width: min(280px, 82vw); object-fit: contain; }
.aptneo-batch-run-table .progress { background-color: rgba(108, 117, 125, .18); }
html[data-bs-theme="dark"] .parenteris-legal-logo,
html[data-bs-theme="dark"] .parenteris-logo-login { filter: none; }

/* Phase 172 · Personalização de widgets do dashboard */
.aptneo-dashboard-widget-row {
  transition: background-color .15s ease, border-color .15s ease;
}
.aptneo-dashboard-widget-row:hover {
  background-color: rgba(148, 163, 184, .08);
}
.aptneo-widget-grip {
  cursor: grab;
}