Manual_Vantive/css/theme.scss

// Import Bootstrap functions, variables, and mixins
@import "../bootstrap-5.2.3/scss/functions";
@import "../bootstrap-5.2.3/scss/variables";
@import "../bootstrap-5.2.3/scss/mixins";

// Definir colores personalizados
$custom-colors: (
  "rosa-lavanda": #ede3ec,
  "lila-rosa": #d8c4d6,
  "verde-ceniza": #84a79c,
  "verde-oscuro": #105742,
  "verde-pino": #4c8071,
  "verde-pasto": #84a816,
  "verde-claro": #d6e3da,
  "verde-gris": #cadcd4,
  "verde-claro-2": #b3cdb9,
  "verde-claro-3": #d3e0d7,
  "lila-claro": #905c8b,
  "morado-claro": #915c8c,
  "gris": #959595,
);

// Colores base principales
$primary: #72256b;
$secondary: #8db497;

// 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: #6cc04a; // Teal (mantenido para consistencia)
$danger: #d4451d; // Rojo vibrante pero sofisticado
$warning: #ff671b; // Ámbar en lugar de dorado
$info: #3498db; // Azul brillante
$light: #5b6770; // Gris muy claro
$dark: #2c3e50; // 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: #515151; // 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, "silver");
}

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

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

  &-scrollbar-drag {
    background: $primary;
  }
}
$container-max-widths: (
  sm: 100%,
  md: 100%,
  lg: 100%,
  xl: 100%,
  xxl: 100%,
);
// Import Bootstrap components
@import "../bootstrap-5.2.3/scss/bootstrap";