:root {
  /* Fuente */
  --font-display: 'Poppins', sans-serif;
  --bs-font-sans-serif: 'Poppins', sans-serif;
  /* Colores principales */
  --bs-primary: #E60C56;
  --bs-primary-hover: #cb0044;
  --bs-primary-300: #ffa9c6;
  --bs-primary-100: hsl(339, 100%, 94%);
  --bs-primary-50: #ffeef4;
  --bs-secondary: #1A2342;
  --bs-secondary-300: #3f4a73;
  --bs-secondary-rgb: #1A2342;
  --bs-secondary-100: #EDF1FF;
  --bs-success: #00A650;
  --bs-info: #3498DB;
  --bs-warning: #FF7733;
  --bs-danger: #dc3545;
  --bs-light: #FBFBFB; 
  --bs-dark: #242424;

  --bs-facebook: #1877F2;
  --bs-x: #000000;
  --bs-whatsapp: #25D366;

  /* Colores neutros (grises) */
  --neutro-100: #242424;
  --neutro-200: #4F4F4F;
  --neutro-300: #787878;
  --neutro-400: #A3A3A3;
  --neutro-500: #D5D5D5;
  --neutro-600: #ECECEC;
  --neutro-700: #FBFBFB;

  --white: #fff;
  --black: #000;

  /* Otros colores y estilos */
  --background-color: #f8f9fa;
  --background-color-ng-select: #fff;
  --input-border-color: #6c757d;
  --card-border-color: #dddddd;
  --card-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  --informative-color: #191A38;
  --success-color: #00A650;
  --warning-color: #FF7733;
  --danger-color: #dc3545;
  --disabled-color: #ECECEC; /* neutro-600 */
  --error-color: #ff0019;
  --info-color: #3498DB;

  --border-radius: 5px;
  --border-radius-sm: 10px;
  --border-radius-lg: 15px;
  --border-radius-max: 20px;

  --box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
  --box-shadow-sm: 0 4px 8px rgba(0, 0, 0, 0.10);
  --box-shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.25);

  --link-hover-color: #E60C56;

  /* Tabla */
  --header-background: #f1f1f1;
  --header-border-bottom: #dee2e6;
  --header-color: #495057;
  --header-notificacion-bg: #fff3cd;
  --header-notificacion-border-color: #ffeeba;
  --header-notificacion-color: #856404;
  --header-notificacion-color-hover: #533f03;
  --header-notificacion-box-shadow: rgba(0, 0, 0, 0.1);
  --table-color-blue: #0056b3;
  --table-diable: #b0c4de;
  --table-pagination-button: #fff;

  /* Header height */
  --h-header: 88px;

  /* Spacers (ejemplo) */
  --spacer: 1rem;
  --spacers-0: 0;
  --spacers-1: 0.25rem;
  --spacers-2: 0.5rem;
  --spacers-3: 1rem;
  --spacers-4: 1.5rem;
  --spacers-5: 3rem;

  /* Otros estilos específicos */
  --navbar-light-color: #1A2342;

  /* Border radius */
  --border-radius: 0.375rem;
  --border-radius-sm: 0.625rem;
  --border-radius-lg: 0.9375rem;
  --border-radius-pill: 50rem;

  /* Shadows */
  --box-shadow: 0 8px 16px rgba(0,0,0,0.25);
  --box-shadow-sm: 0 4px 8px rgba(0,0,0,0.10);
  --box-shadow-lg: 0 8px 24px rgba(0,0,0,0.25);
  --box-shadow-inset: inset 0 1px 2px rgba(0,0,0,0.075);

  /* Buttons */
  --btn-border-radius: 0.375rem;
  --btn-font-family: 'Poppins', sans-serif;

  /* Tables */
  --table-cell-padding-y: 0.5rem;
  --table-cell-padding-x: 1rem;
  --table-hover-bg: rgba(70, 70, 70, 0.4);

  /* Offcanvas */
  --offcanvas-padding-y: 1rem;
  --offcanvas-padding-x: 1rem;

  /* Border color */
  --border-color: #D5D5D5;

  /* Nav */
  --nav-link-color: #E60C56;
  --nav-pills-border-radius: 50rem;
  --nav-pills-link-active-bg: #E60C56;

  /* Form check */
  --form-check-input-checked-bg-color: #E60C56;
  --form-check-input-checked-border-color: #E60C56;
  --form-check-input-border: 1px solid #E60C56;
  --form-check-input-width: 1em;
  --form-check-min-height: 1em;

  /* Badge */
  --badge-font-size: 0.9em;
  --badge-font-weight: 500;

  /* Accordion */
  --accordion-border-radius: 15px;
  --accordion-button-active-bg: #FBFBFB; /* neutro-700 */
  --accordion-button-active-color: #E60C56;

  /* Pagination */
  --pagination-border-radius: 50rem;
  --pagination-color: #E60C56;
  --pagination-focus-color: #E60C56;
  --pagination-active-bg: #E60C56;
  --pagination-active-border-color: #E60C56;
  --pagination-border-width: 0;

  /* Progress */
  --progress-bar-bg: #E60C56;
  --progress-bg: #ECECEC; /* neutro-600 */
  --progress-border-radius: 50rem;
  --progress-height: 0.5rem;

  /* Dropdown */
  --dropdown-bg: #fff;

  /*grises*/
  --bs-gray-100: var(--neutro-700);
  --bs-gray-200: var(--neutro-600);
  --bs-gray-300: var(--neutro-500);
  --bs-gray-400: var(--neutro-400);
  --bs-gray-500: var(--neutro-300);
  --bs-gray-600: var(--neutro-200);
  --bs-gray-700: var(--neutro-100);
  --bs-gray-800: #202020;
  --bs-gray-900: #101010;
}