@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');

:root {
  /* TCH Brand Colors - Matching Theme */
  --brand-primary: #F0BC5E;
  --brand-dark: #D4A142;
  --brand-light: #F5D084;
  --brand-accent: #2DD4BF;
  --brand-neutral: #6B7280;
  
  /* Legacy variable mapping */
  --primary: var(--brand-primary);
  --primary-dark: var(--brand-dark);
  --primary-light: var(--brand-light);
  
  --secondary: #B8D4B8;
  --secondary-light: #D4E6D4;
  --secondary-dark: #9BC49B;
  
  /* Base Colors */
  --white: #FFFFFF;
  --cream: #FAF9F7;
  --light-gray: #E5E7EB;
  --medium-gray: #9CA3AF;
  --dark-gray: #374151;
  --text-primary: #2C2C2C;
  --text-secondary: #6B7280;
  
  /* Typography */
  --font-heading: 'Bebas Neue', sans-serif;
  --font-body: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-primary: var(--font-heading);
  --font-seconday: var(--font-body);
  
  /* Typography Scale */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 3.75rem;

  /* Layout */
  --page-padding-top: 80px;
  --header-height: 80px;
  --header-height-mobile: 80px;
  --sticky-nav-offset: 80px;
  --sticky-scroll-margin: 140px;
}

.bg-primary { background-color: var(--primary); }
.bg-primary-dark { background-color: var(--primary-dark); }
.bg-primary-light { background-color: var(--primary-light); }
.bg-secondary { background-color: var(--secondary); }
.bg-secondary-light { background-color: var(--secondary-light); }
.bg-secondary-dark { background-color: var(--secondary-dark); }
.bg-cream { background-color: var(--cream); }
.bg-light-gray { background-color: var(--light-gray-1); }

.text-primary { color: var(--text-primary); }
.text-secondary { color: var(--text-secondary); }
.text-sage { color: var(--primary); }
.text-white { color: var(--white); }

.border-primary { border-color: var(--primary); }
.border-secondary { border-color: var(--secondary); }
.border-light { border-color: var(--light-gray-1); }

.font-primary { font-family: var(--font-primary); }
.font-seconday { font-family: var(--font-seconday); }

.bg-accent {
    background-color: var(--primary);
}

.plugin-page {
  padding-top: 80px;
  font-family: var(--font-body);
  background: white;
}

.plugin-page .content-body p {
  font-size: 1.125rem;
  line-height: 1.8;
  color: #374151;
  margin-bottom: 1.5rem;
}


.choices__inner {
    border: 2px solid var(--light-gray) !important;
    border-radius: 0.75rem !important;
    padding: 0.75rem !important;
    min-height: auto !important;
    background-color: var(--white) !important;
}

.choices__inner:focus {
    border-color: var(--primary) !important;
}

.choices__list--multiple .choices__item {
    background-color: var(--primary) !important;
    border: 1px solid var(--primary) !important;
    border-radius: 0.5rem !important;
}

.choices__list--dropdown {
    border: 2px solid var(--light-gray) !important;
    border-radius: 0.75rem !important;
    margin-top: 0.25rem !important;
}

.choices__item--choice {
    padding: 0.75rem !important;
}

.choices__item--choice.is-highlighted {
    background-color: var(--light-gray) !important;
}

.choices[data-type*=select-multiple] .choices__button {
    border-left: 1px solid rgba(255, 255, 255, 0.5) !important;
}

.booking-form {
  background-color: var(--white);
  border: 1px solid var(--light-gray);
  font-family: var(--font-sans);
}

.btn-primary {
  background-color: var(--primary);
  color: var(--white);
  font-family: var(--font-sans);
}

.btn-primary:hover {
  background-color: var(--primary-dark);
}

.btn-secondary {
  background-color: var(--secondary);
  color: var(--primary);
  font-family: var(--font-sans);
}

.btn-secondary:hover {
  background-color: var(--secondary-dark);
}


/* Plugin-specific styles only - CMS classes are loaded from theme */

[x-cloak] { display: none !important; }