/**
 * Dark Mode — Global Overrides
 * 
 * Este arquivo aplica a paleta dark em todos os componentes que usam cores hardcoded.
 * Abordagem: overrides globais com [data-theme="dark"] em vez de alterar cada .razor.css.
 * 
 * Paleta:
 *   Background:       #0F172A
 *   Surface:          #162033
 *   Surface Elevated: #1E2A42
 *   Primary:          #4F8DFD
 *   Primary Hover:    #6AA3FF
 *   Text Primary:     #F8FAFC
 *   Text Secondary:   #B8C1D1
 *   Labels/Tertiary:  #8E9AB0
 *   Borders:          #24314D
 *   Button gradient:  linear-gradient(90deg, #4F8DFD, #6AA3FF)
 */

/* ============================================
   LAYOUTS
   ============================================ */

[data-theme="dark"] .auth-layout,
[data-theme="dark"] .app-viewport,
[data-theme="dark"] .mobile-frame,
[data-theme="dark"] .shell-layout {
    background-color: #0F172A !important;
}

[data-theme="dark"] .minimal-page {
    background: #0F172A !important;
}

/* ============================================
   NAV MENU (Drawer)
   ============================================ */

[data-theme="dark"] .nav-profile {
    background-color: #162033 !important;
    border-bottom-color: #24314D !important;
}

[data-theme="dark"] .email-display,
[data-theme="dark"] .session-label {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .session-value {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .nav-divider {
    border-top-color: #24314D !important;
}

[data-theme="dark"] .nav-item:hover {
    background: #1E2A42 !important;
}

[data-theme="dark"] .nav-icon {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .nav-text {
    color: #F8FAFC !important;
}

/* ============================================
   LOGIN PAGE
   ============================================ */

[data-theme="dark"] .logo-icon {
    background: #162033 !important;
    border-color: #24314D !important;
    color: #8E9AB0 !important;
}

[data-theme="dark"] .app-title {
    color: #4F8DFD !important;
}

[data-theme="dark"] .app-subtitle {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .input-label {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .input-field {
    background: #162033 !important;
    border-color: #24314D !important;
    color: #F8FAFC !important;
}

[data-theme="dark"] .input-field:focus {
    border-color: #4F8DFD !important;
    background: #1E2A42 !important;
}

[data-theme="dark"] .input-field::placeholder {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .login-button {
    background: linear-gradient(90deg, #4F8DFD, #6AA3FF) !important;
}

[data-theme="dark"] .login-button:disabled {
    background: #24314D !important;
}

[data-theme="dark"] .version-text {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .progress-card {
    background: #162033 !important;
    border-color: #24314D !important;
}

[data-theme="dark"] .progress-title {
    color: #4F8DFD !important;
}

[data-theme="dark"] .progress-bar-container {
    background: #1E2A42 !important;
}

[data-theme="dark"] .progress-bar-fill {
    background: #4F8DFD !important;
}

[data-theme="dark"] .loading-step.pending {
    color: #8E9AB0 !important;
}

/* ============================================
   TOMBAMENTOS SYNC PAGE
   ============================================ */

[data-theme="dark"] .sync-card {
    background: #162033 !important;
    border-color: #24314D !important;
}

[data-theme="dark"] .sync-title {
    color: #F8FAFC !important;
}

/* Escopado a .sync-card: TombamentosSync.razor é o único dono deste
 * .sync-status claro/neutro. IndicadorDeSincronizacao.razor (badge de
 * sincronização do cabeçalho) reaproveita o mesmo nome de classe mas define
 * suas próprias cores por estado (--ok/--pending/--syncing/--success/--error/
 * --offline) em IndicadorDeSincronizacao.razor.css; um seletor global aqui
 * vazava sobre ele e deixava o texto quase invisível no tema escuro. */
[data-theme="dark"] .sync-card .sync-status {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .progress-label {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .progress-track {
    background: #1E2A42 !important;
}

[data-theme="dark"] .progress-fill {
    background: #4F8DFD !important;
}

[data-theme="dark"] .btn-retry {
    background: #162033 !important;
    border-color: #24314D !important;
    color: #F8FAFC !important;
}

[data-theme="dark"] .btn-back {
    background: linear-gradient(90deg, #4F8DFD, #6AA3FF) !important;
}

[data-theme="dark"] .spinner-validation {
    border-color: #24314D !important;
    border-top-color: #4F8DFD !important;
}

[data-theme="dark"] .sync-validation-hint {
    color: #B8C1D1 !important;
}

/* ============================================
   CONFIGURACAO SESSAO PAGE
   ============================================ */

[data-theme="dark"] .config-title {
    color: #F8FAFC !important;
}

[data-theme="dark"] .config-subtitle {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .field-label {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .config-note {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .start-session-button {
    background: linear-gradient(90deg, #4F8DFD, #6AA3FF) !important;
}

[data-theme="dark"] .start-session-button:disabled {
    background: #24314D !important;
}

/* ============================================
   BENS PAGE
   ============================================ */

[data-theme="dark"] .search-section,
[data-theme="dark"] .cta-section {
    background: #0F172A !important;
}

[data-theme="dark"] .primary-cta {
    background: linear-gradient(90deg, #4F8DFD, #6AA3FF) !important;
    box-shadow: 0 4px 12px rgba(79, 141, 253, 0.3) !important;
}

[data-theme="dark"] .section-label {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .section-count {
    color: #4F8DFD !important;
}

/* ============================================
   PATRIMONIO CARD
   ============================================ */

[data-theme="dark"] .item-card {
    background: #162033 !important;
    border-color: #24314D !important;
}

[data-theme="dark"] .card-name {
    color: #F8FAFC !important;
}

[data-theme="dark"] .code-tag {
    color: #4F8DFD !important;
    background: rgba(79, 141, 253, 0.12) !important;
    border-color: rgba(79, 141, 253, 0.2) !important;
}

[data-theme="dark"] .loc-text {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .loc-icon {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .card-chevron {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .obs-bubble {
    background: #1E2A42 !important;
}

[data-theme="dark"] .obs-bubble::before {
    border-right-color: #1E2A42 !important;
}

[data-theme="dark"] .obs-bubble-icon,
[data-theme="dark"] .obs-bubble-text {
    color: #8E9AB0 !important;
}

/* ============================================
   SEARCH BAR
   ============================================ */

[data-theme="dark"] .search-bar {
    background-color: #162033 !important;
    border-color: #24314D !important;
}

[data-theme="dark"] .search-bar__input {
    color: #F8FAFC !important;
}

[data-theme="dark"] .search-bar__icon {
    color: #8E9AB0 !important;
}

/* ============================================
   ITEM DETAILS PAGE
   ============================================ */

[data-theme="dark"] .details-page {
    background: #0F172A !important;
}

[data-theme="dark"] .header-title {
    color: #F8FAFC !important;
}

[data-theme="dark"] .header-subtitle {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .image-container {
    background: #162033 !important;
}

[data-theme="dark"] .image-placeholder {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .camera-fab {
    background: #1E2A42 !important;
    color: #4F8DFD !important;
}

[data-theme="dark"] .bem-info-card {
    background: #162033 !important;
    border-color: #24314D !important;
}

[data-theme="dark"] .bem-info-header .material-symbols-outlined,
[data-theme="dark"] .bem-info-title,
[data-theme="dark"] .bem-location-title {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .bem-location-section {
    border-top-color: #24314D !important;
}

[data-theme="dark"] .section-divider {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .section-divider::before,
[data-theme="dark"] .section-divider::after {
    background: #24314D !important;
}

[data-theme="dark"] .description-text,
[data-theme="dark"] .value-text {
    color: #F8FAFC !important;
}

[data-theme="dark"] .form-select {
    background-color: #162033 !important;
    border-color: #24314D !important;
    color: #F8FAFC !important;
}

[data-theme="dark"] .checkbox-item {
    border-color: #24314D !important;
}

[data-theme="dark"] .checkbox-item:hover {
    background: #1E2A42 !important;
}

[data-theme="dark"] .checkbox-item span {
    color: #F8FAFC !important;
}

[data-theme="dark"] .form-textarea {
    border-color: #24314D !important;
    color: #F8FAFC !important;
    background: #162033 !important;
}

[data-theme="dark"] .save-button,
[data-theme="dark"] .back-button {
    background: linear-gradient(90deg, #4F8DFD, #6AA3FF) !important;
}

/* ============================================
   OBSERVACAO MODAL
   ============================================ */

[data-theme="dark"] .obs-modal {
    background: #162033 !important;
}

[data-theme="dark"] .obs-modal-title {
    color: #F8FAFC !important;
}

[data-theme="dark"] .obs-modal-subtitle {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .obs-close-btn:active {
    background: #1E2A42 !important;
}

[data-theme="dark"] .obs-textarea {
    border-color: #24314D !important;
    color: #F8FAFC !important;
    background: #0F172A !important;
}

[data-theme="dark"] .obs-textarea:focus {
    border-color: #4F8DFD !important;
}

[data-theme="dark"] .obs-btn-cancel {
    border-color: #24314D !important;
    background: #162033 !important;
    color: #B8C1D1 !important;
}

[data-theme="dark"] .obs-btn-save {
    background: linear-gradient(90deg, #4F8DFD, #6AA3FF) !important;
}

/* ============================================
   OPERATIONS CONTAINER
   ============================================ */

[data-theme="dark"] .operations-container {
    background: #162033 !important;
    border-top-color: #24314D !important;
}

[data-theme="dark"] .operations-handle {
    background: #8E9AB0 !important;
}

[data-theme="dark"] .operations-close-btn {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .operations-close-btn:active {
    background: #1E2A42 !important;
}

[data-theme="dark"] .empty-icon {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .empty-message {
    color: #F8FAFC !important;
}

[data-theme="dark"] .empty-submessage {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .btn-empty-cta,
[data-theme="dark"] .btn-nova-operacao {
    background: linear-gradient(90deg, #4F8DFD, #6AA3FF) !important;
}

[data-theme="dark"] .operations-title {
    color: #F8FAFC !important;
}

[data-theme="dark"] .operation-card {
    background: #1E2A42 !important;
    border-color: #24314D !important;
}

[data-theme="dark"] .operation-card:active {
    background: #0F172A !important;
}

@media (hover: hover) {
    [data-theme="dark"] .operation-card:hover {
        border-color: #33436A !important;
    }
}

[data-theme="dark"] .operation-type {
    color: #4F8DFD !important;
}

[data-theme="dark"] .operation-date,
[data-theme="dark"] .operation-photos {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .operation-justificativa {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .operation-hint {
    color: #7C8CAB !important;
    border-top-color: #24314D !important;
}

[data-theme="dark"] .spinner-ring {
    border-color: #24314D !important;
    border-top-color: #4F8DFD !important;
}

[data-theme="dark"] .loading-text {
    color: #B8C1D1 !important;
}

/* ============================================
   FILTER PANEL
   ============================================ */

[data-theme="dark"] .filter-label {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .filter-label .material-symbols-outlined {
    color: #8E9AB0 !important;
}

[data-theme="dark"] .filter-select {
    border-color: #24314D !important;
    background: #162033 !important;
    color: #F8FAFC !important;
}

[data-theme="dark"] .filter-select:hover {
    border-color: #8E9AB0 !important;
}

[data-theme="dark"] .btn-clear {
    border-color: #24314D !important;
    background: #162033 !important;
    color: #B8C1D1 !important;
}

[data-theme="dark"] .btn-clear:hover {
    background: #1E2A42 !important;
    border-color: #8E9AB0 !important;
    color: #F8FAFC !important;
}

/* ============================================
   FILTER CHIPS
   ============================================ */

[data-theme="dark"] .filter-chip--inactive {
    background: #1E2A42 !important;
    color: #B8C1D1 !important;
}

[data-theme="dark"] .filter-chip--inactive:hover {
    background: #24314D !important;
}

/* ============================================
   FORMULÁRIOS E BOTÃO VOLTAR
   ============================================ */

[data-theme="dark"] .form-input {
    border-color: #24314D !important;
    background: #162033 !important;
    color: #F8FAFC !important;
}

[data-theme="dark"] .btn-back:hover {
    background: #1E2A42 !important;
}

/* ============================================
   BARCODE CONFIGURATION
   ============================================ */

[data-theme="dark"] .config-section {
    background: #162033 !important;
}

[data-theme="dark"] .config-header h3,
[data-theme="dark"] .config-item-header h4 {
    color: #F8FAFC !important;
}

[data-theme="dark"] .config-description,
[data-theme="dark"] .config-item-description,
[data-theme="dark"] .setting-description {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .confidence-item label,
[data-theme="dark"] .numeric-setting label {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .config-item {
    border-bottom-color: #24314D !important;
}

[data-theme="dark"] .config-actions {
    border-top-color: #24314D !important;
}

/* ============================================
   STATUS BADGE
   ============================================ */

[data-theme="dark"] .status-badge.neutro {
    background: #1E2A42 !important;
    color: #B8C1D1 !important;
}

/* ============================================
   ASSET LIST ITEM
   ============================================ */

[data-theme="dark"] .asset-list-item {
    background: #162033 !important;
}

[data-theme="dark"] .asset-list-item:active {
    background: #1E2A42 !important;
}

[data-theme="dark"] .asset-icon {
    background: #1E2A42 !important;
}

/* ============================================
   MAIN HEADER (componente base — todas as telas)
   ============================================ */

[data-theme="dark"] header.app-header {
    background: #0B1324 !important;
    border-bottom-color: #24314D !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .brand-name {
    color: #4F8DFD !important;
}

[data-theme="dark"] .header-action,
[data-theme="dark"] .icon-button {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .header-action:active,
[data-theme="dark"] .icon-button:active {
    background: #1E2A42 !important;
}

[data-theme="dark"] .dropdown-menu {
    background: #162033 !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
}

[data-theme="dark"] .menu-item {
    color: #F8FAFC !important;
}

[data-theme="dark"] .menu-item .material-symbols-outlined {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .menu-item:active {
    background: #1E2A42 !important;
}

[data-theme="dark"] .menu-item-danger,
[data-theme="dark"] .menu-item-danger .material-symbols-outlined {
    color: #EF4444 !important;
}

[data-theme="dark"] .menu-divider {
    background: #24314D !important;
}

[data-theme="dark"] .modal-content {
    background: #162033 !important;
}

[data-theme="dark"] .modal-header {
    border-bottom-color: #24314D !important;
}

[data-theme="dark"] .modal-title,
[data-theme="dark"] .sobre-app-name {
    color: #F8FAFC !important;
}

[data-theme="dark"] .sobre-version,
[data-theme="dark"] .sobre-description {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .modal-close {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .modal-close:active {
    background: #1E2A42 !important;
}

/* ── Componente Card (Components/Base/Card.razor) ─────────────────────────────
 * O Card resolve o fundo por var(--color-surface), que em dark vira branco: o
 * theme.css redefine esse token sob :root DEPOIS do design-tokens.css, e a
 * definicao clara vence por ordem de carga. Dai a sobrescrita explicita, mesma
 * abordagem dos outros 160 overrides deste arquivo.
 *
 * A lacuna existia desde que o Card foi escrito; so apareceu agora porque ele
 * nunca havia sido usado em tela (#161 e o primeiro uso).
 */
[data-theme="dark"] .card {
    background: #162033 !important;
}

[data-theme="dark"] .card--flat {
    border-color: #24314D !important;
}

[data-theme="dark"] .card__header,
[data-theme="dark"] .card__footer {
    border-color: #24314D !important;
}

/* ── Barra de resumo da Listagem de Bens (#161) ───────────────────────────── */
[data-theme="dark"] .summary-count {
    color: #4F8DFD !important;
}

/* ── Seletor de ordenação da barra de resumo (listagem de Bens) ───────────────
 * Mesma lacuna do Card acima: --color-surface/--color-border/--color-text não
 * escurecem sozinhos (theme.css redefine sob :root depois do design-tokens.css),
 * então menu, botão e itens recebem cores fixas aqui.
 */
[data-theme="dark"] .ordenacao-btn {
    color: #4F8DFD !important;
    border-color: #24314D !important;
}

[data-theme="dark"] .ordenacao-btn:active {
    background: rgba(79, 141, 253, 0.12) !important;
}

[data-theme="dark"] .ordenacao-menu {
    background: #162033 !important;
    border-color: #24314D !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5) !important;
}

[data-theme="dark"] .ordenacao-item {
    color: #F8FAFC !important;
}

[data-theme="dark"] .ordenacao-item:active {
    background: #1E2A42 !important;
}

[data-theme="dark"] .ordenacao-item.ativo {
    color: #4F8DFD !important;
}

/* ── Breadcrumb de localização (Components/Base/BreadcrumbDeLocalizacao.razor)
 * Presente na Listagem, nos Detalhes do bem e na leitura de Plaqueta (#172),
 * substituiu a barra de resumo acima, que vivia só na Listagem.
 *
 * Mesma lacuna do Card logo acima — var(--color-surface)/var(--color-border)
 * não escurecem sozinhos — por isso fundo e borda também precisam de
 * sobrescrita explícita, não só o texto.
 *
 * :not(--escuro) exclui a variante do leitor de plaqueta: aquela tela usa
 * fundo escuro sempre, goste o operador do app no modo claro ou escuro, e
 * define suas próprias cores (ver LeitorDePlaqueta.razor.css) — nunca teve
 * overrides aqui, com o resto da tela também ficando de fora deste arquivo.
 */
[data-theme="dark"] .breadcrumb-localizacao:not(.breadcrumb-localizacao--escuro) {
    background: #162033 !important;
    border-bottom-color: #24314D !important;
}

[data-theme="dark"] .breadcrumb-localizacao:not(.breadcrumb-localizacao--escuro) .breadcrumb-localizacao-icon,
[data-theme="dark"] .breadcrumb-localizacao:not(.breadcrumb-localizacao--escuro) .breadcrumb-localizacao-text {
    color: #B8C1D1 !important;
}

[data-theme="dark"] .breadcrumb-localizacao:not(.breadcrumb-localizacao--escuro) .breadcrumb-localizacao-text strong {
    color: #F8FAFC !important;
}

[data-theme="dark"] .breadcrumb-localizacao:not(.breadcrumb-localizacao--escuro) .breadcrumb-localizacao-separator {
    color: #7A8699 !important;
}
