/* Gold Network tier — MobileX "Priority Access" plans (#21).
     Activation tiles: Web/Views/Activate/Carrier/MobileXPlans.cshtml  (.pricing-box.is-gold + .gold-tier-header)
     Refill table:     Web/Views/Refill/RefillCarrier.cshtml           (.gold-tier-badge)
   Treatment chosen via design review (2026-06-04): a gold HEADER BAND ("Option B"), not a gold ring.

   This is a BRANDED-TIER treatment, deliberately kept in a different visual channel from the green
   PROMO treatment (promo-tile.css). Promo owns the card RING (box-shadow) + the top-right SAVE ribbon;
   Gold Network owns the TOP HEADER BAND + a gold-tinted price. A plan that is BOTH gold and promo
   composes cleanly: the gold header sits inside the green ring and the SAVE ribbon keeps its corner.
   The gold treatment never sets a border or box-shadow, so it cannot collide with the promo ring.

   Loaded site-wide from _Layout.cshtml right after promo-tile.css, so every class is namespaced
   (.is-gold / .gold-tier-header / .gold-tier-badge). Never reuse Bootstrap names — repo hard rule.
   Champagne -> amber gradient (not flat mustard) so it reads as premium metal, not a discount sticker. */

/* Full-bleed header band. .pricing-box carries NO horizontal padding (the inner sections do) and is
   overflow:hidden, so this first child spans edge-to-edge and clips to the card's rounded top corners
   with no negative margins. */
.pricing-box.is-gold .gold-tier-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.62rem 0.75rem;
    background: linear-gradient(135deg, #f4dc92 0%, #cda94e 45%, #b07d12 100%);
    color: #3b2d00;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
}

.pricing-box.is-gold .gold-tier-header .bi-star-fill {
    font-size: 0.76rem;
}

/* Gold-tinted price echoes the header without out-shouting the numeral's size-driven dominance.
   Dark enough (> 4.5:1 on white) to stay readable. The Activate button stays the system dark button. */
.pricing-box.is-gold .pricing-price {
    color: #8a6a12;
}

/* Refill (RefillCarrier.cshtml) is a <table>, not cards — the brand shows as a compact pill in the
   Type cell instead of a header band. Same champagne -> amber language as the tile header. */
.gold-tier-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.32rem;
    padding: 0.24rem 0.55rem;
    background: linear-gradient(135deg, #f4dc92 0%, #cda94e 45%, #b07d12 100%);
    color: #3b2d00;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 1;
    border-radius: 999px;
    text-transform: uppercase;
    white-space: nowrap;
}
