/* =============================================================================
   RUSH Evenfall Core — GPS-First Availability Checker Stylesheet
   Version: 4.5.1
   Blocksy-aware: inherits theme palette, typography, and spacing tokens.
   Scoped to .rush-checker / .rush-hero-cta.
   Mobile-first. Zero frameworks.
   ============================================================================= */

/* ── Rush design tokens ──────────────────────────────────────────────────────
   Plugin-specific values only. All surface colors, text colors, and borders
   delegate to Blocksy palette variables so they update automatically when
   the site owner changes their theme colors.
   ─────────────────────────────────────────────────────────────────────────── */
:root {
  /* Brand accent — the only color that is truly plugin-owned */
  --rc-accent:          #FF6B35;
  --rc-accent-dark:     #E55D27;
  --rc-accent-glow:     rgba(255, 107, 53, 0.22);
  --rc-accent-dim:      rgba(255, 107, 53, 0.10);

  /* Geometry */
  --rc-radius-sm:       12px;
  --rc-radius-md:       18px;
  --rc-radius-lg:       24px;

  /* Elevation */
  --rc-shadow:          0 4px 32px rgba(0, 0, 0, 0.08), 0 1px 6px rgba(0, 0, 0, 0.04);
  --rc-shadow-card:     0 2px 16px rgba(0, 0, 0, 0.07);

  /* Motion */
  --rc-transition:      all 0.22s cubic-bezier(0.4, 0, 0.2, 1);

  /* Semantic states */
  --rc-success:         #16A34A;
  --rc-success-bg:      #F0FDF4;
  --rc-success-border:  #BBF7D0;
  --rc-success-dim:     rgba(22, 163, 74, 0.15);

  --rc-denied-bg:       #FFFBEB;
  --rc-denied-border:   #FDE68A;
  --rc-denied-text:     #92400E;

  --rc-error-bg:        #FFF1F2;
  --rc-error-border:    #FECDD3;
  --rc-error-text:      #9F1239;

  /* Dark / coming-soon card surface */
  --rc-coming-bg:       #0F172A;
  --rc-coming-accent:   #FF6B35;
  --rc-coming-text:     #F1F5F9;
  --rc-coming-sub:      #94A3B8;

  /* ── Blocksy semantic aliases ────────────────────────────────────────────────
     Blocksy outputs --theme-palette-color-1…8, --theme-text-color,
     --theme-background-color, and --theme-border-color at :root.
     Hex fallbacks are WCAG-AA-safe values. Palette slot 5 was previously
     mapped to #64748B (4.6:1 on white) but can resolve to a light color on
     dark Blocksy palettes — the explicit fallback locks a safe floor.
     ─────────────────────────────────────────────────────────────────────── */
  --rc-bg:              var(--theme-background-color,  #FFFFFF);
  --rc-text-primary:    var(--theme-text-color,        #0F172A);
  --rc-text-secondary:  var(--theme-palette-color-5,   #475569); /* Bumped: was #64748B */
  --rc-text-muted:      var(--theme-palette-color-6,   #64748B); /* Was #94A3B8 — raised floor */
  --rc-neutral-bg:      var(--theme-palette-color-8,   #F8FAFC);
  --rc-neutral-border:  var(--theme-border-color,      #E2E8F0);
}

/* ============================================================================
   FULL WIDGET — [rush_availability_checker]
   ============================================================================ */

.rush-checker {
  font:                    inherit;               /* ← inherits Blocksy body font */
  color:                   var(--rc-text-primary);
  background:              var(--rc-bg);
  border-radius:           var(--rc-radius-lg);
  box-shadow:              var(--rc-shadow);
  border:                  1px solid var(--rc-neutral-border);
  padding:                 2rem 2rem 1.875rem;
  max-width:               520px;
  margin:                  0 auto;
  -webkit-font-smoothing:  antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Brand strip */
.rush-checker__brand {
  display:       flex;
  align-items:   center;
  gap:           0.5rem;
  margin-bottom: 1.25rem;
}

.rush-checker__brand-name {
  font-size:      0.75rem;
  font-weight:    900;
  letter-spacing: -0.04em;
  color:          var(--rc-accent);
  line-height:    1;
  text-transform: uppercase;
}

.rush-checker__brand-tagline {
  font-size:      0.6875rem;
  font-weight:    600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color:          var(--rc-text-muted);
  padding-left:   0.5rem;
  border-left:    1px solid var(--rc-neutral-border);
}

/* Headline */
.rush-checker__headline {
  font-size:      1.5rem;
  font-weight:    800;
  letter-spacing: -0.035em;
  color:          var(--rc-text-primary);
  margin:         0 0 0.375rem;
  line-height:    1.2;
}

.rush-checker__subline {
  font-size:   0.9rem;
  font-weight: 500;
  color:       var(--rc-text-secondary);
  margin:      0 0 1.625rem;
}

/* GPS / Check Availability button — primary CTA */
.rush-checker__gps-btn {
  display:         flex;
  align-items:     center;
  justify-content: center;
  gap:             0.625rem;
  width:           100%;
  padding:         0.9375rem 1.5rem;
  font:            inherit;
  font-size:       1.0625rem;
  font-weight:     700;
  color:           #FFFFFF;          /* always white on accent-orange — safe */
  background:      var(--rc-accent);
  border:          none;
  border-radius:   var(--rc-radius-sm);
  cursor:          pointer;
  letter-spacing:  -0.015em;
  transition:      var(--rc-transition);
  line-height:     1;
}

.rush-checker__gps-btn:hover:not([aria-busy="true"]) {
  background:  var(--rc-accent-dark);
  transform:   translateY(-2px);
  box-shadow:  0 6px 20px var(--rc-accent-glow);
}

.rush-checker__gps-btn:active:not([aria-busy="true"]) {
  transform:  translateY(0);
  box-shadow: none;
}

.rush-checker__gps-btn[aria-busy="true"],
.rush-checker__gps-btn--loading {
  cursor:    default;
  animation: rush-pulse 1.3s ease-in-out infinite;
}

.rush-checker__gps-icon {
  font-size:   1.125rem;
  flex-shrink: 0;
}

.rush-checker__gps-label {
  line-height: 1;
}

/* Result block */
.rush-checker__result {
  display:    none;
  margin-top: 1.125rem;
}

.rush-checker__result.rush-result--loading,
.rush-checker__result.rush-result--available,
.rush-checker__result.rush-result--unavailable,
.rush-checker__result.rush-result--denied,
.rush-checker__result.rush-result--error {
  display: block;
}

/* Loading inline strip */
.rush-result--loading {
  display:       flex !important;
  align-items:   center;
  gap:           0.625rem;
  padding:       0.875rem 1rem;
  background:    var(--rc-neutral-bg);
  border:        1.5px solid var(--rc-neutral-border);
  border-radius: var(--rc-radius-sm);
  font-size:     0.9375rem;
  font-weight:   600;
  /* Loading text: use primary text, not muted — muted (#94A3B8-#64748B) can
     fail contrast on light neutral backgrounds. */
  color:         var(--rc-text-primary, #0F172A);
  animation:     rush-fade-in 0.25s ease;
}

/* ============================================================================
   HERO CTA — [rush_check_availability]
   ============================================================================ */

.rush-hero-cta {
  display:        inline-flex;
  flex-direction: column;
  gap:            0.875rem;
  font:           inherit;
  -webkit-font-smoothing: antialiased;
}

.rush-hero-cta__btn {
  display:         inline-flex;
  align-items:     center;
  gap:             0.5rem;
  padding:         0.8125rem 1.75rem;
  font:            inherit;
  font-size:       1rem;
  font-weight:     700;
  color:           #FFFFFF;
  background:      var(--rc-accent);
  border:          none;
  border-radius:   var(--rc-radius-sm);
  cursor:          pointer;
  letter-spacing:  -0.01em;
  transition:      var(--rc-transition);
  line-height:     1;
}

.rush-hero-cta__btn:hover:not([aria-busy="true"]) {
  background:  var(--rc-accent-dark);
  transform:   translateY(-2px);
  box-shadow:  0 6px 20px var(--rc-accent-glow);
}

.rush-hero-cta__btn[aria-busy="true"],
.rush-hero-cta__btn--loading {
  cursor:    default;
  animation: rush-pulse 1.3s ease-in-out infinite;
}

.rush-hero-cta__icon {
  font-size:   1rem;
  flex-shrink: 0;
}

.rush-hero-cta__result {
  max-width: 420px;
  display:   none;
}

.rush-hero-cta__result.rush-result--loading,
.rush-hero-cta__result.rush-result--available,
.rush-hero-cta__result.rush-result--unavailable,
.rush-hero-cta__result.rush-result--denied,
.rush-hero-cta__result.rush-result--error {
  display: block;
}

/* ============================================================================
   RESULT CARDS — shared by both shortcodes
   ============================================================================ */

.rush-result-card {
  border-radius: var(--rc-radius-md);
  padding:       1.25rem 1.375rem;
  box-shadow:    var(--rc-shadow-card);
  animation:     rush-fade-in 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  font:          inherit;
}

/* ── Available card ──────────────────────────────────────────────────────────── */
.rush-result-card--available {
  background: var(--rc-success-bg);
  border:     1.5px solid var(--rc-success-border);
  color:      var(--rc-text-primary);
}

.rush-result-card__header {
  display:       flex;
  align-items:   center;
  gap:           0.625rem;
  margin-bottom: 1rem;
}

.rush-result-card__icon {
  font-size:   1.25rem;
  flex-shrink: 0;
  line-height: 1;
}

.rush-result-card__title {
  font-size:   1rem;
  font-weight: 700;
  line-height: 1.3;
  color:       var(--rc-success);
}

/* Available meta rows */
.rush-result-card__meta {
  display:        flex;
  flex-direction: column;
  gap:            0.5rem;
  padding:        0.875rem 0;
  border-top:     1px solid var(--rc-success-dim);
  border-bottom:  1px solid var(--rc-success-dim);
  margin-bottom:  1rem;
}

.rush-result-card__row {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  gap:             0.5rem;
}

.rush-result-card__label {
  font-size:   0.8125rem;
  font-weight: 500;
  /* Secondary label inside card: needs to be readable against #F0FDF4 bg.
     Explicit fallback to #475569 ensures WCAG AA (4.8:1 on white/light-green). */
  color:       var(--rc-text-secondary, #475569);
}

.rush-result-card__value {
  font-size:      0.9375rem;
  font-weight:    700;
  color:          var(--rc-text-primary);
  letter-spacing: -0.02em;
}

/* ETA pill */
.rush-result-card__eta {
  display:     inline-flex;
  align-items: center;
  padding:     0.2rem 0.625rem;
  background:  var(--rc-success-dim);
  color:       var(--rc-success);
  border-radius: 999px;
  font-size:   0.875rem;
  font-weight: 800;
}

/* ── Coming-soon / unavailable card ──────────────────────────────────────────── */
.rush-result-card--unavailable {
  background: var(--rc-coming-bg);
  border:     1px solid rgba(255, 107, 53, 0.25);
  color:      var(--rc-coming-text);
  position:   relative;
  overflow:   hidden;
}

/* Subtle radial glow in the top-right */
.rush-result-card--unavailable::before {
  content:        '';
  position:       absolute;
  top:            -40px;
  right:          -40px;
  width:          160px;
  height:         160px;
  background:     radial-gradient(circle, rgba(255, 107, 53, 0.18) 0%, transparent 70%);
  pointer-events: none;
}

.rush-result-card--unavailable .rush-result-card__icon--soon {
  font-size: 1.5rem;
}

.rush-result-card--unavailable .rush-result-card__title-group {
  display:        flex;
  flex-direction: column;
  gap:            0.125rem;
}

.rush-result-card--unavailable .rush-result-card__title {
  color:     var(--rc-coming-text);
  font-size: 0.9375rem;
}

.rush-result-card--unavailable .rush-result-card__subtitle {
  font-size:      0.75rem;
  font-weight:    700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color:          var(--rc-coming-accent);
}

.rush-result-card__hook {
  font-size:   0.875rem;
  color:       var(--rc-coming-sub);
  margin:      0.75rem 0 1rem;
  line-height: 1.5;
}

/* ── CTAs inside result cards ─────────────────────────────────────────────────── */
.rush-result-card__cta {
  display:         flex;
  align-items:     center;
  justify-content: center;
  width:           100%;
  padding:         0.75rem 1rem;
  font:            inherit;
  font-size:       0.9375rem;
  font-weight:     700;
  text-decoration: none;
  border-radius:   var(--rc-radius-sm);
  cursor:          pointer;
  letter-spacing:  -0.01em;
  transition:      var(--rc-transition);
  line-height:     1;
  text-align:      center;
}

/* "Start Shopping" — solid green */
.rush-result-card__cta--primary {
  background: var(--rc-success);
  color:      #FFFFFF;
}

.rush-result-card__cta--primary:hover {
  background:      #15803D;
  transform:       translateY(-1px);
  box-shadow:      0 4px 12px rgba(22, 163, 74, 0.30);
  color:           #FFFFFF;
  text-decoration: none;
}

/* "Shop EVENFALL" — orange outline on dark bg */
.rush-result-card__cta--secondary {
  background:  transparent;
  color:       var(--rc-coming-accent);
  border:      2px solid var(--rc-coming-accent);
}

.rush-result-card__cta--secondary:hover {
  background:      var(--rc-coming-accent);
  color:           #FFFFFF;
  transform:       translateY(-1px);
  box-shadow:      0 4px 12px var(--rc-accent-glow);
  text-decoration: none;
}

/* ── Denied card ─────────────────────────────────────────────────────────────── */
.rush-result-card--denied {
  display:     flex;
  align-items: center;
  gap:         0.625rem;
  background:  var(--rc-denied-bg);
  border:      1.5px solid var(--rc-denied-border);
  color:       var(--rc-denied-text);
}

.rush-result-card--denied .rush-result-card__title {
  font-size:   0.9rem;
  font-weight: 600;
  color:       var(--rc-denied-text);
}

/* ── Error card ──────────────────────────────────────────────────────────────── */
.rush-result-card--error {
  display:     flex;
  align-items: center;
  gap:         0.625rem;
  background:  var(--rc-error-bg);
  border:      1.5px solid var(--rc-error-border);
  color:       var(--rc-error-text);
  font-size:   0.9rem;
  font-weight: 600;
}

/* ============================================================================
   SPINNER
   ============================================================================ */
.rush-spinner {
  display:       inline-block;
  width:         1.125rem;
  height:        1.125rem;
  border:        2.5px solid var(--rc-neutral-border);
  border-top:    2.5px solid var(--rc-accent);
  border-radius: 50%;
  animation:     rush-spin 0.7s linear infinite;
  flex-shrink:   0;
}

/* ============================================================================
   ANIMATIONS
   ============================================================================ */
@keyframes rush-spin {
  to { transform: rotate(360deg); }
}

@keyframes rush-fade-in {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes rush-pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.6; }
}

/* ============================================================================
   DARK VARIANT — add class "rush-checker--dark" for hero-on-dark-bg use
   ============================================================================ */
.rush-checker--dark {
  background:              rgba(15, 23, 42, 0.88);
  border-color:            rgba(255, 255, 255, 0.08);
  backdrop-filter:         blur(16px);
  -webkit-backdrop-filter: blur(16px);
  color:                   #F1F5F9;
}

.rush-checker--dark .rush-checker__headline   { color: #F1F5F9; }
.rush-checker--dark .rush-checker__subline    { color: #94A3B8; }
.rush-checker--dark .rush-checker__brand-tagline { color: #64748B; }

/* ============================================================================
   WIDE VARIANT — add class "rush-checker--wide" to stretch to container
   ============================================================================ */
.rush-checker--wide { max-width: 100%; }

/* ============================================================================
   RESPONSIVE
   ============================================================================ */
@media ( max-width: 480px ) {

  .rush-checker {
    padding:       1.5rem 1.25rem 1.5rem;
    border-radius: var(--rc-radius-md);
  }

  .rush-checker__headline {
    font-size: 1.25rem;
  }

  .rush-result-card {
    padding: 1rem 1.125rem;
  }

  .rush-result-card__row {
    flex-direction: column;
    align-items:    flex-start;
    gap:            0.1875rem;
  }

  .rush-result-card__value {
    font-size: 1rem;
  }
}