/* 
 * Sleed Brand Guidelines Overrides
 * Applies fonts, colors, and button styles to override default template themes.
 */

:root {
  /* Brand Colors */
  --sleed-green: #00C882;
  --sleed-dark-blue: #293C7C;
  --sleed-light-green: #68DEB4;
  --sleed-pale-green: #BCF0DE;
  --sleed-white: #FFFFFF;
  --sleed-light-gray: #F3F4F6;
  --sleed-gray: #8B8F9E;
  --sleed-dark-gray: #2F3C49;
  --sleed-black: #000000;
  
  --sleed-red: #EF2D56;
  --sleed-yellow: #FFBF00;
  --sleed-light-blue: #06AED5;
  --sleed-orange: #FF6542;
  --sleed-purple: #6320EE;
  
  /* Bootstrap Theme Overrides */
  --bs-primary: var(--sleed-green);
  --bs-primary-rgb: 0, 200, 130;
  --bs-secondary: var(--sleed-dark-blue);
  --bs-secondary-rgb: 41, 60, 124;
  --bs-success: var(--sleed-green);
  --bs-danger: var(--sleed-red);
  --bs-warning: var(--sleed-yellow);
  --bs-info: var(--sleed-light-blue);
  --bs-dark: var(--sleed-dark-gray);
  
  --bs-body-bg: var(--sleed-light-gray);
  --bs-body-color: var(--sleed-dark-gray);
  --bs-heading-color: var(--sleed-black);
  
  --bs-font-sans-serif: 'JetBrains Mono', monospace !important;
  --bs-font-monospace: 'JetBrains Mono', monospace !important;
  --bs-body-font-family: var(--bs-font-sans-serif) !important;
}

/* Typography Overrides */
/* !important is required here because the template customizer script
   relocates the core/theme <link> tags after this stylesheet at runtime,
   so plain cascade order can't be relied on to win. */
body {
  font-family: 'JetBrains Mono', monospace !important;
  font-weight: 400;
  font-size: 14pt;
  color: var(--sleed-dark-gray);
}

.text-fine {
  font-size: 8pt;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  font-family: 'JetBrains Mono', monospace !important;
  color: var(--sleed-black);
}

h1, .h1 {
  font-size: 42px;
  font-weight: 800;
}

h2, .h2 {
  font-size: 38px;
  font-weight: 800;
}

h3, .h3 {
  font-size: 26pt;
  font-weight: 800;
}

h4, .h4 {
  font-size: 14pt;
  font-weight: 700;
}

/* Button Overrides */
.btn-primary,
.btn-success,
button[type="submit"],
.actions a.button {
  background-color: var(--sleed-green) !important;
  border-color: var(--sleed-green) !important;
  color: var(--sleed-white) !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-weight: 500;
  font-size: 10pt;
  text-transform: uppercase;
}

.btn-primary:hover,
.btn-success:hover,
button[type="submit"]:hover {
  background-color: var(--sleed-dark-blue) !important;
  border-color: var(--sleed-dark-blue) !important;
}

/* Gradients */
.bg-gradient-sleed-space {
  background: var(--sleed-white);
}

.bg-gradient-sleed-space-basic {
  background: linear-gradient(135deg, var(--sleed-white) 0%, var(--sleed-dark-blue) 50%, var(--sleed-green) 100%);
}

.bg-gradient-vibrant {
  background: linear-gradient(135deg, var(--sleed-white) 0%, var(--sleed-green) 50%, var(--sleed-purple) 100%);
}

.bg-gradient-fresh {
  background: linear-gradient(135deg, var(--sleed-white) 0%, var(--sleed-green) 50%, var(--sleed-pale-green) 100%);
}

.bg-gradient-noon {
  background: linear-gradient(135deg, var(--sleed-white) 0%, var(--sleed-dark-blue) 50%, var(--sleed-pale-green) 100%);
}

/* Specific component overrides for Sneat template if necessary */
.bg-menu-theme.menu-vertical .menu-item.active > .menu-link:not(.menu-toggle) {
  background: var(--sleed-green) !important;
  box-shadow: 0 0.125rem 0.25rem 0 rgba(0, 200, 130, 0.4) !important;
}

.text-primary {
  color: var(--sleed-green) !important;
}

.bg-primary {
  background-color: var(--sleed-green) !important;
}