/* ============================================================
   🎨 THEME: default - سفارشی   Custom: YES | Preset: NO   Generated at: 2026-10-09 20:25:39   ============================================================ */

:root {
    --theme-bg: #5a2e1b;
    --theme-bg-rgb: 90, 46, 27;
    --theme-surface: #a86232;
    --theme-surface-light: #334155;
    --theme-text: #ffffff;
    --theme-text-muted: #ffffff;
    --theme-primary: #5a2e1b;
    --theme-primary-rgb: 90, 46, 27;
    --theme-primary-hover: #290f05;
    --theme-primary-light: #d0916c;
    --theme-secondary: #a86232;
    --theme-secondary-rgb: 168, 98, 50;
    --theme-border: #e3d5c5;
    --theme-card: #fffdfc;
    --theme-input: #fbf7f1;
    --theme-shadow: rgba(0, 0, 0, 0.4);
    --theme-badge: rgba(59, 130, 246, 0.15);
    --theme-navbar: #c77152;
    --theme-dropdown: rgba(15, 23, 42, 0.98);
    --theme-modal: rgba(15, 23, 42, 0.98);
    --theme-gradient-from: #a86232;
    --theme-gradient-to: #a86232;
    --theme-hero: linear-gradient(135deg, #0f172a 0%, #1e1b4b 100%);
    --theme-footer: #2b1710;
    --theme-success: #22c55e;
    --theme-success-rgb: 34, 197, 94;
    --theme-warning: #f59e0b;
    --theme-warning-rgb: 245, 158, 11;
    --theme-danger: #ef4444;
    --theme-danger-rgb: 239, 68, 68;
    --theme-info: #06b6d4;
    --theme-info-rgb: 6, 182, 212;
    --theme-surface-rgb: 168, 98, 50;
    --theme-surface-light-rgb: 51, 65, 85;
    --theme-gradient: linear-gradient(135deg, #a86232, #a86232);
}

/* ============================================================
   BASE STYLES
   ============================================================ */
html {
    color-scheme: dark !important;
    background: var(--theme-bg) !important;
}

body {
    background-color: var(--theme-bg) !important;
    color: var(--theme-text) !important;
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* ============================================================
   BACKGROUND CLASSES
   ============================================================ */
.bg-theme-bg { background-color: var(--theme-bg) !important; }
.bg-theme-surface { background-color: var(--theme-surface) !important; }
.bg-theme-surface-light { background-color: var(--theme-surface-light) !important; }
.bg-theme-card { background-color: var(--theme-card) !important; }
.bg-theme-input { background-color: var(--theme-input) !important; }
.bg-theme-primary { background-color: var(--theme-primary) !important; }
.bg-theme-badge { background-color: var(--theme-badge) !important; }
.bg-theme-navbar { background-color: var(--theme-navbar) !important; }
.bg-theme-dropdown { background-color: var(--theme-dropdown) !important; }
.bg-theme-modal { background-color: var(--theme-modal) !important; }

.bg-gradient-theme {
    background: var(--theme-gradient) !important;
}

.bg-hero {
    background: var(--theme-hero) !important;
}

.bg-footer {
    background: var(--theme-footer) !important;
}

/* ============================================================
   TEXT COLORS
   ============================================================ */
.text-theme-text { color: var(--theme-text) !important; }
.text-theme-muted { color: var(--theme-text-muted) !important; }
.text-theme-primary { color: var(--theme-primary) !important; }
.text-theme-primary-light { color: var(--theme-primary-light) !important; }
.text-theme-secondary { color: var(--theme-secondary) !important; }

/* ============================================================
   BORDERS
   ============================================================ */
.border-theme { border-color: var(--theme-border) !important; }
.border-theme-primary { border-color: var(--theme-primary) !important; }

/* ============================================================
   CARDS
   ============================================================ */
.card-theme {
    background: var(--theme-card);
    border: 1px solid var(--theme-border);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 16px;
    transition: all 0.3s ease;
}

.card-theme:hover {
    border-color: var(--theme-primary);
    box-shadow: 0 8px 32px var(--theme-shadow);
}

/* ============================================================
   HEADER / NAVBAR
   ============================================================ */
.header-theme,
.navbar-theme {
    background: var(--theme-navbar);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-bottom: 1px solid var(--theme-border);
}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn-theme-primary {
    background: var(--theme-gradient);
    color: #fff;
    padding: 10px 24px;
    border-radius: 12px;
    border: none;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    font-weight: 600;
}

.btn-theme-primary:hover {
    opacity: 0.9;
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(var(--theme-primary-rgb), 0.3);
}

.btn-theme-outline {
    background: transparent;
    color: var(--theme-primary);
    border: 2px solid var(--theme-primary);
    padding: 8px 22px;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

.btn-theme-outline:hover {
    background: var(--theme-primary);
    color: #fff;
}

/* ============================================================
   INPUTS
   ============================================================ */
.input-theme {
    background: var(--theme-input);
    border: 1px solid var(--theme-border);
    color: var(--theme-text);
    padding: 10px 16px;
    border-radius: 12px;
    transition: all 0.3s ease;
    width: 100%;
}

.input-theme:focus {
    border-color: var(--theme-primary);
    box-shadow: 0 0 0 3px rgba(var(--theme-primary-rgb), 0.15);
    outline: none;
}

.input-theme::placeholder {
    color: var(--theme-text-muted);
    opacity: 0.6;
}

/* ============================================================
   MODAL
   ============================================================ */
.modal-theme {
    background: var(--theme-modal);
    border: 1px solid var(--theme-border);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 20px;
}

/* ============================================================
   DROPDOWN
   ============================================================ */
.dropdown-theme {
    background: var(--theme-dropdown);
    border: 1px solid var(--theme-border);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 16px;
}

/* ============================================================
   BADGE
   ============================================================ */
.badge-theme {
    background: var(--theme-badge);
    color: var(--theme-primary-light);
    padding: 2px 10px;
    border-radius: 20px;
    font-size: 0.7rem;
    font-weight: 600;
}

/* ============================================================
   SCROLLBAR
   ============================================================ */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--theme-bg);
}

::-webkit-scrollbar-thumb {
    background: var(--theme-primary);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--theme-primary-hover);
}

/* ============================================================
   SELECTION
   ============================================================ */
::selection {
    background: var(--theme-primary);
    color: #fff;
}

::-moz-selection {
    background: var(--theme-primary);
    color: #fff;
}

/* ============================================================
   LINKS
   ============================================================ */
a:not(.no-theme):hover {
    color: var(--theme-primary-light);
}

/* ============================================================
   TABLES
   ============================================================ */
.table-theme {
    border-color: var(--theme-border);
}

.table-theme thead {
    background: var(--theme-surface);
}

.table-theme tbody tr:hover {
    background: var(--theme-badge);
}

/* ============================================================
   FOOTER
   ============================================================ */
.footer-theme {
    background: var(--theme-footer);
    border-top: 1px solid var(--theme-border);
}

/* ============================================================
   SMOOTH TRANSITIONS
   ============================================================ */
* {
    transition-property: background-color, border-color, color;
    transition-duration: 0.15s;
    transition-timing-function: ease;
}

/* ============================================================
   ✅ OVERRIDE TAILWIND COLORS - هماهنگی با تم
   ============================================================ */
.bg-slate-800 { background-color: var(--theme-surface) !important; }
.bg-slate-800\/90 { background-color: rgba(var(--theme-surface-rgb), 0.90) !important; }
.bg-slate-800\/80 { background-color: rgba(var(--theme-surface-rgb), 0.80) !important; }
.bg-slate-800\/50 { background-color: rgba(var(--theme-surface-rgb), 0.50) !important; }
.bg-slate-800\/30 { background-color: rgba(var(--theme-surface-rgb), 0.30) !important; }
.bg-slate-700 { background-color: var(--theme-surface-light) !important; }
.bg-slate-600 { background-color: var(--theme-surface-light) !important; }
.bg-slate-900 { background-color: var(--theme-bg) !important; }

.text-slate-100 { color: var(--theme-text) !important; }
.text-slate-200 { color: var(--theme-text) !important; }
.text-slate-300 { color: var(--theme-text) !important; }
.text-slate-400 { color: var(--theme-text-muted) !important; }
.text-slate-500 { color: var(--theme-text-muted) !important; }

.border-slate-700 { border-color: var(--theme-border) !important; }
.border-slate-600 { border-color: var(--theme-border) !important; }

.bg-blue-600 { background-color: var(--theme-primary) !important; }
.bg-blue-700 { background-color: var(--theme-primary-hover) !important; }
.text-blue-400 { color: var(--theme-primary-light) !important; }
.text-blue-600 { color: var(--theme-primary) !important; }
.border-blue-500 { border-color: var(--theme-primary) !important; }

/* ============================================================
   🎨 EFFECTS - افکت‌های مناسبتی
   ============================================================ */






/* ============================================================
   🎊 OCCASION BADGE - نشان مناسبت
   ============================================================ */


/* ============================================================
   📱 RESPONSIVE - Effects
   ============================================================ */
@media (max-width: 768px) {
    #theme-snow-container,
    #theme-fireworks-container,
    #theme-moonstar-container,
    #theme-pomegranate-container {
        opacity: 0.6;
    }
    
    .snowflake-particle {
        font-size: 10px !important;
    }
}

/* ============================================================
   ♿ REDUCED MOTION
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
    .snowflake-particle,
    .firework-particle,
    .floating-pumpkin,
    .twinkle-star,
    .floating-moon,
    .falling-pomegranate {
        animation: none !important;
        display: none !important;
    }
    
    #theme-snow-container,
    #theme-fireworks-container,
    #theme-pumpkin-container,
    #theme-moonstar-container,
    #theme-pomegranate-container {
        display: none !important;
    }
    
    * {
        transition-duration: 0.01ms !important;
    }
}

/* ============================================================
   🎯 PRINT
   ============================================================ */
@media print {
    #theme-snow-container,
    #theme-fireworks-container,
    #theme-pumpkin-container,
    #theme-moonstar-container,
    #theme-pomegranate-container,
    .occasion-badge-wrapper,
    .occasion-modal-overlay {
        display: none !important;
    }
}