/* ==========================================================================
   LeafBridge / Dutchie Plus Compatibility Styles

   These styles override and enhance the default LeafBridge-rendered elements
   to match the HighQ Cannabis theme design system. LeafBridge generates
   product grids, category pages, filters, search, and cart elements --
   this file ensures they inherit our brand styling.

   LeafBridge renders using various class patterns. We target broadly
   to catch the plugin's output regardless of minor version differences.
   ========================================================================== */

/* ==========================================================================
   Page Layout for Shop / Menu / Category Pages
   ========================================================================== */

.hq-leafbridge-page main,
.hq-leafbridge-page #main-content {
    padding-top: 0;
}

/* Shop page header */
.hq-leafbridge-page .hq-page-header {
    background: linear-gradient(135deg, var(--hq-dark) 0%, var(--hq-primary-dark) 100%);
    padding: var(--hq-spacing-2xl) 0;
    margin-bottom: var(--hq-spacing-xl);
}

/* ==========================================================================
   Product Grid Overrides

   LeafBridge generates product cards in a grid. We ensure they match
   our card design with proper spacing, shadows, and hover effects.
   ========================================================================== */

/* Target common LeafBridge product grid containers */
.hq-leafbridge-active [class*="product-grid"],
.hq-leafbridge-active [class*="product-list"],
.hq-leafbridge-active [class*="menu-grid"],
.hq-leafbridge-active [class*="products-container"],
.hq-leafbridge-active [class*="menu-products"],
.hq-leafbridge-active [class*="ProductGrid"],
.hq-leafbridge-active [class*="productGrid"] {
    display: grid !important;
    grid-template-columns: repeat(var(--hq-lb-product-columns, 4), 1fr);
    gap: var(--hq-spacing-xl);
    padding: 0;
}

@media (max-width: 1200px) {
    .hq-leafbridge-active [class*="product-grid"],
    .hq-leafbridge-active [class*="product-list"],
    .hq-leafbridge-active [class*="menu-grid"],
    .hq-leafbridge-active [class*="products-container"],
    .hq-leafbridge-active [class*="menu-products"],
    .hq-leafbridge-active [class*="ProductGrid"],
    .hq-leafbridge-active [class*="productGrid"] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .hq-leafbridge-active [class*="product-grid"],
    .hq-leafbridge-active [class*="product-list"],
    .hq-leafbridge-active [class*="menu-grid"],
    .hq-leafbridge-active [class*="products-container"],
    .hq-leafbridge-active [class*="menu-products"],
    .hq-leafbridge-active [class*="ProductGrid"],
    .hq-leafbridge-active [class*="productGrid"] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .hq-leafbridge-active [class*="product-grid"],
    .hq-leafbridge-active [class*="product-list"],
    .hq-leafbridge-active [class*="menu-grid"],
    .hq-leafbridge-active [class*="products-container"],
    .hq-leafbridge-active [class*="menu-products"],
    .hq-leafbridge-active [class*="ProductGrid"],
    .hq-leafbridge-active [class*="productGrid"] {
        grid-template-columns: 1fr;
    }
}

/* Product Cards */
.hq-leafbridge-active [class*="product-card"],
.hq-leafbridge-active [class*="ProductCard"],
.hq-leafbridge-active [class*="productCard"],
.hq-leafbridge-active [class*="menu-item"],
.hq-leafbridge-active [class*="MenuItem"] {
    background: var(--hq-white);
    border: 1px solid var(--hq-gray-200);
    border-radius: var(--hq-radius-lg);
    overflow: hidden;
    transition: all var(--hq-transition-base);
}

.hq-leafbridge-active [class*="product-card"]:hover,
.hq-leafbridge-active [class*="ProductCard"]:hover,
.hq-leafbridge-active [class*="productCard"]:hover,
.hq-leafbridge-active [class*="menu-item"]:hover,
.hq-leafbridge-active [class*="MenuItem"]:hover {
    box-shadow: var(--hq-shadow-lg);
    transform: translateY(-4px);
    border-color: var(--hq-gray-300);
}

/* Product Card Images */
.hq-leafbridge-active [class*="product-card"] img,
.hq-leafbridge-active [class*="ProductCard"] img,
.hq-leafbridge-active [class*="menu-item"] img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    transition: transform var(--hq-transition-slow);
}

.hq-leafbridge-active [class*="product-card"]:hover img,
.hq-leafbridge-active [class*="ProductCard"]:hover img,
.hq-leafbridge-active [class*="menu-item"]:hover img {
    transform: scale(1.05);
}

/* Product Card Names/Titles */
.hq-leafbridge-active [class*="product-card"] h2,
.hq-leafbridge-active [class*="product-card"] h3,
.hq-leafbridge-active [class*="product-card"] h4,
.hq-leafbridge-active [class*="product-name"],
.hq-leafbridge-active [class*="ProductName"],
.hq-leafbridge-active [class*="productName"] {
    font-family: var(--hq-font-heading);
    font-weight: 600;
    color: var(--hq-dark);
    font-size: var(--hq-text-base);
    line-height: 1.3;
}

/* Product Card Prices */
.hq-leafbridge-active [class*="product-price"],
.hq-leafbridge-active [class*="ProductPrice"],
.hq-leafbridge-active [class*="productPrice"],
.hq-leafbridge-active [class*="price"] {
    font-family: var(--hq-font-heading);
    font-weight: 700;
    color: var(--hq-primary);
    font-size: var(--hq-text-lg);
}

/* Strain Type Badges */
.hq-leafbridge-active [class*="strain-type"],
.hq-leafbridge-active [class*="StrainType"],
.hq-leafbridge-active [class*="strainType"],
.hq-leafbridge-active [class*="category-badge"],
.hq-leafbridge-active [class*="product-type"] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: var(--hq-radius-sm);
    font-size: var(--hq-text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* THC/CBD Info */
.hq-leafbridge-active [class*="thc"],
.hq-leafbridge-active [class*="potency"],
.hq-leafbridge-active [class*="Potency"] {
    font-size: var(--hq-text-xs);
    color: var(--hq-gray-600);
    font-weight: 600;
}

/* ==========================================================================
   Add-to-Cart / Order Buttons
   ========================================================================== */

.hq-leafbridge-active [class*="add-to-cart"],
.hq-leafbridge-active [class*="addToCart"],
.hq-leafbridge-active [class*="AddToCart"],
.hq-leafbridge-active [class*="order-btn"],
.hq-leafbridge-active [class*="add-btn"],
.hq-leafbridge-active button[class*="cart"],
.hq-leafbridge-active button[class*="Cart"] {
    background-color: var(--hq-primary);
    color: var(--hq-white);
    border: none;
    border-radius: var(--hq-radius-sm);
    font-family: var(--hq-font-heading);
    font-weight: 600;
    font-size: var(--hq-text-sm);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 10px 20px;
    cursor: pointer;
    transition: all var(--hq-transition-base);
}

.hq-leafbridge-active [class*="add-to-cart"]:hover,
.hq-leafbridge-active [class*="addToCart"]:hover,
.hq-leafbridge-active [class*="AddToCart"]:hover,
.hq-leafbridge-active [class*="order-btn"]:hover,
.hq-leafbridge-active button[class*="cart"]:hover,
.hq-leafbridge-active button[class*="Cart"]:hover {
    background-color: var(--hq-primary-light);
    transform: translateY(-1px);
    box-shadow: var(--hq-shadow-md);
}

/* ==========================================================================
   Filters & Sidebar
   ========================================================================== */

.hq-leafbridge-active [class*="filter"],
.hq-leafbridge-active [class*="Filter"] {
    font-family: var(--hq-font-body);
}

/* Filter headings */
.hq-leafbridge-active [class*="filter-header"],
.hq-leafbridge-active [class*="filter-title"],
.hq-leafbridge-active [class*="FilterTitle"],
.hq-leafbridge-active [class*="filterTitle"] {
    font-family: var(--hq-font-heading);
    font-weight: 700;
    font-size: var(--hq-text-sm);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--hq-dark);
    margin-bottom: var(--hq-spacing-md);
    padding-bottom: var(--hq-spacing-sm);
    border-bottom: 2px solid var(--hq-gray-200);
}

/* Filter checkboxes and radio buttons */
.hq-leafbridge-active [class*="filter"] input[type="checkbox"],
.hq-leafbridge-active [class*="filter"] input[type="radio"] {
    accent-color: var(--hq-primary);
}

/* Filter active state / selected pills */
.hq-leafbridge-active [class*="filter-active"],
.hq-leafbridge-active [class*="filter-selected"],
.hq-leafbridge-active [class*="active-filter"],
.hq-leafbridge-active [class*="FilterPill"][class*="active"],
.hq-leafbridge-active [class*="filterPill"][class*="active"] {
    background-color: var(--hq-primary) !important;
    color: var(--hq-white) !important;
    border-color: var(--hq-primary) !important;
}

/* Filter pills / tags */
.hq-leafbridge-active [class*="filter-pill"],
.hq-leafbridge-active [class*="FilterPill"],
.hq-leafbridge-active [class*="filterPill"],
.hq-leafbridge-active [class*="filter-tag"] {
    padding: 6px 16px;
    border: 2px solid var(--hq-gray-200);
    border-radius: var(--hq-radius-xl);
    font-family: var(--hq-font-heading);
    font-size: var(--hq-text-xs);
    font-weight: 600;
    cursor: pointer;
    transition: all var(--hq-transition-base);
}

.hq-leafbridge-active [class*="filter-pill"]:hover,
.hq-leafbridge-active [class*="FilterPill"]:hover,
.hq-leafbridge-active [class*="filterPill"]:hover,
.hq-leafbridge-active [class*="filter-tag"]:hover {
    border-color: var(--hq-primary);
    color: var(--hq-primary);
}

/* ==========================================================================
   Search Bar
   ========================================================================== */

.hq-leafbridge-active [class*="search-bar"],
.hq-leafbridge-active [class*="SearchBar"],
.hq-leafbridge-active [class*="searchBar"],
.hq-leafbridge-active [class*="menu-search"],
.hq-leafbridge-active [class*="product-search"] {
    font-family: var(--hq-font-body);
}

.hq-leafbridge-active [class*="search-bar"] input,
.hq-leafbridge-active [class*="SearchBar"] input,
.hq-leafbridge-active [class*="searchBar"] input,
.hq-leafbridge-active [class*="menu-search"] input,
.hq-leafbridge-active [class*="product-search"] input,
.hq-leafbridge-active input[type="search"] {
    width: 100%;
    padding: 12px 20px 12px 44px;
    border: 2px solid var(--hq-gray-200);
    border-radius: var(--hq-radius-xl);
    font-family: var(--hq-font-body);
    font-size: var(--hq-text-base);
    transition: border-color var(--hq-transition-fast);
    background-color: var(--hq-white);
}

.hq-leafbridge-active [class*="search"] input:focus,
.hq-leafbridge-active input[type="search"]:focus {
    outline: none;
    border-color: var(--hq-primary);
    box-shadow: 0 0 0 3px rgba(26, 92, 42, 0.1);
}

/* Search autocomplete dropdown */
.hq-leafbridge-active [class*="search-results"],
.hq-leafbridge-active [class*="SearchResults"],
.hq-leafbridge-active [class*="autocomplete"],
.hq-leafbridge-active [class*="Autocomplete"] {
    background: var(--hq-white);
    border: 1px solid var(--hq-gray-200);
    border-radius: var(--hq-radius-md);
    box-shadow: var(--hq-shadow-lg);
    overflow: hidden;
}

.hq-leafbridge-active [class*="search-result-item"],
.hq-leafbridge-active [class*="autocomplete-item"],
.hq-leafbridge-active [class*="SearchResultItem"] {
    padding: var(--hq-spacing-sm) var(--hq-spacing-md);
    transition: background-color var(--hq-transition-fast);
    cursor: pointer;
}

.hq-leafbridge-active [class*="search-result-item"]:hover,
.hq-leafbridge-active [class*="autocomplete-item"]:hover,
.hq-leafbridge-active [class*="SearchResultItem"]:hover {
    background-color: var(--hq-gray-100);
}

/* ==========================================================================
   Category Navigation (on shop/menu pages)
   ========================================================================== */

.hq-leafbridge-active [class*="category-nav"],
.hq-leafbridge-active [class*="CategoryNav"],
.hq-leafbridge-active [class*="categoryNav"],
.hq-leafbridge-active [class*="menu-categories"],
.hq-leafbridge-active [class*="category-tabs"] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--hq-spacing-sm);
    margin-bottom: var(--hq-spacing-xl);
    padding-bottom: var(--hq-spacing-md);
    border-bottom: 1px solid var(--hq-gray-200);
}

.hq-leafbridge-active [class*="category-nav"] a,
.hq-leafbridge-active [class*="CategoryNav"] a,
.hq-leafbridge-active [class*="menu-categories"] a,
.hq-leafbridge-active [class*="category-tabs"] a,
.hq-leafbridge-active [class*="category-tabs"] button {
    padding: 8px 20px;
    border: 2px solid var(--hq-gray-200);
    border-radius: var(--hq-radius-xl);
    font-family: var(--hq-font-heading);
    font-size: var(--hq-text-sm);
    font-weight: 600;
    color: var(--hq-gray-600);
    text-decoration: none;
    transition: all var(--hq-transition-base);
    background: transparent;
    cursor: pointer;
}

.hq-leafbridge-active [class*="category-nav"] a:hover,
.hq-leafbridge-active [class*="category-tabs"] a:hover,
.hq-leafbridge-active [class*="category-tabs"] button:hover {
    border-color: var(--hq-primary);
    color: var(--hq-primary);
}

.hq-leafbridge-active [class*="category-nav"] a[class*="active"],
.hq-leafbridge-active [class*="category-tabs"] a[class*="active"],
.hq-leafbridge-active [class*="category-tabs"] button[class*="active"],
.hq-leafbridge-active [class*="category-nav"] a[aria-current="page"] {
    background-color: var(--hq-primary);
    border-color: var(--hq-primary);
    color: var(--hq-white);
}

/* ==========================================================================
   Cart / Checkout Overrides
   ========================================================================== */

.hq-leafbridge-active [class*="cart-widget"],
.hq-leafbridge-active [class*="CartWidget"],
.hq-leafbridge-active [class*="cartWidget"] {
    font-family: var(--hq-font-body);
}

.hq-leafbridge-active [class*="cart-count"],
.hq-leafbridge-active [class*="CartCount"],
.hq-leafbridge-active [class*="cartCount"],
.hq-leafbridge-active [class*="cart-badge"] {
    background-color: var(--hq-secondary);
    color: var(--hq-dark);
    font-family: var(--hq-font-heading);
    font-weight: 700;
    font-size: var(--hq-text-xs);
    border-radius: var(--hq-radius-full);
    min-width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Checkout button */
.hq-leafbridge-active [class*="checkout-btn"],
.hq-leafbridge-active [class*="CheckoutBtn"],
.hq-leafbridge-active [class*="checkoutBtn"],
.hq-leafbridge-active [class*="checkout-button"],
.hq-leafbridge-active button[class*="checkout"] {
    background: linear-gradient(135deg, var(--hq-secondary), var(--hq-secondary-light)) !important;
    color: var(--hq-dark) !important;
    font-family: var(--hq-font-heading);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: var(--hq-radius-sm);
    padding: 14px 28px;
    border: none;
    cursor: pointer;
    transition: all var(--hq-transition-base);
}

.hq-leafbridge-active [class*="checkout-btn"]:hover,
.hq-leafbridge-active [class*="checkout-button"]:hover,
.hq-leafbridge-active button[class*="checkout"]:hover {
    transform: translateY(-2px);
    box-shadow: var(--hq-shadow-lg);
}

/* ==========================================================================
   Product Detail Page
   ========================================================================== */

.hq-product-page [class*="product-detail"],
.hq-product-page [class*="ProductDetail"],
.hq-product-page [class*="productDetail"],
.hq-product-page [class*="product-page"] {
    max-width: var(--hq-container-max);
    margin: 0 auto;
    padding: var(--hq-spacing-2xl) var(--hq-spacing-lg);
}

/* Product detail image gallery */
.hq-product-page [class*="product-image"],
.hq-product-page [class*="ProductImage"],
.hq-product-page [class*="product-gallery"] {
    border-radius: var(--hq-radius-lg);
    overflow: hidden;
}

/* Product detail info */
.hq-product-page [class*="product-info"] h1,
.hq-product-page [class*="ProductInfo"] h1,
.hq-product-page [class*="product-title"] {
    font-family: var(--hq-font-heading);
    font-weight: 800;
    color: var(--hq-dark);
    font-size: var(--hq-text-3xl);
}

/* Terpene and effect badges */
.hq-leafbridge-active [class*="terpene"],
.hq-leafbridge-active [class*="Terpene"],
.hq-leafbridge-active [class*="effect"],
.hq-leafbridge-active [class*="Effect"] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 12px;
    background: var(--hq-gray-100);
    border-radius: var(--hq-radius-xl);
    font-size: var(--hq-text-xs);
    font-weight: 500;
    color: var(--hq-gray-700);
}

/* ==========================================================================
   Specials / Deals Badges
   ========================================================================== */

.hq-leafbridge-active [class*="special-badge"],
.hq-leafbridge-active [class*="SpecialBadge"],
.hq-leafbridge-active [class*="sale-badge"],
.hq-leafbridge-active [class*="deal-badge"],
.hq-leafbridge-active [class*="promo-badge"] {
    background-color: var(--hq-accent-orange);
    color: var(--hq-white);
    padding: 3px 10px;
    border-radius: var(--hq-radius-sm);
    font-size: var(--hq-text-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    position: absolute;
    top: var(--hq-spacing-sm);
    left: var(--hq-spacing-sm);
    z-index: 2;
}

/* ==========================================================================
   Loading States
   ========================================================================== */

.hq-leafbridge-active [class*="loading"],
.hq-leafbridge-active [class*="skeleton"],
.hq-leafbridge-active [class*="Skeleton"] {
    background: linear-gradient(90deg, var(--hq-gray-100) 25%, var(--hq-gray-200) 50%, var(--hq-gray-100) 75%);
    background-size: 200% 100%;
    animation: hq-shimmer 1.5s infinite;
    border-radius: var(--hq-radius-md);
}

@keyframes hq-shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* ==========================================================================
   Pagination
   ========================================================================== */

.hq-leafbridge-active [class*="pagination"],
.hq-leafbridge-active [class*="Pagination"] {
    display: flex;
    justify-content: center;
    gap: var(--hq-spacing-sm);
    margin-top: var(--hq-spacing-2xl);
    padding-top: var(--hq-spacing-xl);
    border-top: 1px solid var(--hq-gray-200);
}

.hq-leafbridge-active [class*="pagination"] a,
.hq-leafbridge-active [class*="pagination"] button,
.hq-leafbridge-active [class*="pagination"] span {
    padding: 8px 14px;
    border: 2px solid var(--hq-gray-200);
    border-radius: var(--hq-radius-sm);
    font-family: var(--hq-font-heading);
    font-weight: 600;
    font-size: var(--hq-text-sm);
    transition: all var(--hq-transition-fast);
}

.hq-leafbridge-active [class*="pagination"] a:hover,
.hq-leafbridge-active [class*="pagination"] button:hover {
    border-color: var(--hq-primary);
    color: var(--hq-primary);
}

.hq-leafbridge-active [class*="pagination"] [class*="active"],
.hq-leafbridge-active [class*="pagination"] [class*="current"],
.hq-leafbridge-active [class*="pagination"] [aria-current="page"] {
    background-color: var(--hq-primary);
    border-color: var(--hq-primary);
    color: var(--hq-white);
}

/* ==========================================================================
   LeafBridge iFrame Fallback (if still using iFrame for some features)
   ========================================================================== */

.hq-leafbridge-active iframe[src*="dutchie"] {
    width: 100%;
    min-height: 80vh;
    border: none;
    border-radius: var(--hq-radius-lg);
}