/*
Theme Name: Woodmart Child - FSO
Theme URI: https://freeseedsonline.com
Description: Woodmart Child Theme met FreeSeedsOnline brand kleuren
Author: FreeSeedsOnline
Author URI: https://freeseedsonline.com
Template: woodmart
Version: 1.0.0
Text Domain: woodmart-child
*/

/*
 * FSO Brand Colors - FreeSeedsOnline.com 2026
 */

:root {
    /* Primary Colors - FSO Brand Green */
    --wd-primary-color: #228B22 !important;
    --wd-link-color: #228B22 !important;
    --wd-link-color-hover: #1B6B1B !important;

    /* Accent - FSO Brand Gold */
    --wd-accent-color: #F4C430 !important;

    /* FSO Custom Variables */
    --fso-primary: #228B22;
    --fso-primary-dark: #1B6B1B;
    --fso-primary-light: #3CB043;
    --fso-primary-50: #E8F5E9;
    --fso-primary-100: #C8E6C9;
    --fso-accent: #F4C430;
    --fso-accent-light: #FDDC5C;
    --fso-accent-dark: #DAA520;
    --fso-secondary: #2E7D32;
    --fso-secondary-light: #4CAF50;
}

/* =========================================
   BUTTONS
   ========================================= */
.btn-color-primary,
.button.btn-color-primary,
.woocommerce .button.alt,
.woocommerce .button.checkout,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.checkout-button,
.add_to_cart_button,
.single_add_to_cart_button,
button[type="submit"],
input[type="submit"] {
    background-color: #228B22 !important;
    border-color: #228B22 !important;
    color: #fff !important;
}

.btn-color-primary:hover,
.button.btn-color-primary:hover,
.woocommerce .button.alt:hover,
.woocommerce .button.checkout:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.checkout-button:hover,
.add_to_cart_button:hover,
.single_add_to_cart_button:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
    background-color: #1B6B1B !important;
    border-color: #1B6B1B !important;
    color: #fff !important;
}

/* Secondary/Accent buttons */
.btn-color-accent,
.button.btn-color-accent {
    background-color: #F4C430 !important;
    border-color: #F4C430 !important;
    color: #1B6B1B !important;
}

.btn-color-accent:hover,
.button.btn-color-accent:hover {
    background-color: #DAA520 !important;
    border-color: #DAA520 !important;
}

/* =========================================
   LINKS
   ========================================= */
a {
    color: #228B22;
}

a:hover,
a:focus {
    color: #1B6B1B;
}

/* =========================================
   HEADER & NAVIGATION
   ========================================= */

/* Hoofdmenu balk - groen met witte letters (zoals freeseedsonline.com) */
.whb-main-header,
.whb-row.whb-main-header,
.wd-header .whb-main-header,
.whb-top-bar,
.whb-row.whb-top-bar,
.whb-header-bottom,
.whb-row.whb-header-bottom {
    background-color: #228B22 !important;
}

/* Overschrijf alle blauwe kleuren */
[style*="background-color:#0056A7"],
[style*="background-color: #0056A7"],
[style*="background:#0056A7"],
[style*="background: #0056A7"] {
    background-color: #228B22 !important;
}

/* Menu links wit */
.whb-main-header a,
.whb-top-bar a,
.whb-header-bottom a {
    color: #ffffff !important;
}

/* Menu navigatie vet */
.whb-main-header .wd-nav-main > li > a,
.whb-main-header .wd-nav-link,
.whb-top-bar .wd-nav-link,
.whb-header-bottom .wd-nav-link,
.wd-header .wd-nav-main > li > a {
    color: #ffffff !important;
    font-weight: 700 !important;
}

/* Menu hover - goud */
.whb-main-header .wd-nav-main > li > a:hover,
.whb-main-header .wd-nav-main > li.current-menu-item > a,
.whb-main-header .wd-nav-link:hover {
    color: #F4C430 !important;
}

/* Underline bij hover */
.whb-main-header .wd-nav-main > li > a:hover::after,
.whb-main-header .wd-nav-main > li.current-menu-item > a::after {
    background-color: #F4C430 !important;
}

/* Iconen in header wit */
.whb-main-header .wd-tools-element > a,
.whb-main-header .wd-header-icon,
.whb-main-header svg {
    color: #ffffff !important;
    fill: #ffffff !important;
}

/* Standaard header hover styling */
.wd-header .wd-nav-main > li > a:hover,
.wd-header .wd-nav-main > li.current-menu-item > a,
.wd-header .wd-nav-main > li.current-menu-ancestor > a,
.wd-nav .wd-nav-link:hover,
.wd-nav .current-menu-item > .wd-nav-link {
    color: #228B22 !important;
}

.wd-header .wd-nav-main > li > a:hover::after,
.wd-header .wd-nav-main > li.current-menu-item > a::after {
    background-color: #228B22 !important;
}

/* Mobile menu */
.wd-nav-mobile .wd-nav-link:hover,
.wd-nav-mobile .current-menu-item > .wd-nav-link {
    color: #228B22 !important;
}

/* =========================================
   WOOCOMMERCE
   ========================================= */
/* Prices */
.woocommerce .price,
.woocommerce .amount,
.price ins .amount,
.woocommerce-Price-amount {
    color: #228B22 !important;
}

/* Star ratings */
.woocommerce .star-rating span::before,
.star-rating span::before {
    color: #F4C430 !important;
}

/* Sale badge */
.woocommerce span.onsale,
.onsale,
.product-label.wd-sale {
    background-color: #F4C430 !important;
    color: #1B6B1B !important;
}

/* Product titles hover */
.wd-product .wd-entities-title a:hover,
.woocommerce ul.products li.product .woocommerce-loop-product__title:hover,
.product-title a:hover {
    color: #228B22 !important;
}

/* Add to cart icon */
.wd-action-btn.wd-add-cart-btn:hover,
.wd-action-btn:hover {
    color: #228B22 !important;
}

/* Cart widget */
.wd-cart-totals .order-total .woocommerce-Price-amount,
.cart-subtotal .woocommerce-Price-amount,
.order-total .woocommerce-Price-amount {
    color: #228B22 !important;
}

/* Quantity buttons */
.quantity .plus:hover,
.quantity .minus:hover {
    background-color: #228B22 !important;
    border-color: #228B22 !important;
}

/* =========================================
   WIDGETS & SIDEBAR
   ========================================= */
.widget a:hover,
.widget_nav_menu li a:hover,
.widget_categories li a:hover,
.widget_pages li a:hover {
    color: #228B22 !important;
}

/* =========================================
   BREADCRUMBS
   ========================================= */
.wd-breadcrumbs a:hover,
.woocommerce-breadcrumb a:hover {
    color: #228B22 !important;
}

/* =========================================
   PAGINATION
   ========================================= */
.wd-pagination .page-numbers.current,
.wd-pagination .page-numbers:hover,
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
    background-color: #228B22 !important;
    border-color: #228B22 !important;
    color: #fff !important;
}

/* =========================================
   FORMS
   ========================================= */
input:focus,
textarea:focus,
select:focus,
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus {
    border-color: #228B22 !important;
    box-shadow: 0 0 0 1px #228B22 !important;
}

/* =========================================
   TABS
   ========================================= */
.wd-nav-tabs .wd-nav-link.wd-active,
.wd-nav-tabs .wd-nav-link:hover,
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
    color: #228B22 !important;
    border-color: #228B22 !important;
}

/* =========================================
   FOOTER
   ========================================= */
.footer-container a:hover,
.wd-footer a:hover,
.copyrights a:hover {
    color: #3CB043 !important;
}

/* =========================================
   MISC
   ========================================= */
/* Selection */
::selection {
    background: #E8F5E9;
    color: #1B6B1B;
}

/* Focus states */
:focus-visible {
    outline-color: #228B22 !important;
}

/* Loading spinner */
.wd-loader::after {
    border-color: #228B22 !important;
    border-right-color: transparent !important;
}

/* Scroll to top button */
.wd-scroll-top:hover {
    background-color: #228B22 !important;
}

/* Categories */
.wd-sub-categories a:hover {
    color: #228B22 !important;
}

/* Filters */
.wd-widget-layered-nav a:hover,
.wd-active-filters a:hover {
    color: #228B22 !important;
}

/* Checkbox/Radio styled */
.wd-checkbox-input:checked + .wd-checkbox-label::before,
input[type="checkbox"]:checked + label::before {
    background-color: #228B22 !important;
    border-color: #228B22 !important;
}

/* Progress bars */
.wd-progress-bar .progress-bar,
.wd-product-progress .progress-bar {
    background-color: #228B22 !important;
}

/* Info boxes */
.woocommerce-info,
.woocommerce-message {
    border-top-color: #228B22 !important;
}

.woocommerce-info::before,
.woocommerce-message::before {
    color: #228B22 !important;
}

/* Coupon applied */
.woocommerce-message {
    background-color: #E8F5E9 !important;
}

/* =========================================
   FSO FOOTER STYLES
   ========================================= */

/* Footer background */
.footer-container,
.wd-footer {
    background: #1a1a1a !important;
    color: #ffffff !important;
}

/* Footer widget titles */
.footer-container .widget-title,
.wd-footer .widget-title,
.footer-container h4,
.wd-footer h4 {
    color: #F4C430 !important;
    font-size: 1.1rem !important;
    margin-bottom: 20px !important;
    padding-bottom: 10px !important;
    border-bottom: 2px solid #F4C430 !important;
}

/* Footer text */
.footer-container,
.footer-container p,
.footer-container td,
.wd-footer,
.wd-footer p,
.wd-footer td {
    color: #ffffff !important;
}

/* Footer links */
.footer-container a,
.wd-footer a {
    color: #ffffff !important;
    transition: color 0.3s ease !important;
}

.footer-container a:hover,
.wd-footer a:hover {
    color: #F4C430 !important;
}

/* Footer social icons */
.fso-footer-social a:hover {
    background: #F4C430 !important;
    color: #1a1a1a !important;
}

/* Footer bottom bar (copyrights) */
.copyrights-wrapper,
.wd-copyrights {
    background: rgba(0,0,0,0.3) !important;
    border-top: 1px solid rgba(255,255,255,0.1) !important;
}

.copyrights-wrapper *,
.wd-copyrights * {
    color: rgba(255,255,255,0.8) !important;
}

/* Footer table styling (opening hours) */
.fso-footer-hours table {
    width: 100%;
}

.fso-footer-hours table tr td {
    padding: 5px 0;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.fso-footer-hours table tr:last-child td {
    border-bottom: none;
}

/* Footer columns spacing */
.footer-container .wd-col {
    padding: 0 20px;
}

/* Mobile footer */
@media (max-width: 768px) {
    .footer-container .widget-title,
    .wd-footer .widget-title {
        text-align: center;
    }

    .fso-footer-social {
        justify-content: center !important;
    }

    .fso-footer-hours table {
        max-width: 300px;
        margin: 0 auto;
    }
}

/* =========================================
   PRODUCT CARDS - SIMPELE WEERGAVE
   ========================================= */

/* Verberg overbodige elementen op product cards */
.wd-product .wd-product-cats,
.wd-product .wd-product-brands,
.wd-product .wd-product-rating-wrap,
.wd-product .wd-product-desc,
.wd-product .wd-add-btn-text,
.wd-product .wd-buttons .wd-compare-btn,
.wd-product .wd-buttons .wd-wishlist-btn,
.wd-product .wd-buttons .wd-quick-view-btn,
.wd-product .wd-swatches-grid {
    display: none !important;
}

/* Zelfde formaat voor alle product cards */
.wd-product {
    min-height: 350px !important;
}

.wd-product .wd-product-thumb {
    height: 200px !important;
    overflow: hidden !important;
}

.wd-product .wd-product-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

/* Titel en prijs styling */
.wd-product .wd-entities-title {
    font-size: 14px !important;
    margin-bottom: 5px !important;
    height: 40px !important;
    overflow: hidden !important;
}

.wd-product .price {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #228B22 !important;
}

/* =========================================
   FSO CUSTOM FOOTER (HTML BLOCK)
   ========================================= */

/* Hide default Woodmart footer when custom footer is active */
.wd-footer,
.footer-container {
    display: none !important;
}

/* Custom Footer Styles */
.fso-custom-footer {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.fso-custom-footer a:hover {
    color: #F4C430 !important;
}

.fso-custom-footer .footer-social a:hover {
    background: #F4C430 !important;
    color: #1a1a1a !important;
}

.fso-custom-footer .footer-column ul li a:hover {
    color: #F4C430 !important;
    padding-left: 5px;
    transition: all 0.3s ease;
}

.fso-custom-footer .footer-column ul li a {
    transition: all 0.3s ease;
}

/* Responsive Footer */
@media (max-width: 1024px) {
    .fso-custom-footer .footer-main .fso-container > div {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 30px !important;
    }
    .fso-custom-footer .footer-main .fso-container > div + div {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 768px) {
    .fso-custom-footer .footer-main {
        padding: 40px 0 30px !important;
    }
    .fso-custom-footer .footer-main .fso-container > div {
        grid-template-columns: 1fr !important;
        gap: 35px !important;
    }
    .fso-custom-footer .footer-main .fso-container > div + div {
        grid-template-columns: 1fr !important;
    }
    .fso-custom-footer .footer-about {
        text-align: center;
    }
    .fso-custom-footer .footer-social {
        justify-content: center !important;
    }
    .fso-custom-footer .footer-column h4 {
        text-align: center;
    }
    .fso-custom-footer .footer-column > div {
        justify-content: center !important;
    }
    .fso-custom-footer .footer-column ul {
        text-align: center;
    }
    .fso-custom-footer .footer-bottom > .fso-container > div {
        flex-direction: column !important;
        text-align: center;
        gap: 15px !important;
    }
    .fso-custom-footer .footer-copyright {
        text-align: center !important;
    }
    .fso-custom-footer .footer-copyright span {
        display: block !important;
        margin: 10px 0 0 0 !important;
    }
    .fso-custom-footer .payment-methods {
        justify-content: center !important;
        flex-wrap: wrap !important;
    }
    .fso-custom-footer .payment-methods span {
        font-size: 12px !important;
        padding: 4px 8px !important;
    }
}

@media (max-width: 480px) {
    .fso-custom-footer .footer-main .fso-container {
        padding: 0 15px !important;
    }
    .fso-custom-footer .footer-bottom .fso-container {
        padding: 0 15px !important;
    }
}

/* Fix: Skip links verbergen (accessibility links) */
.wd-skip-links {
    position: fixed !important;
    inset-inline-start: -1000em !important;
    opacity: 0;
    pointer-events: none;
}

.wd-skip-links:focus-within {
    inset-inline-start: 10px !important;
    opacity: 1;
    pointer-events: auto;
}



/* =========================================
   FSO CLASSIC CHECKOUT - MOBILE FIX
   Woodmart specific - targets .customer-details
   and .checkout-order-review
   ========================================= */

/* Force single column on ALL mobile devices including old iOS */
@media (max-width: 768px) {
    /* Override Woodmart flex layout - no :is() for old browser compat */
    form.woocommerce-checkout {
        display: block !important;
    }

    form.woocommerce-checkout > .customer-details {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 20px !important;
    }

    form.woocommerce-checkout > .checkout-order-review {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    /* Order review full width */
    #order_review,
    #order_review_heading,
    .woocommerce-checkout-review-order {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Formulier velden full width */
    .woocommerce-checkout .form-row,
    .woocommerce-checkout .form-row-first,
    .woocommerce-checkout .form-row-last {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    /* Input velden 16px = voorkomt iOS auto-zoom */
    .woocommerce-checkout input.input-text,
    .woocommerce-checkout select,
    .woocommerce-checkout textarea {
        width: 100% !important;
        font-size: 16px !important;
        box-sizing: border-box !important;
    }

    /* Product tabel leesbaar */
    .woocommerce-checkout .shop_table td,
    .woocommerce-checkout .shop_table th {
        padding: 8px 5px !important;
        font-size: 14px !important;
        word-break: break-word !important;
    }

    /* Betaalmethodes duidelijk */
    .woocommerce-checkout #payment ul.payment_methods li {
        padding: 10px !important;
        margin-bottom: 5px !important;
    }

    .woocommerce-checkout #payment .payment_methods label {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        font-size: 16px !important;
    }

    .woocommerce-checkout #payment .payment_methods label img {
        max-height: 30px !important;
        width: auto !important;
    }

    /* Bestel knop groot en duidelijk */
    .woocommerce-checkout #place_order {
        width: 100% !important;
        padding: 15px !important;
        font-size: 18px !important;
        font-weight: 700 !important;
        margin-top: 15px !important;
    }

    /* Coupon form */
    .woocommerce-checkout .checkout_coupon input[type="text"] {
        width: 100% !important;
        margin-bottom: 10px !important;
    }

    .woocommerce-checkout .checkout_coupon button {
        width: 100% !important;
    }

    /* Sticky sidebar uitschakelen */
    .woocommerce-checkout .wd-sticky-sidebar-wrapper,
    .woocommerce-checkout .wd-sidebar-sticky {
        position: static !important;
    }
}

/* Extra small screens */
@media (max-width: 480px) {
    .woocommerce-checkout {
        padding: 0 10px !important;
    }

    .woocommerce-checkout h3 {
        font-size: 18px !important;
    }

    .checkout-order-review {
        padding: 15px !important;
    }
}
