/*
Theme Name: Board Gamery
Text Domain: Board Gamery
Version: 1.0
Description: Board Gamery is a modern and stylish WordPress theme designed specifically for board game cafes and shops. With its sleek design and user-friendly features, it provides an excellent platform to showcase your board game collection, promote events, and engage with your community. Whether you're a small local cafe or a large board game retailer, Board Gamery offers the perfect solution to enhance your online presence and attract more customers.
Author: Kelbin
Team: Corsiva Lab
License: GNU General Public License v2 or later


#    
*                      _oo0oo_
#                     088888880
#                     88" . "88
#                     (| -_- |)
#                     0\  =  /0
#                   ___/'---'\___
#                 .' \\|     |// '.
#                / \\|||  :  |||// \
#               / _||||| -:- |||||- \
#              |   | \\\  -  /// |   |
#              | \_|  ''\---/''  |_/ |
#              \  .-\__  '-'  ___/-. /
#            ___'. .'  /--.--\  '. .'___
#         ."" '<  '.___\_<|>_/___.'  >' "".
#        | | :  '- \'.;' \ _ / ';.'/ - ' : | |
#        \  \ '_.   \_ __\ /__ _/   .-' _/  /
#    ====='-.____'.___ \_____/___.-'____.-'=====
#                      '=---='
#
#  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
#
#          Phật phù hộ, không bao giờ BUG
#
#  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 

*/

.woocommerce-page.woocommerce .pro_cls_custom .best-seller {
	z-index: 99;
}

/* ==========================================
   FOOTER THEMING SYSTEM
   ========================================== */

/* 1. DARK THEME (Default) */
.footer.footer--dark {
    background-color: #000000;
    color: #ffffff;
}

.footer.footer--dark a.nav__link,
.footer.footer--dark .desc {
    color: #ffffff;
}

.footer.footer--dark .footer__bot {
    border-top: 2px solid #ffffff;
}

.footer.footer--dark .footer__bot .nav__item + .nav__item .nav__link {
    border-left: 1px solid rgba(255, 255, 255, 0.4);
}

.footer.footer--dark .form-wrapper input[type="email"],
.footer.footer--dark .form-wrapper input[type="text"] {
    background-color: #ffffff;
    color: #000000;
    border: 1px solid #ffffff;
}

/* 2. LIGHT THEME */
.footer.footer--light {
    background-color: #ffffff;
    color: #000000;
}
.footer.footer--light .footer__section{
	border-top: 2px solid #000;
}

.footer.footer--light a.nav__link,
.footer.footer--light .desc {
    color: #000000;
}

.footer.footer--light .footer__bot {
    border-top: 2px solid #000000;
}

.footer.footer--light .footer__bot .nav__item + .nav__item .nav__link {
    border-left: 1px solid rgba(0, 0, 0, 0.2);
}

.footer.footer--light .form-wrapper input[type="email"],
.footer.footer--light .form-wrapper input[type="text"] {
    background-color: #f4f4f4;
    color: #000000;
    border: 1px solid #e0e0e0;
}

/* Auto-invert white social icon SVGs/PNGs for light background */
.footer.footer--light .social__link img {
    filter: invert(1);
}

/* Shared Transitions */
.footer a.nav__link {
    transition: opacity 0.2s ease;
}

.footer a.nav__link:hover {
    opacity: 0.7;
}

/* Change ALL buttons on the Homepage EXCEPT .button.bg--yellow */
.home button:not(.bg--yellow),
.home input[type="submit"]:not(.bg--yellow),
.home input[type="button"]:not(.bg--yellow),
.home .btn:not(.bg--yellow),
.home .button:not(.bg--yellow) {
    background-color: #109EF0 !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important; /* Added white border */
}

/* Hover state */
.home button:not(.bg--yellow):hover,
.home input[type="submit"]:not(.bg--yellow):hover,
.home input[type="button"]:not(.bg--yellow):hover,
.home .btn:not(.bg--yellow):hover,
.home .button:not(.bg--yellow):hover {
    background-color: #0d85cd !important;
    border-color: #ffffff !important; /* Keeps border white on hover */
}

/* Hide any badge that comes after the first child */
#yith-wcbm-cloned-badges .yith-wcbm-badge:nth-child(n+2) {
    display: none !important;
}

/* Make ALL buttons on Single Product detail pages blue */
.single-product button,
.single-product input[type="submit"],
.single-product input[type="button"],
.single-product .button,
.single-product .btn,
.single-product .single_add_to_cart_button {
    background-color: #109EF0 !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

/* Hover & Active States */
.single-product button:hover,
.single-product input[type="submit"]:hover,
.single-product input[type="button"]:hover,
.single-product .button:hover,
.single-product .btn:hover,
.single-product .single_add_to_cart_button:hover {
    background-color: #0d85cd !important;
    border-color: #ffffff !important;
}

/* High specificity target */
.single-product.woocommerce-page.woocommerce .section-pro-detail form.cart .single_add_to_cart_button.bg--black,
html body.single-product .single_add_to_cart_button.bg--black {
    background-color: #109EF0 !important;
    background: #109EF0 !important; /* Overrides background shorthands */
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

/* Styling Utama Button Biru */
.btn-blue, .section-whyus .button {
    display: inline-block;
    background-color: #109EF0 !important;
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    padding: 12px 24px;
    border: 1px solid #109EF0;
    border-radius: 6px;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    transition: all 0.3s ease;
    outline: none;
}

/* Efek saat kursor diarahkan ke tombol (Hover) */
.btn-blue:hover {
    background-color: #0d85cd;
    border-color: #0d85cd;
    color: #ffffff;
}

/* Efek saat tombol diklik (Active) */
.btn-blue:active {
    background-color: #0a6ca7;
    border-color: #0a6ca7;
    transform: translateY(1px);
}

/* Efek saat fokus navigasi keyboard (Focus) */
.btn-blue:focus {
    box-shadow: 0 0 0 3px rgba(16, 158, 240, 0.4);
}
/* Change WooCommerce primary buttons (AddToCart, Checkout, etc.) */
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce-page button.button,
.woocommerce-page input.button,
.woocommerce-page a.button {
    background-color: #109EF0 !important;
    color: #ffffff !important;
    border-color: #109EF0 !important;
}

/* Button Hover State */
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce-page button.button:hover,
.woocommerce-page input.button:hover,
.woocommerce-page a.button:hover {
    background-color: #0c82c2 !important; /* Slightly darker shade for hover */
    color: #ffffff !important;
    border-color: #0c82c2 !important;
}


/* Fix YouTube and video iframes from becoming compressed/penyet */
iframe[src*="youtube.com"],
iframe[src*="youtube-nocookie.com"],
iframe[src*="vimeo.com"] {
    inline-size: 100% !important;
    block-size: auto !important;
    aspect-ratio: 16 / 9;
    object-fit: initial !important;
}
p{
	word-wrap: anywhere;
}

.woocommerce-product-gallery__lightbox, .wpgs-wrapper .slick-prev, .wpgs-wrapper .slick-next, .button, .btn--woo, input[type=submit]:not(.adminbar-button, .button--arrow) {
	background:#109EF0 !important;
}
/* Hide the J&T Express courier image in the shipping method list */
label[for="shipping_method_0_ep-cs058"] img {
    display: none !important;
}

/* Hide Local Pickup fee row only on the Cart page */
.woocommerce-cart .shop_table tr.fee {
    display: none !important;
}

.button.bg--yellow, .btn--woo.bg--yellow, input[type=submit]:not(.adminbar-button, .button--arrow).bg--yellow {
    background-color: #FFD100 !important;
    color: #000 !important;
}

/* Wonderful Brands Section Hover Effect */
.section-wonderful-brands a.brand--item {
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.section-wonderful-brands a.brand--item:hover {
    transform: scale(1.06);
    opacity: 0.85;
}

/* ==========================================
   PRODUCT CARDS: COMPACT SPACING & EQUAL ALIGNMENT
   ========================================== */

/* 1. Category / Shop Archive Grid */
.woocommerce ul.products,
.section-archive-product ul.products {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 30px 24px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 30px 0 !important;
}

.woocommerce ul.products:before,
.woocommerce ul.products:after {
    display: none !important;
}

.woocommerce ul.products li.product {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}

@media (max-width: 991.98px) {
    .woocommerce ul.products,
    .section-archive-product ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px 16px !important;
    }
}

@media (max-width: 575.98px) {
    .woocommerce ul.products,
    .section-archive-product ul.products {
        grid-template-columns: 1fr !important;
    }
}

/* 2. Swiper Sliders (Homepage Best Sellers, New Arrivals, Related) */
.section-best-seller .swiper-slide,
.section-new-arrivals .swiper-slide,
.related .swiper-slide {
    height: auto !important;
    display: flex !important;
}

/* 3. Universal Product Card Flex Layout */
.pro_cls_custom,
.woocommerce-page.woocommerce .pro_cls_custom {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    width: 100% !important;
    justify-content: flex-start !important;
    text-align: center;
}

.pro_cls_custom .woocommerce-LoopProduct-link,
.woocommerce-page.woocommerce .pro_cls_custom .woocommerce-LoopProduct-link {
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
    width: 100% !important;
    text-decoration: none !important;
}

/* Product Image: Clean, Proportional Sizing */
.pro_cls_custom .woocommerce-LoopProduct-link img,
.woocommerce-page.woocommerce .pro_cls_custom .woocommerce-LoopProduct-link img {
    aspect-ratio: 1 / 1 !important;
    object-fit: contain !important;
    width: 100% !important;
    max-height: 240px !important;
    padding: 1rem !important;
    margin: 0 auto !important;
}

/* Title: Clean 2-line clamp with compact height */
.pro_cls_custom .woocommerce-LoopProduct-link .woocommerce-loop-product__title,
.woocommerce-page.woocommerce .pro_cls_custom .woocommerce-LoopProduct-link .woocommerce-loop-product__title {
    font-family: "Faustina", "Roboto Condensed", sans-serif;
    font-size: 1.6rem !important;
    font-weight: 700 !important;
    color: #000 !important;
    line-height: 1.25 !important;
    margin-top: 0.8rem !important;
    margin-bottom: 0.4rem !important;
    min-height: 4rem !important;
    height: 4rem !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

/* Price: Compact height with tight baseline */
.pro_cls_custom .woocommerce-LoopProduct-link span.price,
.woocommerce-page.woocommerce .pro_cls_custom .woocommerce-LoopProduct-link span.price {
    margin-top: auto !important;
    margin-bottom: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    min-height: 2.2rem !important;
    height: 2.2rem !important;
    font-size: 1.6rem !important;
    font-weight: 700 !important;
    color: #000 !important;
}

.pro_cls_custom .woocommerce-LoopProduct-link span.price del {
    color: #8E8E93 !important;
    font-weight: 400 !important;
    font-size: 1.4rem !important;
}

.pro_cls_custom .woocommerce-LoopProduct-link span.price ins {
    text-decoration: none !important;
    color: #000 !important;
}

/* Add to Bag Button: Compact and Aligned */
.pro_cls_custom a.add_to_cart_button,
.pro_cls_custom a.button,
.pro_cls_custom .button,
.woocommerce-page.woocommerce .pro_cls_custom a.add_to_cart_button {
    margin-top: 0 !important;
    margin-bottom: 0.6rem !important;
    width: 100% !important;
    padding: 0.9rem 1.5rem !important;
    font-size: 1.4rem !important;
    display: block !important;
}

/* Wishlist Link: Equalized height so 1-line and 2-line states ("Product added! / Browse wishlist") never shift the Add to Bag button */
.pro_cls_custom .yith-wcwl-add-to-wishlist,
.woocommerce-page.woocommerce .pro_cls_custom .yith-wcwl-add-to-wishlist {
    min-height: 4rem !important;
    height: 4rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    line-height: 1.2 !important;
}

.pro_cls_custom .yith-wcwl-add-to-wishlist .yith-wcwl-add-button,
.pro_cls_custom .yith-wcwl-add-to-wishlist .yith-wcwl-wishlistaddedbrowse,
.pro_cls_custom .yith-wcwl-add-to-wishlist .yith-wcwl-wishlistexistsbrowse {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.2rem !important;
    margin: 0 !important;
}

.pro_cls_custom .yith-wcwl-add-to-wishlist a {
    font-size: 1.3rem !important;
    line-height: 1.2 !important;
    color: #000 !important;
    text-decoration: none !important;
}

.pro_cls_custom .yith-wcwl-add-to-wishlist .feedback {
    font-size: 1.2rem !important;
    line-height: 1.2 !important;
    color: #000 !important;
    margin: 0 !important;
}

.pro_cls_custom .yith-wcwl-add-to-wishlist i {
    margin-right: 0.4rem !important;
}

.pro_cls_custom a.added_to_cart {
    display: block !important;
    font-size: 1.2rem !important;
    margin-top: 0.3rem !important;
    color: #109EF0 !important;
    text-decoration: underline !important;
}