/* ========================================
   COMPREHENSIVE DARK MODE FIX FOR ALL PAGES
   ======================================== */

/* ========== TYPOGRAPHY ========== */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6 {
    color: #f9fafb !important;
}

[data-theme="dark"] p,
[data-theme="dark"] span,
[data-theme="dark"] div,
[data-theme="dark"] li,
[data-theme="dark"] a:not(.btn):not(.btn-primary):not(.btn-outline):not(.btn-secondary) {
    color: #e5e7eb !important;
}

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

[data-theme="dark"] .text-gray-800 {
    color: #f3f4f6 !important;
}

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

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

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

[data-theme="dark"] .text-gray-400 {
    color: #6b7280 !important;
}

[data-theme="dark"] .text-black {
    color: #f9fafb !important;
}

/* ========== BACKGROUNDS ========== */
[data-theme="dark"] body {
    background-color: #111827 !important;
}

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

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

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

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

[data-theme="dark"] section {
    background-color: transparent !important;
}

/* ========== CARDS ========== */
[data-theme="dark"] .card {
    background-color: #1f2937 !important;
    border-color: #374151 !important;
    color: #e5e7eb !important;
}

[data-theme="dark"] .card h1,
[data-theme="dark"] .card h2,
[data-theme="dark"] .card h3,
[data-theme="dark"] .card h4,
[data-theme="dark"] .card h5,
[data-theme="dark"] .card h6 {
    color: #f9fafb !important;
}

[data-theme="dark"] .card p {
    color: #d1d5db !important;
}

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

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

[data-theme="dark"] label {
    color: #e5e7eb !important;
}

[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] select:focus {
    background-color: #4b5563 !important;
    border-color: #2575FC !important;
}

/* ========== BUTTONS ========== */
[data-theme="dark"] .btn-outline {
    border-color: #4b5563 !important;
    color: #e5e7eb !important;
    background-color: transparent !important;
}

[data-theme="dark"] .btn-outline:hover {
    background-color: #374151 !important;
    border-color: #93c5fd !important;
    color: #93c5fd !important;
}

/* ========== NAVIGATION ========== */
[data-theme="dark"] .nav-link {
    color: #d1d5db !important;
}

[data-theme="dark"] .nav-link:hover,
[data-theme="dark"] .nav-link.active {
    color: #5eead4 !important;
}

/* ========== HERO SECTIONS ========== */
[data-theme="dark"] .hero-section {
    background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 100%) !important;
}

[data-theme="dark"] .hero-section h1,
[data-theme="dark"] .hero-section h2,
[data-theme="dark"] .hero-section p {
    color: #ffffff !important;
}

/* ========== GRADIENTS ========== */
[data-theme="dark"] .bg-gradient-to-br,
[data-theme="dark"] .bg-gradient-to-r {
    background: linear-gradient(to bottom right, #1f2937, #111827) !important;
}

[data-theme="dark"] .text-gradient {
    background: linear-gradient(135deg, #6A11CB 0%, #2575FC 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* ========== BORDERS ========== */
[data-theme="dark"] .border,
[data-theme="dark"] .border-t,
[data-theme="dark"] .border-b,
[data-theme="dark"] .border-l,
[data-theme="dark"] .border-r {
    border-color: #374151 !important;
}

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

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

/* ========== ALERTS & NOTIFICATIONS ========== */
[data-theme="dark"] .bg-green-50 {
    background-color: #1e3a2e !important;
}

[data-theme="dark"] .bg-red-50 {
    background-color: #3a1e1e !important;
}

[data-theme="dark"] .bg-yellow-50 {
    background-color: #3a3a1e !important;
}

[data-theme="dark"] .bg-blue-50 {
    background-color: #1e2a3a !important;
}

[data-theme="dark"] .text-green-800 {
    color: #86efac !important;
}

[data-theme="dark"] .text-green-700 {
    color: #4ade80 !important;
}

[data-theme="dark"] .text-red-800 {
    color: #fca5a5 !important;
}

[data-theme="dark"] .text-red-700 {
    color: #f87171 !important;
}

[data-theme="dark"] .text-yellow-800 {
    color: #fde047 !important;
}

[data-theme="dark"] .text-yellow-700 {
    color: #facc15 !important;
}

[data-theme="dark"] .text-blue-800 {
    color: #93c5fd !important;
}

[data-theme="dark"] .text-blue-700 {
    color: #60a5fa !important;
}

[data-theme="dark"] .border-green-200 {
    border-color: #2d5a45 !important;
}

[data-theme="dark"] .border-red-200 {
    border-color: #5a2d2d !important;
}

[data-theme="dark"] .border-yellow-200 {
    border-color: #5a5a2d !important;
}

[data-theme="dark"] .border-blue-200 {
    border-color: #2d3d5a !important;
}

/* ========== BADGES & TAGS ========== */
[data-theme="dark"] .bg-primary\/10 {
    background-color: rgba(37, 117, 252, 0.12) !important;
}

[data-theme="dark"] .text-primary {
    color: #93c5fd !important;
}

[data-theme="dark"] .bg-yellow-100 {
    background-color: rgba(253, 224, 71, 0.1) !important;
}

[data-theme="dark"] .text-yellow-800 {
    color: #fde047 !important;
}

/* ========== TABLES ========== */
[data-theme="dark"] table {
    background-color: #1f2937 !important;
    color: #e5e7eb !important;
}

[data-theme="dark"] thead {
    background-color: #374151 !important;
}

[data-theme="dark"] th,
[data-theme="dark"] td {
    border-color: #4b5563 !important;
    color: #e5e7eb !important;
}

[data-theme="dark"] tr:hover {
    background-color: #374151 !important;
}

/* ========== PRODUCT CARDS ========== */
[data-theme="dark"] .product-card,
[data-theme="dark"] .product-item {
    background-color: #1f2937 !important;
    border-color: #374151 !important;
}

[data-theme="dark"] .product-card h3,
[data-theme="dark"] .product-item h3 {
    color: #f9fafb !important;
}

[data-theme="dark"] .product-card p,
[data-theme="dark"] .product-item p {
    color: #d1d5db !important;
}

/* Product card helper text just above CTA buttons (price details, GST, /piece, review info) */
[data-theme="dark"] .product-card .text-gray-500,
[data-theme="dark"] .product-card .text-xs,
[data-theme="dark"] .product-card .text-sm.text-gray-500,
[data-theme="dark"] .product-item .text-gray-500,
[data-theme="dark"] .product-item .text-xs,
[data-theme="dark"] .product-item .text-sm.text-gray-500 {
    color: #e5e7eb !important; /* light grey for better contrast above yellow buttons */
}

/* ========== PORTFOLIO ITEMS ========== */
[data-theme="dark"] .portfolio-item {
    background-color: #1f2937 !important;
}

[data-theme="dark"] .portfolio-item h3 {
    color: #f9fafb !important;
}

[data-theme="dark"] .portfolio-item p {
    color: #d1d5db !important;
}

/* ========== DROPDOWNS ========== */
[data-theme="dark"] .services-dropdown {
    background-color: #1f2937 !important;
    border-color: #374151 !important;
}

[data-theme="dark"] .services-dropdown a {
    color: #e5e7eb !important;
}

[data-theme="dark"] .services-dropdown a:hover {
    background-color: #374151 !important;
    color: #93c5fd !important;
}

/* ========== MOBILE MENU ========== */
[data-theme="dark"] #mobileMenu {
    background-color: #1f2937 !important;
}

[data-theme="dark"] #mobileMenu a {
    color: #e5e7eb !important;
}

[data-theme="dark"] #mobileMenu a:hover {
    background-color: #374151 !important;
    color: #93c5fd !important;
}

/* ========== FOOTER ========== */
[data-theme="dark"] footer {
    background-color: #111827 !important;
}

[data-theme="dark"] footer h1,
[data-theme="dark"] footer h2,
[data-theme="dark"] footer h3,
[data-theme="dark"] footer h4 {
    color: #f9fafb !important;
}

[data-theme="dark"] footer p,
[data-theme="dark"] footer a,
[data-theme="dark"] footer span {
    color: #d1d5db !important;
}

[data-theme="dark"] footer a:hover {
    color: #93c5fd !important;
}

/* ========== SPECIAL SECTIONS ========== */
[data-theme="dark"] .section-padding {
    background-color: transparent !important;
}

[data-theme="dark"] .container-custom {
    color: #e5e7eb !important;
}

/* ========== IMAGES & ICONS ========== */
[data-theme="dark"] img {
    opacity: 0.9;
}

[data-theme="dark"] .emoji {
    filter: brightness(1.1);
}

/* ========== SHADOWS ========== */
[data-theme="dark"] .shadow,
[data-theme="dark"] .shadow-lg,
[data-theme="dark"] .shadow-xl {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5) !important;
}

/* ========== CLIENTS GRID (Our Clients) ========== */
/* Remove tile background and shadows so logos float on the dark section */
[data-theme="dark"] #clientsGrid .bg-white,
[data-theme="dark"] #clientsGrid .rounded-lg {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

[data-theme="dark"] #clientsGrid .shadow-sm,
[data-theme="dark"] #clientsGrid .shadow,
[data-theme="dark"] #clientsGrid .shadow-lg,
[data-theme="dark"] #clientsGrid .hover\:shadow-md:hover,
[data-theme="dark"] #clientsGrid [class*="shadow"] {
    box-shadow: none !important;
}

/* Also clear any background/border on the tile wrappers themselves */
[data-theme="dark"] #clientsGrid > div {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
}

[data-theme="dark"] #clientsGrid > div::before,
[data-theme="dark"] #clientsGrid > div::after {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

/* ========== HOVER STATES ========== */
[data-theme="dark"] .hover\:bg-gray-50:hover {
    background-color: #374151 !important;
}

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

[data-theme="dark"] .hover\:text-primary:hover {
    color: #93c5fd !important;
}

/* ========== SPECIFIC PAGE FIXES ========== */

/* About Page */
[data-theme="dark"] .about-section h2,
[data-theme="dark"] .about-section h3 {
    color: #f9fafb !important;
}

/* Contact Page */
[data-theme="dark"] .contact-info {
    background-color: #1f2937 !important;
}

/* Cart Page */
[data-theme="dark"] .cart-item {
    background-color: #1f2937 !important;
    border-color: #374151 !important;
}

/* Checkout Page */
[data-theme="dark"] .checkout-summary {
    background-color: #1f2937 !important;
}

/* Track Order Page */
[data-theme="dark"] .order-status {
    background-color: #1f2937 !important;
}

/* ========== ENSURE PRIMARY COLORS STAY ========== */
[data-theme="dark"] .bg-primary {
    background-color: #0d9488 !important;
}

[data-theme="dark"] .bg-secondary {
    background-color: #115e59 !important;
}

/* ========== LINKS ========== */
/* Do NOT touch any button-style links so they keep their own colors */
[data-theme="dark"] a:not(.btn):not(.btn-primary):not(.btn-outline):not(.btn-secondary):not(.btn-primary-header):not(.nav-link):not(.cta-btn-primary):not(.cta-btn-secondary) {
    color: #93c5fd !important;
}

[data-theme="dark"] a:not(.btn):not(.btn-primary):not(.btn-outline):not(.btn-secondary):not(.btn-primary-header):not(.nav-link):not(.cta-btn-primary):not(.cta-btn-secondary):hover {
    color: #bfdbfe !important;
}

/* ========== ENSURE VISIBILITY ========== */
[data-theme="dark"] * {
    border-color: inherit;
}

/* Fix any remaining black text */
[data-theme="dark"] [style*="color: #000"],
[data-theme="dark"] [style*="color: black"],
[data-theme="dark"] [style*="color: rgb(0, 0, 0)"] {
    color: #f9fafb !important;
}

/* Fix any remaining white backgrounds */
[data-theme="dark"] [style*="background: #fff"],
[data-theme="dark"] [style*="background: white"],
[data-theme="dark"] [style*="background-color: #fff"],
[data-theme="dark"] [style*="background-color: white"] {
    background-color: #1f2937 !important;
}