/* WPLoyalty skin, scoped to the loyalty page. Logical properties support AR/EN. */
body.elwan-loyalty-page :is(.wlr-myaccount-page, .wlr-page-page) {
    --loyalty-ink: #123c55;
    --loyalty-muted: #5d7080;
    --loyalty-gold: #bd9440;
    width: 100% !important;
    max-width: 1600px !important;
    min-width: 0 !important;
    margin: 20px auto 32px !important;
    padding: 0 24px !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    background: transparent !important;
    color: var(--loyalty-ink) !important;
    direction: rtl !important;
    text-align: start !important;
    font-family: 'Cairo', Tahoma, sans-serif !important;
    line-height: 1.7;
}
html:lang(en) body.elwan-loyalty-page :is(.wlr-myaccount-page, .wlr-page-page) {
    direction: ltr !important;
    font-family: Arial, sans-serif !important;
}
body.elwan-loyalty-page :is(.wlr-myaccount-page, .wlr-page-page) *,
body.elwan-loyalty-page :is(.wlr-myaccount-page, .wlr-page-page) *::before,
body.elwan-loyalty-page :is(.wlr-myaccount-page, .wlr-page-page) *::after { box-sizing: border-box; }
body.elwan-loyalty-page .wlr-user-details {
    width: 100% !important;
    margin: 0 !important;
    border-radius: 20px !important;
    background: linear-gradient(120deg, #044167, #123c55) !important;
    overflow: hidden !important;
}
body.elwan-loyalty-page .el-hero {
    display: grid !important;
    grid-template-columns: 100px minmax(0, 1fr) auto !important;
    gap: 20px !important;
    padding: 20px 24px !important;
    align-items: center !important;
    direction: inherit !important;
}
body.elwan-loyalty-page .el-hero-img-wrap { width: 100px !important; height: 112px !important; }
body.elwan-loyalty-page .el-hero-img-bg { width: 100px !important; height: 100px !important; inset: 4px auto auto 6px !important; }
body.elwan-loyalty-page .el-coin { animation: none !important; font-size: 24px !important; }
body.elwan-loyalty-page .el-coin-1 { top: 12px !important; left: 20px !important; }
body.elwan-loyalty-page .el-coin-2 { top: 38px !important; left: 74px !important; }
body.elwan-loyalty-page .el-coin-3 { top: 68px !important; left: 28px !important; }
body.elwan-loyalty-page .el-hero-badge { font-size: 11px !important; width: 110px !important; padding: 6px !important; }
body.elwan-loyalty-page .el-hero-points { direction: inherit !important; text-align: start !important; min-width: 0 !important; }
body.elwan-loyalty-page .el-hero-label,
body.elwan-loyalty-page .el-hero-pts-unit { color: #e3edf3 !important; font-size: 14px !important; }
body.elwan-loyalty-page .el-hero-pts-val { color: #fff !important; font-size: clamp(38px, 5vw, 58px) !important; line-height: 1.2 !important; margin: 6px 0 !important; }
body.elwan-loyalty-page .el-hero-equiv { font-size: 13px !important; margin-top: 12px !important; padding: 7px 12px !important; max-width: 100% !important; }
body.elwan-loyalty-page .el-hero-cta { display: flex !important; flex-direction: column !important; gap: 10px !important; min-width: 180px !important; }
body.elwan-loyalty-page .el-hero-tagline { color: #e3edf3 !important; font-size: 13px !important; margin: 0 0 4px !important; }
body.elwan-loyalty-page :is(.el-btn-primary, .el-btn-secondary) { margin: 0 !important; padding: 11px 18px !important; border-radius: 10px !important; font-size: 14px !important; text-align: center !important; }
body.elwan-loyalty-page #el-stats-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 16px !important;
    align-items: stretch !important;
}
body.elwan-loyalty-page :is(.el-stat-card, .elwan-card, .wlr-rewards-container, .wlr-coupons-container, .wlr-coupons-expired-container, .wlr-earning-options, .wlr-enable-email-sent-blog) {
    min-width: 0 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 18px !important;
    border: 1px solid #e2e9ee !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: 0 5px 20px rgba(18, 60, 85, .05) !important;
    direction: inherit !important;
    text-align: start !important;
}
body.elwan-loyalty-page :is(.el-stat-card-title, .elwan-card-title, .wlr-heading) {
    color: var(--loyalty-ink) !important;
    font-size: 18px !important;
    line-height: 1.5 !important;
    margin: 0 0 12px !important;
    border: 0 !important;
    border-inline-start: 3px solid var(--loyalty-gold) !important;
    padding: 0 !important;
    padding-inline-start: 12px !important;
    text-align: start !important;
}
body.elwan-loyalty-page .el-stat-grid { gap: 1px !important; background: #e2e9ee !important; border: 1px solid #e2e9ee !important; }
body.elwan-loyalty-page .el-stat-item { padding: 12px 10px !important; background: #f7fafc !important; min-width: 0; }
body.elwan-loyalty-page .el-stat-val { font-size: 26px !important; color: var(--loyalty-ink) !important; overflow-wrap: anywhere; }
html:lang(en) body.elwan-loyalty-page .el-stat-val { font-family: Arial, sans-serif !important; }
body.elwan-loyalty-page .el-stat-lbl { font-size: 12px !important; color: var(--loyalty-muted) !important; margin-top: 8px !important; line-height: 1.6 !important; }
body.elwan-loyalty-page :is(.el-lc-empty-text, .el-lc-toptext, .el-lc-lvlsub, .el-lc-needed, .el-lvl-sub, .el-lvl-line-labels) { color: var(--loyalty-muted) !important; font-size: 13px !important; }
body.elwan-loyalty-page .el-lc-empty { display: flex !important; flex-direction: column !important; justify-content: center !important; min-height: 120px !important; padding: 12px !important; }
body.elwan-loyalty-page #el-levels { padding: 18px !important; }
body.elwan-loyalty-page #el-levels > p { color: var(--loyalty-muted) !important; font-size: 13px !important; margin: 0 0 12px !important; }
body.elwan-loyalty-page .el-lvl-timeline { overflow-x: auto; padding-bottom: 12px !important; }
body.elwan-loyalty-page .el-lvl-label { font-size: 13px !important; }
body.elwan-loyalty-page .el-lvl-callout { direction: inherit !important; padding: 12px !important; margin-top: 10px !important; text-align: start !important; }
body.elwan-loyalty-page .el-lvl-callout-body { font-size: 13px !important; }
body.elwan-loyalty-page .wlr-your-reward { width: 100% !important; max-width: none !important; padding: 0 !important; margin: 0 !important; display: flex !important; flex-direction: column !important; gap: 24px !important; direction: inherit !important; }
body.elwan-loyalty-page :is(.wlr-customer-reward, .wlr-coupons-list, .wlr-campaign-container) { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)) !important; gap: 16px !important; }
body.elwan-loyalty-page :is(.wlr-card, .wlr-reward-item, .wlr-rewards-content, .wlr-coupon-item) { width: auto !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 20px !important; border-radius: 12px !important; }
body.elwan-loyalty-page :is(.wlr-description, .wlr-name) { overflow-wrap: anywhere; }
body.elwan-loyalty-page :is(.wlr-transaction-list, .wlr-transactions-container, #wlr-transactions) { overflow-x: auto; max-width: 100% !important; }
body.elwan-loyalty-page :is(a, button, input):focus-visible { outline: 3px solid #bd9440 !important; outline-offset: 3px; }
html:lang(en) body.elwan-loyalty-page .el-stat-lbl[data-elwan-label] { font-size: 0 !important; }
html:lang(en) body.elwan-loyalty-page .el-stat-lbl[data-elwan-label]::after { content: attr(data-elwan-label); font-size: 12px; }
/* Widen only content wrappers containing the loyalty component, never the header. */
body.elwan-loyalty-page #Content :is(.content_wrapper, .section_wrapper):has(.wlr-myaccount-page, .wlr-page-page) {
    width: 100% !important;
    max-width: 1600px !important;
    margin-inline: auto !important;
}
@media (min-width: 1200px) {
    body.elwan-loyalty-page :is(.wlr-myaccount-page, .wlr-page-page):has(#el-stats-row):has(#el-levels) {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        align-items: stretch !important;
    }
    body.elwan-loyalty-page :is(.wlr-myaccount-page, .wlr-page-page) > * { grid-column: 1 / -1; }
    body.elwan-loyalty-page :is(.wlr-myaccount-page, .wlr-page-page):has(#el-levels) #el-stats-row { display: contents !important; }
    body.elwan-loyalty-page :is(.wlr-myaccount-page, .wlr-page-page):has(#el-stats-row) #el-levels,
    body.elwan-loyalty-page #el-stats-row > .el-stat-card { grid-column: auto; }
    body.elwan-loyalty-page .el-lvl-circle { width: 42px !important; height: 42px !important; font-size: 20px !important; }
    body.elwan-loyalty-page .el-lvl-node { width: 70px !important; gap: 5px !important; }
}
@media (max-width: 767px) {
    body.elwan-loyalty-page :is(.wlr-myaccount-page, .wlr-page-page) { margin: 20px auto 32px !important; padding: 0 12px !important; gap: 16px !important; }
    body.elwan-loyalty-page .el-hero { grid-template-columns: minmax(0, 1fr) !important; gap: 12px !important; padding: 18px !important; }
    body.elwan-loyalty-page .el-hero-img-wrap { display: none !important; }
    body.elwan-loyalty-page .el-hero-cta { min-width: 0 !important; width: 100% !important; }
    body.elwan-loyalty-page #el-stats-row { grid-template-columns: minmax(0, 1fr) !important; gap: 16px !important; }
    body.elwan-loyalty-page :is(.el-stat-card, .elwan-card, .wlr-rewards-container, .wlr-coupons-container, .wlr-coupons-expired-container, .wlr-earning-options, .wlr-enable-email-sent-blog) { padding: 16px !important; }
    body.elwan-loyalty-page #el-levels { padding: 16px !important; }
    body.elwan-loyalty-page .el-lvl-callout { gap: 10px !important; padding: 14px !important; }
}