/* Promodis - Frontend Styles */

/* ----- جدول الشرائح ----- */
.promodis-tiers-wrap {
    direction: rtl;
    max-width: 420px;
    margin: 0 auto;
    padding: 24px 0;
}
.promodis-tiers-wrap .promodis-tiers-header {
    text-align: center;
    margin-bottom: 28px;
}
.promodis-tiers-wrap .promodis-tiers-header h2 {
    font-size: 22px;
    font-weight: 800;
    color: #1a1a1a;
    margin-bottom: 6px;
}
.promodis-tiers-wrap .promodis-tiers-header p {
    font-size: 14px;
    color: #888;
    font-weight: 400;
}
.promodis-tiers-wrap .promodis-tiers-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.promodis-tiers-wrap .promodis-tier {
    display: flex;
    align-items: center;
    padding: 16px 20px;
    border-radius: 14px;
    border: 1.5px solid #ebebeb;
    background: #fafafa;
    transition: border-color 0.2s, background 0.2s;
    position: relative;
    overflow: hidden;
}
.promodis-tiers-wrap .promodis-tier:hover {
    border-color: #c5e0c8;
    background: #f4faf5;
}
.promodis-tiers-wrap .promodis-tier.is-best {
    border-color: #3aaa5c;
    background: #f0faf3;
    padding-top: 36px;
}
.promodis-tiers-wrap .promodis-best-badge {
    position: absolute;
    top: 10px;
    left: 16px;
    font-size: 11px;
    font-weight: 700;
    color: #3aaa5c;
    background: #d6f5e0;
    padding: 3px 10px;
    border-radius: 20px;
}
.promodis-tiers-wrap .promodis-tier-discount {
    width: auto;
    min-width: 74px;
    justify-content: center;
    text-align: center;
    font-size: 18px;
    font-weight: 800;
    flex-shrink: 0;
}
.promodis-tiers-wrap .promodis-divider {
    width: 1px;
    height: 36px;
    background: #e0e0e0;
    margin: 0 16px;
    flex-shrink: 0;
}
.promodis-tiers-wrap .promodis-tier.is-best .promodis-divider { background: #b2dfc0; }
.promodis-tiers-wrap .promodis-tier-amount {
    flex: 1;
    font-size: 17px;
    font-weight: 700;
    color: #1a1a1a;
    text-align: right;
}
.promodis-tiers-wrap .promodis-note {
    margin-top: 20px;
    background: #f4faf5;
    border-radius: 12px;
    padding: 13px 16px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.promodis-tiers-wrap .promodis-note-icon {
    width: 22px;
    height: 22px;
    background: #3aaa5c;
    border-radius: 50%;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 12px;
}
.promodis-tiers-wrap .promodis-note p {
    font-size: 13px;
    color: #555;
    font-weight: 500;
    margin: 0;
}

/* ----- رسالة التحفيز ----- */
.promodis-upsell-container {
    margin: 15px 0;
    padding: 15px;
    background: #ffffff;
    border: 2px solid;
    border-radius: 10px;
    text-align: center;
    direction: rtl;
}
.promodis-upsell-container p {
    margin: 5px 0;
    font-size: 16px;
}

/* ----- ملصق الخصم على صفحة المنتج/المتجر -----
   نُبقي على كلاس onsale الأصلي حتى يحافظ الملصق على موضعه من القالب، لكن
   كثيرًا من القوالب تفرض شكلًا دائريًا بحجم ثابت على onsale (يقصّ نصًا مثل
   "-20%")، لذلك نلغي هذه القيود بقوة ونفرض شكل الشارة الموحّد في الإضافة. */
.promodis-onsale-badge {
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    border-radius: 20px !important;
    padding: 4px 10px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
    text-transform: none !important;
}
.promodis-onsale-badge * {
    color: inherit !important;
}

/* ----- شارة قيمة الخصم (Badge بخلفية مصمتة، بأسلوب المتاجر العالمية) -----
   ملاحظة مهمة: wc_price() تُخرج وسوم داخلية بكلاسات خاصة بووكومرس
   (.woocommerce-Price-amount, .woocommerce-Price-currencySymbol, <bdi>)
   وبعض القوالب (Themes) تفرض لها لونًا خاصًا بقاعدة مباشرة. لضمان أن كل
   شيء داخل الشارة يأخذ نفس اللون بلا استثناء (الرقم، رمز العملة، الإشارة)
   نجبر كل العناصر الفرعية على "وراثة" لون الشارة نفسه بدل أي لون آخر. */
.promodis-discount-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 20px;
    font-weight: 700;
    font-size: 13px;
    line-height: 1.6;
}
.promodis-discount-badge * {
    color: inherit !important;
}
.promodis-discount-badge .promodis-discount-badge-icon {
    font-size: 12px;
}

/* ----- تمييز الأرقام داخل الرسائل (رسالة التحفيز وغيرها) بلون الخصم -----
   نفس منطق الشارة أعلاه: نجبر كل العناصر الفرعية (رمز العملة، %، bdi)
   على وراثة لون التمييز نفسه بدل أي لون افتراضي من القالب. */
.promodis-highlight * {
    color: inherit !important;
}

/* ----- السلة المصغرة ----- */
.promodis-mini-cart-discounts {
    border-top: 1px solid #e5e5e5;
    margin-top: 8px;
    padding-top: 8px;
    direction: rtl;
}
.promodis-mini-cart-discount-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 0;
    font-size: 14px;
}
.promodis-mini-cart-discount-row .promodis-label {
    display: flex;
    align-items: center;
    gap: 4px;
    font-weight: 600;
}
.promodis-mini-cart-discount-row .promodis-discount-badge {
    font-size: 12px;
}

/* ----- حقل كود الخصم الخاص ----- */
.promodis-coupon-field-wrap {
    direction: rtl;
    margin: 15px 0;
}
.promodis-coupon-input {
    display: flex;
    gap: 8px;
}
.promodis-coupon-input .promodis-code-input {
    flex: 1;
    padding: 10px 12px;
    border: 1.5px solid #e0e0e0;
    border-radius: 8px;
    font-size: 14px;
}
.promodis-coupon-input .promodis-apply-code {
    padding: 10px 18px;
    background: #2e7d32;
    color: #fff;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 700;
}
.promodis-coupon-input .promodis-apply-code:hover { background: #276b2b; }
.promodis-coupon-message {
    margin-top: 8px;
    font-size: 13px;
}
.promodis-coupon-message.success { color: #2e7d32; }
.promodis-coupon-message.error { color: #c0392b; }

.promodis-coupon-applied {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f0faf3;
    border: 1.5px solid #cdeed4;
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 14px;
}
.promodis-coupon-applied .promodis-remove-code {
    background: transparent;
    border: none;
    color: #c0392b;
    cursor: pointer;
    font-weight: 700;
    text-decoration: underline;
}

/* ----- التوافق مع الجوال ----- */
@media (max-width: 600px) {
    .promodis-tiers-wrap .promodis-tier {
        flex-wrap: wrap;
        padding: 14px 16px;
    }
    .promodis-tiers-wrap .promodis-tier-discount {
        width: 60px;
        font-size: 22px;
    }
    .promodis-tiers-wrap .promodis-divider {
        margin: 0 10px;
        height: 28px;
    }
    .promodis-tiers-wrap .promodis-tier-amount {
        font-size: 15px;
    }
    .promodis-upsell-container {
        padding: 12px;
    }
}