/*
* Custom Gymcatch Embed Styling for SB Fitness
*/

:root {
  /* Colors */
  --gc-highlight-color: #a2b42a; /* Primary accent */
  --gc-ok-color: #a2b42a; /* Success messages */
  --gc-error-color: #8f044c; /* Error messages */
  --gc-warning-color: #8f5102; /* Warning messages */
  --gc-foreground-color: #21252b; /* Main text color */
  --gc-foreground-secondary-color: #616165; /* Secondary text color */
  --gc-disabled-color: #767676; /* Disabled elements */
  --gc-background-color: #ffffff; /* Gymcatch container background */
  --gc-background-highlight-color: #d3d3d3; /* Light grey for subtle highlights */

  /* Fonts */
  --gc-font-family: 'Open Sans', sans-serif;
  --gc-header-font-family: 'Oswald', sans-serif;
  --gc-font-size: 16px;
  --gc-font-size-small: 0.85em;
  --gc-font-size-h1: 2em;
  --gc-font-size-h2: 1.75em;
  --gc-font-size-h3: 1.5em;
  --gc-font-size-h4: 1.3em;

  /* Border */
  --gc-border-radius: 5px;
  --gc-border-color: var(--gc-foreground-secondary-color);

  /* Buttons */
  --gc-button-border-radius: var(--gc-border-radius);
  --gc-button-background-color: #a2b42a; /* Match primary accent */
  --gc-button-text-color: #ffffff;
  --gc-button-hover-background-color: #8c9f26;
  --gc-button-disabled-background-color: #d3d3d3;
  --gc-button-disabled-border-color: transparent;

  /* Forms */
  --gc-control-border-radius: var(--gc-border-radius);
  --gc-input-border-color: lightgrey;
  --gc-input-focus-border-color: #a2b42a;

  /* Alerts */
  --gc-alert-color: white;
  --gc-alert-background-color: var(--gc-warning-color);
  --gc-alert-border-radius: var(--gc-border-radius);

  /* Modal */
  --gc-modal-border-radius: var(--gc-border-radius);
  --gc-modal-border-color: var(--gc-foreground-secondary-color);
  --gc-modal-background-color: var(--gc-background-color);
  --gc-modal-overlay-background-color: rgba(10, 10, 10, 0.45);

  /* Table */
  --gc-table-header-background-color: var(--gc-background-highlight-color);
  --gc-table-header-color: #222222;
}

/* Styling the Gymcatch Container */
.gymcatch-container {
  background-color: #ffffff; /* White container */
  padding: 20px;
  border-radius: var(--gc-border-radius);
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
}

/* Page Section Styling */
.sb-fitness-booking-section {
  background-color: #1e699a; /* Section background */
  padding: 50px 0;
  color: #ffffff; /* Ensure readability */
}

/* Buttons */
.gymcatch-container button {
  background-color: var(--gc-button-background-color);
  color: var(--gc-button-text-color);
  border-radius: var(--gc-button-border-radius);
  padding: 10px 15px;
  border: none;
  transition: background 0.3s;
}

.gymcatch-container button:hover {
  background-color: var(--gc-button-hover-background-color);
}