/* ====================================
   FICA BOOTSTRAP NESTA RODADA (guia-v1.0, correspondencia.md, "Fica Bootstrap", D6)
   As copias do guia alcancam todo .btn e todo .tn-a, e nao podem mudar. Esta camada do
   produto devolve o que o guia manda manter: a moldura (barra do topo e menu lateral)
   como estava na base. Os valores sao os do Bootstrap 5.3.2 e os antigos de style.css;
   por isso este arquivo pode ter cor fixa.
   Conferencia: tests/e2e/playwright_local/conferir_direcao_a.py compara a moldura com
   moldura_base.json.gz.
   ==================================== */

/* --- Moldura: variaveis e texto que vinham do body antes do guia --- */
.tn-a :is(.navbar-themed, .sidebar-wrapper, .sidebar-backdrop) {
  --bs-body-bg: #fff; --bs-body-color: #212529; --bs-body-color-rgb: 33, 37, 41;
  --bs-primary: #0d6efd; --bs-primary-rgb: 13, 110, 253;
  --bs-link-color: #0d6efd; --bs-link-color-rgb: 13, 110, 253; --bs-link-hover-color: #0a58ca;
  --bs-secondary-color: rgba(33, 37, 41, .75); --bs-emphasis-color: #000;
  --bs-danger: #dc3545; --bs-danger-rgb: 220, 53, 69; --bs-white-rgb: 255, 255, 255;
  --bs-border-color: #dee2e6; --bs-border-radius: .375rem;
  --bs-primary-bg-subtle: #cfe2ff; --bs-primary-text-emphasis: #052c65;
  --bs-danger-bg-subtle: #f8d7da; --bs-danger-text-emphasis: #58151c;
  --bs-form-invalid-color: #dc3545; --bs-form-invalid-border-color: #dc3545;
  --bs-code-color: #d63384;
  --primary-color: #0d6efd; --primary-dark: #0a58ca; --secondary-color: #6c757d;
  --success-color: #198754; --warning-color: #ffc107; --danger-color: #dc3545; --info-color: #0dcaf0;
  --bg-primary: #fff; --bg-secondary: #f8f9fa; --bg-sidebar: #f8f9fa; --bg-card: #fff;
  --text-primary: #212529; --text-secondary: #6c757d; --text-muted: #6c757d;
  --border-color: #dee2e6; --border-radius: .375rem;
  --shadow-sm: 0 .125rem .25rem rgba(0, 0, 0, .075); --shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
  --bg-color: initial; --bg-hover: initial; --text-color: initial; --border-light: initial;
  font-family: var(--app-font-sans); font-size: 1rem; font-weight: 400; line-height: 1.5;
  color: var(--bs-body-color);
}
[data-bs-theme="dark"] .tn-a :is(.navbar-themed, .sidebar-wrapper, .sidebar-backdrop) {
  --bs-body-bg: #212529; --bs-body-color-rgb: 222, 226, 230;
  --bs-link-color: #6ea8fe; --bs-link-color-rgb: 110, 168, 254; --bs-link-hover-color: #8bb9fe;
  --bs-emphasis-color: #fff;
  --bs-border-color: #495057;
  --bs-primary-bg-subtle: #031633; --bs-primary-text-emphasis: #6ea8fe;
  --bs-danger-bg-subtle: #2c0b0e; --bs-danger-text-emphasis: #ea868f;
  --bs-form-invalid-color: #ea868f; --bs-form-invalid-border-color: #ea868f;
  --bs-code-color: #e685b5;
  --bg-primary: #212529; --bg-secondary: #343a40; --bg-sidebar: #343a40; --bg-card: #495057;
  --text-primary: #fff; --text-secondary: #dee2e6; --text-muted: #ced4da;
  --border-color: #495057;
  --bs-body-color: #f8f9fa; --bs-secondary-color: #dee2e6; --bs-tertiary-color: #dee2e6;
}
.tn-a .navbar-themed { color: var(--text-primary); }

/* --- Moldura: botoes (.tn-a .btn do guia alcancaria todos) --- */
.tn-a :is(.navbar-themed, .sidebar-wrapper) .btn {
  --bs-btn-font-size: 1rem; --bs-btn-font-weight: 400; --bs-btn-border-radius: var(--bs-border-radius);
  --bs-btn-bg: transparent; --bs-btn-color: var(--bs-body-color); --bs-btn-border-color: transparent;
  --bs-btn-hover-border-color: transparent; --bs-btn-disabled-opacity: .65;
  display: inline-block; gap: normal; align-items: revert; justify-content: normal; min-height: auto;
  padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
  font-family: var(--bs-btn-font-family); font-size: var(--bs-btn-font-size); font-weight: var(--bs-btn-font-weight); line-height: var(--bs-btn-line-height);
  border: var(--bs-btn-border-width) solid var(--bs-btn-border-color); border-radius: var(--bs-btn-border-radius);
  white-space: normal;
}
.tn-a :is(.navbar-themed, .sidebar-wrapper) .btn-sm { --bs-btn-font-size: .875rem; --bs-btn-border-radius: var(--bs-border-radius-sm); }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .btn > i { display: inline-block; align-items: normal; justify-content: normal; width: auto; height: auto; flex: 0 1 auto; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .btn > i.me-1 { margin-right: .25rem !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .btn > i.me-2 { margin-right: .5rem !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .btn.show { background-color: var(--bs-btn-active-bg); }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .btn:focus-visible { color: var(--bs-btn-hover-color); background-color: var(--bs-btn-hover-bg); border-color: var(--bs-btn-hover-border-color); outline: 0; outline-offset: 0px; box-shadow: var(--bs-btn-focus-box-shadow); }

/* Variantes usadas na moldura, com os valores do Bootstrap e de style.css. */
.tn-a :is(.navbar-themed, .sidebar-wrapper) .btn.btn-outline-primary {
  --bs-btn-color: #0d6efd; --bs-btn-bg: transparent; --bs-btn-border-color: #0d6efd;
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #0d6efd; --bs-btn-hover-border-color: #0d6efd;
  --bs-btn-active-color: #fff; --bs-btn-active-bg: #0d6efd; --bs-btn-active-border-color: #0d6efd;
  --bs-btn-disabled-color: #0d6efd; --bs-btn-disabled-bg: transparent; --bs-btn-disabled-border-color: #0d6efd;
}
.tn-a :is(.navbar-themed, .sidebar-wrapper) .btn.btn-outline-secondary {
  --bs-btn-color: #6c757d; --bs-btn-bg: transparent; --bs-btn-border-color: #6c757d;
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #6c757d; --bs-btn-hover-border-color: #6c757d;
  --bs-btn-active-color: #fff; --bs-btn-active-bg: #6c757d; --bs-btn-active-border-color: #6c757d;
  --bs-btn-disabled-color: #6c757d; --bs-btn-disabled-bg: transparent; --bs-btn-disabled-border-color: #6c757d;
}
.tn-a :is(.navbar-themed, .sidebar-wrapper) .btn.btn-link {
  --bs-btn-font-weight: 400; --bs-btn-color: var(--bs-link-color); --bs-btn-bg: transparent; --bs-btn-border-color: transparent;
  --bs-btn-hover-color: var(--bs-link-hover-color); --bs-btn-hover-bg: transparent; --bs-btn-hover-border-color: transparent;
  --bs-btn-active-color: var(--bs-link-hover-color); --bs-btn-active-bg: transparent; --bs-btn-active-border-color: transparent;
  --bs-btn-disabled-color: #6c757d; --bs-btn-disabled-bg: transparent; --bs-btn-disabled-border-color: transparent;
}
/* Botoes de nivel fora da regra do guia so aqui: botoes-nivel-a.css nao vale na moldura. */
.tn-a :is(.navbar-themed, .sidebar-wrapper) .btn.btn-outline-warning { --bs-btn-color: #ffc107; --bs-btn-bg: transparent; --bs-btn-border-color: #ffc107; --bs-btn-hover-color: #000; --bs-btn-hover-bg: #ffc107; --bs-btn-hover-border-color: #ffc107; --bs-btn-active-color: #000; --bs-btn-active-bg: #ffc107; --bs-btn-active-border-color: #ffc107; --bs-btn-disabled-color: #ffc107; --bs-btn-disabled-bg: transparent; --bs-btn-disabled-border-color: #ffc107; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .btn.btn-outline-danger { --bs-btn-color: #dc3545; --bs-btn-bg: transparent; --bs-btn-border-color: #dc3545; --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #dc3545; --bs-btn-hover-border-color: #dc3545; --bs-btn-active-color: #fff; --bs-btn-active-bg: #dc3545; --bs-btn-active-border-color: #dc3545; --bs-btn-disabled-color: #dc3545; --bs-btn-disabled-bg: transparent; --bs-btn-disabled-border-color: #dc3545; }
/* style.css nomeia estas cores na barra; o guia passaria por cima, pela ordem de carga. */
.tn-a .navbar-themed .btn.btn-outline-secondary {
  --bs-btn-color: var(--text-secondary); --bs-btn-border-color: var(--border-color);
  --bs-btn-hover-color: var(--text-primary); --bs-btn-hover-bg: var(--bg-secondary); --bs-btn-hover-border-color: var(--border-color);
}
.tn-a .navbar-themed .btn.btn-outline-secondary:focus-visible { color: var(--bs-btn-color); border-color: var(--bs-btn-border-color); background-color: #6c757d; }
.tn-a .navbar-themed .btn.btn-outline-secondary.show { color: var(--bs-btn-color); border-color: var(--bs-btn-border-color); }
.tn-a .navbar-themed .btn.btn-outline-danger {
  --bs-btn-color: var(--danger-color); --bs-btn-bg: transparent; --bs-btn-border-color: var(--danger-color);
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--danger-color); --bs-btn-hover-border-color: var(--danger-color);
}
.tn-a .navbar-themed .btn.btn-outline-danger:focus-visible { color: var(--bs-btn-color); border-color: var(--bs-btn-border-color); background-color: #dc3545; }
.tn-a .navbar-themed .alert-item-actions .btn { padding: .15rem .35rem; font-size: .7rem; line-height: 1; }

/* Painel financeiro (tem .filters-container): a base escurecia estas cores so nele, com a moldura junto. */
.tn-a:has(.filters-container) .navbar-themed .btn.btn-outline-secondary { --bs-btn-color: #495057; --bs-btn-border-color: #495057; }
.tn-a:has(.filters-container) .navbar-themed .btn.btn-outline-primary { --bs-btn-color: #0a58ca; --bs-btn-border-color: #0a58ca; --bs-btn-hover-color: #0a58ca; --bs-btn-hover-border-color: #0a58ca; }
.tn-a:has(.filters-container) .navbar-themed .btn.btn-outline-danger { --bs-btn-color: #a61e2d; --bs-btn-border-color: #a61e2d; }
[data-bs-theme="dark"] .tn-a:has(.filters-container) .navbar-themed .btn.btn-outline-secondary { --bs-btn-color: #f8f9fa; --bs-btn-hover-color: #f8f9fa; --bs-btn-border-color: #ced4da; color: #f8f9fa !important; }
[data-bs-theme="dark"] .tn-a:has(.filters-container) .navbar-themed .btn.btn-outline-primary { --bs-btn-color: #9ec5fe; --bs-btn-hover-color: #9ec5fe; --bs-btn-border-color: #9ec5fe; --bs-btn-hover-border-color: #9ec5fe; }
[data-bs-theme="dark"] .tn-a:has(.filters-container) .navbar-themed .btn.btn-outline-danger { --bs-btn-color: #f1aeb5; --bs-btn-hover-color: #f1aeb5; --bs-btn-border-color: #f1aeb5; }

/* --- Moldura: componentes que a camada do produto ou o guia recoloriram --- */
.tn-a :is(.navbar-themed, .sidebar-wrapper) .nav-pills { --bs-nav-pills-link-active-bg: #0d6efd; --bs-nav-pills-link-active-color: #fff; --bs-nav-link-color: var(--bs-link-color); --bs-nav-link-hover-color: var(--bs-link-hover-color); }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .dropdown-menu {
  --bs-dropdown-bg: var(--bs-body-bg); --bs-dropdown-color: var(--bs-body-color); --bs-dropdown-border-color: var(--bs-border-color-translucent);
  --bs-dropdown-link-color: var(--bs-body-color); --bs-dropdown-link-hover-color: var(--bs-body-color); --bs-dropdown-link-hover-bg: var(--bs-tertiary-bg);
  --bs-dropdown-link-active-bg: #0d6efd; --bs-dropdown-link-active-color: #fff; --bs-dropdown-divider-bg: var(--bs-border-color-translucent);
}
.tn-a :is(.navbar-themed, .sidebar-wrapper) :is(.badge, .card, .card-header, .rounded).bg-primary { background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)) !important; color: var(--bs-badge-color) !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) :is(.badge, .card, .card-header, .rounded).bg-success { background-color: rgba(var(--bs-success-rgb), var(--bs-bg-opacity)) !important; color: var(--bs-badge-color) !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) :is(.badge, .card, .card-header, .rounded).bg-info { background-color: rgba(var(--bs-info-rgb), var(--bs-bg-opacity)) !important; color: var(--bs-badge-color) !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) :is(.badge, .card, .card-header, .rounded).bg-warning { background-color: rgba(var(--bs-warning-rgb), var(--bs-bg-opacity)) !important; color: var(--bs-badge-color) !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) :is(.badge, .card, .card-header, .rounded).bg-danger { background-color: rgba(var(--bs-danger-rgb), var(--bs-bg-opacity)) !important; color: var(--bs-badge-color) !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) :is(.badge, .card, .card-header, .rounded).bg-secondary { background-color: rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity)) !important; color: var(--bs-badge-color) !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .badge.bg-warning.text-dark { color: rgba(var(--bs-dark-rgb), var(--bs-text-opacity)) !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .text-success { color: rgba(var(--bs-success-rgb), var(--bs-text-opacity)) !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .text-warning { color: rgba(var(--bs-warning-rgb), var(--bs-text-opacity)) !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .text-danger { color: rgba(var(--bs-danger-rgb), var(--bs-text-opacity)) !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .text-info { color: rgba(var(--bs-info-rgb), var(--bs-text-opacity)) !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .text-dark { color: rgba(var(--bs-dark-rgb), var(--bs-text-opacity)) !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .text-secondary { color: rgba(var(--bs-secondary-rgb), var(--bs-text-opacity)) !important; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) :is(.text-muted, .text-body-secondary) { color: var(--bs-secondary-color) !important; }

[data-bs-theme="dark"] .tn-a:has(.filters-container) :is(.navbar-themed, .sidebar-wrapper) .text-muted { color: #f8f9fa !important; border-color: #ced4da; }
[data-bs-theme="dark"] .tn-a:has(.filters-container) :is(.navbar-themed, .sidebar-wrapper) .text-info { color: #9ec5fe !important; border-color: #9ec5fe; }
[data-bs-theme="dark"] .tn-a:has(.filters-container) :is(.navbar-themed, .sidebar-wrapper) .text-danger { color: #f1aeb5 !important; border-color: #f1aeb5; }
[data-bs-theme="dark"] .tn-a:has(.filters-container) :is(.navbar-themed, .sidebar-wrapper) .text-success { color: #75b798 !important; }
[data-bs-theme="dark"] .tn-a:has(.filters-container) :is(.navbar-themed, .sidebar-wrapper) .text-warning { color: #ffda6a !important; }

/* Foco na moldura: o desenho anterior, nao o do guia. */
.tn-a :is(.navbar-themed, .sidebar-wrapper) :focus-visible:not(.btn) { outline: revert; outline-offset: revert; }
.tn-a :is(.navbar-themed, .sidebar-wrapper) .nav-link:focus-visible { outline: 0; box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25); }

@media (max-width: 575.98px) {
  .tn-a :is(.navbar-themed, .sidebar-wrapper) .d-flex:not(.flex-wrap) { flex-wrap: nowrap !important; }
  .tn-a :is(.navbar-themed, .sidebar-wrapper) .d-flex.justify-content-between { gap: normal; }
}