/* ── Geo Price Public Styles ── */

/* ── Checkout Conversion Notice (Type A gateways) ─────────────────────────── */
.gp-checkout-notice {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    background: var(--gp-notice-bg, #f0f6fc);
    border: 1px solid var(--gp-notice-border, #2271b1);
    border-inline-start: 4px solid var(--gp-notice-border, #2271b1);
    border-radius: 6px;
    padding: 12px 16px;
    margin-bottom: 24px;
    color: var(--gp-notice-text, #1d2327);
    /* inherit the website font — never impose a plugin or browser default */
    font-family: inherit;
}

.gp-checkout-notice .gp-notice-icon {
    flex-shrink: 0;
    color: var(--gp-notice-border, #2271b1);
    margin-top: 2px;
}

.gp-checkout-notice .gp-notice-icon svg {
    display: block;
}

.gp-checkout-notice .gp-notice-text {
    flex: 1;
}

.gp-checkout-notice strong {
    color: var(--gp-notice-border, #2271b1);
}

/* ── SVG currency symbol — color inheritance fixes ─────────────────────────── */
/*
 * Elementor cart/checkout widgets apply color directly on td/bdi elements.
 * The SVG we inject sits inside:
 *   <span class="woocommerce-Price-currencySymbol">
 *     <span style="...inline-flex...">   ← our wrapper
 *       <svg fill="currentColor">        ← our SVG
 *
 * For fill:currentColor to resolve correctly, `color` must be defined on the SVG
 * element or a direct ancestor. These rules force color:inherit down the chain
 * from the Elementor-styled td → bdi → our span → SVG.
 */

/* Elementor Cart widget */
.elementor-widget-woocommerce-cart .woocommerce table.cart td span,
.elementor-widget-woocommerce-cart .woocommerce table.cart td bdi {
    color: inherit;
}

/* Elementor Checkout order-review table */
.elementor-widget-woocommerce-checkout-page .woocommerce-checkout-review-order-table .cart_item td,
.elementor-widget-woocommerce-checkout-page .woocommerce-checkout-review-order-table .cart_item td span,
.elementor-widget-woocommerce-checkout-page .woocommerce-checkout-review-order-table .cart_item td bdi {
    color: inherit;
}

/* Ensure bdi (bidirectional) elements containing SVG flex properly —
 * only apply inline-flex when an SVG symbol is actually present,
 * so <del> strikethrough is not broken on regular text prices. */
.woocommerce-Price-amount > bdi:has(svg) {
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

/* Our SVG wrapper + SVG itself — cascade color from the WC price span */
.woocommerce-Price-currencySymbol > span[style],
.woocommerce-Price-currencySymbol > span[style] svg {
    color: inherit;
    fill: currentColor;
    stroke: currentColor;
}

/* Ensure SVG wrapper has proper vertical centering with flexbox */
.woocommerce-Price-currencySymbol > span[style*="inline-flex"] {
    align-items: center;
    justify-content: center;
    display: inline-flex;
    vertical-align: middle;
    line-height: 1;
}

/* SVG inside wrapper should have display:block to avoid baseline issues */
.woocommerce-Price-currencySymbol > span[style*="inline-flex"] svg {
    display: block;
    vertical-align: middle;
}

/* Broader fallback — any inline-flex span inside a WC price amount span */
.woocommerce-Price-amount > bdi > span[style*="inline-flex"],
.woocommerce-Price-amount > bdi > span[style*="inline-flex"] svg {
    color: inherit;
    fill: currentColor;
}

/* Ensure price amount container aligns flexbox items properly */
.woocommerce-Price-amount > bdi > span[style*="inline-flex"] {
    align-items: center;
    justify-content: center;
    display: inline-flex;
}

/* ── Universal SVG centering for all price displays ────────────────────────── */
/* This ensures the margin-bottom fix applies everywhere: WooCommerce, WooLentor, Elementor, etc. */

/* Any SVG inside span[style*="inline-flex"] gets proper centering */
span[style*="inline-flex"] svg {
    margin-bottom: 0.25em !important;
    display: block !important;
}

/* SVG currency symbols in any price element */
.price svg,
.woocommerce-Price-amount svg,
.product-price svg,
.product_price svg,
.tutor-course-price svg {
    margin-bottom: 0.25em !important;
    vertical-align: middle;
}

/* WooLentor specific - any SVG in their price wrappers */
.wl-single-product-price svg,
.wl-product-price svg,
.product-summary .price svg {
    margin-bottom: 0.25em !important;
}

/* Catch all: any SVG that appears next to text in a price context */
.woocommerce .product-summary .price svg,
.woocommerce .product .price svg,
.woocommerce div.product .price svg,
.woocommerce-Price-currencySymbol svg {
    margin-bottom: 0.25em !important;
}

/* Prevent price flash while JS replaces foreign-cached prices */
.gp-prices-loading .price,
.gp-prices-loading .tutor-course-price,
.gp-prices-loading .list-item-price .price,
.gp-prices-loading .tutor-course-sidebar-card-pricing .price {
    visibility: hidden;
}

/* "تبدأ من" variable product price label */
.gp-price-from {
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    direction: rtl;
    font-size: 14px;
}
.gp-price-from .woocommerce-Price-amount {
    font-size: 1.4em;
}
.gp-price-from-label {
    font-size: 14px;
}

/* ── GeoPrice Elementor Widget ─────────────────────────────────────────────── */
.gp-widget-price-wrap { direction: rtl; }

.gp-price-from.gp-inline {
    display: inline-flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px;
}

.gp-price-from.gp-above {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.gp-price-from-label {
    font-size: 14px;
    opacity: .75;
}

/* Variation separate buttons */
.gp-widget-variation-separate-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    direction: rtl;
}

.gp-widget-variation-btn {
    padding: 6px 14px;
    border: 1px solid #ddd;
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
    font-size: 13px;
    font-family: inherit;
    transition: all .15s;
    color: inherit;
}
.gp-widget-variation-btn:hover { border-color: #999; background: #f5f5f5; }
.gp-widget-variation-btn.gp-active { background: #1a1a2e; border-color: #1a1a2e; color: #fff; }

/* Dropdown selector */
.gp-widget-variation-select {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-family: inherit;
    font-size: 14px;
    direction: rtl;
    background: #fff;
    color: inherit;
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23999' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: left 10px center;
    padding-left: 28px;
}
.gp-widget-variation-select:focus { outline: none; border-color: #93b0c1; }