/* ============================================================
   LymaLeaf Recommended Courses — Frontend Styles v1.1
   All rules use high specificity (.llrc-wrapper .llrc-xxx)
   and !important on layout-critical properties to override
   Elementor / Woodmart resets without touching global styles.
   ============================================================ */

/* ── Wrapper ──────────────────────────────────────────────── */
.llrc-wrapper {
    margin: 16px 0 20px 0 !important;
    padding: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    font-family: inherit !important;
}

/* ── Section heading ─────────────────────────────────────── */
.llrc-wrapper .llrc-section-title {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #333 !important;
    margin: 0 0 10px 0 !important;
    padding: 0 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    border: none !important;
    background: none !important;
    line-height: 1.4 !important;
}

/* ── Card grid — 3 per row, wraps to next row ────────────── */
.llrc-wrapper .llrc-cards-grid {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    align-items: stretch !important;
    width: 100% !important;
    box-sizing: border-box !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 4px 0 !important;
}

/* ── Individual card — exactly 3 per row ────────────────── */
/* Width formula: (100% - 2 gaps of 10px) / 3 = 33.333% - ~6.7px */
.llrc-wrapper .llrc-card {
    position: relative !important;
    flex: 0 0 calc(33.333% - 7px) !important;
    min-width: calc(33.333% - 7px) !important;
    max-width: calc(33.333% - 7px) !important;
    background: #f9f9f4 !important;
    border: 1.5px solid #ddddd0 !important;
    border-radius: 8px !important;
    padding: 12px 10px 14px !important;
    cursor: pointer !important;
    text-align: center !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease !important;
    box-shadow: 0 1px 6px rgba(0,0,0,0.06) !important;
    -webkit-tap-highlight-color: transparent !important;
    user-select: none !important;
    outline: none !important;
    float: none !important;
    display: block !important;
}

.llrc-wrapper .llrc-card:hover {
    border-color: #4a7c59 !important;
    box-shadow: 0 4px 16px rgba(74,124,89,0.18) !important;
    transform: translateY(-2px) !important;
}

.llrc-wrapper .llrc-card:focus-visible {
    box-shadow: 0 0 0 3px rgba(74,124,89,0.25) !important;
}

/* ── Selected card ───────────────────────────────────────── */
.llrc-wrapper .llrc-card.llrc-card--selected {
    border-color: #4a7c59 !important;
    border-width: 2px !important;
    background: #edf7f1 !important;
    box-shadow: 0 4px 16px rgba(74,124,89,0.18) !important;
}

/* Checkmark badge on selected card */
.llrc-wrapper .llrc-card.llrc-card--selected::before {
    content: '✓' !important;
    position: absolute !important;
    top: -9px !important;
    right: -9px !important;
    width: 20px !important;
    height: 20px !important;
    background: #4a7c59 !important;
    color: #fff !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.18) !important;
    line-height: 20px !important;
}

/* ── Duration label chip ─────────────────────────────────── */
.llrc-wrapper .llrc-card .llrc-card__label {
    display: inline-block !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.07em !important;
    color: #555 !important;
    background: #e8e8de !important;
    border-radius: 4px !important;
    padding: 2px 8px !important;
    margin-bottom: 8px !important;
    line-height: 1.6 !important;
}

.llrc-wrapper .llrc-card.llrc-card--selected .llrc-card__label {
    background: #4a7c59 !important;
    color: #fff !important;
}

/* ── Capsule / qty info ──────────────────────────────────── */
.llrc-wrapper .llrc-card .llrc-card__qty-info {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #111 !important;
    margin-bottom: 8px !important;
    line-height: 1.2 !important;
    display: block !important;
}

/* ── Prices block ────────────────────────────────────────── */
.llrc-wrapper .llrc-card .llrc-card__prices {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 2px !important;
    margin-bottom: 5px !important;
}

.llrc-wrapper .llrc-card .llrc-card__sale-price {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #111 !important;
    display: block !important;
    line-height: 1.2 !important;
}

.llrc-wrapper .llrc-card .llrc-card__regular-price {
    font-size: 12px !important;
    color: #999 !important;
    display: block !important;
    line-height: 1.2 !important;
}

.llrc-wrapper .llrc-card .llrc-card__regular-price del,
.llrc-wrapper .llrc-card .llrc-card__regular-price s {
    text-decoration: line-through !important;
}

/* ── Savings text ────────────────────────────────────────── */
.llrc-wrapper .llrc-card .llrc-card__savings {
    font-size: 11px !important;
    color: #4a7c59 !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    display: block !important;
    margin-top: 3px !important;
}

.llrc-wrapper .llrc-card .llrc-card__discount-pct {
    font-weight: 500 !important;
    opacity: 0.9 !important;
}

/* ── Badge strip at card bottom ──────────────────────────── */
.llrc-wrapper .llrc-card .llrc-card__badge {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: #4a7c59 !important;
    color: #fff !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: 0.07em !important;
    text-transform: uppercase !important;
    padding: 3px 4px !important;
    border-radius: 0 0 6px 6px !important;
    white-space: nowrap !important;
    text-align: center !important;
    line-height: 1.5 !important;
}

/* Extra bottom padding when badge is present */
.llrc-wrapper .llrc-card:has(.llrc-card__badge) {
    padding-bottom: 22px !important;
}

/* ── Responsive breakpoints ──────────────────────────────── */

/* Tablet: 2 per row */
@media (max-width: 640px) {
    .llrc-wrapper .llrc-card {
        flex: 0 0 calc(50% - 5px) !important;
        min-width: calc(50% - 5px) !important;
        max-width: calc(50% - 5px) !important;
    }
}

/* ── Injected / Updated price effects ───────────────────── */

/* Style for the price when we have to inject it ourselves 
   (because the default price was deleted/empty) */
.llrc-wrapper ~ .llrc-injected-price,
.llrc-injected-price {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #4a7c59 !important;
    margin: 10px 0 !important;
    display: block !important;
}

/* Shortcode [llrc_price] display style */
.llrc-price-display {
    font-size: 1.7em !important;
    font-weight: 700 !important;
    color: #4a7c59 !important; /* Premium LymaLeaf Green */
    display: inline-block !important;
    line-height: 1.2 !important;
    vertical-align: middle !important;
}

/* Flash effect when price updates */
.llrc-price-updated {
    animation: llrc-flash 0.5s ease-out !important;
}

@keyframes llrc-flash {
    0% { opacity: 0.5; transform: scale(0.98); }
    100% { opacity: 1; transform: scale(1); }
}

/* ── Product Rating Adjustments ──────────────────────────── */
.woocommerce-product-rating {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 15px !important;
}

.woocommerce-product-rating .star-rating {
    margin: 0 !important;
    float: none !important;
    font-size: 16px !important; /* Premium visible stars */
}

/* Review count in brackets (0) */
.woocommerce-product-rating .woocommerce-review-link,
.woocommerce-product-rating .review-count,
.elementor-widget-rating .review-count,
.e-rating .review-count,
.review-count {
    font-size: 14px !important; /* Slightly smaller than stars for hierarchy */
    color: #777 !important;
    text-decoration: none !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    font-weight: 500 !important;
    vertical-align: middle !important;
    margin-left: 6px !important;
    position: relative !important;
    top: -1px !important; /* Visual nudge for alignment */
}

.woocommerce-product-rating .woocommerce-review-link:hover,
.review-count:hover {
    color: #4a7c59 !important;
}

/* Fix for Elementor Rating widget specific alignment */
.elementor-widget-rating .e-rating-wrapper + .review-count {
    margin-left: 8px !important;
}