html[data-mav-palette="clinical-blue"]{
  /* Project palette */
  --accent-1: var(--color-cblue-700);
  --accent-2: var(--color-cblue-100);
  --accent-3: var(--color-slate-900);
  --contrast-max: #000;
  --contrast-lg: var(--color-zinc-800);
  --contrast-md: var(--color-zinc-500);
  --contrast-sm: var(--color-gray-300);
  --contrast-xs: var(--color-gray-200);
  --contrast-none: #fff;
  --bg-primary: hsl(45 40% 98%);
  --bg-secondary:  hsl(42 38% 95%);
  --bg-tertiary: var(--color-zinc-800);
  --bg-quaternary: var(--color-zinc-950);

  --hover-accent1: var(--color-cblue-600);
  --hover-accent2:var(--color-cblue-300);
  --hover-conmax: var(--contrast-lg);
  --hover-connone: var(--contrast-xs);
  --hover-consm: var(--contrast-md);
}

html[data-mav-palette="emerald"]{
  /* Project palette */
  --accent-1: var(--color-emerald-600);
  --accent-2: var(--color-emerald-300);
  --accent-3: var(--color-emerald-900);
  --contrast-max: #000;
  --contrast-lg: var(--color-zinc-800);
  --contrast-md: var(--color-zinc-500);
  --contrast-sm: var(--color-gray-300);
  --contrast-xs: var(--color-gray-200);
  --contrast-none: #fff;
  --bg-primary: hsl(45 40% 98%);
  --bg-secondary:  hsl(42 38% 95%);
  --bg-tertiary: var(--color-zinc-800);
  --bg-quaternary: var(--color-zinc-950);

  --hover-accent1: var(--color-emerald-700);
  --hover-accent2:var(--color-emerald-400);
  --hover-conmax: var(--contrast-lg);
  --hover-connone: var(--contrast-xs);
  --hover-consm: var(--contrast-md);

  --header-bg-top-act: var(--header-bg);
  --header-color-top-act: var(--header-color);
}

html[data-mav-palette="indigo"]{
  /* Project palette */
  --accent-1: var(--color-indigo-600);
  --accent-2: var(--color-indigo-300);
  --accent-3: var(--color-indigo-900);
  --contrast-max: #000;
  --contrast-lg: var(--color-zinc-800);
  --contrast-md: var(--color-zinc-500);
  --contrast-sm: var(--color-gray-300);
  --contrast-xs: var(--color-gray-200);
  --contrast-none: #fff;
  --bg-primary: hsl(45 40% 98%);
  --bg-secondary:  hsl(42 38% 95%);
  --bg-tertiary: var(--color-zinc-800);
  --bg-quaternary: var(--color-zinc-950);

  --hover-accent1: var(--color-indigo-700);
  --hover-accent2:var(--color-indigo-400);
  --hover-conmax: var(--contrast-lg);
  --hover-connone: var(--contrast-xs);
  --hover-consm: var(--contrast-md);
}

html[data-mav-palette="orange"]{
  /* Project palette */
  --accent-1: var(--color-orange-600);
  --accent-2: var(--color-orange-300);
  --accent-3: var(--color-orange-900);
  --contrast-max: #000;
  --contrast-lg: var(--color-zinc-800);
  --contrast-md: var(--color-zinc-500);
  --contrast-sm: var(--color-gray-300);
  --contrast-xs: var(--color-gray-200);
  --contrast-none: #fff;
  --bg-primary: hsl(45 40% 98%);
  --bg-secondary:  hsl(42 38% 95%);
  --bg-tertiary: var(--color-zinc-800);
  --bg-quaternary: var(--color-zinc-950);

  --hover-accent1: var(--color-orange-700);
  --hover-accent2:var(--color-orange-400);
  --hover-conmax: var(--contrast-lg);
  --hover-connone: var(--contrast-xs);
  --hover-consm: var(--contrast-md);
}

html[data-mav-palette="olive-light"]{
  /* Project palette */
  --accent-1: var(--color-olive-600) ;
  --accent-2: var(--color-olive-200);
  --accent-3: var(--color-slate-900);
  --contrast-max: #000;
  --contrast-lg: var(--color-zinc-800);
  --contrast-md: var(--color-zinc-500);
  --contrast-sm: var(--color-gray-300);
  --contrast-xs: var(--color-gray-200);
  --contrast-none: #fff;
  --bg-primary: hsl(45 40% 98%);
  --bg-secondary:  hsl(42 38% 95%);
  --bg-tertiary: var(--color-zinc-800);
  --bg-quaternary: var(--color-zinc-950);

  --hover-accent1: var(--color-olive-500);
  --hover-accent2:var(--color-olive-300);
  --hover-conmax: var(--contrast-md);
  --hover-connone: var(--contrast-xs);
  --hover-consm: var(--contrast-xs);
}

html[data-mav-palette="olive-dark"]{
  /* Project palette */
  --accent-1: var(--color-olive-400) ;
  --accent-2: var(--color-olive-800);
  --accent-3: var(--color-slate-200);
  --contrast-max:#fff;
  --contrast-lg: var(--color-gray-200);
  --contrast-md: var(--color-gray-300);
  --contrast-sm: var(--color-zinc-500);
  --contrast-xs: var(--color-zinc-900);
  --contrast-none: #000;
  --bg-primary: var(--color-zinc-950);
  --bg-secondary: var(--contrast-xs);
  --bg-tertiary: hsl(42 38% 95%);
  --bg-quaternary: hsl(45 40% 98%);

  --hover-accent1: var(--color-olive-300);
  --hover-accent2:var(--color-olive-700);
  --hover-conmax: var(--contrast-md);
  --hover-connone: var(--contrast-xs);
  --hover-consm: var(--contrast-xs);
}

html[data-mav-palette="solar-light"]{
  --mav-palette-switcher: hidden;
  --primary-0: #FEF3C7; /* amber-100 */
  --primary-1: #FBBF24; /* amber-400 */
  --primary-2: #FCD34D; /* amber-300 */
  --primary-3: #F59E0B; /* amber-500 */
  --primary-4: #D97706; /* amber-600 */
  --primary-5: #78350F; /* amber-900 */
  --secondary-1: #7E22CE; /* purple-700 */
  --secondary-2: #581C87; /* purple-900 */
  --secondary-3: #A855F7; /* purple-500 */
  --secondary-5: #C084FC; /* purple-400 */
  --sblue-1: #38BDF8; /* sky-400 */
  --sblue-2: #BAE6FD; /* sky-200 */
  --sblue-3: #E0F2FE; /* sky-100 */
  --sblue-5: #7DD3FC; /* sky-300 */
  --sblue-6: #06B6D4; /* cyan-500 */
  --sblue-7: #0369A1;
  --sgreen-2: #65A30D; /* lime-600 */
  --sred-1: #EF4444; /* red-500 */
  --screen-red: #E11D48; /* rose-600 */
  --screen-green: #22C55E; /* green-500 */
  --screen-muted: #94A3B8; /* slate-400 */
  --screen-address: #F1F5F9; /* slate-100 */
  --contrast-max: #0F172A; /* slate-900 */
  --contrast-lg: #475569; /* slate-600 */
  --contrast-none: var(--color-white);
  --border-default: #E2E8F0; /* slate-200 */
  --soller-phone-shadow:
    0 0 10px color-mix(in srgb, var(--color-black) 7%, transparent),
    0 20px 25px -5px color-mix(in srgb, var(--color-black) 10%, transparent);
  --soller-floating-card-shadow:
    0 0 15px color-mix(in srgb, var(--color-black) 7%, transparent),
    0 25px 50px -12px color-mix(in srgb, var(--color-black) 25%, transparent);
  --soller-button-shadow:
    0 0 2px color-mix(in srgb, var(--color-black) 7%, transparent),
    0 1px 3px color-mix(in srgb, var(--color-black) 10%, transparent);
  --soller-macbook-shadow:
    drop-shadow(0 0 7.5px color-mix(in srgb, var(--color-black) 7%, transparent))
    drop-shadow(0 25px 25px color-mix(in srgb, var(--color-black) 25%, transparent));

  --header-height-mobile:56px;
  --header-height-desktop:96px;
  --header-color-top:var(--contrast-max);
  --header-bg:var(--contrast-none);
  --cnav-link-hover:var(--primary-4);
}

html[data-mav-palette="lovable-light"] {
  --mav-palette-switcher: hidden;
  --primary-0: #F3F1FF;
  --primary-1: #DDD6FE;
  --primary-2: #C4B5FD;
  --primary-3: #A78BFA;
  --primary-4: #7C3AED;
  --primary-5: #4C1D95;
  --secondary-1: #DBEAFE;
  --secondary-2: #BFDBFE;
  --secondary-3: #60A5FA;
  --secondary-4: #2563EB;
  --secondary-5: #1E3A8A;
  --bg-primary: #FCFBF8;
  --bg-secondary: #F7F4ED;
  --bg-tertiary: #F0EFEC;
  --contrast-max: #030303;
  --contrast-lg: #636363;
  --contrast-md: #777771;
  --contrast-sm: #A09F9B;
  --contrast-none: #FAFAFA;
  --border-default: #ECEAE4;
  --border-strong: #D9D7D1;

  --header-height-mobile: 64px;
  --header-bg-top: transparent;
  --header-color-top: var(--contrast-max);
  --header-bg: var(--bg-primary);
  --header-color: var(--contrast-max);
  --header-border: var(--bg-secondary);
  --header-transition-duration: 300ms;
  --header-transition-easing: cubic-bezier(0.4, 0, 0.2, 1);
  --cnav-mega-shadow:
    0 0 0 1px var(--contrast-none),
    0 0 0 1px var(--bg-primary),
    0 0 0 2px rgb(119 119 113 / 16%),
    0 2px 1px rgb(0 0 0 / 4%),
    0 2px 1px -0.5px rgb(0 0 0 / 4%),
    0 4px 3px -1.5px rgb(0 0 0 / 4%),
    0 7px 6px -3px rgb(0 0 0 / 4%);
}

html[data-mav-palette="mintlify-dark"] {
  --mav-palette-switcher: hidden;

  --bg-primary: #08090a;
  --contrast-max: var(--color-white);
  --border-default: #1e1f21;
  --brand: #18e299;

  --header-height-mobile: 64px;

  --cnav-mega-shadow:
    0 164px 46px 0 transparent,
    0 105px 42px 0 transparent,
    0 59px 36px 0 rgb(0 0 0 / 1%),
    0 26px 26px 0 rgb(0 0 0 / 2%),
    0 7px 14px 0 rgb(0 0 0 / 2%);
}

html[data-mav-palette="breakio"] {
  --bg-primary: var(--color-white);
  --bg-secondary: #F1F5F9; /* Tailwind v3 slate-100 */
  --bg-tertiary: #FDF4FF; /* Tailwind v3 fuchsia-50 */

  --contrast-max: #0F172A; /* Tailwind v3 slate-900 */
  --contrast-lg: #475569; /* Tailwind v3 slate-600 */
  --contrast-md: #94A3B8; /* Tailwind v3 slate-400 */
  --contrast-none: var(--color-white);

  --border-default: #CBD5E1; /* Tailwind v3 slate-300 */
  --border-subtle: #E2E8F0; /* Tailwind v3 slate-200 */

  --primary-1: #C026D3; /* Tailwind v3 fuchsia-600 */
  --primary-2: #86198F; /* Tailwind v3 fuchsia-800 */
  --primary-3: #701A75; /* Tailwind v3 fuchsia-900 */

  --badge-bg: #DBEAFE; /* Tailwind v3 blue-100 */
  --badge-text: #1E40AF; /* Tailwind v3 blue-800 */

  --browser-dot-red: #E11D48; /* Tailwind v3 rose-600 */
  --browser-dot-yellow: #FBBF24; /* Tailwind v3 amber-400 */
  --browser-dot-green: #22C55E; /* Tailwind v3 green-500 */

  --hero-image-shadow:
    12px 12px 0 var(--contrast-max);
  --story-card-shadow:
    0 0 4px rgba(0, 0, 0, 0.07),
    0 4px 6px -1px rgba(0, 0, 0, 0.10);
  --story-card-shadow-hover:
  0 1px 5px rgba(0, 0, 0, 0.09),
  0 8px 12px -2px rgba(0, 0, 0, 0.15);
  --testimonial-card-shadow:
    0 0 6px rgba(0, 0, 0, 0.07),
    0 10px 15px -3px rgba(0, 0, 0, 0.10);

  --header-height-mobile: 67px;
  --header-height-desktop: 96px;
}

html[data-mav-palette="teach"] {
    --bg-primary: #FFFFFF;
    --bg-secondary: #F1F5F9;
    --bg-tertiary: #0F172A;
    --surface-strong: #334155;

    --contrast-max: #0F172A;
    --contrast-lg: #475569;
    --contrast-md: #64748B;
    --contrast-sm: #94A3B8;
    --contrast-none: #FFFFFF;
    --contrast-soft: #E2E8F0;
    --contrast-black: #000000;

    --accent-1: #EA580C;
    --accent-2: #FB923C;
    --accent-3: #FACC15;
    --accent-4: #2563EB;
    --accent-5: #FEF08A;

    --badge-featured-bg: #F3E8FF;
    --badge-featured-text: #6B21A8;
    --badge-popular-bg: #DBEAFE;
    --badge-popular-text: #1E40AF;
    --badge-new-bg: #DCFCE7;
    --badge-new-text: #166534;

    --border-default: #CBD5E1;
    --border-soft: var(--contrast-soft);
    --border-strong: var(--surface-strong);

    --shadow-button: 0 0 2px rgb(0 0 0 / 0.07), 0 1px 3px rgb(0 0 0 / 0.10);
    --shadow-card-sm: 0 0 4px rgb(0 0 0 / 0.07), 0 4px 6px -1px rgb(0 0 0 / 0.10);
    --shadow-card: 0 0 6px rgb(0 0 0 / 0.07), 0 10px 15px -3px rgb(0 0 0 / 0.10);
    --shadow-panel: 0 0 10px rgb(0 0 0 / 0.07), 0 20px 25px -5px rgb(0 0 0 / 0.10);
    --shadow-media: 0 0 15px rgb(0 0 0 / 0.07), 0 25px 50px -12px rgb(0 0 0 / 0.25);
    --header-height-mobile: 67px;
    --header-height-desktop: 96px;

    --screen-red: #E11D48;
    --screen-yellow: #FBBF24;
    --screen-green: #22C55E;
}

html[data-mav-palette="solar-light-ele"] {
  --mav-palette-switcher: hidden;

  --bg-primary: #FFFFFF;
  --bg-secondary: #F1F5F9;

  --primary-0: #FEF3C7;
  --primary-1: #FBBF24;
  --primary-2: #FCD34D;
  --primary-3: #F59E0B;
  --primary-4: #D97706;
  --primary-5: #78350F;

  --secondary-1: #7E22CE;
  --secondary-2: #581C87;
  --secondary-3: #A855F7;
  --secondary-5: #C084FC;

  --support1-1: #38BDF8;
  --support1-2: #BAE6FD;
  --support1-3: #E0F2FE;
  --support1-5: #7DD3FC;
  --support1-6: #06B6D4;
  --support1-7: #0369A1;

  --support2-2: #65A30D;
  --support3-1: #EF4444;

  --contrast-max: #0F172A;
  --contrast-lg: #475569;
  --contrast-md: #94A3B8;
  --contrast-none: #FFFFFF;

  --border-default: #E2E8F0;

  --browser-dot-red: #E11D48;
  --browser-dot-green: #22C55E;

  --screen-red: var(--browser-dot-red);
  --screen-green: var(--browser-dot-green);
  --screen-muted: var(--contrast-md);
  --screen-address: var(--bg-secondary);

  --header-height-mobile: 56px;
  --header-height-desktop: 96px;
  --header-color-top: var(--contrast-max);
  --header-bg: var(--contrast-none);
  --cnav-link-hover: var(--primary-4);

  --soller-phone-shadow:
    0 0 10px color-mix(in srgb, var(--color-black) 7%, transparent),
    0 20px 25px -5px color-mix(in srgb, var(--color-black) 10%, transparent);

  --soller-floating-card-shadow:
    0 0 15px color-mix(in srgb, var(--color-black) 7%, transparent),
    0 25px 50px -12px color-mix(in srgb, var(--color-black) 25%, transparent);

  --soller-button-shadow:
    0 0 2px color-mix(in srgb, var(--color-black) 7%, transparent),
    0 1px 3px color-mix(in srgb, var(--color-black) 10%, transparent);

  --soller-macbook-shadow:
    drop-shadow(0 0 7.5px color-mix(in srgb, var(--color-black) 7%, transparent))
    drop-shadow(0 25px 25px color-mix(in srgb, var(--color-black) 25%, transparent));
}

html[data-mav-palette="teach-ele"] {
    --bg-primary: #fff;
    --bg-secondary: #f1f5f9;
    --bg-tertiary: #0f172a;
    --surface-strong: #334155;

    --contrast-max: #0f172a;
    --contrast-lg: #475569;
    --contrast-md: #64748b;
    --contrast-sm: #94a3b8;
    --contrast-none: #fff;
    --contrast-black: #000;

    --border-default: #cbd5e1;
    --border-subtle: #e2e8f0;

    --primary-0: #fef08a;
    --primary-1: #ea580c;
    --primary-2: #fb923c;
    --primary-3: #facc15;

    --secondary-1: #6b21a8;
    --secondary-2: #f3e8ff;

    --support1-1: #2563eb;
    --support1-2: #dbeafe;
    --support1-3: #1e40af;

    --support2-1: #dcfce7;
    --support2-2: #166534;

    --browser-dot-red: #e11d48;
    --browser-dot-yellow: #fbbf24;
    --browser-dot-green: #22c55e;

    --shadow-button: 0 0 2px rgb(0 0 0 / .07), 0 1px 3px rgb(0 0 0 / .1);
    --shadow-card-sm: 0 0 4px rgb(0 0 0 / .07), 0 4px 6px -1px rgb(0 0 0 / .1);
    --shadow-card: 0 0 6px rgb(0 0 0 / .07), 0 10px 15px -3px rgb(0 0 0 / .1);
    --shadow-panel: 0 0 10px rgb(0 0 0 / .07), 0 20px 25px -5px rgb(0 0 0 / .1);
    --shadow-media: 0 0 15px rgb(0 0 0 / .07), 0 25px 50px -12px rgb(0 0 0 / .25);

    --header-height-mobile: 67px;
    --header-height-desktop: 96px;
}

[data-mav-palette-switcher]{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

[data-mav-palette-option]{
  border: 1px solid color-mix(in srgb, var(--contrast-lg) 18%, transparent);
  border-radius: 999px;
  background-color: var(--bg-primary);
  color: var(--contrast-lg);
  cursor: pointer;
  font: inherit;
  line-height: 1;
  padding: 10px 14px;
  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
    border-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
    color 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

[data-mav-palette-option]:hover{
  background-color: var(--accent-2);
  border-color: color-mix(in srgb, var(--accent-1) 24%, transparent);
}

[data-mav-palette-option][aria-pressed="true"]{
  background-color: var(--accent-1);
  border-color: var(--accent-1);
  color: var(--contrast-none);
}