/* ============================================================================
   Gomhoria template — منصة الجمهورية التعليمية
   Layered over learnify.css (the Aurora base). Brand colours come from
   Admin → Settings → Appearance (blue #0060D8 ↔ magenta #F0006C), so this file
   only adds the identity's finishing touches. Scoped to body.lf-tpl-gomhoria.
   ========================================================================== */

/* --- Hero: a confident government-education gradient --------------------- */
body.lf-tpl-gomhoria .lf-hero,
body.lf-tpl-gomhoria .lf-tp-hero {
    background-image: linear-gradient(135deg, var(--lf-primary-dark) 0%, var(--lf-primary) 45%, var(--lf-primary-2) 100%);
}

/* --- Section headings: a short brand-gradient underline accent ----------- */
body.lf-tpl-gomhoria .lf-section-head h2,
body.lf-tpl-gomhoria section > .container > .text-center > h2 {
    position: relative;
    padding-bottom: .55rem;
}
body.lf-tpl-gomhoria .lf-section-head h2::after,
body.lf-tpl-gomhoria section > .container > .text-center > h2::after {
    content: "";
    position: absolute;
    inset-inline-start: 50%;
    transform: translateX(50%);
    bottom: 0;
    width: 64px;
    height: 4px;
    border-radius: 999px;
    background: var(--lf-grad);
}

/* --- Cards: clearer border + a brand top-edge accent on hover ------------ */
body.lf-tpl-gomhoria .lf-card,
body.lf-tpl-gomhoria .card {
    border: 1px solid var(--lf-border);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
body.lf-tpl-gomhoria .lf-card:hover,
body.lf-tpl-gomhoria .card:hover {
    border-color: rgba(var(--lf-primary-rgb), .35);
    box-shadow: var(--lf-shadow);
}

/* --- Stage / browse cards: bolder, education-forward ---------------------- */
body.lf-tpl-gomhoria .gom-stage-card { border-radius: var(--lf-radius-lg); }
body.lf-tpl-gomhoria .gom-stage-card:hover { transform: translateY(-4px); box-shadow: var(--lf-shadow-lg); }

/* --- Pills / badges pick up the brand tint ------------------------------- */
body.lf-tpl-gomhoria .badge.bg-primary-subtle,
body.lf-tpl-gomhoria .lf-pill {
    background: rgba(var(--lf-primary-rgb), .10);
    color: var(--lf-primary-dark);
}

/* --- Footer: deep brand-navy so the logo and links read clearly --------- */
body.lf-tpl-gomhoria .lf-footer {
    background: linear-gradient(180deg, #0a1a33 0%, #06122a 100%);
}