/* 
 * Variáveis CSS Bootstrap Customizadas - Sistema de Frete
 * Sobrescreve as variáveis padrão do Bootstrap usando as cores do sistema
 * Deve ser importado APÓS o bootstrap.css
 */

:root {
    /* ===================================
       CORES PRIMÁRIAS DO BOOTSTRAP
       ================================= */
    
    /* Cores Principais - usando variáveis do sistema */
    --bs-primary: var(--color-primary);
    --bs-primary-rgb: 13, 110, 253;
    --bs-secondary: var(--color-secondary);
    --bs-secondary-rgb: 108, 117, 125;
    --bs-success: var(--color-success);
    --bs-success-rgb: 25, 135, 84;
    --bs-info: var(--color-info);
    --bs-info-rgb: 13, 202, 240;
    --bs-warning: var(--color-warning);
    --bs-warning-rgb: 255, 193, 7;
    --bs-danger: var(--color-danger);
    --bs-danger-rgb: 220, 53, 69;
    --bs-light: var(--color-gray-100);
    --bs-light-rgb: 243, 244, 246;
    --bs-dark: var(--color-gray-800);
    --bs-dark-rgb: 31, 41, 55;
  
    /* ===================================
       VARIAÇÕES DAS CORES PRIMÁRIAS
       ================================= */
    
    /* Primary Variants */
    --bs-primary-100: var(--color-primary-light);
    --bs-primary-200: rgba(13, 110, 253, 0.2);
    --bs-primary-300: rgba(13, 110, 253, 0.3);
    --bs-primary-400: rgba(13, 110, 253, 0.4);
    --bs-primary-500: var(--bs-primary);
    --bs-primary-600: var(--color-primary-dark);
    --bs-primary-700: #084298;
    --bs-primary-800: #052c65;
    --bs-primary-900: #031633;
  
    /* Secondary Variants */
    --bs-secondary-100: var(--color-secondary-light);
    --bs-secondary-200: rgba(108, 117, 125, 0.2);
    --bs-secondary-300: rgba(108, 117, 125, 0.3);
    --bs-secondary-400: rgba(108, 117, 125, 0.4);
    --bs-secondary-500: var(--bs-secondary);
    --bs-secondary-600: var(--color-secondary-dark);
    --bs-secondary-700: #41474b;
    --bs-secondary-800: #2b2f32;
    --bs-secondary-900: #161819;
  
    /* Success Variants */
    --bs-success-100: var(--color-success-light);
    --bs-success-200: rgba(25, 135, 84, 0.2);
    --bs-success-300: rgba(25, 135, 84, 0.3);
    --bs-success-400: rgba(25, 135, 84, 0.4);
    --bs-success-500: var(--bs-success);
    --bs-success-600: var(--color-success-dark);
    --bs-success-700: #0f5132;
    --bs-success-800: #0a3622;
    --bs-success-900: #051b11;
  
    /* Info Variants */
    --bs-info-100: var(--color-info-light);
    --bs-info-200: rgba(13, 202, 240, 0.2);
    --bs-info-300: rgba(13, 202, 240, 0.3);
    --bs-info-400: rgba(13, 202, 240, 0.4);
    --bs-info-500: var(--bs-info);
    --bs-info-600: var(--color-info-dark);
    --bs-info-700: #087990;
    --bs-info-800: #055160;
    --bs-info-900: #032830;
  
    /* Warning Variants */
    --bs-warning-100: var(--color-warning-light);
    --bs-warning-200: rgba(255, 193, 7, 0.2);
    --bs-warning-300: rgba(255, 193, 7, 0.3);
    --bs-warning-400: rgba(255, 193, 7, 0.4);
    --bs-warning-500: var(--bs-warning);
    --bs-warning-600: var(--color-warning-dark);
    --bs-warning-700: #997404;
    --bs-warning-800: #664d03;
    --bs-warning-900: #332701;
  
    /* Danger Variants */
    --bs-danger-100: var(--color-danger-light);
    --bs-danger-200: rgba(220, 53, 69, 0.2);
    --bs-danger-300: rgba(220, 53, 69, 0.3);
    --bs-danger-400: rgba(220, 53, 69, 0.4);
    --bs-danger-500: var(--bs-danger);
    --bs-danger-600: var(--color-danger-dark);
    --bs-danger-700: #b02a37;
    --bs-danger-800: #7a1f28;
    --bs-danger-900: #3d1014;

    /* ===================================
       CORES DE TEXTO E FUNDO
       ================================= */
    
    /* Cores de texto */
    --bs-body-color: var(--text-primary);
    --bs-body-color-rgb: 17, 24, 39;
    --bs-body-bg: var(--bg-primary);
    --bs-body-bg-rgb: 255, 255, 255;
    
    /* Cores de link */
    --bs-link-color: var(--color-primary);
    --bs-link-color-rgb: 13, 110, 253;
    --bs-link-hover-color: var(--color-primary-dark);
    --bs-link-hover-color-rgb: 10, 88, 202;
    
    /* Cores de código */
    --bs-code-color: var(--color-danger);
    --bs-code-color-rgb: 220, 53, 69;

    /* ===================================
       CORES DE COMPONENTES
       ================================= */
    
    /* Componentes de formulário */
    --bs-form-control-bg: var(--form-control-bg);
    --bs-form-control-border-color: var(--form-control-border-color);
    --bs-form-control-border-radius: var(--form-control-border-radius);
    --bs-form-control-focus-border-color: var(--form-control-border-color-focus);
    --bs-form-control-focus-box-shadow: 0 0 0 0.2rem var(--color-focus-ring);
    
    /* Componentes de tabela */
    --bs-table-bg: var(--bg-primary);
    --bs-table-border-color: var(--table-border-color);
    --bs-table-striped-bg: var(--table-striped-bg);
    --bs-table-hover-bg: var(--hover);
    --bs-table-accent-bg: transparent;
    --bs-table-striped-color: var(--text-base);
    --bs-table-striped-bg: var(--bg-primary);
    --bs-table-active-color: var(--text-primary);
    --bs-table-active-bg: var(--hover);
    --bs-table-hover-color: var(--text-base);
    --bs-table-hover-bg: var(--hover);

    
    
    /* Componentes de botão */
    --bs-btn-padding-x: 0.75rem;
    --bs-btn-padding-y: 0.375rem;
    --bs-btn-border-radius: var(--border-radius);
    --bs-btn-font-weight: var(--font-weight-normal);
    
    /* Componentes de alerta */
    --bs-alert-padding-x: 1rem;
    --bs-alert-padding-y: 0.75rem;
    --bs-alert-border-radius: var(--border-radius);
    --bs-alert-border-width: 1px;
    --bs-alert-border-style: solid;
    
    /* Componentes de paginação */
    --bs-pagination-padding-x: 0.75rem;
    --bs-pagination-padding-y: 0.375rem;
    --bs-pagination-border-radius: var(--border-radius);
    --bs-pagination-border-width: 1px;
    --bs-pagination-border-style: solid;
    --bs-pagination-color: var(--color-primary);
    --bs-pagination-bg: var(--bg-primary);
    --bs-pagination-border-color: var(--border-color);
    --bs-pagination-hover-color: var(--color-primary-dark);
    --bs-pagination-hover-bg: var(--bg-secondary);
    --bs-pagination-hover-border-color: var(--border-color);
    --bs-pagination-active-color: var(--color-white);
    --bs-pagination-active-bg: var(--color-primary);
    --bs-pagination-active-border-color: var(--color-primary);
    --bs-pagination-disabled-color: var(--text-disabled);
    --bs-pagination-disabled-bg: var(--bg-primary);
    --bs-pagination-disabled-border-color: var(--border-color);

    /* ===================================
       CORES DE ESTADO
       ================================= */
    
    /* Estados de foco */
    --bs-focus-ring-color: var(--color-focus-ring);
    --bs-focus-ring-width: 0.25rem;
    
    /* Estados de validação */
    --bs-form-valid-color: var(--color-success);
    --bs-form-valid-border-color: var(--color-success);
    --bs-form-invalid-color: var(--color-danger);
    --bs-form-invalid-border-color: var(--color-danger);
    
    /* Estados de carregamento */
    --bs-spinner-border-width: 0.25em;
    --bs-spinner-border-color: currentcolor;
    --bs-spinner-border-color-light: transparent;
}


.table {
   --bs-table-bg: var(--bs-table-bg);
   --bs-table-accent-bg: var(--bs-table-accent-bg);
   --bs-table-striped-color: var(--bs-table-striped-color);
   --bs-table-striped-bg: var(--bs-table-striped-bg);
   --bs-table-active-color: var(--bs-table-active-color);
   --bs-table-active-bg: var(--bs-table-active-bg);
   --bs-table-hover-color: var(--bs-table-hover-color);
   --bs-table-hover-bg: var(--bs-table-hover-bg);
   width: 100%;
   margin-bottom: 1rem;
   color: var(--bs-table-color);
   vertical-align: top;
   border-color: var(--bs-table-border-color);
}