/* ===========================================
   DARK MODE - TEMA ESCURO
   Catálogo Digital - Notas Fácil
   =========================================== */

/* ========== VARIÁVEIS DARK ========== */
[data-theme="dark"] {
    --primary: #f97316;
    --primary-light: rgba(249, 115, 22, 0.1);
    --primary-shadow: rgba(249, 115, 22, 0.2);
    --secondary: #1f2937;
    --text-dark: #f9fafb;
    --text-gray: #9ca3af;
    --text-light: #6b7280;
    --border-color: #374151;
    --white: #111827;
    --success: #22c55e;
}

/* ========== BASE ========== */
[data-theme="dark"] body,
[data-theme="dark"] #app {
    background-color: #111827;
    color: #f9fafb;
}

/* ========== BACKGROUNDS ========== */
[data-theme="dark"] .bg-white {
    background-color: #1f2937 !important;
}

[data-theme="dark"] .bg-gray-50,
[data-theme="dark"] .bg-gray-100 {
    background-color: #374151 !important;
}

[data-theme="dark"] .bg-gray-200 {
    background-color: #4b5563 !important;
}

/* ========== TEXTOS ========== */
[data-theme="dark"] .text-gray-900,
[data-theme="dark"] .text-gray-800 {
    color: #f9fafb !important;
}

[data-theme="dark"] .text-gray-700,
[data-theme="dark"] .text-gray-600 {
    color: #d1d5db !important;
}

[data-theme="dark"] .text-gray-500,
[data-theme="dark"] .text-gray-400 {
    color: #9ca3af !important;
}

/* ========== BORDAS ========== */
[data-theme="dark"] .border-gray-100,
[data-theme="dark"] .border-gray-200 {
    border-color: #374151 !important;
}

[data-theme="dark"] .border-gray-300 {
    border-color: #4b5563 !important;
}

/* ========== SOMBRAS ========== */
[data-theme="dark"] .shadow-sm,
[data-theme="dark"] .shadow-lg,
[data-theme="dark"] .shadow-2xl {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
}

/* ========== NAVIGATION ========== */
[data-theme="dark"] #footer > .fixed {
    background-color: #1f2937;
    border-color: #374151;
}

/* ========== TOAST ========== */
[data-theme="dark"] #toast {
    background-color: #1f2937;
    border-color: #374151;
    color: #f9fafb;
}

/* ========== INPUTS ========== */
[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select {
    background-color: #374151 !important;
    color: #f9fafb !important;
    border-color: #4b5563 !important;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
    color: #6b7280 !important;
}

/* ========== MODALS ========== */
[data-theme="dark"] .bg-black\/50,
[data-theme="dark"] .bg-black\/60 {
    background-color: rgba(0, 0, 0, 0.7) !important;
}

/* ========== SKELETON ========== */
[data-theme="dark"] .skeleton {
    background: linear-gradient(90deg, #374151 25%, #4b5563 50%, #374151 75%);
    background-size: 200% 100%;
}

/* ========== CARDS ========== */
[data-theme="dark"] .skeleton-card {
    border-color: #374151;
}

[data-theme="dark"] .suggestion-card {
    background: #1f2937;
    border-color: #374151;
}

[data-theme="dark"] .img-placeholder {
    background-color: #374151;
}

/* ========== SEARCH ========== */
[data-theme="dark"] .search-results-dropdown {
    background: #1f2937;
    border-color: #374151;
}

/* ========== TOGGLE ========== */
.dark-mode-toggle {
    position: relative;
    width: 3.5rem;
    height: 2rem;
    background: #e5e7eb;
    border-radius: 9999px;
    cursor: pointer;
    transition: background 0.3s ease;
    border: none;
    padding: 0;
}

[data-theme="dark"] .dark-mode-toggle {
    background: #4b5563;
}

.dark-mode-toggle .toggle-thumb {
    position: absolute;
    top: 0.25rem;
    left: 0.25rem;
    width: 1.5rem;
    height: 1.5rem;
    background: white;
    border-radius: 50%;
    transition: transform 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

[data-theme="dark"] .dark-mode-toggle .toggle-thumb {
    transform: translateX(1.5rem);
}

.dark-mode-toggle .toggle-thumb svg {
    width: 0.875rem;
    height: 0.875rem;
    color: #f59e0b;
}

[data-theme="dark"] .dark-mode-toggle .toggle-thumb svg {
    color: #6366f1;
}