/* 
═══════════════════════════════════════════════════════════════
WOOCOMMERCE PRODUCT PAGE CSS
Consolidated from multiple Code Snippets:
- "Product Page CSS"
- "Dropdown Z-Index Fixes" (CSS only)
- "PDF Manual Link" styles
Applied to: Single product pages only
═══════════════════════════════════════════════════════════════
*/

/* ═══════════════════════════════════════════════════════════════
   PRODUCT GALLERY STYLING
   ═══════════════════════════════════════════════════════════════ */

/* Border around main image */
.kadence-product-gallery-main .woocommerce-main-image img,
.kadence-product-gallery-thumbnails img {
    border: 1px solid #e5e5e5 !important;
}

/* Border around related products */
.related.products ul.products li.product, 
.upsells.products ul.products li.product {
    border: 1px solid #e5e5e5 !important;
    padding: 10px;
    border-radius: 5px;
    background-color: #ffffff;
}

/* ═══════════════════════════════════════════════════════════════
   COIN BATTERY WARNING STYLING
   ═══════════════════════════════════════════════════════════════ */

.coin_battery_warning {
    display: flex;
    align-items: center;
    background: #ffeb3b;
    padding: 10px;
    border-radius: 5px;
    font-weight: bold;
    margin-top: 10px;
}

.battery_warning_link {
    display: flex;
    align-items: center;
    color: #d32f2f;
    text-decoration: none;
}

.battery_warning_icon {
    width: 40px;
    height: 40px;
    margin-right: 10px;
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCT RIBBON STYLES
   ═══════════════════════════════════════════════════════════════ */

.product-ribbon {
    background: #f26722;
    color: white;
    padding: 8px 15px;
    font-weight: bold;
    position: absolute;
    top: 10px;
    left: 10px;
    border-radius: 5px;
    z-index: 5 !important;
    text-transform: uppercase;
    border: 2px solid #fff;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    font-size: 0.9em;
    line-height: 1.2;
}

/* Ensure proper positioning contexts */
.woocommerce-product-gallery,
.woocommerce ul.products li.product {
    position: relative !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .product-ribbon {
        padding: 6px 12px;
        font-size: 0.8em;
    }
}

/* ═══════════════════════════════════════════════════════════════
   DROPDOWN Z-INDEX FIXES
   ═══════════════════════════════════════════════════════════════ */

/* Comprehensive dropdown z-index fixes */
.select2-container,
.select2-dropdown,
.select2-search,
.select2-results,
.woocommerce-ordering select,
.woocommerce select,
.woocommerce-page select,
.variations select,
.variations .select2-container,
.variations_form .variations td.value,
.variations_form .variations td.value div,
.woocommerce div.product form.cart .variations select,
.woocommerce-ordering,
div.dropdown-menu,
.dropdown-content,
.select-items,
.variations_form .value .select-wrapper,
.variations_form select,
.custom-select,
.woocommerce .form-row select,
select.form-control,
.value select {
    z-index: 999999 !important;
    position: relative !important;
}

/* Force dropdown menus to be visible */
.select2-container--open .select2-dropdown,
.select2-container--open,
.select2-results__options,
.value .select2-container--open {
    z-index: 9999999 !important;
}

/* Fix positioning for variations container */
.variations_form .variations,
.variations_form .variations tr,
.variations_form .variations td.value {
    position: relative !important;
    overflow: visible !important;
}

/* Ensure the Select2 container remains visible */
body .select2-container--open {
    z-index: 9999999 !important;
}

/* Override theme styles for dropdowns */
.woocommerce div.product form.cart .variations select {
    min-width: 50% !important;
    position: relative !important;
    z-index: 10000 !important;
}

/* ═══════════════════════════════════════════════════════════════
   PDF MANUAL LINK STYLING
   ═══════════════════════════════════════════════════════════════ */

.pdf-manual-link {
    margin-top: 10px !important;
    display: flex;
    align-items: center;
    font-size: 14px;
    font-weight: bold;
}

.pdf-manual-link a {
    text-decoration: none;
    color: #d32f2f;
    display: flex;
    align-items: center;
    transition: color 0.2s ease-in-out;
}

.pdf-icon {
    display: inline-block;
    margin-right: 8px;
    width: 20px;
    height: 20px;
}

.pdf-manual-link a:hover {
    color: #b71c1c;
    text-decoration: underline;
}