/*
 * TTS Call For Price Replacer – Frontend Styles
 * Version: 1.0.0
 *
 * Layout philosophy:
 *  - The badge is inline-flex so it sits naturally in any container.
 *  - CSS custom properties make theming trivial from the admin custom-CSS box.
 *  - RTL is handled via logical properties and a [dir="rtl"] override block.
 */

/* ── Custom properties ─────────────────────────────────────────────────────── */
:root {
    --cfpr-color-primary:  #1a5276;
    --cfpr-color-accent:   #2980b9;
    --cfpr-color-hover:    #1a3d5c;
    --cfpr-color-text:     #ffffff;
    --cfpr-color-bg:       #1a5276;
    --cfpr-color-bg-hover: #154360;
    --cfpr-color-border:   rgba(41, 128, 185, 0.4);
    --cfpr-radius:         6px;
    --cfpr-font-size:      0.88rem;
    --cfpr-font-size-btn:  0.95rem;
    --cfpr-font-size-single: 1.05rem;
    --cfpr-gap:            0.4em;
    --cfpr-px:             0.85em;
    --cfpr-py:             0.45em;
    --cfpr-transition:     180ms ease;
    --cfpr-shadow:         0 2px 8px rgba(26, 82, 118, 0.25);
    --cfpr-shadow-hover:   0 4px 14px rgba(26, 82, 118, 0.38);
}

/* ── Base reset for the price area ─────────────────────────────────────────── */

/*
 * HIDE leftover price fragments that can be injected by themes
 * outside of WooCommerce's own templates. These selectors are broad
 * but scoped to common WooCommerce / theme wrappers.
 */
.woocommerce .price > del,
.woocommerce .price > ins,
.woocommerce .price > .woocommerce-Price-amount:not(.tts-cfpr-price-wrap *),
.woocommerce-loop-product__link .price del,
.woocommerce-loop-product__link .price ins,
.product_list_widget .woocommerce-Price-amount,
.widget_shopping_cart .woocommerce-Price-amount,

/* Specific to many Persian/RTL WooCommerce themes */
.woocommerce .price .amount:not(.tts-cfpr-price-wrap *),
.product .price .amount:not(.tts-cfpr-price-wrap *),
.woocommerce span.price del,
.woocommerce span.price ins,
span.price del,
span.price ins,
p.price del,
p.price ins,
.price del,
.price ins,
.price .woocommerce-Price-currencySymbol,
.woocommerce-Price-currencySymbol:not(.tts-cfpr-price-wrap *),

/* Sale badge / discount labels */
.woocommerce span.onsale,
.woocommerce .badge-sale,
.onsale,
.discount-percent,
.discount-badge,
.sale-percent,
.product-badge.sale,
.woo-discount-percent,

/* Theme-specific price wrappers (common patterns in Persian themes) */
.price-box .regular-price:not(.tts-cfpr-price-wrap *),
.price-box .special-price:not(.tts-cfpr-price-wrap *),
.price-box .old-price:not(.tts-cfpr-price-wrap *),
.product-price .old-price,
.product-price .regular-price,
.product-price .sale-price,
.toman:not(.tts-cfpr-price-wrap *),
.price-toman:not(.tts-cfpr-price-wrap *),
.currency:not(.tts-cfpr-price-wrap *) {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* Ensure the price span itself has no stray top/bottom margin when only badge is inside */
.tts-cfpr-price-wrap {
    display: inline-block;
    margin: 0;
    padding: 0;
    background: none !important;
    font-size: 1rem !important;
    color: inherit !important;
    border: none !important;
}

/* Hide screen-reader original price text that some themes print */
.tts-cfpr-price-wrap .screen-reader-text {
    display: none !important;
}

/* ── Badge – base ───────────────────────────────────────────────────────────── */
.tts-cfpr-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--cfpr-gap);
    padding: var(--cfpr-py) var(--cfpr-px);
    font-size: var(--cfpr-font-size);
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
    text-decoration: none !important;
    color: var(--cfpr-color-text) !important;
    background: var(--cfpr-color-bg);
    border: 1px solid var(--cfpr-color-border);
    border-radius: var(--cfpr-radius);
    box-shadow: var(--cfpr-shadow);
    transition:
        background var(--cfpr-transition),
        box-shadow  var(--cfpr-transition),
        transform   var(--cfpr-transition);
    cursor: pointer;
    user-select: none;
    letter-spacing: 0.01em;
    /* Prevent layout disturbance */
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    box-sizing: border-box;
    /* Fixes vertical misalignment in flex parents */
    vertical-align: middle;
    position: relative;
}

.tts-cfpr-badge:hover,
.tts-cfpr-badge:focus-visible {
    background: var(--cfpr-color-bg-hover) !important;
    color: var(--cfpr-color-text) !important;
    box-shadow: var(--cfpr-shadow-hover);
    transform: translateY(-1px);
    text-decoration: none !important;
}

.tts-cfpr-badge:active {
    transform: translateY(0);
    box-shadow: var(--cfpr-shadow);
}

.tts-cfpr-badge:focus-visible {
    outline: 3px solid rgba(41, 128, 185, 0.6);
    outline-offset: 2px;
}

/* ── Badge SVG phone icon ────────────────────────────────────────────────────── */
.tts-cfpr-icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
    vertical-align: middle;
    stroke: currentColor;
}

/* ── Badge – button context (archive / loop cards) ──────────────────────────── */
.tts-cfpr-badge--button {
    font-size: var(--cfpr-font-size-btn);
    padding: 0.5em 1.1em;
    width: 100%;
    justify-content: center;
    border-radius: var(--cfpr-radius);
}

/* ── Badge – single product page ────────────────────────────────────────────── */
.tts-cfpr-single-cta {
    margin: 1.5rem 0;
}

.tts-cfpr-badge--single {
    font-size: var(--cfpr-font-size-single);
    padding: 0.7em 1.6em;
    border-radius: 8px;
    gap: 0.55em;
    letter-spacing: 0.02em;
}

.tts-cfpr-badge--single .tts-cfpr-icon {
    width: 1.2em;
    height: 1.2em;
}

/* ── Replace add-to-cart button containers ───────────────────────────────────── */

/* Hide all native WC add-to-cart elements in product cards */
.woocommerce ul.products li.product .add_to_cart_button,
.woocommerce ul.products li.product .product_type_simple,
.woocommerce ul.products li.product .product_type_variable,
.woocommerce ul.products li.product .product_type_external,
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce-loop-add-to-cart-link.button,
form.cart,
.single_add_to_cart_button,
.woocommerce #respond input#submit,
.woocommerce a.button.add_to_cart_button,
.added_to_cart.wc-forward,
.wc-variation-selection-needed {
    /* These are handled by PHP hooks; CSS is a safety net */
    display: none !important;
}

/* Quantity selector on single pages */
.woocommerce .quantity,
.woocommerce form.cart .quantity {
    display: none !important;
}

/* ── Responsiveness ──────────────────────────────────────────────────────────── */
@media (max-width: 600px) {
    /* Halve the button size on mobile: font, padding, gap, icon, radius */
    .tts-cfpr-badge--button {
        font-size: calc(var(--cfpr-font-size-btn) / 2);   /* 0.95rem → ~0.475rem */
        padding: calc(0.5em / 2) calc(1.1em / 2);          /* 0.25em 0.55em */
        gap: calc(var(--cfpr-gap) / 2);                    /* 0.2em */
        border-radius: calc(var(--cfpr-radius) / 2);       /* 3px */
        width: 100%;
        justify-content: center;
    }

    .tts-cfpr-badge--inline {
        font-size: calc(var(--cfpr-font-size) / 2);        /* 0.88rem → ~0.44rem */
        padding: calc(var(--cfpr-py) / 2) calc(var(--cfpr-px) / 2);
        gap: calc(var(--cfpr-gap) / 2);
        border-radius: calc(var(--cfpr-radius) / 2);
    }

    .tts-cfpr-badge--single {
        font-size: calc(var(--cfpr-font-size-single) / 2); /* 1.05rem → ~0.525rem */
        padding: calc(0.7em / 2) calc(1.6em / 2);          /* 0.35em 0.8em */
        gap: calc(0.55em / 2);                             /* 0.275em */
        border-radius: 4px;
        width: 100%;
        justify-content: center;
    }

    .tts-cfpr-badge--single .tts-cfpr-icon {
        width: calc(1.2em / 2);   /* 0.6em */
        height: calc(1.2em / 2);
    }
}

/* ── RTL / Persian sites ─────────────────────────────────────────────────────── */
[dir="rtl"] .tts-cfpr-badge,
.rtl .tts-cfpr-badge {
    direction: rtl;
    text-align: right;
}

[dir="rtl"] .tts-cfpr-icon,
.rtl .tts-cfpr-icon {
    transform: scaleX(-1); /* Flip phone icon for RTL */
}

/* Ensure Persian text currency units are hidden */
.woocommerce .price .تومان,
*[class*="toman"],
*[class*="rial"] {
    display: none !important;
}
