/**
 * Tusso — Dark / Light theme
 * True black dark mode with smooth transitions
 */

html {
    color-scheme: light;
    transition: background-color 0.35s ease, color 0.35s ease;
}

html[data-theme="dark"] {
    color-scheme: dark;
}

body,
.site-header,
.navbar-list-roma,
.product-card,
.sidebar,
.search-slide-container,
.form-section,
.cart-section,
.checkout-container .header,
.top-marquee-bar,
.marquee-item,
.alert-box,
input,
select,
textarea,
button,
a {
    transition: background-color 0.35s ease, color 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
}

/* ===== Dark theme variables ===== */
html[data-theme="dark"] {
    --primary-color: #ffffff;
    --secondary-color: #d4d4d4;
    --dark-accent: #141414;
    --light-background: #000000;
    --card-background: #0a0a0a;
    --card-bg: #0a0a0a;
    --secondary-bg: #111111;
    --white: #000000;
    --text-primary: #ffffff;
    --text-secondary: #cccccc;
    --text-gray: #bbbbbb;
    --border-color: #2a2a2a;
    --gold-primary: #ffffff;
    --shadow: 0 2px 8px rgba(255, 255, 255, 0.04);
    --shadow-accent: 0 4px 14px rgba(255, 255, 255, 0.06);

    --text-color: #f0f0f0;
    --secondary-color-checkout: #0a0a0a;
}

html[data-theme="dark"] body {
    background-color: #000000 !important;
    color: #ffffff !important;
}

/* ===== Header / Navbar ===== */
html[data-theme="dark"] .site-header {
    background-color: #000000 !important;
    border-bottom-color: #2a2a2a !important;
    box-shadow: 0 2px 8px rgba(255, 255, 255, 0.04) !important;
}

html[data-theme="dark"] .nav-icon,
html[data-theme="dark"] .nav-logo,
html[data-theme="dark"] .logo-main,
html[data-theme="dark"] .lang-switcher-btn {
    color: #ffffff !important;
}

html[data-theme="dark"] .lang-switcher-btn {
    border-color: #333 !important;
}

html[data-theme="dark"] .cart-badge {
    border-color: #000 !important;
}

html[data-theme="dark"] .search-slide-container.active {
    background: #0a0a0a !important;
    border-top-color: #2a2a2a !important;
}

html[data-theme="dark"] .search-slide-input {
    background: #111 !important;
    color: #fff !important;
    border-color: #333 !important;
}

html[data-theme="dark"] .search-slide-button {
    background: #fff !important;
    color: #000 !important;
}

/* ===== Sidebar ===== */
html[data-theme="dark"] .sidebar {
    background: #000 !important;
    color: #fff !important;
    border-color: #2a2a2a !important;
}

html[data-theme="dark"] .sidebar-section-title,
html[data-theme="dark"] .sidebar-title,
html[data-theme="dark"] .category-list li a,
html[data-theme="dark"] .close-btn {
    color: #fff !important;
}

html[data-theme="dark"] .category-list li a {
    border-bottom-color: #222 !important;
}

html[data-theme="dark"] .sidebar-overlay {
    background: rgba(0, 0, 0, 0.75) !important;
}

/* ===== Product cards / grids ===== */
html[data-theme="dark"] .product-card,
html[data-theme="dark"] .products-grid .card,
html[data-theme="dark"] .product-item {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
    color: #fff !important;
}

html[data-theme="dark"] .product-name,
html[data-theme="dark"] .product-price,
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4 {
    color: #fff !important;
}

html[data-theme="dark"] p,
html[data-theme="dark"] .product-category,
html[data-theme="dark"] .text-muted {
    color: #ccc !important;
}

/* ===== Product page — sizes & variants ===== */
html[data-theme="dark"] .product-detail-grid,
html[data-theme="dark"] .product-info-section,
html[data-theme="dark"] .image-gallery-container,
html[data-theme="dark"] .slideshow-container,
html[data-theme="dark"] .size-chart-section {
    background: transparent !important;
    color: #fff !important;
}

html[data-theme="dark"] .size-chart-section {
    border-color: #333 !important;
    background: #0a0a0a !important;
}

html[data-theme="dark"] .size-chart-title {
    color: #fff !important;
}

html[data-theme="dark"] .variant-selector {
    background: #0a0a0a !important;
    border-color: #333 !important;
    color: #fff !important;
}

html[data-theme="dark"] .variant-selector > label,
html[data-theme="dark"] .variant-selector label[data-ar],
html[data-theme="dark"] .product-stock,
html[data-theme="dark"] #selected-size-display,
html[data-theme="dark"] #selected-color-display {
    color: #fff !important;
}

html[data-theme="dark"] .size-options label {
    background-color: #111 !important;
    border-color: #444 !important;
    color: #fff !important;
}

html[data-theme="dark"] .size-options input[type="radio"]:checked + label {
    background-color: #fff !important;
    color: #000 !important;
    border-color: #fff !important;
}

html[data-theme="dark"] .color-options label {
    border-color: #666 !important;
}

html[data-theme="dark"] .color-options input[type="radio"]:checked + label {
    outline-color: #fff !important;
    border-color: #fff !important;
}

html[data-theme="dark"] .option-btn,
html[data-theme="dark"] .size-option,
html[data-theme="dark"] .color-option {
    background: #111 !important;
    border-color: #333 !important;
    color: #fff !important;
}

html[data-theme="dark"] .option-btn.active,
html[data-theme="dark"] .size-option.active {
    background: #fff !important;
    color: #000 !important;
}

html[data-theme="dark"] .product-description-box {
    background: #0a0a0a !important;
    border: 1px solid #2a2a2a;
}

html[data-theme="dark"] .product-description-box h3,
html[data-theme="dark"] .product-description-box p {
    color: #ddd !important;
}

/* ===== Cart page ===== */
html[data-theme="dark"] h2.cart-heading {
    color: #fff !important;
    border-bottom-color: #333 !important;
}

html[data-theme="dark"] .cart-items-table {
    background-color: #0a0a0a !important;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.04) !important;
}

html[data-theme="dark"] .cart-items-table th,
html[data-theme="dark"] .cart-items-table td {
    background-color: #0a0a0a !important;
    color: #fff !important;
    border-bottom-color: #2a2a2a !important;
}

html[data-theme="dark"] .cart-items-table th {
    background-color: #141414 !important;
    color: #fff !important;
}

html[data-theme="dark"] .cart-items-table tr {
    border-color: #2a2a2a !important;
    background: #0a0a0a !important;
}

html[data-theme="dark"] .cart-items-table td::before {
    color: #999 !important;
}

html[data-theme="dark"] .cart-item-name,
html[data-theme="dark"] .cart-item-name a,
html[data-theme="dark"] a.cart-item-name {
    color: #fff !important;
}

html[data-theme="dark"] .cart-item-variant {
    color: #aaa !important;
}

html[data-theme="dark"] .cart-item-image {
    border-color: #444 !important;
}

html[data-theme="dark"] .quantity-input {
    background: #111 !important;
    color: #fff !important;
    border-color: #444 !important;
}

html[data-theme="dark"] .btn-update-qty,
html[data-theme="dark"] .btn-remove {
    color: #fff !important;
    border-color: #fff !important;
    background: transparent !important;
}

html[data-theme="dark"] .btn-update-qty:hover,
html[data-theme="dark"] .btn-remove:hover {
    background: #fff !important;
    color: #000 !important;
}

html[data-theme="dark"] .cart-summary {
    background-color: #0a0a0a !important;
    color: #fff !important;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.04) !important;
}

html[data-theme="dark"] .cart-summary h3 {
    color: #fff !important;
    border-bottom-color: #333 !important;
}

html[data-theme="dark"] .summary-row,
html[data-theme="dark"] .summary-row.total {
    color: #fff !important;
}

html[data-theme="dark"] .summary-row.total {
    border-top-color: #333 !important;
}

html[data-theme="dark"] .cart-page-container,
html[data-theme="dark"] .cart-items-list {
    color: #fff !important;
}

html[data-theme="dark"] .checkout-button,
html[data-theme="dark"] .cart-summary .btn-primary {
    background-color: #fff !important;
    color: #000 !important;
    border-color: #fff !important;
}

html[data-theme="dark"] .checkout-button:hover,
html[data-theme="dark"] .cart-summary .btn-primary:hover {
    background-color: #ddd !important;
    color: #000 !important;
}

html[data-theme="dark"] .cart-table,
html[data-theme="dark"] .cart-table tr,
html[data-theme="dark"] .cart-table td {
    background: #0a0a0a !important;
    color: #fff !important;
    border-color: #2a2a2a !important;
}

html[data-theme="dark"] .empty-cart {
    background: #0a0a0a !important;
    color: #fff !important;
}

/* ===== Checkout ===== */
html[data-theme="dark"] .header.checkout-header-bar,
html[data-theme="dark"] .checkout-page .header {
    background-color: #000 !important;
    box-shadow: 0 2px 10px rgba(255, 255, 255, 0.05) !important;
}

html[data-theme="dark"] .form-section,
html[data-theme="dark"] .cart-section {
    background: #0a0a0a !important;
    color: #fff !important;
    box-shadow: 0 5px 15px rgba(255, 255, 255, 0.04) !important;
}

html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="tel"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="number"],
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
    background: #111 !important;
    color: #fff !important;
    border-color: #333 !important;
}

html[data-theme="dark"] .payment-method {
    background: #0a0a0a !important;
    border-color: #333 !important;
    color: #fff !important;
}

html[data-theme="dark"] .payment-method.selected {
    background: #141414 !important;
}

html[data-theme="dark"] .payment-desc {
    color: #aaa !important;
}

html[data-theme="dark"] .alert-box.alert-success {
    background-color: #112a11 !important;
    color: #8aff8a !important;
    border-color: #205c20 !important;
}

html[data-theme="dark"] .alert-box.alert-warning {
    background-color: #2a2411 !important;
    color: #ffd966 !important;
    border-color: #5c4e20 !important;
}

html[data-theme="dark"] .alert-box.alert-danger {
    background-color: #2a1111 !important;
    color: #ff8a8a !important;
    border-color: #5c2020 !important;
}

html[data-theme="dark"] .discount-example {
    background: #141414 !important;
    color: #ddd !important;
}

/* ===== Checkout — order summary & discount (dark) ===== */
html[data-theme="dark"] .checkout-page-content {
    --checkout-heading-color: #ffffff;
    --checkout-muted: #aaaaaa;
    --text-color: #e8e8e8;
    --checkout-discount-bg: linear-gradient(135deg, #141414 0%, #0a0a0a 100%);
    --checkout-example-bg: #141414;
    --checkout-input-valid-bg: #0d1f0d;
    --checkout-input-invalid-bg: #1f0d0d;
    --checkout-msg-success-bg: #112a11;
    --checkout-msg-success-border: #205c20;
    --checkout-msg-success-text: #8aff8a;
    --checkout-msg-error-bg: #2a1111;
    --checkout-msg-error-border: #5c2020;
    --checkout-msg-error-text: #ff8a8a;
    --checkout-shipping-bg: linear-gradient(135deg, #1a1608 0%, #141008 100%);
    --checkout-shipping-border: #3d3520;
    --checkout-shipping-text: #d4c9a8;
    --checkout-shipping-strong: #e8c96a;
    --checkout-shipping-row: #d4b86a;
    --checkout-secure-bg: #141414;
    --checkout-secure-text: #aaaaaa;
    --checkout-payment-selected-bg: #141414;
    --discount-color: #6fcf97;
    --tooltip-bg: #2a2a2a;
    --tooltip-text: #ffffff;
}

html[data-theme="dark"] .checkout-page-content h1,
html[data-theme="dark"] .checkout-page-content h2,
html[data-theme="dark"] .checkout-page-content h3,
html[data-theme="dark"] .checkout-page-content h4,
html[data-theme="dark"] .cart-section .discount-label h3 {
    color: #ffffff !important;
}

html[data-theme="dark"] .checkout-page-content h1 {
    border-bottom-color: #333 !important;
}

html[data-theme="dark"] .discount-section {
    border-color: #444 !important;
}

html[data-theme="dark"] .discount-input {
    background: #111 !important;
    color: #fff !important;
    border-color: #444 !important;
}

html[data-theme="dark"] .cart-item {
    border-bottom-color: #2a2a2a !important;
}

html[data-theme="dark"] .cart-item-price {
    color: #ffffff !important;
}

html[data-theme="dark"] .cart-item-details,
html[data-theme="dark"] .cart-item-details p {
    color: #aaaaaa !important;
}

html[data-theme="dark"] .price-breakdown {
    border-top-color: #333 !important;
}

html[data-theme="dark"] .price-row.total {
    border-top-color: #333 !important;
}

html[data-theme="dark"] .savings {
    color: #6fcf97 !important;
}

html[data-theme="dark"] .back-link {
    color: #ffffff !important;
}

html[data-theme="dark"] .checkout-page-content label {
    color: #ffffff !important;
}

html[data-theme="dark"] .discount-example-code {
    background-color: #ffffff !important;
    color: #000000 !important;
}

html[data-theme="dark"] .tooltip .tooltiptext {
    background-color: var(--tooltip-bg) !important;
    color: var(--tooltip-text) !important;
}

html[data-theme="dark"] .discount-example > span:not(.tooltip) {
    color: var(--text-color) !important;
}

html[data-theme="dark"] .checkout-page-content .alert-error {
    background-color: #2a1111 !important;
    border-color: #5c2020 !important;
    color: #ff8a8a !important;
}

html[data-theme="dark"] .checkout-page-content .alert-success {
    background-color: #112a11 !important;
    border-color: #205c20 !important;
    color: #8aff8a !important;
}

html[data-theme="dark"] .btn-primary {
    background-color: #fff !important;
    color: #000 !important;
}

html[data-theme="dark"] .btn-primary:hover {
    background-color: #ddd !important;
}

/* ===== Index marquee / sections ===== */
html[data-theme="dark"] .top-marquee-bar {
    background-color: #000 !important;
    border-bottom: 1px solid #222;
}

html[data-theme="dark"] .category-section,
html[data-theme="dark"] .latest-section {
    background: #000 !important;
}

html[data-theme="dark"] .section-header {
    color: #fff !important;
}

/* ===== Forms / inputs (global) ===== */
html[data-theme="dark"] .search-input {
    background: #111 !important;
    color: #fff !important;
    border-color: #333 !important;
}

html[data-theme="dark"] .alert-error {
    background: #2a1111 !important;
    color: #ff8a8a !important;
    border-color: #5c2020 !important;
}

html[data-theme="dark"] .alert-success {
    background: #112a11 !important;
    color: #8aff8a !important;
    border-color: #205c20 !important;
}

/* ===== Theme toggle button ===== */
.theme-toggle-btn {
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 8px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: inherit;
}

button.theme-toggle-btn.nav-icon {
    font-size: 24px;
    color: #000;
}

html[data-theme="dark"] button.theme-toggle-btn.nav-icon {
    color: #fff;
}

.theme-toggle-btn:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
    border-radius: 4px;
}

.theme-toggle-checkout {
    background: transparent;
    border: 1px solid var(--border-color, #ddd);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: inherit;
}

html[data-theme="dark"] .theme-toggle-checkout {
    border-color: #444;
    color: #fff;
}

.checkout-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}