/* ============================================================================
   page-overrides.css — Re-themes Products.razor (.st-*) and CartPage.razor
   inline styles to match the Ganesh Shirsat navy + gold palette.
   Loaded AFTER all theme files. Does NOT modify markup — CSS-only overrides.
   ============================================================================ */

/* ── Products page hero ── */
.st-hero {
    background: linear-gradient(135deg, var(--navy, #1C2B4A), var(--navy-dark, #0F1A2E)) !important;
}

/* ── Products page tabs & buttons ── */
.st-tab.active,
.st-lang-btn.active {
    background: var(--gold, #C8A44E) !important;
    color: var(--navy-dark, #0F1A2E) !important;
    border-color: var(--gold, #C8A44E) !important;
}

.st-tab:hover,
.st-lang-btn:hover {
    border-color: var(--gold, #C8A44E) !important;
    color: var(--navy, #1C2B4A) !important;
}

/* ── Product card pricing ── */
.st-price {
    color: var(--navy, #1C2B4A) !important;
}

.st-badge {
    background: var(--gold, #C8A44E) !important;
    color: var(--navy-dark, #0F1A2E) !important;
}

/* ── Add to cart button ── */
.st-add-btn {
    background: var(--gold, #C8A44E) !important;
    color: var(--navy-dark, #0F1A2E) !important;
}
.st-add-btn:hover {
    background: #B8943E !important;
}
.st-added-btn {
    background: var(--success, #2E8B57) !important;
}

/* ── Product card hover accent ── */
.st-card:hover {
    border-color: rgba(200, 164, 78, .4) !important;
}

/* ── Combo card accent ── */
.st-combo-banner {
    background: linear-gradient(135deg, var(--navy, #1C2B4A), var(--navy-dark, #0F1A2E)) !important;
}

/* ── Filter chips ── */
.st-level-chip.active {
    background: var(--navy, #1C2B4A) !important;
    color: #fff !important;
    border-color: var(--navy, #1C2B4A) !important;
}

/* ── Cart page sticky summary ── */
.ct-summary-head,
.ct-order-head {
    background: var(--navy, #1C2B4A) !important;
}

.ct-checkout-btn,
.ct-pay-btn {
    background: var(--gold, #C8A44E) !important;
    color: var(--navy-dark, #0F1A2E) !important;
}
.ct-checkout-btn:hover,
.ct-pay-btn:hover {
    background: #B8943E !important;
}

/* ── Cart discount strip ── */
.ct-savings {
    background: var(--green-light, #E8F5E7) !important;
    color: var(--success, #2E8B57) !important;
}

/* ── Login page (UI.Auth) — retheme the dark panel + accent colors ── */
.al-left {
    background: linear-gradient(160deg, var(--navy-dark, #0F1A2E) 0%, var(--navy, #1C2B4A) 40%, #0F1A2E 100%) !important;
}
.al-btn {
    background: var(--gold, #C8A44E) !important;
    color: var(--navy-dark, #0F1A2E) !important;
}
.al-btn:hover {
    background: #B8943E !important;
}
.al-link, .al-forgot {
    color: var(--gold, #C8A44E) !important;
}
.al-tab.active {
    background: var(--navy, #1C2B4A) !important;
    color: #fff !important;
}

/* ── PageTitle font ── */
.page-hero {
    background: var(--navy, #1C2B4A) !important;
}

/* ── ProductDetail page (.pd2-*) ── */
.pd2-tag.yellow {
    background: var(--gold-pale, #F5EDD8) !important;
    color: var(--navy, #1C2B4A) !important;
    border-color: var(--gold, #C8A44E) !important;
}
.pd2-buy-btn,
.pd2-mobile-cta__btn {
    background: linear-gradient(135deg, var(--gold, #C8A44E), #B8943E) !important;
    color: var(--navy-dark, #0F1A2E) !important;
}
.pd2-cart-btn,
.pd2-mobile-cta__cart {
    border-color: var(--gold, #C8A44E) !important;
    color: var(--gold, #C8A44E) !important;
}
.pd2-cart-btn:hover {
    background: var(--gold-pale, #F5EDD8) !important;
}
.pd2-h1 {
    color: var(--navy, #1C2B4A) !important;
}
.pd2-side-price {
    color: var(--navy, #1C2B4A) !important;
}
.pd2-tab.active {
    color: var(--navy, #1C2B4A) !important;
    border-bottom-color: var(--gold, #C8A44E) !important;
}
.pd2-include-ico {
    color: var(--gold, #C8A44E) !important;
}
.pd2-module summary {
    color: var(--navy, #1C2B4A) !important;
}
.pd2-not-found-btn,
.pd2-page a[style*="background:#f59e0b"] {
    background: var(--gold, #C8A44E) !important;
    color: var(--navy-dark, #0F1A2E) !important;
}

/* ── Checkout page ── */
.checkout-step.active .checkout-step__num {
    background: var(--navy, #1C2B4A) !important;
}
.checkout-step.done .checkout-step__num {
    background: var(--success, #2E8B57) !important;
}
.pay-option.selected {
    border-color: var(--navy, #1C2B4A) !important;
}

/* ── Student pages — accent colors ── */
.progress-bar__fill {
    background: linear-gradient(90deg, var(--gold, #C8A44E), #B8943E) !important;
}
.course-access-card__badge.is-active {
    background: var(--green-light, #E8F5E7) !important;
    color: var(--success, #2E8B57) !important;
}

/* ── General accent overrides ── */
.nf-btn-primary,
.nf-code {
    background: linear-gradient(135deg, var(--gold, #C8A44E), #B8943E) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* ── Register page accent ── */
.al-google-btn:hover {
    border-color: var(--gold, #C8A44E) !important;
}

/* ── Fix About Instructor photo — cap to native image resolution ── */
.ganesh-academy-home .gsa-about__photo-inner {
    max-width: 370px !important;
    max-height: 424px !important;
}
.ganesh-academy-home .gsa-about__photo-inner img {
    image-rendering: auto !important;
    object-fit: cover !important;
    object-position: center top !important;
}