/**
 * Passover Promotion – Minicart bar section (matches MINI_CART.html design)
 * All rules scoped under .passover-promo-minicart-wrap for specificity.
 */

.passover-promo-minicart-wrap {
    margin: 0;
    padding: 0;
    min-width: 280px; /* keep promo text on one line */
}

.passover-promo-minicart-wrap:empty {
    display: none;
}

/* Section: emerald background + dotted overlay */
.passover-promo-minicart-wrap .passover-promo-bar {
    position: relative;
    overflow: hidden;
    min-width: 260px; /* room for main text on one line */
    background: rgba(236, 253, 245, 0.5); /* emerald-50/50 */
    padding: 6px 32px 16px;
    border-bottom: 1px solid rgba(167, 243, 208, 0.6); /* border-emerald-100 */
}

@media (max-width: 640px) {
    .passover-promo-minicart-wrap .passover-promo-bar {
        padding: 6px 0px 16px;
    }
}

.passover-promo-minicart-wrap .passover-promo-bar__bg {
    position: absolute;
    inset: 0;
    opacity: 0.1;
    pointer-events: none;
    background-image: radial-gradient(#10b981 0.5px, transparent 0.5px);
    background-size: 10px 10px;
}

.passover-promo-minicart-wrap .passover-promo-bar__inner {
    position: relative;
    z-index: 10;
}

/* Main text line */
.passover-promo-minicart-wrap .passover-promo-bar__text-wrap {
    margin-bottom: 4px;
}

.passover-promo-minicart-wrap .passover-promo-bar__text {
    margin: 0;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.25;
    color: #064e3b; /* emerald-900 */
    white-space: nowrap !important; /* force single line: "עוד ₪X לשובר של ₪Y לקנייה הבאה 🎁" */
}

.passover-promo-minicart-wrap .passover-promo-bar__amount {
    color: #059669; /* emerald-600 */
    font-weight: 800;
}

.passover-promo-minicart-wrap .passover-promo-bar__text-won {
    color: #047857; /* emerald-700 */
    font-weight: 700;
}

/* Progress track (LTR) – revert to original Tailwind layout */
.passover-promo-minicart-wrap .passover-promo-bar__track {
    position: relative;
    height: 48px;
    display: flex;
    align-items: center;
    direction: ltr;
}

.passover-promo-minicart-wrap .passover-promo-bar__track-line {
    position: absolute;
    top: 30%;
    left: 0;
    width: 100%;
    height: 2px;
    background: #e5e7eb; /* gray-200 */
    border-radius: 9999px;
    transform: translateY(-50%);
}

.passover-promo-minicart-wrap .passover-promo-bar__track-fill {
    position: absolute;
    top: 30%;
    left: 0;
    height: 2px;
    max-width: 100%; /* never overflow track on any screen */
    background: #10b981; /* emerald-500 */
    border-radius: 9999px;
    transform: translateY(-50%);
    transition: width 0.7s ease;
    box-shadow: 0 0 8px rgba(16, 185, 129, 0.3);
}

/* Start dot */
.passover-promo-minicart-wrap .passover-promo-bar__track-start {
    position: absolute;
    top: 30%;
    left: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #d1d5db; /* gray-300 */
    transform: translate(-50%, -50%);
}

/* Milestones */
.passover-promo-minicart-wrap .passover-promo-bar__milestones {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.passover-promo-minicart-wrap .passover-promo-bar__milestone {
    position: absolute;
    top: 0;
    height: 100%;
    width: 0;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding-top: 0;
}

.passover-promo-minicart-wrap .passover-promo-bar__milestone-circle {
    width: 24px;
    height: 24px;
    min-width: 24px;
    min-height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #d1d5db; /* gray-300 */
    background: #fff;
    padding: 0;
    margin-bottom: 4px;
    z-index: 20;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.passover-promo-minicart-wrap .passover-promo-bar__milestone.is-achieved .passover-promo-bar__milestone-circle {
    background: #10b981; /* emerald-500 */
    border-color: #10b981;
    transform: scale(1.05);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.passover-promo-minicart-wrap .passover-promo-bar__milestone-circle svg {
    display: block;
    width: 13px;
    height: 13px;
    margin: 0 auto;
    flex-shrink: 0;
    vertical-align: middle;
}

.passover-promo-minicart-wrap .passover-promo-bar__milestone.is-achieved .passover-promo-bar__milestone-circle svg {
    color: white;
}

.passover-promo-minicart-wrap .passover-promo-bar__milestone-labels {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    line-height: 1.2;
    visibility: visible;
}

.passover-promo-minicart-wrap .passover-promo-bar__milestone-threshold {
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
    color: #6b7280; /* gray-500 */
}

.passover-promo-minicart-wrap .passover-promo-bar__milestone.is-achieved .passover-promo-bar__milestone-threshold {
    color: #047857; /* emerald-700 */
}

.passover-promo-minicart-wrap .passover-promo-bar__milestone-badge {
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 8.5px;
    font-weight: 500;
    line-height: 1.25;
    white-space: nowrap;
    border: 1px solid #e5e7eb; /* gray-200 */
    background: #fff;
    color: #4b5563; /* gray-600 */
    transition: all 0.3s ease;
}

.passover-promo-minicart-wrap .passover-promo-bar__milestone.is-achieved .passover-promo-bar__milestone-badge {
    background: #d1fae5; /* emerald-100 */
    color: #065f46; /* emerald-800 */
    border-color: #6ee7b7; /* emerald-300 */
}