// Import Bootstrap functions, variables, and mixins
@import '../bootstrap-5.3.8/scss/functions';
@import '../bootstrap-5.3.8/scss/variables';
@import '../bootstrap-5.3.8/scss/mixins';

// Definir colores personalizados - Actualizados a azules/grises
$custom-colors: (
  'blue-1': #242d5d,
  'blue-2': #183568,
  'blue-3': #006eab,
  'purple-1': #83448b,
  'purple-2': #c97cbb,
  'pink-1': #cd188e,
  'pink-2': #ffb8b8,
  'pink-3': #f2d0c1,
  'pink-4': #f7ebf5,
);

// Colores base principales - Azules profesionales
$primary: #6a217f; // Azul corporativo moderno
$secondary: #001c71; // Coral anaranjado (mantenido como acento)

// Variaciones del primario - Escala de azules
$primary-light: lighten($primary, 15%);
$primary-lighter: lighten($primary, 30%);
$primary-dark: darken($primary, 15%);
$primary-darker: darken($primary, 25%);

// Variaciones del secundario - Coral
$secondary-light: lighten($secondary, 10%);
$secondary-lighter: lighten($secondary, 20%);
$secondary-dark: darken($secondary, 10%);
$secondary-darker: darken($secondary, 20%);

// Colores adicionales - Armonía azul/gris
$success: #a4d65e; // Teal (mantenido para consistencia)
$danger: #fe5000; // Rojo vibrante pero sofisticado
$warning: #f39c12; // Ámbar en lugar de dorado
$info: #3498db; // Azul brillante
$light: #f8f9fa; // Gris muy claro
$dark: #000000; // Azul noche
$muted: #7f8c8d; // Gris neutro
$white: #ffffff; // Blanco puro

// Combinar colores en $theme-colors
$theme-colors: map-merge(
  (
    'primary': $primary,
    'primary-light': $primary-light,
    'primary-lighter': $primary-lighter,
    'primary-dark': $primary-dark,
    'primary-darker': $primary-darker,
    'secondary': $secondary,
    'secondary-light': $secondary-light,
    'secondary-lighter': $secondary-lighter,
    'secondary-dark': $secondary-dark,
    'secondary-darker': $secondary-darker,
    'success': $success,
    'danger': $danger,
    'warning': $warning,
    'info': $info,
    'light': $light,
    'dark': $dark,
    'muted': $muted,
    'white': $white,
  ),
  $custom-colors
);

// Configuración de fondo y texto
$body-bg: $white;
$body-color: #000000; // Azul/gris oscuro para texto

// Configuración de Swiper - Actualizada a azules
:root {
  --swiper-theme-color: $primary;
  --swiper-navigation-color: $primary;
  --swiper-pagination-color: $primary;
  --swiper-pagination-bullet-inactive-color: map-get($custom-colors, 'gris-6');
}

.swiper {
  &-button-prev,
  &-button-next {
    &:hover {
      color: $primary-dark;
      background: rgba($light, 0.9);
    }
  }

  &-pagination-bullet-active {
    background: $primary;
  }

  &-scrollbar-drag {
    background: $primary;
  }
}

// Import Bootstrap components
@import '../bootstrap-5.3.8/scss/bootstrap';