/* =====================================================================
   MUEVO · Extra theme scopes for the Component Library browser
   Two new token scopes that match the four advertised themes:
     .muevo-theme-purple   — Modern Purple · clean SaaS, violet primary
     .muevo-theme-minimal  — Minimal Light · neutral white, clinic-clean
   (Luxury Gold = .muevo-theme-luxury, Wellness Green = .muevo-theme-modern
    already live in muevo-tokens.css.)
   ===================================================================== */

/* ---------------------------------------------------------------------
   MODERN PURPLE — clean SaaS, friendly, violet accent
   --------------------------------------------------------------------- */
.muevo-theme-purple{
  --muevo-primary:        #6d4aed;
  --muevo-primary-strong: #5a37d8;
  --muevo-primary-deep:   #4827b8;
  --muevo-on-primary:     #ffffff;
  --muevo-secondary:      #1b1530;
  --muevo-accent:         #9a7cf6;

  --muevo-background:     #f6f5fc;
  --muevo-surface:        #ffffff;
  --muevo-surface-soft:   #f4f2fb;
  --muevo-surface-2:      #ece8f8;

  --muevo-text:           #171327;
  --muevo-text-soft:      #3b3658;
  --muevo-text-muted:     #6f6a8a;
  --muevo-text-faint:     #a39ec0;

  --muevo-border:         rgba(23,19,39,.10);
  --muevo-border-soft:    rgba(23,19,39,.06);
  --muevo-border-strong:  rgba(109,74,237,.34);
  --muevo-border-opacity: 1;
  --muevo-stroke-width:   1px;

  --muevo-success:        #1f9d6b;
  --muevo-success-bg:     rgba(31,157,107,.12);
  --muevo-warning:        #cf8a1f;
  --muevo-warning-bg:     rgba(207,138,31,.12);
  --muevo-error:          #dc4b4b;
  --muevo-error-bg:       rgba(220,75,75,.10);
  --muevo-info:           #4a6ff0;
  --muevo-info-bg:        rgba(74,111,240,.10);

  --muevo-cal-available:      #f6f5fc;
  --muevo-cal-available-ink:  var(--muevo-text-soft);
  --muevo-cal-selected:       var(--muevo-primary);
  --muevo-cal-selected-ink:   #ffffff;
  --muevo-cal-limited:        rgba(207,138,31,.14);
  --muevo-cal-limited-ink:    #a96f12;
  --muevo-cal-unavailable:    transparent;
  --muevo-cal-unavailable-ink:var(--muevo-text-faint);
  --muevo-cal-closed:         repeating-linear-gradient(135deg, rgba(23,19,39,.05) 0 5px, transparent 5px 10px);

  --muevo-status-confirmed:   #1f9d6b;
  --muevo-status-pending:     #cf8a1f;
  --muevo-status-cancelled:   #dc4b4b;
  --muevo-status-completed:   #4a6ff0;
  --muevo-status-noshow:      #8a86a0;

  --muevo-gift:           #c356a0;
  --muevo-gift-2:         #7c5cf6;
  --muevo-package:        #4a6ff0;
  --muevo-membership:     #6d4aed;

  --muevo-tier-bronze:    #c08552;
  --muevo-tier-silver:    #9fa0b0;
  --muevo-tier-gold:      #d8a93f;
  --muevo-tier-platinum:  #8f8fb0;

  --muevo-radius-sm:      8px;
  --muevo-radius-md:      12px;
  --muevo-radius-lg:      18px;
  --muevo-radius-xl:      24px;
  --muevo-radius-card:    var(--muevo-radius-lg);
  --muevo-radius-btn:     12px;
  --muevo-radius-input:   10px;

  --muevo-shadow-sm:      0 2px 10px -4px rgba(74,39,184,.16), 0 1px 2px rgba(23,19,39,.05);
  --muevo-shadow-md:      0 16px 36px -16px rgba(74,39,184,.24), 0 2px 6px rgba(23,19,39,.05);
  --muevo-shadow-lg:      0 36px 70px -30px rgba(74,39,184,.30), 0 4px 10px rgba(23,19,39,.06);
  --muevo-shadow-color:   rgba(109,74,237,.34);

  --muevo-font:           'Manrope', system-ui, sans-serif;
  --muevo-font-display:   'Sora', system-ui, sans-serif;
  --muevo-font-mono:      'JetBrains Mono', ui-monospace, monospace;
  --muevo-font-scale:     1;
  --muevo-display-weight: 600;
  --muevo-label-spacing:  .12em;
  --muevo-label-transform:uppercase;

  --muevo-glass:          rgba(255,255,255,.72);
  --muevo-feature-fill:   linear-gradient(180deg, rgba(109,74,237,.08), #ffffff 52%);
}

/* ---------------------------------------------------------------------
   MINIMAL LIGHT — neutral white, professional clinic, ink primary
   --------------------------------------------------------------------- */
.muevo-theme-minimal{
  --muevo-primary:        #23262e;
  --muevo-primary-strong: #15171c;
  --muevo-primary-deep:   #0c0d11;
  --muevo-on-primary:     #ffffff;
  --muevo-secondary:      #5b6170;
  --muevo-accent:         #3f4654;

  --muevo-background:     #fafafa;
  --muevo-surface:        #ffffff;
  --muevo-surface-soft:   #f5f5f6;
  --muevo-surface-2:      #ededee;

  --muevo-text:           #191b20;
  --muevo-text-soft:      #3d4047;
  --muevo-text-muted:     #71757e;
  --muevo-text-faint:     #a6aab2;

  --muevo-border:         rgba(20,22,28,.12);
  --muevo-border-soft:    rgba(20,22,28,.07);
  --muevo-border-strong:  rgba(20,22,28,.26);
  --muevo-border-opacity: 1;
  --muevo-stroke-width:   1px;

  --muevo-success:        #2f8f63;
  --muevo-success-bg:     rgba(47,143,99,.11);
  --muevo-warning:        #b9821f;
  --muevo-warning-bg:     rgba(185,130,31,.11);
  --muevo-error:          #cc4b41;
  --muevo-error-bg:       rgba(204,75,65,.09);
  --muevo-info:           #3f6fb0;
  --muevo-info-bg:        rgba(63,111,176,.10);

  --muevo-cal-available:      #f5f5f6;
  --muevo-cal-available-ink:  var(--muevo-text-soft);
  --muevo-cal-selected:       var(--muevo-primary);
  --muevo-cal-selected-ink:   #ffffff;
  --muevo-cal-limited:        rgba(185,130,31,.14);
  --muevo-cal-limited-ink:    #9a6c16;
  --muevo-cal-unavailable:    transparent;
  --muevo-cal-unavailable-ink:var(--muevo-text-faint);
  --muevo-cal-closed:         repeating-linear-gradient(135deg, rgba(20,22,28,.05) 0 5px, transparent 5px 10px);

  --muevo-status-confirmed:   #2f8f63;
  --muevo-status-pending:     #b9821f;
  --muevo-status-cancelled:   #cc4b41;
  --muevo-status-completed:   #3f6fb0;
  --muevo-status-noshow:      #8a8e96;

  --muevo-gift:           #8a6d9c;
  --muevo-gift-2:         #5b6170;
  --muevo-package:        #5b6170;
  --muevo-membership:     #23262e;

  --muevo-tier-bronze:    #b07d52;
  --muevo-tier-silver:    #9aa0a8;
  --muevo-tier-gold:      #c79a3c;
  --muevo-tier-platinum:  #6b7280;

  --muevo-radius-sm:      6px;
  --muevo-radius-md:      10px;
  --muevo-radius-lg:      14px;
  --muevo-radius-xl:      18px;
  --muevo-radius-card:    var(--muevo-radius-lg);
  --muevo-radius-btn:     8px;
  --muevo-radius-input:   8px;

  --muevo-shadow-sm:      0 2px 6px -2px rgba(20,22,28,.08), 0 1px 2px rgba(20,22,28,.05);
  --muevo-shadow-md:      0 10px 24px -12px rgba(20,22,28,.16), 0 2px 5px rgba(20,22,28,.04);
  --muevo-shadow-lg:      0 26px 54px -24px rgba(20,22,28,.20), 0 3px 8px rgba(20,22,28,.05);
  --muevo-shadow-color:   rgba(20,22,28,.20);

  --muevo-font:           'Manrope', system-ui, sans-serif;
  --muevo-font-display:   'Manrope', system-ui, sans-serif;
  --muevo-font-mono:      'JetBrains Mono', ui-monospace, monospace;
  --muevo-font-scale:     1;
  --muevo-display-weight: 700;
  --muevo-label-spacing:  .1em;
  --muevo-label-transform:uppercase;

  --muevo-glass:          rgba(255,255,255,.74);
  --muevo-feature-fill:   linear-gradient(180deg, rgba(20,22,28,.04), #ffffff 52%);
}

/* ============================================================
   .muevo-theme-glass  —  Frosted Glass
   Folded from the (now-removed) Appearance page's makeSkin('glass').
   Violet accent, translucent white surfaces, blurred panels floating
   over a soft tinted gradient. Token-driven so every component inherits
   the look automatically.
   ============================================================ */
.muevo-theme-glass{
  --muevo-primary:        #6d4aed;
  --muevo-primary-strong: #5a37d8;
  --muevo-primary-deep:   #4827b8;
  --muevo-on-primary:     #ffffff;
  --muevo-secondary:      #1b1530;
  --muevo-accent:         #9a7cf6;

  --muevo-background:     transparent;
  --muevo-surface:        rgba(255,255,255,.42);
  --muevo-surface-soft:   rgba(255,255,255,.30);
  --muevo-surface-2:      rgba(255,255,255,.22);

  --muevo-text:           #1c1733;
  --muevo-text-soft:      #3b3658;
  --muevo-text-muted:     #564f74;
  --muevo-text-faint:     #837da6;

  --muevo-border:         rgba(255,255,255,.55);
  --muevo-border-soft:    rgba(255,255,255,.38);
  --muevo-border-strong:  rgba(109,74,237,.40);
  --muevo-border-opacity: 1;
  --muevo-stroke-width:   1px;

  --muevo-success:#1f9d6b; --muevo-success-bg:rgba(31,157,107,.16);
  --muevo-warning:#cf8a1f; --muevo-warning-bg:rgba(207,138,31,.16);
  --muevo-error:#dc4b4b;   --muevo-error-bg:rgba(220,75,75,.14);
  --muevo-info:#4a6ff0;    --muevo-info-bg:rgba(74,111,240,.14);

  --muevo-cal-available:      rgba(255,255,255,.30);
  --muevo-cal-available-ink:  var(--muevo-text-soft);
  --muevo-cal-selected:       var(--muevo-primary);
  --muevo-cal-selected-ink:   #ffffff;
  --muevo-cal-limited:        rgba(207,138,31,.20);
  --muevo-cal-limited-ink:    #8a5a12;
  --muevo-cal-unavailable:    transparent;
  --muevo-cal-unavailable-ink:var(--muevo-text-faint);
  --muevo-cal-closed:         repeating-linear-gradient(135deg, rgba(28,23,51,.05) 0 5px, transparent 5px 10px);

  --muevo-status-confirmed:#1f9d6b; --muevo-status-pending:#cf8a1f; --muevo-status-cancelled:#dc4b4b; --muevo-status-completed:#4a6ff0; --muevo-status-noshow:#8a86a0;

  --muevo-gift:#c356a0; --muevo-gift-2:#7c5cf6; --muevo-package:#4a6ff0; --muevo-membership:#6d4aed;
  --muevo-tier-bronze:#c08552; --muevo-tier-silver:#9fa0b0; --muevo-tier-gold:#d8a93f;

  --muevo-glass:          rgba(255,255,255,.42);

  /* the soft tinted backdrop the frosted panels float over */
  background:
    radial-gradient(120% 120% at 0% 0%,   rgba(109,74,237,.30), transparent 60%),
    radial-gradient(120% 120% at 100% 100%, rgba(229,84,127,.20), transparent 55%),
    linear-gradient(135deg, rgba(109,74,237,.24), rgba(59,130,246,.13) 55%, rgba(229,84,127,.15));
}

/* Frost the primary panels/containers. Large surfaces only — small chips keep
   their translucent fill without blur (performance + legibility). Unknown
   selectors here are simply no-ops on components that don't use them. */
.muevo-theme-glass .mv-card,
.muevo-theme-glass .mv-stat,
.muevo-theme-glass .mv-cat-cell,
.muevo-theme-glass .mv-status-banner,
.muevo-theme-glass .mv-phone,
.muevo-theme-glass .mv-resv .when,
.muevo-theme-glass .mv-hcal,
.muevo-theme-glass .mv-pricing .pcard{
  -webkit-backdrop-filter: blur(14px) saturate(1.25);
  backdrop-filter: blur(14px) saturate(1.25);
  box-shadow: 0 14px 44px rgba(40,30,110,.22);
}