/* ==========================================================
   ELECTRO CATALOG - SHOP PAGE STYLES
   Extends the home.html design system
   ========================================================== */

/* ------------------------------------------
   Shop Header Bar
   Moved to style.css — it's global chrome shared by page.php,
   archive.php, and single-product (via functions.php), not just
   shop archives, so it needs to load on every page.
   ------------------------------------------ */

/* ------------------------------------------
   Shop Layout
   ------------------------------------------ */
.shop-layout {
    align-items: start;
}

.shop-sidebar {
    position: sticky;
    top: 90px;
    height: fit-content;
}

.shop-content {
    min-width: 0;
}

/* ------------------------------------------
   Shop Toolbar
   ------------------------------------------ */
.shop-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding: 15px 20px;
    background: #fff;
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--gray-200);
    flex-wrap: wrap;
    gap: 15px;
}

.toolbar-left {
    font-size: 0.9rem;
    color: var(--gray-600);
}

.toolbar-left strong {
    color: var(--secondary);
}

.toolbar-right {
    display: flex;
    align-items: center;
    gap: 15px;
}

/* WooCommerce ordering dropdown */
.woocommerce-ordering {
    margin: 0;
}

.woocommerce-ordering select {
    padding: 8px 35px 8px 15px;
    border: 1px solid var(--gray-300);
    border-radius: var(--radius-sm);
    background: #fff;
    font-size: 0.9rem;
    color: var(--gray-700);
    cursor: pointer;
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236c757d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    transition: var(--transition);
}

.woocommerce-ordering select:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(254, 215, 0, 0.2);
}

/* View Toggle */
.view-toggle {
    display: flex;
    gap: 5px;
}

.view-btn {
    width: 36px;
    height: 36px;
    border: 1px solid var(--gray-300);
    background: #fff;
    border-radius: var(--radius-sm);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
    color: var(--gray-600);
}

.view-btn:hover,
.view-btn.active {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--secondary);
}

/* ------------------------------------------
   Product Grid (Shop)
   ------------------------------------------ */
.shop-content .products {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 20px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.shop-content .products.list-view {
    grid-template-columns: 1fr;
}

.shop-content .products.list-view .shop-product-card {
    display: grid;
    grid-template-columns: 240px 1fr;
    align-items: stretch;
}

.shop-content .products.list-view .product-image {
    height: 100%;
    min-height: 240px;
}

.shop-content .products.list-view .product-body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 25px;
}

.shop-content .products.list-view .product-features {
    display: block;
}

/* ------------------------------------------
   Shop Product Card Overrides
   ------------------------------------------ */
.shop-product-card {
    background: #fff;
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    transition: var(--transition);
    position: relative;
    border: 1px solid transparent;
    list-style: none;
}

.shop-product-card:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-4px);
    border-color: var(--gray-200);
}

.shop-product-card .product-image {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    position: relative;
    background: var(--gray-100);
}

.shop-product-card .product-image img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    transition: var(--transition);
}

.shop-product-card:hover .product-image img {
    transform: scale(1.05);
}

.shop-product-card .product-image a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

/* Product Actions (hover reveal) */
.shop-product-card .product-actions {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%) translateX(10px);
    opacity: 0;
    transition: var(--transition);
    display: flex;
    flex-direction: column;
    gap: 8px;
    z-index: 2;
}

.shop-product-card:hover .product-actions {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

/* YITH Wishlist integration */
.shop-product-card .product-actions .yith-wcwl-add-button {
    margin: 0;
}

.shop-product-card .product-actions .yith-wcwl-add-button a {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid var(--gray-200);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--gray-700);
    box-shadow: var(--shadow-sm);
    font-size: 0;
    position: relative;
}

.shop-product-card .product-actions .yith-wcwl-add-button a:before {
    content: "\f004";
    font-family: "Font Awesome 5 Free";
    font-weight: 400;
    font-size: 0.9rem;
}

.shop-product-card .product-actions .yith-wcwl-add-button a:hover {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--secondary);
}

/* Product Body */
.shop-product-card .product-body {
    padding: 18px;
}

.shop-product-card .product-category {
    font-size: 0.75rem;
    color: var(--gray-500);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
    line-height: 1.4;
}

.shop-product-card .product-category a {
    color: var(--gray-500);
    text-decoration: none;
    transition: var(--transition);
}

.shop-product-card .product-category a:hover {
    color: var(--secondary);
}

.shop-product-card .product-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--gray-800);
    margin-bottom: 8px;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.shop-product-card .product-title a {
    color: inherit;
    text-decoration: none;
    transition: var(--transition);
}

.shop-product-card .product-title a:hover {
    color: var(--secondary);
}

/* Rating */
.shop-product-card .product-rating {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 10px;
}

.shop-product-card .stars {
    color: var(--warning);
    font-size: 0.8rem;
}

.shop-product-card .stars i {
    margin-right: 1px;
}

.shop-product-card .rating-count {
    font-size: 0.75rem;
    color: var(--gray-500);
}

/* Features List */
.shop-product-card .product-features {
    list-style: none;
    margin: 0 0 12px 0;
    padding: 0;
    font-size: 0.8rem;
    color: var(--gray-600);
    line-height: 1.6;
}

.shop-product-card .product-features li {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-bottom: 3px;
}

.shop-product-card .product-features li i {
    color: var(--accent);
    font-size: 0.7rem;
    margin-top: 4px;
    flex-shrink: 0;
}

/* SKU */
.shop-product-card .product-sku {
    font-size: 0.8rem;
    color: var(--gray-500);
    margin-bottom: 10px;
}

.shop-product-card .sku-label {
    font-weight: 600;
    color: var(--gray-700);
}

/* Price */
.shop-product-card .product-price {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.shop-product-card .product-price .woocommerce-Price-amount {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--secondary);
}

.shop-product-card .product-price del .woocommerce-Price-amount {
    font-size: 0.9rem;
    color: var(--gray-400);
    font-weight: 400;
    text-decoration: line-through;
}

.shop-product-card .product-price ins {
    text-decoration: none;
}

/* Stock */
.shop-product-card .product-stock {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    margin-bottom: 8px;
}

/* Action Buttons Row */
.product-actions-row {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--gray-100);
    display: flex;
    gap: 10px;
}

.action-add-cart,
.action-read-more {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 0.85rem;
    text-decoration: none;
    transition: var(--transition);
    cursor: pointer;
    border: none;
    text-align: center;
}

.action-add-cart {
    background: var(--primary);
    color: var(--secondary);
}

.action-add-cart:hover {
    background: var(--primary-dark);
    transform: translateY(-1px);
}

.action-read-more {
    background: var(--gray-100);
    color: var(--gray-700);
    border: 1px solid var(--gray-300);
}

.action-read-more:hover {
    background: var(--gray-200);
}

/* ------------------------------------------
   Pagination
   ------------------------------------------ */
.shop-pagination-wrap {
    margin-top: 35px;
}

.shop-pagination-wrap .woocommerce-pagination {
    display: flex;
    justify-content: center;
}

.shop-pagination-wrap .woocommerce-pagination ul {
    display: flex;
    gap: 6px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.shop-pagination-wrap .woocommerce-pagination ul li {
    margin: 0;
}

.shop-pagination-wrap .woocommerce-pagination ul li a,
.shop-pagination-wrap .woocommerce-pagination ul li span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 42px;
    border: 1px solid var(--gray-300);
    background: #fff;
    border-radius: var(--radius-sm);
    font-weight: 600;
    color: var(--gray-700);
    text-decoration: none;
    transition: var(--transition);
    font-size: 0.9rem;
    padding: 0 12px;
}

.shop-pagination-wrap .woocommerce-pagination ul li a:hover,
.shop-pagination-wrap .woocommerce-pagination ul li span.current {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--secondary);
}

.shop-pagination-wrap .woocommerce-pagination ul li span.dots {
    border: none;
    background: transparent;
    color: var(--gray-500);
}

/* ------------------------------------------
   Tag Cloud (Sidebar)
   ------------------------------------------ */
.tag-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tag-link {
    display: inline-block;
    padding: 6px 14px;
    background: var(--gray-100);
    border: 1px solid var(--gray-200);
    border-radius: 20px;
    font-size: 0.8rem;
    color: var(--gray-600);
    text-decoration: none;
    transition: var(--transition);
}

.tag-link:hover {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--secondary);
    font-weight: 500;
}

/* ------------------------------------------
   Filter Panel Widget Styling
   ------------------------------------------ */
.filter-panel .widget {
    margin-bottom: 25px;
}

.filter-panel .widget:last-child {
    margin-bottom: 0;
}

.filter-panel .widget-title {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--gray-800);
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* Price filter widget */
.filter-panel .widget_price_filter .price_slider_wrapper {
    padding-top: 5px;
}

.filter-panel .widget_price_filter .ui-slider {
    background: var(--gray-200);
    border-radius: 3px;
    height: 6px;
    margin-bottom: 15px;
}

.filter-panel .widget_price_filter .ui-slider-range {
    background: var(--primary);
    border-radius: 3px;
}

.filter-panel .widget_price_filter .ui-slider-handle {
    background: var(--secondary);
    border: 2px solid #fff;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    top: -6px;
    box-shadow: var(--shadow-sm);
    cursor: pointer;
}

.filter-panel .widget_price_filter .price_slider_amount {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: stretch;
}

.filter-panel .widget_price_filter .price_label {
    font-size: 0.85rem;
    color: var(--gray-600);
    text-align: center;
}

.filter-panel .widget_price_filter .button {
    background: var(--secondary);
    color: #fff;
    border: none;
    padding: 8px 16px;
    border-radius: var(--radius-sm);
    cursor: pointer;
    font-weight: 600;
    font-size: 0.85rem;
    transition: var(--transition);
}

.filter-panel .widget_price_filter .button:hover {
    background: var(--primary);
    color: var(--secondary);
}

/* Layered nav (attribute filters) */
.filter-panel .woocommerce-widget-layered-nav-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.filter-panel .woocommerce-widget-layered-nav-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0;
    border-bottom: 1px solid var(--gray-100);
    font-size: 0.85rem;
}

.filter-panel .woocommerce-widget-layered-nav-list li:last-child {
    border-bottom: none;
}

.filter-panel .woocommerce-widget-layered-nav-list li a {
    color: var(--gray-700);
    text-decoration: none;
    transition: var(--transition);
    display: flex;
    align-items: center;
    gap: 8px;
}

.filter-panel .woocommerce-widget-layered-nav-list li a:hover {
    color: var(--secondary);
    padding-left: 3px;
}

.filter-panel .woocommerce-widget-layered-nav-list li .count {
    background: var(--gray-200);
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 0.75rem;
    color: var(--gray-600);
}

.filter-panel .woocommerce-widget-layered-nav-list li.chosen a::before {
    content: "\f00d";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: var(--danger);
    font-size: 0.7rem;
}

/* Active filter widgets */
.filter-panel .widget_layered_nav_filters ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.filter-panel .widget_layered_nav_filters ul li {
    margin: 0;
}

.filter-panel .widget_layered_nav_filters ul li a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--secondary);
    color: #fff;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    text-decoration: none;
    transition: var(--transition);
}

.filter-panel .widget_layered_nav_filters ul li a:hover {
    background: var(--danger);
}

.filter-panel .widget_layered_nav_filters ul li a::before {
    content: "\f00d";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 0.7rem;
}

/* Product categories widget in sidebar */
.widget_product_categories .product-categories {
    list-style: none;
    margin: 0;
    padding: 0;
}

.widget_product_categories .product-categories li {
    border-bottom: 1px solid var(--gray-100);
}

.widget_product_categories .product-categories li:last-child {
    border-bottom: none;
}

.widget_product_categories .product-categories li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    color: var(--gray-700);
    text-decoration: none;
    font-size: 0.9rem;
    transition: var(--transition);
}

.widget_product_categories .product-categories li a:hover {
    color: var(--secondary);
    padding-left: 5px;
}

.widget_product_categories .product-categories li .count {
    background: var(--gray-200);
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 0.75rem;
    color: var(--gray-600);
}

.widget_product_categories .product-categories li.current-cat > a {
    color: var(--secondary);
    font-weight: 600;
}

.widget_product_categories .product-categories .children {
    list-style: none;
    margin: 0 0 0 15px;
    padding: 0;
    border-left: 2px solid var(--gray-200);
    padding-left: 12px;
}

/* ------------------------------------------
   Mobile Filter Toggle
   ------------------------------------------ */
.mobile-filter-toggle {
    display: none;
    width: 100%;
    padding: 12px;
    background: var(--secondary);
    color: #fff;
    border: none;
    border-radius: var(--radius);
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: var(--transition);
}

.mobile-filter-toggle:hover {
    background: var(--primary);
    color: var(--secondary);
}

/* ------------------------------------------
   No Products Found
   ------------------------------------------ */
.shop-content .woocommerce-info,
.shop-content .woocommerce-message,
.shop-content .woocommerce-error {
    background: #fff;
    border-radius: var(--radius);
    padding: 20px;
    margin-bottom: 20px;
    border-left: 4px solid var(--info);
    box-shadow: var(--shadow-sm);
}

.shop-content .woocommerce-message {
    border-left-color: var(--accent);
}

.shop-content .woocommerce-error {
    border-left-color: var(--danger);
}

/* ------------------------------------------
   Responsive
   ------------------------------------------ */
@media (max-width: 1200px) {
    .shop-layout {
        grid-template-columns: 220px 1fr;
    }
}

@media (max-width: 992px) {
    .shop-layout {
        grid-template-columns: 1fr;
    }

    .shop-sidebar {
        display: none;
    }

    .mobile-filter-toggle {
        display: flex;
    }

    /* Column counts for #productGrid are handled below, in the
       WOOCOMMERCE OVERRIDES section — those rules use !important
       to beat WooCommerce's default float layout, so any column
       count set here would be silently ignored. */
}

@media (max-width: 768px) {
    .shop-header-inner {
        flex-direction: column;
        text-align: center;
    }

    .shop-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .toolbar-right {
        justify-content: space-between;
    }

    .shop-content .products.list-view .product-image {
        height: 200px;
    }
}

@media (max-width: 480px) {
    .shop-page-title {
        font-size: 1.4rem;
    }
}

/* ==========================================================
   WOOCOMMERCE OVERRIDES — beat WC's default float layouts
   ========================================================== */

/* Force grid layout on shop archives (higher specificity than WC defaults) */
.woocommerce ul.products,
.woocommerce-page ul.products,
.electro-shop-page ul.products,
.shop-content ul.products {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important;
    gap: 20px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    float: none !important;
}

.woocommerce ul.products.columns-2 { grid-template-columns: repeat(2, 1fr) !important; }
.woocommerce ul.products.columns-3 { grid-template-columns: repeat(3, 1fr) !important; }
.woocommerce ul.products.columns-4 { grid-template-columns: repeat(4, 1fr) !important; }

.woocommerce ul.products li.product,
.electro-shop-page ul.products li.product {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
    clear: none !important;
}

/* List view — one column, horizontal cards */
.woocommerce ul.products.list-view,
.shop-content ul.products.list-view {
    grid-template-columns: 1fr !important;
}

.woocommerce ul.products.list-view li.product,
.shop-content ul.products.list-view li.product {
    display: grid !important;
    grid-template-columns: 220px 1fr !important;
    gap: 25px !important;
    align-items: stretch;
}

/* Neutralize WooCommerce's default clearfix pseudo-elements on
   ul.products. WC adds `content:" "; display:table;` via ::before/
   ::after to clear floats in its classic float-based layout — but
   since we turn ul.products into a CSS Grid, a pseudo-element with
   `content` set becomes a real grid item, silently occupying the
   first cell and pushing every actual product into the next column.
   This was the cause of the empty first cell in every product grid
   on shop/product pages (content:none removes the box entirely). */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after,
.shop-content ul.products::before,
.shop-content ul.products::after {
    display: none !important;
    content: none !important;
}

/* Responsive column counts, scoped to #productGrid (the wrapper both
   archive-product.php and front-page.php's featured grid render into)
   so these reliably win over the fixed .columns-3/.columns-4 rules
   above via ID specificity, regardless of source order in this file.
   Matches the theme's standard 992/768/480 breakpoints used elsewhere. */
@media (max-width: 992px) {
    #productGrid ul.products,
    #productGrid .products {
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
    }
}

@media (max-width: 768px) {
    #productGrid ul.products,
    #productGrid .products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }
    #productGrid ul.products.list-view li.product,
    #productGrid .products.list-view .shop-product-card {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 480px) {
    #productGrid ul.products,
    #productGrid .products {
        grid-template-columns: 1fr !important;
    }
}

/* ==========================================================
   SINGLE PRODUCT PAGE — beat WC's default float layout
   ========================================================== */
.single-product div.product {
    display: grid !important;
    grid-template-columns: minmax(300px, 45%) 1fr !important;
    gap: 40px !important;
    background: #fff;
    padding: 40px;
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    margin: 30px auto;
    max-width: 1200px;
}

.single-product .woocommerce-product-gallery {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 !important;
}

.single-product .woocommerce-product-gallery__wrapper {
    width: 100%;
    margin: 0;
}

.single-product .woocommerce-product-gallery__image img,
.single-product .woocommerce-product-gallery img {
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    display: block;
    margin: 0 auto;
    border-radius: var(--radius);
    border: 1px solid var(--gray-200);
}

.single-product .summary.entry-summary {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.single-product .product_title {
    font-size: 1.75rem !important;
    color: var(--secondary);
    margin: 0 0 15px 0 !important;
    font-weight: 700;
}

.single-product .price {
    font-size: 1.5rem !important;
    color: var(--primary-dark);
    font-weight: 700;
    margin: 0 0 20px 0 !important;
}

.single-product .price del {
    color: var(--gray-500);
    font-size: 1rem;
    font-weight: 400;
    margin-right: 10px;
}

.single-product .woocommerce-product-details__short-description {
    margin: 20px 0 !important;
    line-height: 1.7;
    color: var(--gray-700);
}

.single-product .woocommerce-product-details__short-description ul {
    padding-left: 20px;
    margin: 10px 0;
}

.single-product .woocommerce-product-details__short-description li {
    padding: 4px 0;
}

.single-product .stock {
    display: inline-block;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 20px;
}

.single-product .stock.in-stock {
    background: rgba(92, 184, 92, 0.15);
    color: var(--success, #2f7a2f);
}

.single-product .stock.out-of-stock {
    background: rgba(217, 83, 79, 0.15);
    color: var(--danger);
}

.single-product form.cart {
    margin: 25px 0 !important;
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
}

.single-product .quantity input {
    width: 80px !important;
    padding: 12px !important;
    border: 2px solid var(--gray-200) !important;
    border-radius: 8px !important;
    font-size: 1rem;
    text-align: center;
}

.single-product .single_add_to_cart_button {
    background: var(--primary) !important;
    color: var(--secondary) !important;
    padding: 14px 32px !important;
    border-radius: 30px !important;
    font-weight: 700 !important;
    font-size: 1rem !important;
    border: none !important;
    cursor: pointer;
    transition: var(--transition);
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
}

.single-product .single_add_to_cart_button:hover {
    background: var(--secondary) !important;
    color: var(--primary) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(254, 215, 0, 0.35);
}

.single-product .product_meta {
    padding: 20px 0 !important;
    border-top: 1px solid var(--gray-200);
    margin-top: 25px !important;
    font-size: 0.9rem;
    color: var(--gray-600);
}

.single-product .product_meta > span {
    display: block;
    margin-bottom: 8px;
}

.single-product .product_meta a {
    color: var(--primary-dark);
    font-weight: 600;
    text-decoration: none;
}

/* Product tabs (Description, Additional Information, Reviews) */
.woocommerce-tabs.wc-tabs-wrapper {
    grid-column: 1 / -1 !important;
    margin-top: 30px !important;
    padding-top: 30px !important;
    border-top: 1px solid var(--gray-200);
}

.woocommerce-tabs .tabs.wc-tabs {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 25px 0 !important;
    display: flex !important;
    gap: 5px;
    border-bottom: 2px solid var(--gray-200) !important;
}

.woocommerce-tabs .tabs.wc-tabs::before,
.woocommerce-tabs .tabs.wc-tabs::after {
    display: none !important;
}

.woocommerce-tabs .tabs.wc-tabs li {
    margin: 0 !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
}

.woocommerce-tabs .tabs.wc-tabs li a {
    display: block !important;
    padding: 12px 24px !important;
    color: var(--gray-600) !important;
    text-decoration: none;
    font-weight: 600;
    border-bottom: 3px solid transparent;
    transition: var(--transition);
}

.woocommerce-tabs .tabs.wc-tabs li.active a {
    color: var(--primary-dark) !important;
    border-bottom-color: var(--primary) !important;
}

.woocommerce-tabs .panel {
    color: var(--gray-700);
    line-height: 1.7;
}

.woocommerce-tabs .panel h2 {
    font-size: 1.3rem;
    color: var(--secondary);
    margin: 0 0 15px 0;
}

/* Related products section */
.single-product .related.products,
.single-product .upsells.products {
    grid-column: 1 / -1 !important;
    max-width: 100% !important;
    margin-top: 40px !important;
    padding-top: 30px !important;
    border-top: 1px solid var(--gray-200);
}

.single-product .related.products > h2,
.single-product .upsells.products > h2 {
    font-size: 1.4rem;
    color: var(--secondary);
    margin: 0 0 25px 0;
}

/* Mobile single product */
@media (max-width: 768px) {
    .single-product div.product {
        grid-template-columns: 1fr !important;
        gap: 25px !important;
        padding: 20px !important;
    }
    .single-product .product_title {
        font-size: 1.4rem !important;
    }
    .single-product .price {
        font-size: 1.25rem !important;
    }
}