/* ===== DARK THEME CSS ===== */

/* Root Variables for Dark Theme */
:root {
    --dark-bg-primary: #1a1a1a;
    --dark-bg-secondary: #2d2d2d;
    --dark-bg-tertiary: #3a3a3a;
    --dark-text-primary: #ffffff;
    --dark-text-secondary: #cccccc;
    --dark-text-muted: #999999;
    --dark-border: #444444;
    --dark-accent: #007bff;
    --dark-accent-hover: #0056b3;
    --dark-success: #28a745;
    --dark-warning: #ffc107;
    --dark-danger: #dc3545;
    --dark-card-bg: #2d2d2d;
    --dark-input-bg: #3a3a3a;
    --dark-shadow: rgba(0, 0, 0, 0.5);
}

/* Global Dark Theme Styles */
body.dark-theme {
    background-color: var(--dark-bg-primary) !important;
    color: var(--dark-text-primary) !important;
}

/* Header & Navigation */
.dark-theme .bg-white,
.dark-theme .top-nav,
.dark-theme .search-nav,
.dark-theme .bg-nav {
    background-color: var(--dark-bg-secondary) !important;
    border-bottom: 1px solid var(--dark-border) !important;
}

.dark-theme .navbar {
    background-color: var(--dark-bg-secondary) !important;
}

.dark-theme .nav-link,
.dark-theme .navbar-nav .nav-link,
.dark-theme .font-color {
    color: var(--dark-text-primary) !important;
}

.dark-theme .nav-link:hover,
.dark-theme .navbar-nav .nav-link:hover {
    color: var(--dark-accent) !important;
}

.dark-theme .active-nav {
    color: var(--dark-accent) !important;
    border-bottom: 2px solid var(--dark-accent) !important;
}

/* Dropdown Menus */
.dark-theme .dropdown-menu {
    background-color: var(--dark-bg-tertiary) !important;
    border: 1px solid var(--dark-border) !important;
}

.dark-theme .dropdown-item {
    color: var(--dark-text-primary) !important;
}

.dark-theme .dropdown-item:hover {
    background-color: var(--dark-bg-secondary) !important;
    color: var(--dark-accent) !important;
}

/* Cards & Containers */
.dark-theme .card,
.dark-theme .bg-white {
    background-color: var(--dark-card-bg) !important;
    border: 1px solid var(--dark-border) !important;
    color: var(--dark-text-primary) !important;
}

.dark-theme .card-body {
    background-color: var(--dark-card-bg) !important;
    color: var(--dark-text-primary) !important;
}

/* Forms & Inputs */
.dark-theme .form-control,
.dark-theme .form-select,
.dark-theme input,
.dark-theme textarea,
.dark-theme select {
    background-color: var(--dark-input-bg) !important;
    border: 1px solid var(--dark-border) !important;
    color: var(--dark-text-primary) !important;
}

.dark-theme .form-control:focus,
.dark-theme .form-select:focus,
.dark-theme input:focus,
.dark-theme textarea:focus {
    background-color: var(--dark-input-bg) !important;
    border-color: var(--dark-accent) !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25) !important;
    color: var(--dark-text-primary) !important;
}

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

/* Buttons */
.dark-theme .btn-primary {
    background-color: var(--dark-accent) !important;
    border-color: var(--dark-accent) !important;
}

.dark-theme .btn-primary:hover {
    background-color: var(--dark-accent-hover) !important;
    border-color: var(--dark-accent-hover) !important;
}

.dark-theme .btn-secondary {
    background-color: var(--dark-bg-tertiary) !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text-primary) !important;
}

.dark-theme .btn-outline-primary {
    color: var(--dark-accent) !important;
    border-color: var(--dark-accent) !important;
}

.dark-theme .btn-outline-primary:hover {
    background-color: var(--dark-accent) !important;
    color: white !important;
}

/* Product Cards */
.dark-theme .product-card,
.dark-theme .product-item {
    background-color: var(--dark-card-bg) !important;
    border: 1px solid var(--dark-border) !important;
    color: var(--dark-text-primary) !important;
}

.dark-theme .product-card:hover {
    box-shadow: 0 4px 8px var(--dark-shadow) !important;
}

.dark-theme .product-title,
.dark-theme .product-name {
    color: var(--dark-text-primary) !important;
}

.dark-theme .product-price {
    color: var(--dark-accent) !important;
}

.dark-theme .product-description {
    color: var(--dark-text-secondary) !important;
}

/* Tables */
.dark-theme .table {
    color: var(--dark-text-primary) !important;
    background-color: var(--dark-bg-secondary) !important;
}

.dark-theme .table th,
.dark-theme .table td {
    border-color: var(--dark-border) !important;
}

.dark-theme .table-striped tbody tr:nth-of-type(odd) {
    background-color: var(--dark-bg-tertiary) !important;
}

.dark-theme .table-hover tbody tr:hover {
    background-color: var(--dark-bg-tertiary) !important;
}

/* Modals */
.dark-theme .modal-content {
    background-color: var(--dark-bg-secondary) !important;
    border: 1px solid var(--dark-border) !important;
}

.dark-theme .modal-header {
    border-bottom: 1px solid var(--dark-border) !important;
}

.dark-theme .modal-footer {
    border-top: 1px solid var(--dark-border) !important;
}

.dark-theme .modal-title {
    color: var(--dark-text-primary) !important;
}

/* Offcanvas */
.dark-theme .offcanvas {
    background-color: var(--dark-bg-secondary) !important;
    color: var(--dark-text-primary) !important;
}

.dark-theme .offcanvas-header {
    border-bottom: 1px solid var(--dark-border) !important;
}

/* Footer */
.dark-theme footer,
.dark-theme .footer {
    background-color: var(--dark-bg-secondary) !important;
    color: var(--dark-text-primary) !important;
    border-top: 1px solid var(--dark-border) !important;
}

.dark-theme footer a,
.dark-theme .footer a {
    color: var(--dark-text-secondary) !important;
}

.dark-theme footer a:hover,
.dark-theme .footer a:hover {
    color: var(--dark-accent) !important;
}

/* Text Colors */
.dark-theme .text-dark,
.dark-theme .text-body {
    color: var(--dark-text-primary) !important;
}

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

.dark-theme .text-primary {
    color: var(--dark-accent) !important;
}

/* Links */
.dark-theme a {
    color: var(--dark-accent) !important;
}

.dark-theme a:hover {
    color: var(--dark-accent-hover) !important;
}

/* Borders */
.dark-theme .border {
    border-color: var(--dark-border) !important;
}

/* Search Bar */
.dark-theme .searchcontainer,
.dark-theme .searchbar {
    background-color: var(--dark-input-bg) !important;
    border: 1px solid var(--dark-border) !important;
    color: var(--dark-text-primary) !important;
}

/* Icons - Careful approach */
.dark-theme .text-dark-emphasis {
    color: var(--dark-text-primary) !important;
}

.dark-theme .fa-navicon {
    color: var(--dark-text-primary) !important;
}

/* Theme Toggle Button */
.theme-toggle {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    background-color: var(--dark-accent);
    color: white;
    border: none;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
}

.theme-toggle:hover {
    background-color: var(--dark-accent-hover);
    transform: scale(1.1);
}

.theme-toggle i {
    font-size: 20px;
    color: white !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .dark-theme .offcanvas {
        background-color: var(--dark-bg-secondary) !important;
    }
    
    .dark-theme .navbar-toggler {
        border-color: var(--dark-border) !important;
    }
}

/* Logo Size Increase */
.brand-logo-link,
.brand-logo-link img,
.company-logo img,
.footer-logo img {
    height: 150px !important;
    width: auto !important;
    max-height: 150px !important;
}

.navbar .company-logo img {
    height: 150px !important;
    max-height: 150px !important;
}

.top-nav .company-logo img {
    height: 150px !important;
    max-height: 150px !important;
}

/* Animation for theme transition */
* {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease !important;
}