/*
 * SPA Specials brand theme
 * ---------------------------------------------------------------------------
 * Emerald:         #0F3D37
 * Deep Forest:     #102721
 * Pale Sage:       #B7C8B1
 * Ivory:           #F7F3EC
 * Champagne Gold:  #CDAA6D
 * ---------------------------------------------------------------------------
 * Mapped to Vuexy / Bootstrap CSS variables so the whole UI inherits the brand.
 */

:root,
[data-bs-theme='light'] {
  /* Brand tokens */
  --spa-emerald: #0f3d37;
  --spa-deep-forest: #102721;
  --spa-pale-sage: #b7c8b1;
  --spa-ivory: #f7f3ec;
  --spa-champagne-gold: #cdaa6d;

  /* Core theme colors */
  --bs-primary: #cdaa6d;
  --bs-secondary: #b7c8b1;
  --bs-dark: #0f3d37;
  --bs-light: #f7f3ec;

  --bs-primary-rgb: 205, 170, 109;
  --bs-secondary-rgb: 183, 200, 177;
  --bs-dark-rgb: 15, 61, 55;
  --bs-light-rgb: 247, 243, 236;

  --bs-primary-text-emphasis: #102721;
  --bs-secondary-text-emphasis: #0f3d37;
  --bs-dark-text-emphasis: #0f3d37;
  --bs-light-text-emphasis: #102721;

  --bs-primary-bg-subtle: #f5edd9;
  --bs-secondary-bg-subtle: #eef3ec;
  --bs-dark-bg-subtle: #d9e3e0;
  --bs-light-bg-subtle: #fbf9f5;

  --bs-primary-border-subtle: #e4d2a8;
  --bs-secondary-border-subtle: #d5e0d1;
  --bs-dark-border-subtle: #9bb3ad;
  --bs-light-border-subtle: #ebe6dc;

  --bs-primary-contrast: #102721;
  --bs-secondary-contrast: #102721;
  --bs-dark-contrast: #f7f3ec;
  --bs-light-contrast: #102721;

  /* Surfaces & text */
  --bs-body-bg: #f7f3ec;
  --bs-body-bg-rgb: 247, 243, 236;
  --bs-body-color: #102721;
  --bs-body-color-rgb: 16, 39, 33;
  --bs-heading-color: #0f3d37;
  --bs-emphasis-color: #0f3d37;
  --bs-emphasis-color-rgb: 15, 61, 55;
  --bs-secondary-color: #5f736c;
  --bs-secondary-color-rgb: 95, 115, 108;
  --bs-secondary-bg: #e8eee5;
  --bs-secondary-bg-rgb: 232, 238, 229;
  --bs-tertiary-bg: #ebe6dc;
  --bs-tertiary-bg-rgb: 235, 230, 220;

  --bs-paper-bg: #ffffff;
  --bs-paper-bg-rgb: 255, 255, 255;
  --bs-base-color: #0f3d37;
  --bs-base-color-rgb: 15, 61, 55;

  --bs-border-color: #dde5d8;
  --bs-border-color-translucent: rgba(15, 61, 55, 0.1);

  /* Links follow primary */
  --bs-link-color: #cdaa6d;
  --bs-link-color-rgb: 205, 170, 109;
  --bs-link-hover-color: #b8944f;
  --bs-link-hover-color-rgb: 184, 148, 79;

  --bs-custom-link-color: var(--bs-primary);
  --bs-navbar-bg: var(--bs-paper-bg);

  /* Menu / sidebar */
  --bs-menu-bg: var(--bs-paper-bg);
  --bs-menu-bg-rgb: var(--bs-paper-bg-rgb);
  --bs-menu-color: #0f3d37;
  --bs-menu-color-rgb: 15, 61, 55;
  --bs-menu-hover-bg: color-mix(in sRGB, var(--bs-base-color) 6%, var(--bs-menu-bg));
  --bs-menu-hover-color: #0f3d37;
  --bs-menu-sub-active-bg: color-mix(in sRGB, var(--bs-base-color) 8%, var(--bs-menu-bg));
  --bs-menu-sub-active-color: #0f3d37;
  --bs-menu-active-color: var(--bs-primary-contrast);
  --bs-menu-active-bg: var(--bs-primary);
  --bs-menu-horizontal-active-bg: var(--bs-primary-bg-subtle);
  --bs-menu-box-shadow: 0 0.125rem 0.5rem 0 rgba(16, 39, 33, 0.12);
  --bs-menu-header-color: var(--bs-heading-color);
}

[data-bs-theme='dark'] {
  --bs-primary: #cdaa6d;
  --bs-secondary: #b7c8b1;
  --bs-dark: #0f3d37;
  --bs-light: #f7f3ec;

  --bs-primary-rgb: 205, 170, 109;
  --bs-secondary-rgb: 183, 200, 177;
  --bs-dark-rgb: 15, 61, 55;
  --bs-light-rgb: 247, 243, 236;

  --bs-primary-text-emphasis: #e4d2a8;
  --bs-secondary-text-emphasis: #d5e0d1;
  --bs-dark-text-emphasis: #b7c8b1;
  --bs-light-text-emphasis: #f7f3ec;

  --bs-primary-bg-subtle: #3a3424;
  --bs-secondary-bg-subtle: #2a3832;
  --bs-dark-bg-subtle: #1a332e;
  --bs-light-bg-subtle: #3a3832;

  --bs-primary-border-subtle: #6e5c3a;
  --bs-secondary-border-subtle: #4d5f4c;
  --bs-dark-border-subtle: #2f524a;
  --bs-light-border-subtle: #5a574e;

  --bs-primary-contrast: #102721;
  --bs-secondary-contrast: #102721;
  --bs-dark-contrast: #f7f3ec;
  --bs-light-contrast: #102721;

  --bs-body-bg: #102721;
  --bs-body-bg-rgb: 16, 39, 33;
  --bs-body-color: #f7f3ec;
  --bs-body-color-rgb: 247, 243, 236;
  --bs-heading-color: #f7f3ec;
  --bs-emphasis-color: #f7f3ec;
  --bs-emphasis-color-rgb: 247, 243, 236;
  --bs-secondary-color: #b7c8b1;
  --bs-secondary-color-rgb: 183, 200, 177;
  --bs-secondary-bg: #1a332e;
  --bs-secondary-bg-rgb: 26, 51, 46;
  --bs-tertiary-bg: #24403a;
  --bs-tertiary-bg-rgb: 36, 64, 58;

  --bs-paper-bg: #0f3d37;
  --bs-paper-bg-rgb: 15, 61, 55;
  --bs-base-color: #f7f3ec;
  --bs-base-color-rgb: 247, 243, 236;

  --bs-border-color: #24403a;
  --bs-border-color-translucent: rgba(247, 243, 236, 0.12);

  --bs-link-color: #cdaa6d;
  --bs-link-color-rgb: 205, 170, 109;
  --bs-link-hover-color: #e4d2a8;
  --bs-link-hover-color-rgb: 228, 210, 168;

  --bs-custom-link-color: var(--bs-primary);
  --bs-navbar-bg: var(--bs-paper-bg);

  /* Dark gray scale (replaces Vuexy purple-gray) */
  --bs-gray-25: #1a332e;
  --bs-gray-50: #1f3a34;
  --bs-gray-75: #24403a;
  --bs-gray-100: #2f524a;
  --bs-gray-200: #3a5f56;
  --bs-gray-300: #5f736c;
  --bs-gray-400: #7a8f87;
  --bs-gray-500: #96a89f;
  --bs-gray-600: #b7c8b1;
  --bs-gray-700: #d5e0d1;
  --bs-gray-800: #e8eee5;
  --bs-gray-900: #f7f3ec;

  /* Menu / sidebar — was hardcoded Vuexy purple #2f3349 */
  --bs-menu-bg: #0f3d37;
  --bs-menu-bg-rgb: 15, 61, 55;
  --bs-menu-active-bg: var(--bs-primary);
  --bs-menu-horizontal-active-bg: #3a3424;
  --bs-menu-color: #f7f3ec;
  --bs-menu-color-rgb: 247, 243, 236;
  --bs-menu-hover-bg: color-mix(in sRGB, var(--bs-base-color) 6%, var(--bs-menu-bg));
  --bs-menu-hover-color: #f7f3ec;
  --bs-menu-sub-active-bg: color-mix(in sRGB, var(--bs-base-color) 8%, var(--bs-menu-bg));
  --bs-menu-sub-active-color: #f7f3ec;
  --bs-menu-box-shadow: 0 0.125rem 0.5rem 0 rgba(16, 39, 33, 0.35);
  --bs-menu-divider-color: transparent;
  --bs-menu-header-color: var(--bs-heading-color);
}

[data-semidark-menu='true'] {
  --bs-menu-bg: #0f3d37;
  --bs-menu-bg-rgb: 15, 61, 55;
  --bs-menu-color: #f7f3ec;
  --bs-menu-color-rgb: 247, 243, 236;
  --bs-menu-hover-color: #f7f3ec;
  --bs-menu-sub-active-color: #f7f3ec;
  --bs-menu-active-bg: var(--bs-primary);
  --bs-menu-horizontal-active-bg: #3a3424;
}

.apexcharts-theme-dark {
  --bs-primary: #cdaa6d;
  --bs-secondary: #b7c8b1;
  --bs-dark: #0f3d37;
  --bs-body-color: #f7f3ec;
  --bs-heading-color: #f7f3ec;
  --bs-paper-bg: #0f3d37;
  --bs-base-color: #f7f3ec;
  --bs-secondary-color: #b7c8b1;
  --bs-border-color: #24403a;
}