/**
 * WooCommerce Dark Theme
 * Donkere kleurstelling voor WooCommerce pagina's
 *
 * @package Kolk
 */

/* ==========================================================================
   Root Variables Override - Dark Theme
   ========================================================================== */

:root {
    /* Kolk Dark Theme Variables */
    --kolk-background: #1d2127;
    --kolk-card: #252a31;
    --kolk-muted: #2d333b;
    --kolk-foreground: #f5f5f5;
    --kolk-card-foreground: #f5f5f5;
    --kolk-muted-foreground: #a4a4a6;
    --kolk-primary: #c7b299;
    --kolk-primary-foreground: #1d2127;
    --kolk-destructive: #ef4444;
    --kolk-success: #22c55e;
    --kolk-border: rgba(255, 255, 255, 0.1);
    --kolk-input: rgba(255, 255, 255, 0.1);
    --kolk-ring: #a4a4a6;
    --kolk-radius: 0.5rem;
    --kolk-radius-lg: 1rem;

    /* WooCommerce Dark Variables */
    --wc-primary: #c7b299;
    --wc-primary-hover: #d4c4ad;
    --wc-primary-light: rgba(199, 178, 153, 0.15);
    --wc-background: #1d2127;
    --wc-card: #252a31;
    --wc-card-hover: #2d333b;
    --wc-muted: #2d333b;
    --wc-foreground: #f5f5f5;
    --wc-foreground-muted: rgba(245, 245, 245, 0.6);
    --wc-foreground-dim: rgba(245, 245, 245, 0.4);
    --wc-border: rgba(255, 255, 255, 0.1);
    --wc-border-hover: rgba(255, 255, 255, 0.2);
    --wc-success: #22c55e;
    --wc-error: #ef4444;
    --wc-warning: #f59e0b;
    --wc-warning-light: rgba(245, 158, 11, 0.15);
    --wc-radius: 0.75rem;
    --wc-radius-sm: 0.5rem;
    --wc-radius-lg: 1rem;
    --wc-shadow: 0 4px 24px -8px rgba(0, 0, 0, 0.4);
    --wc-shadow-lg: 0 12px 40px -12px rgba(0, 0, 0, 0.5);
    --wc-transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ==========================================================================
   Body & Page Background
   ========================================================================== */

body.woocommerce-page,
body.woocommerce-active {
    background-color: #1d2127;
    color: #f5f5f5;
}

.woocommerce-page .site-content,
.woocommerce-active .site-content {
    background-color: #1d2127;
}

/* ==========================================================================
   Header Override for WooCommerce (Dark keeps default dark header)
   ========================================================================== */

.woocommerce-page .header--woocommerce,
.woocommerce-active .header--woocommerce {
    background-color: #1d2127;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.woocommerce-page .header--woocommerce .nav-logo--dark,
.woocommerce-active .header--woocommerce .nav-logo--dark {
    display: none !important;
}

.woocommerce-page .header--woocommerce .nav-logo--light,
.woocommerce-active .header--woocommerce .nav-logo--light {
    display: block !important;
}

/* Navigation text color */
.woocommerce-page .header--woocommerce a,
.woocommerce-active .header--woocommerce a {
    color: #f5f5f5;
}

.woocommerce-page .header--woocommerce a:hover,
.woocommerce-active .header--woocommerce a:hover {
    color: var(--wc-primary);
}

/* ==========================================================================
   Mobile Menu Override
   ========================================================================== */

.woocommerce-page .mobile-drawer,
.woocommerce-active .mobile-drawer {
    background-color: #1d2127;
    color: #f5f5f5;
}

.woocommerce-page .mobile-drawer__close,
.woocommerce-active .mobile-drawer__close {
    color: #f5f5f5;
}

.woocommerce-page .mobile-drawer__link,
.woocommerce-active .mobile-drawer__link {
    color: #f5f5f5;
}

.woocommerce-page .mobile-drawer__link:hover,
.woocommerce-active .mobile-drawer__link:hover {
    color: var(--wc-primary);
}

.woocommerce-page .mobile-drawer__footer,
.woocommerce-active .mobile-drawer__footer {
    color: #a4a4a6;
    border-color: rgba(255, 255, 255, 0.1);
}

/* ==========================================================================
   Footer Override for WooCommerce
   ========================================================================== */

.woocommerce-page .kolk-footer,
.woocommerce-active .kolk-footer,
.woocommerce-page #colophon,
.woocommerce-active #colophon {
    background-color: #1a1d22 !important;
    color: #f5f5f5;
    border-top-color: rgba(255, 255, 255, 0.1);
}

.woocommerce-page #colophon h3,
.woocommerce-active #colophon h3 {
    color: #f5f5f5;
}

.woocommerce-page #colophon a,
.woocommerce-active #colophon a {
    color: #a4a4a6;
}

.woocommerce-page #colophon a:hover,
.woocommerce-active #colophon a:hover {
    color: var(--wc-primary);
}

/* Footer bottom bar */
.woocommerce-page .kolk-footer-bottom,
.woocommerce-active .kolk-footer-bottom,
.woocommerce-page #colophon > div:last-child,
.woocommerce-active #colophon > div:last-child {
    background-color: #15181c !important;
}

/* ==========================================================================
   WooCommerce Card Styles Override
   ========================================================================== */

.kolk-cart-items-card,
.kolk-cart-totals,
.kolk-checkout-section,
.kolk-order-review-card,
.kolk-shipping-progress-card,
.kolk-trust-badges,
.kolk-checkout-trust {
    background-color: var(--wc-card);
    border-color: var(--wc-border);
}

/* ==========================================================================
   Form Elements Override
   ========================================================================== */

.woocommerce-page input[type="text"],
.woocommerce-page input[type="email"],
.woocommerce-page input[type="tel"],
.woocommerce-page input[type="password"],
.woocommerce-page input[type="number"],
.woocommerce-page textarea,
.woocommerce-page select {
    background-color: #2d333b;
    border-color: var(--wc-border);
    color: #f5f5f5;
}

.woocommerce-page input::placeholder,
.woocommerce-page textarea::placeholder {
    color: #666;
}

.woocommerce-page input:focus,
.woocommerce-page textarea:focus,
.woocommerce-page select:focus {
    border-color: var(--wc-primary);
    box-shadow: 0 0 0 3px var(--wc-primary-light);
}

/* ==========================================================================
   Select2 Override
   ========================================================================== */

.woocommerce-page .select2-container--default .select2-selection--single {
    background-color: #2d333b;
    border-color: var(--wc-border);
}

.woocommerce-page .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #f5f5f5;
}

.woocommerce-page .select2-dropdown {
    background-color: #2d333b;
    border-color: var(--wc-border);
}

.woocommerce-page .select2-container--default .select2-results__option {
    color: #f5f5f5;
}

.woocommerce-page .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--wc-primary);
    color: #1d2127;
}

/* ==========================================================================
   Notices Override
   ========================================================================== */

.woocommerce-page .woocommerce-message,
.woocommerce-page .woocommerce-info,
.woocommerce-page .woocommerce-error,
.woocommerce-page .woocommerce-notice {
    background-color: var(--wc-card);
    color: #f5f5f5;
}

.woocommerce-page .woocommerce-message a.button,
.woocommerce-page .woocommerce-info a.button,
.woocommerce-page .woocommerce-error a.button {
    background: var(--wc-primary);
    color: #1d2127 !important;
}

/* ==========================================================================
   Table Override
   ========================================================================== */

.woocommerce-page table.shop_table {
    background-color: var(--wc-card);
}

.woocommerce-page table.shop_table th,
.woocommerce-page table.shop_table td {
    color: #f5f5f5;
    border-color: var(--wc-border);
}

.woocommerce-page table.shop_table thead th {
    background-color: #2d333b;
    color: #a4a4a6;
}

/* ==========================================================================
   Checkout Review Order Override
   ========================================================================== */

.woocommerce-page .woocommerce-checkout-review-order,
.woocommerce-page .woocommerce-checkout-review-order-table,
.woocommerce-page #order_review {
    color: #f5f5f5;
}

.woocommerce-page .woocommerce-checkout-review-order th,
.woocommerce-page .woocommerce-checkout-review-order td {
    color: #f5f5f5;
}

.woocommerce-page #payment {
    background-color: transparent;
    color: #f5f5f5;
}

.woocommerce-page #payment .payment_methods li {
    background-color: #2d333b;
    border-color: var(--wc-border);
}

.woocommerce-page #payment .payment_methods li.wc_payment_method > label {
    color: #f5f5f5;
}

.woocommerce-page #payment .payment_box {
    color: #a4a4a6;
}

/* ==========================================================================
   Cart Page Specific Override
   ========================================================================== */

.woocommerce-page .kolk-cart-title,
.woocommerce-page .kolk-checkout-title {
    color: #f5f5f5;
}

.woocommerce-page .kolk-cart-subtitle {
    color: #a4a4a6;
}

.woocommerce-page .kolk-cart-item-title a {
    color: #f5f5f5;
}

.woocommerce-page .kolk-cart-item-price,
.woocommerce-page .kolk-cart-item-subtotal {
    color: #f5f5f5;
}

.woocommerce-page .kolk-totals-title {
    color: #f5f5f5;
}

.woocommerce-page .kolk-totals-label {
    color: #a4a4a6;
}

.woocommerce-page .kolk-totals-value {
    color: #f5f5f5;
}

/* ==========================================================================
   Checkout Section Headers
   ========================================================================== */

.woocommerce-page .kolk-section-header {
    background-color: #2d333b;
}

.woocommerce-page .kolk-section-title {
    color: #f5f5f5;
}

.woocommerce-page .kolk-section-subtitle {
    color: #a4a4a6;
}

/* ==========================================================================
   Progress Steps
   ========================================================================== */

.woocommerce-page .kolk-progress-number {
    background-color: #2d333b;
    border-color: var(--wc-border);
    color: #a4a4a6;
}

.woocommerce-page .kolk-progress-label {
    color: #a4a4a6;
}

.woocommerce-page .kolk-progress-step.is-active .kolk-progress-label {
    color: #f5f5f5;
}

.woocommerce-page .kolk-progress-connector {
    background-color: var(--wc-border);
}

/* ==========================================================================
   Empty Cart
   ========================================================================== */

.woocommerce-page .kolk-empty-cart-title {
    color: #f5f5f5;
}

.woocommerce-page .kolk-empty-cart-text {
    color: #a4a4a6;
}

.woocommerce-page .kolk-empty-cart-icon {
    background-color: var(--wc-card);
    border-color: var(--wc-border);
    color: #666;
}

/* ==========================================================================
   Trust Badges
   ========================================================================== */

.woocommerce-page .kolk-trust-badge,
.woocommerce-page .kolk-trust-item {
    color: #a4a4a6;
}

.woocommerce-page .kolk-empty-cart-feature {
    color: #a4a4a6;
}

/* ==========================================================================
   Quantity Input
   ========================================================================== */

.woocommerce-page .kolk-cart-item-quantity .quantity {
    background-color: #2d333b;
    border-color: var(--wc-border);
}

.woocommerce-page .kolk-cart-item-quantity .qty {
    color: #f5f5f5;
}

/* ==========================================================================
   Coupon Form
   ========================================================================== */

.woocommerce-page .kolk-coupon-input {
    background-color: #2d333b;
    border-color: var(--wc-border);
    color: #f5f5f5;
}

.woocommerce-page .kolk-coupon-btn {
    background-color: #2d333b;
    border-color: var(--wc-border);
    color: #f5f5f5;
}

.woocommerce-page .kolk-coupon-btn:hover {
    background-color: var(--wc-primary);
    color: #1d2127;
}

/* ==========================================================================
   Cart Buttons
   ========================================================================== */

.woocommerce-page .kolk-continue-shopping,
.woocommerce-page .kolk-update-cart {
    border-color: var(--wc-border);
    color: #a4a4a6;
}

.woocommerce-page .kolk-continue-shopping:hover,
.woocommerce-page .kolk-update-cart:hover {
    background-color: #2d333b;
    color: #f5f5f5;
}

/* ==========================================================================
   Cart Table Header
   ========================================================================== */

.woocommerce-page .kolk-cart-table-header {
    background-color: #2d333b;
    color: #a4a4a6;
}

/* ==========================================================================
   Cart Actions Bar
   ========================================================================== */

.woocommerce-page .kolk-cart-actions {
    background-color: #2d333b;
}

/* ==========================================================================
   Shipping Progress Card
   ========================================================================== */

.woocommerce-page .kolk-shipping-text {
    color: #f5f5f5;
}

.woocommerce-page .kolk-shipping-bar {
    background-color: rgba(255, 255, 255, 0.1);
}

/* ==========================================================================
   Order Review Header
   ========================================================================== */

.woocommerce-page .kolk-order-review-title {
    color: #f5f5f5;
}

/* ==========================================================================
   Kolk Review Order - Dark Theme
   ========================================================================== */

.woocommerce-page .kolk-review-header-product,
.woocommerce-page .kolk-review-header-total {
    color: #f5f5f5;
}

.woocommerce-page .kolk-review-item-qty {
    background: #2d333b;
    border-color: var(--wc-border);
    color: #f5f5f5;
}

.woocommerce-page .kolk-review-item-name {
    color: #f5f5f5;
}

.woocommerce-page .kolk-review-item-price {
    color: #a4a4a6;
}

.woocommerce-page .kolk-review-item-price ins {
    color: var(--wc-success);
}

.woocommerce-page .kolk-review-item-meta {
    color: #a4a4a6;
}

.woocommerce-page .kolk-review-item-total {
    color: #f5f5f5;
}

.woocommerce-page .kolk-review-totals-row .kolk-totals-label,
.woocommerce-page .kolk-review-totals-row .kolk-totals-value {
    color: #f5f5f5;
}

.woocommerce-page .kolk-review-totals-row .kolk-discount {
    color: var(--wc-success);
}

/* ==========================================================================
   Kolk Payment Section - Dark Theme
   ========================================================================== */

.kolk-payment-section {
    background: #2a2f38;
}

.kolk-payment-method {
    border-bottom: 1px solid var(--wc-border);
    background: #2a2f38;
}

.kolk-payment-radio {
    border: 2px solid #a4a4a6;
}

.kolk-payment-radio:checked {
    border-color: var(--wc-primary);
    background: var(--wc-primary);
}

.kolk-payment-radio:checked::after {
    background: #1d2127;
}

.kolk-payment-title {
    color: #f5f5f5;
}

.kolk-payment-box {
    color: #a4a4a6;
}

.kolk-payment-notice {
    background: rgba(199, 178, 153, 0.15);
    color: #f5f5f5;
}

/* Place Order Section - Dark */
.kolk-place-order {
    background: #2a2f38;
    border-top: 1px solid var(--wc-border);
}

.kolk-place-order .woocommerce-privacy-policy-text p {
    color: #a4a4a6;
}

.kolk-place-order .woocommerce-privacy-policy-text a {
    color: var(--wc-primary);
}

.kolk-place-order .validate-required label,
.kolk-place-order .woocommerce-form__label-for-checkbox {
    color: #f5f5f5;
}

.kolk-place-order .validate-required input[type="checkbox"],
.kolk-place-order .woocommerce-form__label-for-checkbox input[type="checkbox"] {
    border: 2px solid #a4a4a6;
    background: #1d2127;
}

.kolk-place-order .validate-required input[type="checkbox"]:checked,
.kolk-place-order .woocommerce-form__label-for-checkbox input[type="checkbox"]:checked {
    background: var(--wc-primary);
    border-color: var(--wc-primary);
}

.kolk-place-order .validate-required input[type="checkbox"]:checked::after,
.kolk-place-order .woocommerce-form__label-for-checkbox input[type="checkbox"]:checked::after {
    border: 2px solid #1d2127;
}

.kolk-place-order .woocommerce-terms-and-conditions-checkbox-text a,
.kolk-place-order .woocommerce-terms-and-conditions-link {
    color: var(--wc-primary);
}

.kolk-place-order-btn {
    color: #1d2127;
}

/* ==========================================================================
   Order Tip Plugin - Dark Theme
   ========================================================================== */

.woocommerce-page #wooot_order_tip_form .order_tip_title {
    color: #f5f5f5;
}

.woocommerce-page #wooot_order_tip_form .woo_order_tip {
    background: #2d333b;
    border-color: var(--wc-border);
    color: #f5f5f5;
}

.woocommerce-page #wooot_order_tip_form .woo_order_tip:hover {
    border-color: var(--wc-primary);
    color: var(--wc-primary);
}

.woocommerce-page #wooot_order_tip_form .woo_order_tip.active {
    background: var(--wc-primary);
    border-color: var(--wc-primary);
    color: #1d2127;
}

.woocommerce-page #wooot_order_tip_form .woo_order_tip_remove {
    color: #a4a4a6;
}


/* ==========================================================================
   Open Pricing / Kadobon - Dark Theme
   ========================================================================== */

.woocommerce-page .cadobon-input > label {
    color: #f5f5f5;
}

.woocommerce-page .openprice-euro-sign {
    background: #2d333b;
    border-color: var(--wc-border);
    color: #a4a4a6;
}

.woocommerce-page .openprice-formfield input.alg_open_price {
    background: #2d333b;
    border-color: var(--wc-border);
    color: #f5f5f5;
}

.woocommerce-page .openprice-formfield input.alg_open_price::placeholder {
    color: #666666;
}

.woocommerce-page .cadobon-input ~ .single_add_to_cart_button {
    background: var(--wc-primary);
    color: #1d2127;
}

.woocommerce-page .cadobon-input ~ .single_add_to_cart_button:hover {
    background: var(--wc-primary-hover);
}

/* ==========================================================================
   Secure Badge
   ========================================================================== */

.woocommerce-page .kolk-secure-badge {
    background-color: rgba(34, 197, 94, 0.15);
}

/* ==========================================================================
   Payment Icons
   ========================================================================== */

.woocommerce-page .kolk-payment-label {
    color: #a4a4a6;
}

/* ==========================================================================
   Mini Cart Override
   ========================================================================== */

.woocommerce-page .kolk-mini-cart-wrapper .kolk-cart-toggle {
    color: #f5f5f5;
}

/* ==========================================================================
   Sort Select Override
   ========================================================================== */

.woocommerce-page .kolk-sort-select {
    background-color: #2d333b;
    border-color: var(--wc-border);
    color: #f5f5f5;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M2 4L6 8L10 4' stroke='%23f5f5f5' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ==========================================================================
   Product Cards Override (Shop page)
   ========================================================================== */

.woocommerce-page .kolk-card-inner {
    background-color: var(--wc-card);
    border-color: var(--wc-border);
}

.woocommerce-page .kolk-product-title a {
    color: #f5f5f5;
}

.woocommerce-page .kolk-product-price {
    color: #f5f5f5;
}

/* ==========================================================================
   Sidebar Override
   ========================================================================== */

.woocommerce-page .kolk-sidebar-inner {
    background-color: var(--wc-card);
    border-color: var(--wc-border);
}

.woocommerce-page .kolk-filter-header {
    color: #f5f5f5;
}

.woocommerce-page .kolk-category-link {
    color: #a4a4a6;
}

.woocommerce-page .kolk-category-link:hover {
    color: #f5f5f5;
}

/* ==========================================================================
   Hamburger Menu Button Override
   ========================================================================== */

.woocommerce-page .header--woocommerce #primary-menu-toggle,
.woocommerce-active .header--woocommerce #primary-menu-toggle {
    color: #f5f5f5;
}

.woocommerce-page .header--woocommerce #primary-menu-toggle:hover,
.woocommerce-active .header--woocommerce #primary-menu-toggle:hover {
    color: var(--wc-primary);
    background-color: rgba(199, 178, 153, 0.1);
}

/* ==========================================================================
   Mobile Logo Override
   ========================================================================== */

.woocommerce-page .header--woocommerce .mobile-logo--dark,
.woocommerce-active .header--woocommerce .mobile-logo--dark {
    display: none !important;
}

.woocommerce-page .header--woocommerce .mobile-logo--light,
.woocommerce-active .header--woocommerce .mobile-logo--light {
    display: block !important;
}

/* ==========================================================================
   GLOZIN-STYLE CART PAGE REDESIGN - Dark Theme
   ========================================================================== */

/* Cart Table */
.kolk-cart-table {
    background: var(--wc-card);
    border-color: var(--wc-border);
}

.kolk-cart-table-header {
    background: #2d333b;
    border-color: var(--wc-border);
    color: #a4a4a6;
}

.kolk-cart-item {
    border-color: var(--wc-border);
}

.kolk-cart-item-image {
    background: #2d333b;
}

.kolk-cart-item-title {
    color: #f5f5f5;
}

.kolk-cart-item-meta {
    color: #a4a4a6;
}

.kolk-cart-item-remove {
    color: #a4a4a6;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--wc-border);
}

.kolk-cart-item-remove:hover {
    color: var(--wc-error);
    background: rgba(239, 68, 68, 0.12);
    border-color: rgba(239, 68, 68, 0.25);
}

.kolk-cart-item-price {
    color: #f5f5f5;
}

.kolk-price-regular {
    color: #666;
}

.kolk-cart-item-subtotal {
    color: #f5f5f5;
}

/* Quantity Selector */
.kolk-quantity-selector {
    border-color: var(--wc-border);
    background: #2d333b;
}

.kolk-qty-btn {
    color: #a4a4a6;
}

.kolk-qty-btn:hover {
    background: #363d47;
    color: #f5f5f5;
}

.kolk-qty-btn:active {
    background: #3d454f;
}

.kolk-qty-input {
    border-color: var(--wc-border);
    color: #f5f5f5;
    background: #2d333b;
}

/* Coupon Section */
.kolk-coupon-section {
    background: var(--wc-card);
    border-color: var(--wc-border);
}

.kolk-coupon-input {
    background: #2d333b;
    border-color: var(--wc-border);
    color: #f5f5f5;
}

.kolk-coupon-input::placeholder {
    color: #666;
}

.kolk-coupon-btn {
    background: var(--wc-primary);
    color: #1d2127;
}

.kolk-coupon-btn:hover {
    background: var(--wc-primary-hover);
}

/* Cross-Sells */
.kolk-cross-sells-title {
    color: #f5f5f5;
}

.kolk-cross-sell-item {
    background: var(--wc-card);
    border-color: var(--wc-border);
}

.kolk-cross-sell-item:hover {
    border-color: var(--wc-primary);
}

.kolk-cross-sell-image {
    background: #2d333b;
}

.kolk-cross-sell-name {
    color: #f5f5f5;
}

.kolk-cross-sell-name:hover {
    color: var(--wc-primary);
}

.kolk-cross-sell-price {
    color: #f5f5f5;
}

.kolk-cross-sell-price del {
    color: #666;
}

/* Cart Totals */
.kolk-cart-totals {
    background: var(--wc-card);
    border-color: var(--wc-border);
}

.kolk-order-note-section {
    border-color: var(--wc-border);
}

.kolk-order-note-title {
    color: #f5f5f5;
}

.kolk-order-note-input {
    border-color: var(--wc-border);
    color: #f5f5f5;
    background: #2d333b;
}

.kolk-order-note-input::placeholder {
    color: #666;
}

.kolk-totals-title {
    color: #f5f5f5;
    border-color: var(--wc-border);
}

.kolk-totals-label {
    color: #a4a4a6;
}

.kolk-totals-value {
    color: #f5f5f5;
}

.kolk-totals-total {
    border-color: var(--wc-border);
}

.kolk-totals-total .kolk-totals-label,
.kolk-totals-total .kolk-totals-value,
.kolk-total-amount {
    color: #f5f5f5;
}

/* Cart Shipping - Light text for dark mode */
.kolk-totals-shipping .kolk-totals-value .woocommerce-shipping-methods label {
    color: #f5f5f5;
}

/* Checkout Button */
.kolk-checkout-actions .checkout-button,
.kolk-checkout-actions .wc-proceed-to-checkout a,
.wc-proceed-to-checkout .checkout-button {
    background: var(--wc-primary);
    color: #1d2127;
}

.kolk-checkout-actions .checkout-button:hover,
.kolk-checkout-actions .wc-proceed-to-checkout a:hover,
.wc-proceed-to-checkout .checkout-button:hover {
    background: var(--wc-primary-hover);
}