/**
 * Theme Colors and Typography
 *
 * Primair: Lichtblauw: #2aa9f8
 * Secundair: Donkerblauw: #204085
 * Font: Montserrat
 */

:root {
  --color-primary: #2aa9f8;
  --color-primary-light: #66bef9;
  --color-primary-dark: #0a7abd;
  
  --color-secondary: #204085;
  --color-secondary-light: #335faf;
  --color-secondary-dark: #142851;
  
  --color-text: #333333;
  --color-text-light: #666666;
}

/* Global Typography */
body {
  font-family: 'Montserrat', sans-serif;
  color: var(--color-text);
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Montserrat', sans-serif;
}

/* Buttons */
.btn,
.button,
button[type="submit"],
input[type="submit"] {
  background-color: var(--color-primary);
  color: white;
  border-radius: 8px;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  transition: all 0.2s ease;
}

.btn:hover,
.button:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
  background-color: var(--color-secondary);
  transform: translateY(-1px);
  box-shadow: 0 4px 6px rgba(32, 64, 133, 0.2);
}

/* Links */
a {
  color: var(--color-primary);
  transition: color 0.2s ease;
}

a:hover {
  color: var(--color-secondary);
}

/* Headers */
.site-header,
header {
  font-family: 'Montserrat', sans-serif;
}

/* Footer */
.site-footer,
footer {
  font-family: 'Montserrat', sans-serif;
}

/* WooCommerce Specific */
.woocommerce #respond input#submit, 
.woocommerce a.button, 
.woocommerce button.button, 
.woocommerce input.button,
.woocommerce #respond input#submit.alt, 
.woocommerce a.button.alt, 
.woocommerce button.button.alt, 
.woocommerce input.button.alt {
  background-color: var(--color-primary);
  color: white;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
}

.woocommerce #respond input#submit:hover, 
.woocommerce a.button:hover, 
.woocommerce button.button:hover, 
.woocommerce input.button:hover,
.woocommerce #respond input#submit.alt:hover, 
.woocommerce a.button.alt:hover, 
.woocommerce button.button.alt:hover, 
.woocommerce input.button.alt:hover {
  background-color: var(--color-secondary);
  color: white;
}

.woocommerce-message,
.woocommerce-info {
  border-top-color: var(--color-primary);
}

.woocommerce-message::before,
.woocommerce-info::before {
  color: var(--color-primary);
}

.woocommerce span.onsale {
  background-color: var(--color-primary);
  font-family: 'Montserrat', sans-serif;
}

.woocommerce ul.products li.product .price,
.woocommerce div.product p.price, 
.woocommerce div.product span.price {
  color: var(--color-primary);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  background: white;
  border-bottom-color: white;
  color: var(--color-secondary);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li.active::after {
  box-shadow: none;
}

.woocommerce-Price-amount {
  color: var(--color-primary);
  font-weight: 600;
}

/* Navigation */
.main-navigation,
.nav-menu {
  font-family: 'Montserrat', sans-serif;
}

/* Forms */
input, select, textarea {
  font-family: 'Montserrat', sans-serif;
}

/* Custom Classes */
.text-primary {
  color: var(--color-primary) !important;
}

.text-secondary {
  color: var(--color-secondary) !important;
}

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

.bg-secondary {
  background-color: var(--color-secondary) !important;
}

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

.border-secondary {
  border-color: var(--color-secondary) !important;
}

/* Gradient Backgrounds */
.bg-gradient-primary {
  background: linear-gradient(to right, var(--color-primary), var(--color-secondary)) !important;
}

.bg-gradient-secondary {
  background: linear-gradient(to right, var(--color-secondary), var(--color-secondary-dark)) !important;
}