/* Shared overrides for Tailwind-based templates (front-page.php, home.php,
 * single.php). Loaded by AssetsManager::tailwindAssets() on those routes only,
 * so rules here will not leak onto legacy pages still served by app.css. */

/* Warm orange gradient (#FF9974 → #FF5212) — applied to text via background-clip.
 * Used inline as `background: linear-gradient(...)` in 7 spots; this utility is
 * available for migration / new usages. */
.ob-gradient-warm-text {
    background: linear-gradient(161.15deg, #FF9974 8.73%, #FF5212 88.52%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

/* Post-card category pill — default orange, with per-category gradient overrides.
 * The post-card template applies `cat-pill cat-pill--<slug>` so styles cascade
 * naturally by source order (default first, then specific overrides). */
.cat-pill {
    background: var(--color-ob-orange, #FD614B);
    color: #fff;
}

.cat-pill--merchandise-planning {
    background: linear-gradient(161.15deg, #FF9974 8.73%, #FF5212 88.52%);
    color: #fff;
}

.cat-pill--smart-allocation {
    background: linear-gradient(201.12deg, #D394D3 -8.72%, #BA6ABA 170.67%);
    color: #fff;
}

.cat-pill--special-events-promotions {
    background: linear-gradient(180deg, #D13800 0%, #AD2E00 100%);
    color: #fff;
}

.cat-pill--replenishment {
    background: linear-gradient(219.74deg, #206C6D 21.26%, #2D8C8E 94.64%);
    color: #fff;
}

.cat-pill--store-transfers {
    background: linear-gradient(200deg, #FACC15 0%, #F59E0B 100%);
    color: var(--color-ob-dark, #1A314B);
}

.cat-pill--liquidation {
    background: linear-gradient(179.79deg, #D0E4F8 0.19%, #DBE6F1 61.04%);
    color: var(--color-ob-dark, #1A314B);
}

.cat-pill--in-season-purchasing {
    background: linear-gradient(178.52deg, #8FB6DE 1.26%, #B3D3F2 111.58%);
    color: var(--color-ob-dark, #1A314B);
}

.cat-pill--announcements {
    background: linear-gradient(223deg, #E7BFE7 17.42%, #FF5212 110.07%);
    color: #fff;
}

/* Footer overrides (no CTA bar, tighter padding) */
.site-footer-wrap {
    margin-top: 0 !important;
}

.footer-content {
    padding: 78px 18px !important;
}

@media (min-width: 1600px) {
    .footer-content {
        padding: 88px 64px !important;
    }
}