/*
  Men's Bodyland theme system
  - theme.css owns every color, surface, border, shadow, and status token.
  - style.css owns layout, component structure, animation, responsiveness, and utilities.
  - Add new themes by overriding the same token set on a new [data-theme="..."] selector.
  - System mode is represented by the absence of data-theme and follows prefers-color-scheme.
*/

:root {
  color-scheme: light;

  /* Core palette */
  --mbl-black: #050505;
  --mbl-white: #ffffff;
  --mbl-page-hero-mid: #120f0a;
  --mbl-brand-ink: #050505;
  --mbl-ink: #1d1710;
  --mbl-ink-2: #050505;
  --mbl-charcoal: #050505;
  --mbl-surface: #f3ece0;
  --mbl-surface-2: #e6dac8;
  --mbl-paper: #fbf7ef;
  --mbl-gold: #d6aa60;
  --mbl-gold-dark: #9b6f31;
  --mbl-gold-soft: #f6e4b5;
  --mbl-accent-text: #805a24;
  --mbl-muted: #6c6256;
  --mbl-clay: #050505;
  --mbl-text: var(--mbl-ink);
  --mbl-primary: var(--mbl-brand-ink);

  /* RGB channels for alpha-composed colors in style.css */
  --mbl-black-rgb: 5 5 5;
  --mbl-white-rgb: 255 255 255;
  --mbl-shadow-rgb: 0 0 0;
  --mbl-service-dark-rgb: 15 12 8;
  --mbl-built-bg-rgb: 20 20 24;
  --mbl-built-hover-bg-rgb: 30 30 36;
  --mbl-success-rgb: 37 211 102;
  --mbl-gold-rgb: 182 132 60;
  --mbl-warning-rgb: 200 154 91;
  --mbl-built-glow-rgb: 212 175 99;
  --mbl-gold-bright-rgb: 224 188 114;
  --mbl-cookie-accent-rgb: 244 194 143;
  --mbl-gold-soft-rgb: 246 228 181;

  /* Global surfaces, borders, and shadows */
  --mbl-line: rgb(var(--mbl-black-rgb) / 0.13);
  --mbl-body-bg: radial-gradient(circle at 18% -12%, rgb(var(--mbl-gold-soft-rgb) / 0.18), transparent 34rem), linear-gradient(180deg, var(--mbl-paper), var(--mbl-surface));
  --mbl-link-decoration: rgb(var(--mbl-warning-rgb) / 0.5);
  --mbl-shadow: 0 18px 55px rgb(var(--mbl-black-rgb) / 0.17);
  --mbl-card-shadow: 0 16px 46px rgb(var(--mbl-black-rgb) / 0.08);
  --mbl-focus-shadow: 0 0 0 3px rgb(var(--mbl-gold-bright-rgb) / 0.12);
  --mbl-focus-ring: rgb(var(--mbl-gold-rgb) / 0.2);
  --mbl-radius: 8px;
  --mbl-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mbl-meta-theme-color: #fbf7ef;

  /* Brand metal treatment */
  --mbl-metal-stops: #B6843C 0%, #CFA255 18%, #E0BC72 35%, #F1D99B 46%, #F6E4B5 50%, #F1D99B 54%, #E0BC72 65%, #CFA255 82%, #B6843C 100%;
  --mbl-metal-gradient: linear-gradient(45deg, var(--mbl-metal-stops));
  --mbl-metal-gradient-hover: linear-gradient(-45deg, var(--mbl-metal-stops));

  /* Header and navigation */
  --mbl-topbar-bg: rgb(251 247 239 / 0.94);
  --mbl-topbar-color: #1d1710;
  --mbl-topbar-muted: rgb(29 23 16 / 0.62);
  --mbl-topbar-line: rgb(var(--mbl-gold-bright-rgb) / 0.2);
  --mbl-header-bg: rgb(var(--mbl-black-rgb) / 0.92);
  --mbl-header-line: rgb(var(--mbl-gold-rgb) / 0.22);
  --mbl-nav-text: #d6c09b;
  --mbl-nav-active-text: #f1d99b;
  --mbl-nav-pill-bg: rgb(var(--mbl-gold-soft-rgb) / 0.16);
  --mbl-logo-light-display: block;
  --mbl-logo-dark-display: none;
  --mbl-mobile-menu-bg: linear-gradient(180deg, rgb(var(--mbl-gold-soft-rgb) / 0.08), transparent 32%), var(--mbl-black);

  /* Buttons and controls */
  --mbl-button-primary-text: var(--mbl-black);
  --mbl-button-primary-shadow: 0 11px 28px rgb(var(--mbl-gold-rgb) / 0.26), inset 0 1px 0 rgb(var(--mbl-white-rgb) / 0.38);
  --mbl-button-hover-bg: var(--mbl-black);
  --mbl-button-light-bg: var(--mbl-black);
  --mbl-button-light-border: rgb(var(--mbl-gold-soft-rgb) / 0.86);
  --mbl-button-light-shadow: inset 0 0 0 1px rgb(var(--mbl-gold-bright-rgb) / 0.42);
  --mbl-button-light-hover-shadow: inset 0 0 0 1px rgb(var(--mbl-gold-soft-rgb) / 0.64), var(--mbl-focus-shadow), 0 11px 26px rgb(var(--mbl-shadow-rgb) / 0.22);
  --mbl-switch-bg: rgb(var(--mbl-white-rgb) / 0.04);
  --mbl-switch-border: rgb(var(--mbl-gold-bright-rgb) / 0.36);
  --mbl-switch-text: rgb(var(--mbl-white-rgb) / 0.86);

  /* Status colors */
  --mbl-status-open: #35c46a;
  --mbl-status-closed: #e14646;
  --mbl-success: #25d366;
  --mbl-warning: #c89a5b;
  --mbl-danger: #e14646;
  --mbl-info: #d6aa60;
  --mbl-success-bg: rgb(var(--mbl-success-rgb) / 0.12);
  --mbl-success-border: rgb(var(--mbl-success-rgb) / 0.36);
  --mbl-warning-bg: rgb(var(--mbl-warning-rgb) / 0.16);
  --mbl-warning-border: rgb(var(--mbl-warning-rgb) / 0.42);

  /* Page and component surfaces */
  --mbl-price-bg: rgb(var(--mbl-white-rgb) / 0.54);
  --mbl-price-line: rgb(var(--mbl-gold-rgb) / 0.28);
  --mbl-treatment-footer-bg: linear-gradient(180deg, rgb(var(--mbl-gold-soft-rgb) / 0.26), rgb(var(--mbl-gold-rgb) / 0.12));
  --mbl-section-muted-bg: linear-gradient(180deg, rgb(var(--mbl-gold-rgb) / 0.07), transparent 32%), var(--mbl-surface);
  --mbl-card-highlight-bg: linear-gradient(180deg, rgb(var(--mbl-gold-soft-rgb) / 0.12), rgb(var(--mbl-white-rgb) / 0.02));
  --mbl-card-highlight-bg-strong: linear-gradient(180deg, rgb(var(--mbl-gold-soft-rgb) / 0.13), rgb(var(--mbl-white-rgb) / 0.02));
  --mbl-card-highlight-bg-soft: linear-gradient(180deg, rgb(var(--mbl-gold-soft-rgb) / 0.08), rgb(var(--mbl-white-rgb) / 0.02));
  --mbl-hero-overlay: radial-gradient(circle at 70% 22%, rgb(var(--mbl-gold-rgb) / 0.22), transparent 27rem), linear-gradient(90deg, rgb(var(--mbl-black-rgb) / 0.9), rgb(var(--mbl-black-rgb) / 0.54) 54%, rgb(var(--mbl-black-rgb) / 0.18));
  --mbl-service-hero-overlay: radial-gradient(circle at 72% 18%, rgb(var(--mbl-gold-rgb) / 0.18), transparent 26rem), linear-gradient(0deg, rgb(var(--mbl-black-rgb) / 0.9), rgb(var(--mbl-black-rgb) / 0.32));
  --mbl-service-intro-overlay: radial-gradient(circle at 76% 20%, rgb(var(--mbl-gold-soft-rgb) / 0.18), transparent 24rem), linear-gradient(90deg, rgb(var(--mbl-black-rgb) / 0.96), rgb(var(--mbl-service-dark-rgb) / 0.86) 48%, rgb(var(--mbl-black-rgb) / 0.64));
  --mbl-service-card-bg: var(--mbl-black);
  --mbl-service-card-border: rgb(var(--mbl-gold-bright-rgb) / 0.22);
  --mbl-service-card-overlay: linear-gradient(180deg, transparent 34%, rgb(var(--mbl-black-rgb) / 0.84));
  --mbl-page-hero-bg: radial-gradient(circle at 75% 16%, rgb(var(--mbl-gold-soft-rgb) / 0.18), transparent 27rem), linear-gradient(120deg, var(--mbl-black), var(--mbl-page-hero-mid) 54%, var(--mbl-black));
  --mbl-prices-header-overlay: linear-gradient(90deg, rgb(var(--mbl-black-rgb) / 0.86), rgb(var(--mbl-black-rgb) / 0.46));
  --mbl-prices-pill-bg: rgb(var(--mbl-black-rgb) / 0.74);
  --mbl-prices-pill-border: rgb(var(--mbl-white-rgb) / 0.16);
  --mbl-prices-pill-text: rgb(var(--mbl-white-rgb) / 0.82);
  --mbl-about-hero-overlay: linear-gradient(90deg, rgb(var(--mbl-black-rgb) / 0.95), rgb(var(--mbl-black-rgb) / 0.72));
  --mbl-contact-card-bg: radial-gradient(circle at 85% 12%, rgb(var(--mbl-gold-soft-rgb) / 0.16), transparent 18rem), var(--mbl-black);
  --mbl-contact-card-border: rgb(var(--mbl-gold-bright-rgb) / 0.28);
  --mbl-account-message-bg: rgb(var(--mbl-gold-rgb) / 0.12);
  --mbl-account-message-border: rgb(var(--mbl-gold-rgb) / 0.24);

  /* Dark fixed sections */
  --mbl-on-dark: var(--mbl-white);
  --mbl-on-dark-muted: rgb(var(--mbl-white-rgb) / 0.86);
  --mbl-on-dark-soft: rgb(var(--mbl-white-rgb) / 0.78);
  --mbl-on-dark-faint: rgb(var(--mbl-white-rgb) / 0.58);
  --mbl-on-dark-line: rgb(var(--mbl-white-rgb) / 0.14);
  --mbl-footer-closed-days-title: rgb(var(--mbl-white-rgb) / 0.72);
  --mbl-footer-bg: radial-gradient(circle at 20% 0%, rgb(var(--mbl-gold-rgb) / 0.15), transparent 26rem), var(--mbl-black);
  --mbl-footer-line: rgb(var(--mbl-gold-bright-rgb) / 0.24);
  --mbl-footer-text: rgb(var(--mbl-white-rgb) / 0.78);
  --mbl-footer-link: rgb(var(--mbl-white-rgb) / 0.86);
  --mbl-footer-link-muted: rgb(var(--mbl-white-rgb) / 0.58);
  --mbl-footer-link-hover-bg: rgb(var(--mbl-white-rgb) / 0.08);
  --mbl-footer-link-hover: rgb(var(--mbl-white-rgb) / 0.86);

  /* Booking band */
  --mbl-booking-band-bg: radial-gradient(circle at 14% 18%, rgb(var(--mbl-gold-soft-rgb) / 0.42), transparent 20rem), var(--mbl-metal-gradient);
  --mbl-booking-band-text: var(--mbl-black);
  --mbl-booking-band-muted: rgb(var(--mbl-black-rgb) / 0.72);

  /* Floating widgets and partner badge */
  --mbl-built-by-bg: rgb(var(--mbl-built-bg-rgb) / 0.38);
  --mbl-built-by-border: rgb(var(--mbl-white-rgb) / 0.18);
  --mbl-built-by-shadow: 0 10px 30px rgb(var(--mbl-shadow-rgb) / 0.45), inset 0 1px 0 rgb(var(--mbl-white-rgb) / 0.25), inset 0 -1px 0 rgb(var(--mbl-white-rgb) / 0.06);
  --mbl-built-by-hover-bg: rgb(var(--mbl-built-hover-bg-rgb) / 0.48);
  --mbl-built-by-hover-shadow: 0 18px 50px rgb(var(--mbl-shadow-rgb) / 0.55), 0 0 18px rgb(var(--mbl-built-glow-rgb) / 0.25), inset 0 1px 0 rgb(var(--mbl-white-rgb) / 0.35);
  --mbl-whatsapp-bg: #25D366;
  --mbl-whatsapp-shadow: 0 10px 24px rgb(var(--mbl-shadow-rgb) / 0.22);
  --mbl-cookie-float-bg: #050507;
  --mbl-cookie-float-hover-bg: #0b0b0f;
  --mbl-cookie-float-accent: #f4c28f;

  /* CookieConsent vendor variables, overridden after the vendor stylesheet is loaded. */
  --cc-font-family: var(--mbl-font);
  --cc-bg: var(--mbl-paper);
  --cc-primary-color: var(--mbl-ink);
  --cc-secondary-color: var(--mbl-muted);
  --cc-btn-primary-bg: var(--mbl-black);
  --cc-btn-primary-color: var(--mbl-gold-soft);
  --cc-btn-primary-border-color: var(--mbl-black);
  --cc-btn-primary-hover-bg: var(--mbl-gold-dark);
  --cc-btn-primary-hover-color: var(--mbl-black);
  --cc-btn-primary-hover-border-color: var(--mbl-gold-dark);
  --cc-btn-secondary-bg: var(--mbl-surface);
  --cc-btn-secondary-color: var(--mbl-ink);
  --cc-btn-secondary-border-color: var(--mbl-line);
  --cc-btn-secondary-hover-bg: var(--mbl-surface-2);
  --cc-btn-secondary-hover-color: var(--mbl-ink);
  --cc-btn-secondary-hover-border-color: var(--mbl-gold-dark);
  --cc-separator-border-color: var(--mbl-line);
  --cc-toggle-on-bg: var(--mbl-gold-dark);
  --cc-toggle-off-bg: var(--mbl-muted);
  --cc-toggle-on-knob-bg: var(--mbl-black);
  --cc-toggle-off-knob-bg: var(--mbl-paper);
  --cc-toggle-readonly-bg: var(--mbl-surface-2);
  --cc-toggle-readonly-knob-bg: var(--mbl-paper);
  --cc-toggle-readonly-knob-icon-color: var(--mbl-muted);
  --cc-cookie-category-block-bg: var(--mbl-surface);
  --cc-cookie-category-block-border: var(--mbl-line);
  --cc-cookie-category-block-hover-bg: var(--mbl-surface-2);
  --cc-cookie-category-block-hover-border: var(--mbl-line);
  --cc-cookie-category-expanded-block-bg: transparent;
  --cc-cookie-category-expanded-block-hover-bg: var(--mbl-surface-2);
  --cc-overlay-bg: rgb(var(--mbl-shadow-rgb) / 0.65);
  --cc-footer-bg: var(--mbl-surface);
  --cc-footer-color: var(--mbl-muted);
  --cc-footer-border-color: var(--mbl-line);
}

html[data-theme="light"] {
  color-scheme: light;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --mbl-ink: #f4efe5;
  --mbl-ink-2: #ffffff;
  --mbl-charcoal: #050505;
  --mbl-surface: #0d0c0a;
  --mbl-surface-2: #15120d;
  --mbl-paper: #050505;
  --mbl-gold: #e0bc72;
  --mbl-gold-dark: #f1d99b;
  --mbl-gold-soft: #f6e4b5;
  --mbl-accent-text: #f1d99b;
  --mbl-muted: #bdb4a6;
  --mbl-text: var(--mbl-ink);
  --mbl-line: rgb(var(--mbl-gold-bright-rgb) / 0.22);
  --mbl-shadow: 0 18px 55px rgb(var(--mbl-shadow-rgb) / 0.38);
  --mbl-card-shadow: 0 16px 46px rgb(var(--mbl-shadow-rgb) / 0.34);
  --mbl-meta-theme-color: #050505;
  --mbl-header-bg: rgb(var(--mbl-black-rgb) / 0.9);
  --mbl-header-line: rgb(var(--mbl-gold-bright-rgb) / 0.24);
  --mbl-logo-light-display: none;
  --mbl-logo-dark-display: block;
  --mbl-price-bg: rgb(var(--mbl-white-rgb) / 0.055);
  --mbl-price-line: rgb(var(--mbl-gold-bright-rgb) / 0.22);
  --mbl-treatment-footer-bg: linear-gradient(180deg, rgb(var(--mbl-gold-bright-rgb) / 0.09), rgb(var(--mbl-black-rgb) / 0.72));
  --mbl-card-highlight-bg: linear-gradient(180deg, rgb(var(--mbl-gold-soft-rgb) / 0.1), rgb(var(--mbl-white-rgb) / 0.02));
  --mbl-card-highlight-bg-strong: linear-gradient(180deg, rgb(var(--mbl-gold-soft-rgb) / 0.11), rgb(var(--mbl-white-rgb) / 0.02));
  --mbl-card-highlight-bg-soft: linear-gradient(180deg, rgb(var(--mbl-gold-soft-rgb) / 0.08), rgb(var(--mbl-white-rgb) / 0.02));
  --cc-bg: var(--mbl-paper);
  --cc-primary-color: var(--mbl-ink);
  --cc-secondary-color: var(--mbl-muted);
  --cc-btn-primary-bg: var(--mbl-gold-dark);
  --cc-btn-primary-color: var(--mbl-black);
  --cc-btn-primary-border-color: var(--mbl-gold-dark);
  --cc-btn-primary-hover-bg: var(--mbl-gold-soft);
  --cc-btn-primary-hover-color: var(--mbl-black);
  --cc-btn-primary-hover-border-color: var(--mbl-gold-soft);
  --cc-btn-secondary-bg: var(--mbl-surface-2);
  --cc-btn-secondary-color: var(--mbl-ink);
  --cc-btn-secondary-border-color: var(--mbl-line);
  --cc-btn-secondary-hover-bg: #211b13;
  --cc-btn-secondary-hover-color: var(--mbl-ink);
  --cc-btn-secondary-hover-border-color: var(--mbl-gold-dark);
  --cc-footer-bg: var(--mbl-surface);
}

@media (prefers-color-scheme: dark) {
  html:not([data-theme]) {
    color-scheme: dark;
    --mbl-ink: #f4efe5;
    --mbl-ink-2: #ffffff;
    --mbl-charcoal: #050505;
    --mbl-surface: #0d0c0a;
    --mbl-surface-2: #15120d;
    --mbl-paper: #050505;
    --mbl-gold: #e0bc72;
    --mbl-gold-dark: #f1d99b;
    --mbl-gold-soft: #f6e4b5;
    --mbl-accent-text: #f1d99b;
    --mbl-muted: #bdb4a6;
    --mbl-text: var(--mbl-ink);
    --mbl-line: rgb(var(--mbl-gold-bright-rgb) / 0.22);
    --mbl-shadow: 0 18px 55px rgb(var(--mbl-shadow-rgb) / 0.38);
    --mbl-card-shadow: 0 16px 46px rgb(var(--mbl-shadow-rgb) / 0.34);
    --mbl-meta-theme-color: #050505;
    --mbl-header-bg: rgb(var(--mbl-black-rgb) / 0.9);
    --mbl-header-line: rgb(var(--mbl-gold-bright-rgb) / 0.24);
    --mbl-logo-light-display: none;
    --mbl-logo-dark-display: block;
    --mbl-price-bg: rgb(var(--mbl-white-rgb) / 0.055);
    --mbl-price-line: rgb(var(--mbl-gold-bright-rgb) / 0.22);
    --mbl-treatment-footer-bg: linear-gradient(180deg, rgb(var(--mbl-gold-bright-rgb) / 0.09), rgb(var(--mbl-black-rgb) / 0.72));
    --mbl-card-highlight-bg: linear-gradient(180deg, rgb(var(--mbl-gold-soft-rgb) / 0.1), rgb(var(--mbl-white-rgb) / 0.02));
    --mbl-card-highlight-bg-strong: linear-gradient(180deg, rgb(var(--mbl-gold-soft-rgb) / 0.11), rgb(var(--mbl-white-rgb) / 0.02));
    --mbl-card-highlight-bg-soft: linear-gradient(180deg, rgb(var(--mbl-gold-soft-rgb) / 0.08), rgb(var(--mbl-white-rgb) / 0.02));
    --cc-bg: var(--mbl-paper);
    --cc-primary-color: var(--mbl-ink);
    --cc-secondary-color: var(--mbl-muted);
    --cc-btn-primary-bg: var(--mbl-gold-dark);
    --cc-btn-primary-color: var(--mbl-black);
    --cc-btn-primary-border-color: var(--mbl-gold-dark);
    --cc-btn-primary-hover-bg: var(--mbl-gold-soft);
    --cc-btn-primary-hover-color: var(--mbl-black);
    --cc-btn-primary-hover-border-color: var(--mbl-gold-soft);
    --cc-btn-secondary-bg: var(--mbl-surface-2);
    --cc-btn-secondary-color: var(--mbl-ink);
    --cc-btn-secondary-border-color: var(--mbl-line);
    --cc-btn-secondary-hover-bg: #211b13;
    --cc-btn-secondary-hover-color: var(--mbl-ink);
    --cc-btn-secondary-hover-border-color: var(--mbl-gold-dark);
    --cc-footer-bg: var(--mbl-surface);
  }
}
