/* FBR DESIGN ADOPTION (Web)
   Scope: storefront + coach
   Keeps existing structure and adds consistent premium polish.
*/

:root {
  --fbr-ds-bg: #f1ece4;
  --fbr-ds-surface: #fffdf8;
  --fbr-ds-surface-soft: #eef5ff;
  --fbr-ds-line: #d8cfbf;
  --fbr-ds-title: #17355a;
  --fbr-ds-muted: #4e6484;
  --fbr-ds-accent: #e4572e;
  --fbr-ds-accent-blue: #2d8ee6;
  --fbr-ds-radius: 18px;
  --fbr-ds-shadow: 0 14px 28px rgba(18, 47, 78, 0.14);
  --fbr-ds-shadow-hover: 0 18px 34px rgba(18, 47, 78, 0.18);
}

/* Storefront form surfaces */
.steps,
.formulario,
.loader-card,
.top-card,
.card,
.tcard,
.final-hero {
  border-radius: var(--fbr-ds-radius) !important;
  border: 1px solid var(--fbr-ds-line) !important;
  box-shadow: var(--fbr-ds-shadow) !important;
}

.formulario h2,
.steps__stage,
.header-fbr h1 {
  color: var(--fbr-ds-title) !important;
}

.steps__label,
.loader-note,
.marca-hint {
  color: var(--fbr-ds-muted) !important;
}

/* Coach portal visual coherence */
body.coach-premium .coach-card,
body.coach-premium .metric-card,
body.coach-premium .plan-week-card,
body.coach-premium .weekly-summary-day,
body.coach-premium .evolution-chart-card,
body.coach-premium .coach-news-preview-card,
body.coach-premium .coach-news-cover-preview {
  border-radius: var(--fbr-ds-radius) !important;
  border: 1px solid #d3deef !important;
  box-shadow: var(--fbr-ds-shadow) !important;
}

body.coach-premium .coach-card:hover,
body.coach-premium .metric-card:hover,
body.coach-premium .plan-week-card:hover {
  box-shadow: var(--fbr-ds-shadow-hover) !important;
}

body.coach-premium .card-head h2,
body.coach-premium .card-head h3,
body.coach-premium .coach-collapse__summary,
body.coach-premium .athlete-header h2 {
  color: #17355a !important;
}

body.coach-premium .muted,
body.coach-premium .card-head p,
body.coach-premium .weekly-summary-row p {
  color: #4e6484 !important;
}

body.coach-premium .btn.primary {
  background: linear-gradient(165deg, #e86b40, #d84f24) !important;
  border-color: rgba(216, 79, 36, 0.56) !important;
}

body.coach-premium .btn.ghost {
  border-color: #b9cee9 !important;
  background: linear-gradient(160deg, #f8fbff, #eef5ff) !important;
  color: #1f4c7c !important;
}

body.coach-premium .btn.ghost:hover {
  filter: saturate(1.03);
}

body.coach-premium .coach-news-badge--published {
  background: rgba(47, 191, 113, 0.16) !important;
  border-color: rgba(47, 191, 113, 0.34) !important;
}

body.coach-premium .coach-news-badge--draft {
  background: rgba(251, 191, 36, 0.18) !important;
  border-color: rgba(251, 191, 36, 0.36) !important;
}

/* safer defaults on narrow screens */
@media (max-width: 820px) {
  body.coach-premium .coach-card,
  body.coach-premium .metric-card,
  body.coach-premium .plan-week-card,
  body.coach-premium .weekly-summary-day {
    border-radius: 14px !important;
  }
}

/* Index step tracker: blend with dark hero instead of flat white block */
body.storefront-index .steps {
  position: relative;
  overflow: hidden;
  padding: 12px 14px;
  border-radius: 16px !important;
  border: 1px solid rgba(173, 206, 242, 0.34) !important;
  background:
    radial-gradient(circle at 95% 8%, rgba(255, 122, 61, 0.18), transparent 44%),
    radial-gradient(circle at 6% 100%, rgba(45, 142, 230, 0.22), transparent 42%),
    linear-gradient(165deg, rgba(17, 43, 73, 0.88), rgba(12, 33, 58, 0.9)) !important;
  box-shadow: 0 12px 30px rgba(5, 17, 34, 0.46) !important;
}

body.storefront-index .steps::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  border: 1px solid rgba(255, 255, 255, 0.09);
}

body.storefront-index .steps__stage {
  color: #eaf4ff !important;
}

body.storefront-index .steps__label {
  color: #bdd3ec !important;
}

body.storefront-index .steps__bar {
  height: 12px;
  background: rgba(7, 18, 34, 0.54) !important;
  border: 1px solid rgba(178, 212, 247, 0.22);
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.42);
}

body.storefront-index .steps__bar-fill {
  background: linear-gradient(90deg, #2d8ee6, #4eb5ff, #ff7a3d) !important;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.3),
    0 6px 16px rgba(45, 142, 230, 0.34) !important;
}