/**
 * PRI-FLY VIVID FLIGHT DECK
 * Coinable visual style system
 * Deep navy cockpit + vivid blue / violet / green / amber action states.
 */

:root {
  --cfd-navy-0: #030b17;
  --cfd-navy-1: #071424;
  --cfd-navy-2: #0b1b31;
  --cfd-line: rgba(104, 164, 231, .34);
  --cfd-white: #f7fbff;
  --cfd-muted: #bfd0e1;

  --cfd-blue-a: #58a7f3;
  --cfd-blue-b: #436de8;
  --cfd-violet-a: #a45bf5;
  --cfd-violet-b: #7039e4;
  --cfd-green-a: #8bcb60;
  --cfd-green-b: #589e49;
  --cfd-amber-a: #f0bd46;
  --cfd-amber-b: #d88d17;
  --cfd-gold-a: #f5cb53;
  --cfd-gold-b: #d99b18;
}

/* -------------------------------------------------------------------------
   HOMEPAGE ACTION CARDS
   ------------------------------------------------------------------------- */
body.coinable-vivid-flight-deck .cph-action-cards article {
  border-color: var(--cfd-line) !important;
  background:
    radial-gradient(circle at 16% 8%, rgba(65, 137, 232, .08), transparent 34%),
    linear-gradient(145deg, #0a1a30, #061323) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    0 12px 30px rgba(0,0,0,.20) !important;
}

body.coinable-vivid-flight-deck .cph-action-cards h3 {
  color: var(--cfd-white) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.28) !important;
}

body.coinable-vivid-flight-deck .cph-action-cards p {
  color: var(--cfd-muted) !important;
}

/* Bigger Discover Coinable medallion: use the available circle instead of
   leaving the actual Coinable coin visually undersized. */
body.coinable-vivid-flight-deck .cph-action-cards article:first-child {
  grid-template-columns: 70px minmax(0,1fr) !important;
  column-gap: 12px !important;
}

body.coinable-vivid-flight-deck .cph-action-cards article:first-child .cph-circle {
  width: 68px !important;
  height: 68px !important;
  margin-top: -4px !important;
  overflow: hidden !important;
  border: 1px solid rgba(116, 191, 255, .60) !important;
  background: linear-gradient(145deg, #62adf4, #486ee9) !important;
  box-shadow:
    inset 0 1px 2px rgba(255,255,255,.22),
    0 0 20px rgba(67, 130, 240, .22) !important;
}

body.coinable-vivid-flight-deck .cph-action-cards article:first-child .cph-circle img {
  width: 64px !important;
  height: 64px !important;
  max-width: none !important;
  object-fit: contain !important;
  transform: scale(1.08) !important;
}

/* Luminous medallion states. */
body.coinable-vivid-flight-deck .cph-action-cards .cph-circle.cph-purple {
  background: linear-gradient(145deg, var(--cfd-violet-a), var(--cfd-violet-b)) !important;
  box-shadow: inset 0 1px 2px rgba(255,255,255,.18), 0 0 20px rgba(135,74,239,.20) !important;
}
body.coinable-vivid-flight-deck .cph-action-cards .cph-circle.cph-green {
  background: linear-gradient(145deg, var(--cfd-green-a), var(--cfd-green-b)) !important;
  box-shadow: inset 0 1px 2px rgba(255,255,255,.18), 0 0 20px rgba(102,181,74,.18) !important;
}
body.coinable-vivid-flight-deck .cph-action-cards .cph-circle.cph-amber,
body.coinable-vivid-flight-deck .cph-action-cards .cph-circle.cph-orange {
  background: linear-gradient(145deg, var(--cfd-amber-a), var(--cfd-amber-b)) !important;
  box-shadow: inset 0 1px 2px rgba(255,255,255,.18), 0 0 20px rgba(229,158,27,.18) !important;
}

/* Vivid CTA fills. */
body.coinable-vivid-flight-deck .cph-action-cards .cph-card-btn.cph-blue {
  background: linear-gradient(90deg, var(--cfd-blue-a), var(--cfd-blue-b)) !important;
  border: 1px solid rgba(112, 181, 255, .52) !important;
  box-shadow: 0 7px 18px rgba(56, 107, 232, .18) !important;
}
body.coinable-vivid-flight-deck .cph-action-cards .cph-card-btn.cph-purple {
  background: linear-gradient(90deg, var(--cfd-violet-a), var(--cfd-violet-b)) !important;
  border: 1px solid rgba(179, 111, 255, .48) !important;
  box-shadow: 0 7px 18px rgba(123, 61, 228, .18) !important;
}
body.coinable-vivid-flight-deck .cph-action-cards .cph-card-btn.cph-green {
  background: linear-gradient(90deg, var(--cfd-green-a), var(--cfd-green-b)) !important;
  border: 1px solid rgba(153, 219, 102, .42) !important;
  box-shadow: 0 7px 18px rgba(83, 153, 68, .16) !important;
}
body.coinable-vivid-flight-deck .cph-action-cards .cph-card-btn.cph-amber,
body.coinable-vivid-flight-deck .cph-action-cards .cph-card-btn.cph-orange {
  background: linear-gradient(90deg, var(--cfd-amber-a), var(--cfd-amber-b)) !important;
  border: 1px solid rgba(255, 206, 92, .48) !important;
  box-shadow: 0 7px 18px rgba(216, 141, 23, .16) !important;
}

body.coinable-vivid-flight-deck .cph-action-cards .cph-card-btn {
  color: #fff !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.24) !important;
  transition: transform .16s ease, filter .16s ease, box-shadow .16s ease !important;
}
body.coinable-vivid-flight-deck .cph-action-cards .cph-card-btn:hover,
body.coinable-vivid-flight-deck .cph-action-cards .cph-card-btn:focus-visible {
  transform: translateY(-1px) !important;
  filter: saturate(1.10) brightness(1.06) !important;
}

/* -------------------------------------------------------------------------
   COINABLE FLIGHT NAVIGATION
   Make the SEO/support-page flight cards use the same vivid visual language.
   ------------------------------------------------------------------------- */
body.coinable-vivid-flight-deck .coinable-seo-web {
  --vfd-panel: #071424;
}

body.coinable-vivid-flight-deck .coinable-seo-web__inner {
  border-color: rgba(102, 164, 234, .34) !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(65, 142, 236, .08), transparent 32%),
    radial-gradient(circle at 90% 0%, rgba(139, 86, 241, .07), transparent 34%),
    linear-gradient(145deg, #071629, #050f1e) !important;
}

body.coinable-vivid-flight-deck .coinable-seo-web__eyebrow {
  color: #dcecff !important;
  letter-spacing: .12em !important;
}

body.coinable-vivid-flight-deck .coinable-seo-web__flight-button,
body.coinable-vivid-flight-deck .coinable-seo-web__customer-grid a {
  border-radius: 12px !important;
  min-height: 74px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 8px 20px rgba(0,0,0,.18) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.24) !important;
}

/* MINI BOSS / Start: vivid gold, not muddy brown. */
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--yellow {
  border-color: rgba(255, 218, 92, .72) !important;
  background: linear-gradient(135deg, #f3c84e 0%, #e5ae2b 48%, #cc8f13 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 0 22px rgba(236,177,41,.16) !important;
}
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--yellow strong,
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--yellow span {
  color: #fff !important;
}

/* PRI-FLY 2.0 / AIR BOSS 2.0: vivid blue -> violet. */
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--prifly2,
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--decision {
  border-color: rgba(125, 190, 255, .68) !important;
  background: linear-gradient(135deg, #54a8f3 0%, #536fe8 48%, #8d51e9 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 0 24px rgba(90,109,238,.18) !important;
}
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--prifly2 strong,
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--prifly2 span,
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--decision strong,
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--decision span {
  color: #fff !important;
}

/* AIR BOSS 3.0: vivid green. */
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--green {
  border-color: rgba(155, 220, 104, .62) !important;
  background: linear-gradient(135deg, #8bc95e 0%, #70b253 52%, #559b48 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 0 22px rgba(92,168,72,.16) !important;
}
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--green strong,
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--green span {
  color: #fff !important;
}

/* FAQ / Track: vivid amber-orange. */
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--amber {
  border-color: rgba(245, 190, 68, .70) !important;
  background: linear-gradient(135deg, #efba45 0%, #e3a12c 52%, #d48717 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 0 22px rgba(225,147,27,.16) !important;
}
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--amber strong,
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button--amber span {
  color: #fff !important;
}

body.coinable-vivid-flight-deck .coinable-seo-web__flight-button:hover,
body.coinable-vivid-flight-deck .coinable-seo-web__flight-button:focus-visible,
body.coinable-vivid-flight-deck .coinable-seo-web__customer-grid a:hover,
body.coinable-vivid-flight-deck .coinable-seo-web__customer-grid a:focus-visible {
  transform: translateY(-2px) !important;
  filter: saturate(1.10) brightness(1.06) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 12px 26px rgba(0,0,0,.24),
    0 0 24px rgba(105, 138, 255, .16) !important;
}

/* Signed-in customer controls inherit the same vivid four-state rhythm. */
body.coinable-vivid-flight-deck .coinable-seo-web__customer-grid a:nth-child(4n+1) {
  background: linear-gradient(135deg, var(--cfd-blue-a), var(--cfd-blue-b)) !important;
  border-color: rgba(112,181,255,.58) !important;
}
body.coinable-vivid-flight-deck .coinable-seo-web__customer-grid a:nth-child(4n+2) {
  background: linear-gradient(135deg, var(--cfd-violet-a), var(--cfd-violet-b)) !important;
  border-color: rgba(180,111,255,.55) !important;
}
body.coinable-vivid-flight-deck .coinable-seo-web__customer-grid a:nth-child(4n+3) {
  background: linear-gradient(135deg, var(--cfd-green-a), var(--cfd-green-b)) !important;
  border-color: rgba(153,219,102,.50) !important;
}
body.coinable-vivid-flight-deck .coinable-seo-web__customer-grid a:nth-child(4n+4) {
  background: linear-gradient(135deg, var(--cfd-amber-a), var(--cfd-amber-b)) !important;
  border-color: rgba(255,205,88,.54) !important;
}
body.coinable-vivid-flight-deck .coinable-seo-web__customer-grid a strong,
body.coinable-vivid-flight-deck .coinable-seo-web__customer-grid a span {
  color: #fff !important;
}

@media (max-width: 650px) {
  body.coinable-vivid-flight-deck .cph-action-cards article:first-child {
    grid-template-columns: 64px minmax(0,1fr) !important;
  }
  body.coinable-vivid-flight-deck .cph-action-cards article:first-child .cph-circle {
    width: 62px !important;
    height: 62px !important;
  }
  body.coinable-vivid-flight-deck .cph-action-cards article:first-child .cph-circle img {
    width: 58px !important;
    height: 58px !important;
  }

  body.coinable-vivid-flight-deck .coinable-seo-web__flight-button {
    min-height: 68px !important;
    border-radius: 10px !important;
  }
}