/**
 * Theme Tokens v2 — RUFIT
 * OKLCH-based palette. Sobrescreve defaults do Tabler via variáveis CSS.
 * Reverter = apagar este arquivo + remover o <link> dos templates.
 *
 * Estratégia de cor: Restrained (product register)
 * North Star: "O Diário de Treino" — preciso, enérgico, refinado
 */

:root,
[data-bs-theme="light"] {
  /* ── Cor primária: Terracota Forge ── */
  --tblr-primary:        oklch(55.8% 0.165 42);
  --tblr-primary-rgb:    212, 98, 42;
  --tblr-primary-fg:     oklch(99.5% 0.003 252);
  --tblr-primary-darken: oklch(47.2% 0.145 40);
  --tblr-primary-lt:     oklch(96.8% 0.020 57);

  /* ── Status semântico ── */
  --tblr-success:        oklch(65.0% 0.170 142);
  --tblr-success-rgb:    47, 179, 68;
  --tblr-warning:        oklch(73.8% 0.168 68);
  --tblr-warning-rgb:    245, 158, 11;
  --tblr-danger:         oklch(50.2% 0.240 18);
  --tblr-danger-rgb:     225, 29, 72;

  /* ── Info: slate navy (substitui azure genérico do Tabler) ── */
  --tblr-info:           oklch(50.0% 0.070 252);
  --tblr-info-rgb:       58, 96, 148;
  --tblr-info-lt:        oklch(95.5% 0.012 252);

  /* ── Fundo: tintados de navy para harmonia com o sidebar ── */
  --tblr-body-bg:              oklch(98.2% 0.006 252);
  --tblr-bg-surface:           oklch(99.5% 0.003 252);
  --tblr-bg-surface-secondary: oklch(97.5% 0.005 252);
  --tblr-bg-surface-tertiary:  oklch(94.5% 0.007 255);

  /* ── Borda ── */
  --tblr-border-color:             oklch(93.2% 0.009 262);
  --tblr-border-color-translucent: rgba(0, 0, 0, .055);

  /* ── Tipografia ── */
  --tblr-font-sans-serif:      "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont,
                                "Segoe UI", sans-serif;
  --tblr-body-font-family:     var(--tblr-font-sans-serif);
  --tblr-body-font-weight:     400;
  --tblr-body-line-height:     1.55;
  --tblr-headings-font-weight: 700;
  --tblr-headings-line-height: 1.25;

  /* ── Raio ── */
  --tblr-border-radius:      8px;
  --tblr-border-radius-sm:   6px;
  --tblr-border-radius-lg:   12px;
  --tblr-border-radius-xl:   16px;
  --tblr-border-radius-pill: 999px;

  /* ── Sombras (tintadas de navy — não cinza neutro) ── */
  --tblr-box-shadow:    0 1px 2px 0 rgba(13, 21, 32, .05),
                        0 1px 3px 1px rgba(13, 21, 32, .03);
  --tblr-box-shadow-sm: 0 1px 1px 0 rgba(13, 21, 32, .04);
  --tblr-box-shadow-lg: 0 10px 28px -8px rgba(13, 21, 32, .09),
                        0 2px 6px -2px rgba(13, 21, 32, .05);
}

/* ── Dark mode: navy stack coerente com o sidebar ── */
[data-bs-theme="dark"] {
  --tblr-primary:        oklch(63.0% 0.150 43);
  --tblr-primary-rgb:    232, 117, 72;
  --tblr-primary-darken: oklch(55.8% 0.165 42);
  --tblr-primary-lt:     oklch(55.8% 0.165 42 / 14%);

  --tblr-info:           oklch(58.0% 0.075 252);
  --tblr-info-rgb:       80, 124, 188;
  --tblr-info-lt:        oklch(27.0% 0.060 252 / 40%);

  /* Surfaces em navy-stack para harmonia com o sidebar */
  --tblr-body-bg:              oklch(12.5% 0.024 245);
  --tblr-bg-surface:           oklch(17.0% 0.036 246);
  --tblr-bg-surface-secondary: oklch(20.5% 0.045 246);
  --tblr-bg-surface-tertiary:  oklch(23.0% 0.052 247);

  --tblr-border-color: rgba(255, 255, 255, .07);
}

/* Sidebar em dark mode: navy mais fundo para não competir com o conteúdo */
[data-bs-theme="dark"] .navbar-vertical {
  background-color: oklch(11.0% 0.028 247);
  border-right-color: rgba(255, 255, 255, .05);
}

/* ── Light mode: cards e elementos precisam de borda ── */
[data-bs-theme="light"] .card {
  border: 1px solid var(--tblr-border-color);
  box-shadow: var(--tblr-box-shadow-sm);
}

[data-bs-theme="light"] .navbar:not(.navbar-vertical) {
  border-bottom: 1px solid var(--tblr-border-color);
  box-shadow: none;
}

[data-bs-theme="light"] .page-wrapper {
  background-color: oklch(96.5% 0.007 252);
}

[data-bs-theme="light"] .page-body {
  background-color: oklch(96.5% 0.007 252);
}

/* ── Botões ── */
.btn {
  font-weight: 600;
  letter-spacing: -0.005em;
}

.btn-primary {
  --tblr-btn-bg:                 var(--tblr-primary);
  --tblr-btn-border-color:       var(--tblr-primary);
  --tblr-btn-hover-bg:           var(--tblr-primary-darken);
  --tblr-btn-hover-border-color: var(--tblr-primary-darken);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .15) inset,
              0 1px 2px oklch(55.8% 0.165 42 / 20%);
  transition: background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}

/* ── Links: neutros por padrão, cor só onde há intenção ── */
a {
  color: inherit;
  transition: color 120ms ease;
}
a:hover {
  color: var(--tblr-primary);
}

/* Links em prosa e contextos inline ficam coloridos */
p a, .text-body a, label a {
  color: var(--tblr-primary);
}
p a:hover {
  color: var(--tblr-primary-darken);
}

/* Links em tabela: affordance via underline no hover (P1 do critique) */
td a:not(.btn):not(.badge):not(.avatar) {
  text-underline-offset: 2px;
  text-decoration-color: transparent;
  transition: color 120ms ease, text-decoration-color 120ms ease;
}
td a:not(.btn):not(.badge):not(.avatar):hover {
  color: var(--tblr-primary);
  text-decoration: underline;
  text-decoration-color: var(--tblr-primary);
}

/* ── Focus visible: anel de foco acessível em toda a interface ── */
:focus-visible {
  outline: 2px solid oklch(55.8% 0.165 42 / 70%);
  outline-offset: 2px;
}

/* ── Sidebar navy: âncora permanente da identidade RUFIT ── */
.navbar-vertical {
  background-color: oklch(28.0% 0.060 245);
  border-right: 1px solid rgba(255, 255, 255, .06);
}

.navbar-vertical .nav-link,
.navbar-vertical .nav-link-title {
  color: rgba(255, 255, 255, .72);
  transition: color 150ms ease, background-color 150ms ease;
}

.navbar-vertical .nav-link:hover {
  color: oklch(99.5% 0.003 252);
  background-color: rgba(255, 255, 255, .08);
}

.navbar-vertical .nav-link.active,
.navbar-vertical .nav-link.dropdown-toggle.show,
.navbar-vertical .dropdown-item.active {
  color: oklch(63.0% 0.150 43);
  background-color: oklch(55.8% 0.165 42 / 12%);
}

.navbar-vertical .nav-link-icon {
  color: rgba(255, 255, 255, .45);
  transition: color 150ms ease;
}

.navbar-vertical .nav-link:hover .nav-link-icon,
.navbar-vertical .nav-link.active .nav-link-icon,
.navbar-vertical .nav-link.dropdown-toggle.show .nav-link-icon {
  color: inherit;
}

.navbar-vertical .nav-header {
  color: rgba(255, 255, 255, .35);
  font-size: 0.65rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.navbar-vertical .dropdown-menu {
  background-color: transparent;
  border: none;
  padding-left: 1rem;
}

.navbar-vertical .dropdown-item {
  color: rgba(255, 255, 255, .65);
  border-radius: var(--tblr-border-radius-sm);
  transition: color 150ms ease, background-color 150ms ease;
}

.navbar-vertical .dropdown-item:hover {
  color: oklch(99.5% 0.003 252);
  background-color: rgba(255, 255, 255, .08);
}

/* ── Sidebar modo claro: branco com texto slate ── */
[data-bs-theme="light"] .navbar-vertical {
  background-color: oklch(99.5% 0.003 252);
  border-right: 1px solid oklch(93.2% 0.009 262);
}

[data-bs-theme="light"] .navbar-vertical .nav-link,
[data-bs-theme="light"] .navbar-vertical .nav-link-title {
  color: oklch(22.8% 0.035 255 / 70%);
}

[data-bs-theme="light"] .navbar-vertical .nav-link:hover {
  color: oklch(22.8% 0.035 255);
  background-color: rgba(0, 0, 0, .04);
}

[data-bs-theme="light"] .navbar-vertical .nav-link.active,
[data-bs-theme="light"] .navbar-vertical .nav-link.dropdown-toggle.show,
[data-bs-theme="light"] .navbar-vertical .dropdown-item.active {
  color: oklch(47.2% 0.145 40);
  background-color: oklch(96.8% 0.020 57);
}

[data-bs-theme="light"] .navbar-vertical .nav-link-icon {
  color: oklch(22.8% 0.035 255 / 35%);
}

[data-bs-theme="light"] .navbar-vertical .nav-header {
  color: oklch(22.8% 0.035 255 / 38%);
}

[data-bs-theme="light"] .navbar-vertical .dropdown-item {
  color: oklch(22.8% 0.035 255 / 65%);
}

[data-bs-theme="light"] .navbar-vertical .dropdown-item:hover {
  color: oklch(22.8% 0.035 255);
  background-color: rgba(0, 0, 0, .04);
}

/* ── Header topo ── */
.navbar:not(.navbar-vertical) {
  background-color: var(--tblr-bg-surface);
  border-bottom: 1px solid var(--tblr-border-color);
}

/* ── Formulários ── */
.form-control:focus,
.form-select:focus {
  border-color: var(--tblr-primary);
  box-shadow: 0 0 0 3px oklch(55.8% 0.165 42 / 15%);
}

/* ── Tipografia ── */
.page-title {
  letter-spacing: -0.02em;
}

/* ── Badges ── */
.badge.bg-primary-lt {
  background-color: var(--tblr-primary-lt);
  color: var(--tblr-primary-darken);
}

/* ── Override de cores Tabler fora do sistema de marca ──
   Azure e Blue são defaults do Tabler sem relação com a paleta RUFIT.
   Mapeados para Info (slate navy) para coerência cromática.          */
[data-bs-theme="light"] .bg-azure-lt,
[data-bs-theme="light"] .bg-blue-lt {
  background-color: var(--tblr-info-lt) !important;
  color: oklch(40.0% 0.070 252) !important;
}
[data-bs-theme="dark"] .bg-azure-lt,
[data-bs-theme="dark"] .bg-blue-lt {
  background-color: oklch(30.0% 0.070 252 / 35%) !important;
  color: oklch(70.0% 0.060 252) !important;
}
.bg-azure-lt,
.bg-blue-lt {
  background-color: var(--tblr-info-lt);
  color: oklch(40.0% 0.070 252);
}

[data-bs-theme="light"] .bg-azure,
[data-bs-theme="light"] .bg-blue,
[data-bs-theme="light"] .card-stamp-icon.bg-azure,
[data-bs-theme="light"] .card-stamp-icon.bg-blue {
  background-color: oklch(28.0% 0.060 245) !important;
  color: oklch(99.5% 0.003 252) !important;
}
[data-bs-theme="dark"] .bg-azure,
[data-bs-theme="dark"] .bg-blue,
[data-bs-theme="dark"] .card-stamp-icon.bg-azure,
[data-bs-theme="dark"] .card-stamp-icon.bg-blue {
  background-color: oklch(23.0% 0.052 247) !important;
  color: oklch(70.0% 0.060 252) !important;
}

/* ── Page title: remove decorative icon noise (P1 layout fix) ──
   Icons in page headers are redundant with the text. The sidebar already
   provides context. Removing here keeps the hierarchy clean. */
.page-header .page-title i {
  display: none;
}

/* ── Stat strip: compact single-row summary metrics ──
   Replaces the identical 4-card hero-metric grid (double-banned pattern:
   identical card grid + big-number/small-label template).
   Active (accent) item is primary-tinted to signal the key operational metric.
   Responsive: 2-column layout on small screens with row dividers. */
.stat-strip {
  display: flex;
  background: var(--tblr-bg-surface);
  border: 1px solid var(--tblr-border-color);
  border-radius: var(--tblr-border-radius);
  overflow: hidden;
  box-shadow: var(--tblr-box-shadow-sm);
}

.stat-strip-item {
  flex: 1;
  min-width: 0;
  padding: 14px 20px;
  border-right: 1px solid var(--tblr-border-color);
}

.stat-strip-item:last-child {
  border-right: none;
}

.stat-strip-item--accent {
  background-color: oklch(55.8% 0.165 42 / 5%);
}

[data-bs-theme="dark"] .stat-strip-item--accent {
  background-color: oklch(55.8% 0.165 42 / 8%);
}

.stat-strip-value {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.025em;
  color: var(--tblr-body-color);
}

.stat-strip-item--accent .stat-strip-value {
  color: var(--tblr-primary);
}

.stat-strip-label {
  font-size: 0.6875rem;
  font-weight: 600;
  color: oklch(50% 0.008 252);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 3px;
}

[data-bs-theme="dark"] .stat-strip-label {
  color: oklch(62% 0.010 252);
}

@media (max-width: 575.98px) {
  .stat-strip {
    flex-wrap: wrap;
  }
  .stat-strip-item {
    width: 50%;
    flex: none;
  }
  .stat-strip-item:nth-child(2n) {
    border-right: none;
  }
  .stat-strip-item:nth-child(n+3) {
    border-top: 1px solid var(--tblr-border-color);
  }
}

/* ── Avatar defaults: brand-aligned slate for initials ──
   Replaces Tabler's azure default (#206bc4) with RUFIT slate navy.
   Applies to any .avatar not already carrying a bg-* utility class.
   Photo avatars are unaffected (image covers the background). */
.avatar:not([class*="bg-"]) {
  background-color: oklch(38.0% 0.055 252);
  color: oklch(99.5% 0.003 252);
}
[data-bs-theme="dark"] .avatar:not([class*="bg-"]) {
  background-color: oklch(32.0% 0.055 252);
  color: oklch(92.0% 0.008 252);
}

/* ── Unread notification tint ──
   Replaces the banned >1px side-stripe (border-start-3) with a background tint.
   The "New" badge and bold title already convey unread; tint reinforces it. */
.notif-unread {
  background-color: oklch(55.8% 0.165 42 / 4%);
}
[data-bs-theme="dark"] .notif-unread {
  background-color: oklch(55.8% 0.165 42 / 7%);
}

/* ── DataTables: dark mode overrides ── */
[data-bs-theme="dark"] table.dataTable thead th,
[data-bs-theme="dark"] table.dataTable thead td {
  border-bottom-color: var(--tblr-border-color);
  background-color: var(--tblr-bg-surface);
  color: var(--tblr-body-color);
}
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_filter input,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_length select {
  background-color: var(--tblr-bg-surface-secondary);
  color: var(--tblr-body-color);
  border-color: var(--tblr-border-color);
}
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_info,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button {
  color: var(--tblr-body-color);
}
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background: var(--tblr-bg-surface) !important;
  border-color: var(--tblr-border-color) !important;
  color: var(--tblr-body-color) !important;
}

/* ── Motion: respect user preference ── */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ── Mobile: ajustes globais de usabilidade no celular (<= 767.98px) ──
   Corrige causas comuns de uma vez, sem editar tela a tela:
   (1) alvos de toque grandes o bastante; (2) inputs sem zoom no iOS.
   theme.css carrega DEPOIS do tabler.min.css, entao estes overrides vencem. */
@media (max-width: 767.98px) {
  /* Alvo de toque: recomendado >= 44px (btn) e >= 36px (btn-sm).
     O .btn do Tabler ja e inline-flex centralizado, entao min-height
     apenas aumenta a area clicavel sem desalinhar o conteudo. */
  .btn {
    min-height: 44px;
  }
  .btn-sm,
  .btn-group-sm > .btn {
    min-height: 36px;
  }
  /* Botoes so-icone ficam quadrados (largura acompanha a altura minima). */
  .btn-icon {
    min-width: 44px;
  }
  .btn-icon.btn-sm {
    min-width: 36px;
  }
  .btn-close,
  .navbar-toggler {
    min-width: 44px;
    min-height: 44px;
  }

  /* Fonte >= 16px nos campos evita o zoom automatico do iOS ao focar
     (inclui as variantes -sm, que senao continuam disparando o zoom). */
  .form-control,
  .form-select,
  .form-control-sm,
  .form-select-sm {
    font-size: 16px;
  }
}