/* event-html — shared CSS variables & A/B body variant defaults */

:root {
  --font-size: 16px;
  --background: #ffffff;
  --foreground: #0f172a;
  --primary: #2563eb;
  --primary-foreground: #ffffff;
  --border: rgba(0, 0, 0, 0.1);
  --radius: 0.625rem;
}

/* A 시안 — light */
body.variant-a {
  --background: #ffffff;
  --foreground: #0f172a;
  --primary: #2563eb;
  color: var(--foreground);
  background-color: var(--background);
}

body.variant-a #page {
  background-color: #ffffff;
  color: #0f172a;
}

/* A 시안 z-index stack
   Modal > Mobile Menu > Chatbot Window > Floating Chat > Mobile Sticky CTA > Header > Content */
body.variant-a {
  --z-page: 1;
  --z-header: 500;
  --z-sticky-cta: 650;
  --z-scroll-top: 680;
  --z-floating-chat: 750;
  --z-chatbot-window: 900;
  --z-mobile-menu: 850;
  --z-modal: 1100;
}

body.variant-a .site-header {
  z-index: var(--z-header);
}

body.variant-a .mobile-sticky-cta {
  z-index: var(--z-sticky-cta);
}

body.variant-a .floating-ai-chat-wrap {
  z-index: var(--z-floating-chat);
}

body.variant-a .cbmc-scroll-top {
  z-index: var(--z-scroll-top);
}

body.variant-a [data-mobile-menu-panel] {
  z-index: var(--z-mobile-menu);
}

body.variant-a .cbmc-modal-overlay {
  z-index: var(--z-modal) !important;
}

body.variant-a .dmex-desk-messenger,
body.variant-a #dmex-floating .dmex-desk-messenger {
  z-index: var(--z-chatbot-window) !important;
}

/* B 시안 — dark conference */
body.variant-b {
  --background: #041018;
  --foreground: #f8fafc;
  --primary: #06b6d4;
  color: var(--foreground);
  background-color: var(--background);
}

body.variant-b #page {
  background-color: transparent;
  color: var(--foreground);
}

/* B 시안 z-index stack */
body.variant-b {
  --z-header: 500;
  --z-day-tabs: 400;
  --z-floating-cta: 450;
  --z-scroll-top: 455;
  --z-mobile-sticky: 400;
  --z-floating-chat: 460;
  --z-modal: 1100;
  --z-mobile-menu: 850;
}

body.variant-b .b-site-header {
  z-index: var(--z-header);
}

body.variant-b .b-day-tabs-bar {
  z-index: var(--z-day-tabs);
}

body.variant-b .cbmc-modal-overlay {
  z-index: var(--z-modal) !important;
}

body.variant-b [data-mobile-menu-panel] {
  z-index: var(--z-mobile-menu);
}

body.variant-b .floating-early-bird-cta {
  z-index: var(--z-floating-cta);
}

body.variant-b .mobile-sticky-cta-dark {
  z-index: var(--z-mobile-sticky);
}

body.variant-b .floating-ai-chat-wrap-dark {
  z-index: var(--z-floating-chat);
}

body.variant-b .cbmc-scroll-top {
  z-index: var(--z-scroll-top);
}

/* Admin — DashStack Light Style 1 (mapped from style.css Figma tokens) */
body.variant-admin {
  /* Color */
  --background: var(--ds-main-bg);
  --foreground: var(--ds-text-primary);
  --card: var(--ds-card-bg);
  --border: var(--ds-card-border);
  --input-bg: var(--ds-main-bg);
  --table-head: var(--ds-card-bg);
  --primary: var(--ds-accent);
  --primary-hover: var(--ds-accent-cta);
  --primary-foreground: var(--ds-nav-active-text);
  --primary-soft: var(--ds-accent-soft);
  --primary-border: var(--ds-accent-border);
  --sub-text: var(--ds-text-secondary);
  --caption: var(--ds-text-caption);
  --row-hover: var(--ds-row-hover);
  --hover: var(--ds-row-hover);
  --secondary: var(--ds-nav-text);
  --success: #00B69B;
  --success-hover: #009882;
  --warning: #FCBE2D;
  --error: #FD5454;
  --error-hover: #E04B4B;
  --sidebar-bg: var(--ds-sidebar-bg);
  --topbar-bg: var(--ds-topbar-bg);
  --nav-hover-text: var(--primary);
  --nav-active-bg: var(--ds-nav-active-bg);
  --nav-active-text: var(--ds-nav-active-text);
  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: var(--ds-section-gap);
  --card-padding: var(--ds-card-padding);
  --page-padding: var(--ds-page-padding);
  --section-spacing: var(--ds-section-spacing);
  --title-bottom: var(--ds-title-bottom);
  --form-gap: var(--ds-form-gap);
  /* Radius */
  --radius-sm: var(--ds-control-radius);
  --radius-md: var(--ds-card-radius);
  --radius-lg: var(--ds-card-radius);
  --radius-nav-active: var(--ds-tab-radius);
  --radius-full: 999px;
  /* Shadow */
  --shadow-card: var(--ds-card-shadow);
  --shadow-card-hover: var(--ds-card-hover-shadow);
  --shadow-header: none;
  --shadow-focus: var(--ds-focus-ring);
  /* Typography */
  --font-admin: 'Nunito Sans', 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-page-title: var(--ds-font-page-title);
  --font-section-title: var(--ds-font-section-title);
  --font-card-title: var(--ds-font-card-title);
  --font-subtitle: var(--ds-font-subtitle);
  --font-label: var(--ds-font-label);
  --font-body: var(--ds-font-body);
  --font-table-head: var(--ds-font-table-head);
  --font-table-body: var(--ds-font-table-body);
  --font-caption: var(--ds-font-caption);
  /* Motion */
  --transition-fast: var(--ds-transition-fast);
  --transition-card: var(--ds-transition-card);
  /* Z-index */
  --z-header: 500;
  --z-toast: 1200;
  --z-modal: 1300;
  color: var(--foreground);
  background-color: var(--background);
}