/* Dark Mode Global Styles */

/* Base Dark Mode Colors */
:root {
    --dark-bg-primary: #111827;
    --dark-bg-secondary: #1f2937;
    --dark-bg-tertiary: #374151;
    --dark-text-primary: #f9fafb;
    --dark-text-secondary: #e5e7eb;
    --dark-text-muted: #9ca3af;
    --dark-border: #374151;
}

/* Force all backgrounds in dark mode */
.dark * {
    border-color: var(--dark-border) !important;
}

/* HERO SECTIONS - Ultra Priority - MAXIMUM SPECIFICITY */
.dark section:first-of-type,
.dark section[class*="py-"],
.dark section.py-20,
.dark section.py-16,
.dark section.py-12,
.dark section.bg-gray-50,
.dark section.bg-white,
.dark section[class*="bg-gradient"] {
    background: var(--dark-bg-primary) !important;
    background-image: none !important;
}

/* Hero title and subtitle - Maximum priority - FORCE VISIBLE */
.dark section h1,
.dark section h2,
.dark section h3,
.dark section h4,
.dark h1,
.dark h2,
.dark h3,
.dark h4 {
    color: var(--dark-text-primary) !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Hero paragraphs - FORCE VISIBLE */
.dark section p,
.dark p {
    color: var(--dark-text-secondary) !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Any div inside sections - ABSOLUTELY TRANSPARENT */
.dark section > div,
.dark section > div > div,
.dark section > div > div > div,
.dark section div[class*="container"],
.dark section div[class*="max-w"] {
    background-color: transparent !important;
}

/* Override ALL possible white/gray backgrounds in sections */
.dark section div.bg-white,
.dark section div.bg-gray-50,
.dark section div.bg-gray-100,
.dark section div[class*="bg-"],
.dark section > * {
    background-color: transparent !important;
}

/* Dark Mode Body */
.dark body {
    background-color: var(--dark-bg-primary) !important;
    color: var(--dark-text-primary) !important;
}

/* Dark Mode Sections */
.dark section {
    background-color: var(--dark-bg-primary) !important;
}

.dark section.bg-gray-50,
.dark section.bg-gray-100 {
    background-color: var(--dark-bg-secondary) !important;
}

.dark section.bg-white {
    background-color: var(--dark-bg-primary) !important;
}

/* Dark Mode Headings */
.dark h1,
.dark h2,
.dark h3,
.dark h4,
.dark h5,
.dark h6 {
    color: var(--dark-text-primary) !important;
}

/* Dark Mode Paragraphs and Text */
.dark p,
.dark span,
.dark li,
.dark label,
.dark div {
    color: var(--dark-text-secondary) !important;
}

.dark .text-gray-900 {
    color: var(--dark-text-primary) !important;
}

.dark .text-gray-800 {
    color: var(--dark-text-primary) !important;
}

.dark .text-gray-700 {
    color: var(--dark-text-secondary) !important;
}

.dark .text-gray-600 {
    color: var(--dark-text-muted) !important;
}

.dark .text-gray-500 {
    color: var(--dark-text-muted) !important;
}

.dark .text-gray-400 {
    color: var(--dark-text-muted) !important;
}

/* Dark Mode Cards */
.dark .bg-white {
    background-color: var(--dark-bg-secondary) !important;
}

.dark .bg-gray-50 {
    background-color: var(--dark-bg-tertiary) !important;
}

.dark .bg-gray-100 {
    background-color: var(--dark-bg-tertiary) !important;
}

/* Dark Mode Borders */
.dark .border-gray-100,
.dark .border-gray-200 {
    border-color: var(--dark-border) !important;
}

/* Dark Mode Buttons */
.dark button:not(.bg-blue-600):not(.bg-emerald-600):not(.bg-emerald-500) {
    color: var(--dark-text-primary) !important;
}

.dark .hover\:bg-gray-50:hover {
    background-color: var(--dark-bg-tertiary) !important;
}

/* Dark Mode Forms */
.dark input,
.dark textarea,
.dark select {
    background-color: var(--dark-bg-tertiary) !important;
    color: var(--dark-text-primary) !important;
    border-color: var(--dark-border) !important;
}

.dark input::placeholder,
.dark textarea::placeholder {
    color: var(--dark-text-muted) !important;
}

/* Dark Mode Links */
.dark a:not(.bg-blue-600):not(.bg-emerald-600):not(.bg-emerald-500) {
    color: #60a5fa !important;
}

.dark a:not(.bg-blue-600):not(.bg-emerald-600):not(.bg-emerald-500):hover {
    color: #93c5fd !important;
}

/* Dark Mode Shadows */
.dark .shadow-sm,
.dark .shadow,
.dark .shadow-md,
.dark .shadow-lg,
.dark .shadow-xl,
.dark .shadow-2xl {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.5), 0 1px 2px 0 rgba(0, 0, 0, 0.3) !important;
}

/* Dark Mode for Rounded Elements */
.dark .rounded-2xl,
.dark .rounded-xl,
.dark .rounded-lg {
    background-color: var(--dark-bg-secondary) !important;
}

/* Dark Mode for Specific Sections */
.dark section.bg-white,
.dark section.bg-gray-50,
.dark section.bg-gray-100 {
    background-color: var(--dark-bg-primary) !important;
}

/* Dark Mode for divs with bg classes */
.dark div.bg-white,
.dark div.bg-gray-50,
.dark div.bg-gray-100 {
    background-color: var(--dark-bg-secondary) !important;
}

/* Ensure text center divs are visible */
.dark .text-center {
    color: var(--dark-text-primary) !important;
}

/* Number badges and stats */
.dark .text-4xl,
.dark .text-3xl,
.dark .text-2xl,
.dark .text-xl {
    color: var(--dark-text-primary) !important;
}

/* Keep brand colors for blue and emerald */
.dark .bg-blue-600,
.dark .bg-emerald-600,
.dark .bg-emerald-500,
.dark .bg-blue-500 {
    /* Keep original colors */
    background-color: inherit !important;
}

.dark .text-blue-600 {
    color: #3b82f6 !important;
}

.dark .text-emerald-600 {
    color: #10b981 !important;
}

/* Hero sections with large text */
.dark section div h1,
.dark section div h2,
.dark section div h3 {
    color: var(--dark-text-primary) !important;
}

/* Paragraphs in sections */
.dark section div p {
    color: var(--dark-text-secondary) !important;
}

/* All containers and wrappers */
.dark .container,
.dark .max-w-7xl,
.dark .max-w-6xl,
.dark .max-w-4xl,
.dark .max-w-2xl {
    background-color: transparent !important;
}

/* Grid items */
.dark .grid > div {
    background-color: var(--dark-bg-secondary) !important;
}

/* Flex items that are cards */
.dark .flex.flex-col {
    background-color: var(--dark-bg-secondary) !important;
}

/* All text utilities */
.dark .text-lg,
.dark .text-base,
.dark .text-sm,
.dark .text-xs {
    color: var(--dark-text-secondary) !important;
}

/* Lead text / descriptions */
.dark .leading-relaxed {
    color: var(--dark-text-secondary) !important;
}

/* Specific for rounded cards in grid */
.dark .grid .rounded-xl,
.dark .grid .rounded-2xl,
.dark .grid .rounded-lg {
    background-color: var(--dark-bg-secondary) !important;
}

/* Buttons that are not primary actions */
.dark button:not([class*="bg-blue"]):not([class*="bg-emerald"]) {
    background-color: var(--dark-bg-tertiary) !important;
    color: var(--dark-text-primary) !important;
}

/* Badge or tag style elements */
.dark .inline-block {
    color: var(--dark-text-secondary) !important;
}

/* Override any remaining white backgrounds */
.dark [class*="bg-white"]:not([class*="bg-blue"]):not([class*="bg-emerald"]) {
    background-color: var(--dark-bg-secondary) !important;
}

/* Override any remaining gray backgrounds */
.dark [class*="bg-gray-"]:not([class*="bg-blue"]):not([class*="bg-emerald"]) {
    background-color: var(--dark-bg-tertiary) !important;
}

/* Dark Mode Dropdown Menus */
.dark #beyazEsyaDropdown,
.dark #kombiDropdown {
    background-color: var(--dark-bg-secondary) !important;
    border-color: var(--dark-border) !important;
}

/* Dark Mode Mobile Menu */
.dark #mobileMenu {
    background-color: rgba(31, 41, 55, 0.98) !important;
}

/* Dark Mode Icons - Keep Blue/Emerald Colors */
.dark .text-blue-600,
.dark .text-blue-500,
.dark .text-emerald-600,
.dark .text-emerald-500 {
    /* Keep original colors for branding */
}

.dark .bg-blue-100 {
    background-color: rgba(59, 130, 246, 0.2) !important;
}

.dark .bg-emerald-100 {
    background-color: rgba(16, 185, 129, 0.2) !important;
}

/* Dark Mode Hover States for Cards */
.dark .hover\:bg-blue-50:hover {
    background-color: rgba(59, 130, 246, 0.1) !important;
}

.dark .hover\:bg-emerald-50:hover {
    background-color: rgba(16, 185, 129, 0.1) !important;
}

/* Smooth Transitions */
body,
section,
div,
h1, h2, h3, h4, h5, h6,
p, span, a {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* MARKA BUTONLARI - Brand Buttons Specific */
.dark .flex.flex-wrap > a,
.dark .flex.flex-wrap > button {
    background-color: var(--dark-bg-tertiary) !important;
    color: var(--dark-text-primary) !important;
    border-color: var(--dark-border) !important;
}

.dark .flex.flex-wrap > a:hover,
.dark .flex.flex-wrap > button:hover {
    background-color: rgba(59, 130, 246, 0.2) !important;
    border-color: #3b82f6 !important;
}

/* Additional color backgrounds for dark mode */
.dark .bg-yellow-100 {
    background-color: rgba(234, 179, 8, 0.15) !important;
}

.dark .bg-orange-100 {
    background-color: rgba(249, 115, 22, 0.15) !important;
}

.dark .bg-red-100 {
    background-color: rgba(239, 68, 68, 0.15) !important;
}

.dark .bg-purple-100 {
    background-color: rgba(168, 85, 247, 0.15) !important;
}

.dark .bg-pink-100 {
    background-color: rgba(236, 72, 153, 0.15) !important;
}

.dark .bg-indigo-100 {
    background-color: rgba(99, 102, 241, 0.15) !important;
}

/* MARKA KARTLARI - Gradient Cards Override */
.dark div[class*="bg-gradient"] {
    background: var(--dark-bg-secondary) !important;
    background-image: none !important;
}

/* Grid içindeki gradient kartlar */
.dark .grid div[class*="bg-gradient"] {
    background: var(--dark-bg-secondary) !important;
    background-image: none !important;
}

/* Marka grid kartlarındaki beyaz iç kartlar */
.dark div[class*="bg-gradient"] .bg-white {
    background-color: var(--dark-bg-tertiary) !important;
}

.dark div[class*="bg-gradient"] p.text-gray-900,
.dark div[class*="bg-gradient"] h3.text-gray-900 {
    color: var(--dark-text-primary) !important;
}

.dark div[class*="bg-gradient"] p.text-gray-600 {
    color: var(--dark-text-muted) !important;
}

/* Link-style buttons (anchor tags with button styling) */
.dark a[class*="inline-flex"],
.dark a[class*="flex items-center"] {
    background-color: var(--dark-bg-tertiary) !important;
    color: var(--dark-text-primary) !important;
}

/* Nested divs in grid keep proper background */
.dark .grid > div > div {
    background-color: transparent !important;
}

/* Text colors for small badges */
.dark .text-xs,
.dark .text-sm {
    color: var(--dark-text-muted) !important;
}

/* Strong emphasis text */
.dark strong,
.dark b {
    color: var(--dark-text-primary) !important;
}

/* All anchor tags inside sections */
.dark section a:not([class*="bg-blue"]):not([class*="bg-emerald"]):not([class*="bg-green"]) {
    color: #60a5fa !important;
}

.dark section a:not([class*="bg-blue"]):not([class*="bg-emerald"]):not([class*="bg-green"]):hover {
    color: #93c5fd !important;
}