/* ===================================================================
   BOOTSTRAP CUSTOM - Extranet Partenaires CD974
   Customisations et overrides Bootstrap 5
   =================================================================== */

/* === VARIABLES BOOTSTRAP OVERRIDES === */

:root {
  /* Primary colors (CD974 brand) */
  --bs-primary: #0066cc;
  --bs-primary-rgb: 0, 102, 204;
  
  /* Secondary colors */
  --bs-secondary: #6c757d;
  --bs-secondary-rgb: 108, 117, 125;
  
  /* Success, Danger, Warning, Info */
  --bs-success: #28a745;
  --bs-success-rgb: 40, 167, 69;
  
  --bs-danger: #dc3545;
  --bs-danger-rgb: 220, 53, 69;
  
  --bs-warning: #ffc107;
  --bs-warning-rgb: 255, 193, 7;
  
  --bs-info: #17a2b8;
  --bs-info-rgb: 23, 162, 184;
  
  /* Gray scale */
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  
  /* Typography */
  --bs-font-sans-serif: 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #212529;
  --bs-body-bg: #f8f9fa;
  
  /* Border radius */
  --bs-border-radius: 0.375rem;
  --bs-border-radius-sm: 0.25rem;
  --bs-border-radius-lg: 0.5rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-2xl: 2rem;
  
  /* Spacing */
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
}

/* === BUTTONS CUSTOMIZATIONS === */

.btn {
  font-weight: 500;
  border-radius: var(--bs-border-radius);
  padding: 0.5rem 1rem;
  transition: all 0.15s ease-in-out;
}

.btn-lg {
  padding: 0.75rem 1.5rem;
  font-size: 1.125rem;
  border-radius: var(--bs-border-radius-lg);
}

.btn-sm {
  padding: 0.375rem 0.75rem;
  font-size: 0.875rem;
  border-radius: var(--bs-border-radius-sm);
}

/* Primary button with gradient (optional) */
.btn-primary {
  background: linear-gradient(135deg, #0066cc 0%, #0052a3 100%);
  border: none;
  box-shadow: 0 2px 4px rgba(0, 102, 204, 0.2);
}

.btn-primary:hover {
  background: linear-gradient(135deg, #0052a3 0%, #004080 100%);
  box-shadow: 0 4px 8px rgba(0, 102, 204, 0.3);
  transform: translateY(-1px);
}

.btn-primary:active {
  transform: translateY(0);
}

.btn-outline-primary:hover {
  background-color: #0066cc;
  border-color: #0066cc;
}

/* === FORMS CUSTOMIZATIONS === */

.form-control,
.form-select {
  border-radius: var(--bs-border-radius);
  border: 1px solid #ced4da;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-control:focus,
.form-select:focus {
  border-color: #0066cc;
  box-shadow: 0 0 0 0.25rem rgba(0, 102, 204, 0.25);
}

.form-label {
  font-weight: 500;
  margin-bottom: 0.5rem;
  color: #495057;
}

.form-check-input:checked {
  background-color: #0066cc;
  border-color: #0066cc;
}

.form-check-input:focus {
  border-color: #0066cc;
  box-shadow: 0 0 0 0.25rem rgba(0, 102, 204, 0.25);
}

.input-group-text {
  background-color: #f8f9fa;
  border: 1px solid #ced4da;
}

/* === CARDS CUSTOMIZATIONS === */

.card {
  border: none;
  border-radius: var(--bs-border-radius-lg);
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  margin-bottom: 1.5rem;
  overflow: hidden;
}

.card-header {
  background-color: #f8f9fa;
  border-bottom: 1px solid rgba(0, 0, 0, 0.125);
  padding: 1rem 1.25rem;
  font-weight: 600;
}

.card-header.bg-primary {
  background-color: #0066cc !important;
  color: white;
  border-bottom-color: rgba(255, 255, 255, 0.125);
}

.card-header.bg-success {
  background-color: #28a745 !important;
  color: white;
}

.card-header.bg-info {
  background-color: #17a2b8 !important;
  color: white;
}

.card-header.bg-warning {
  background-color: #ffc107 !important;
  color: #212529;
}

.card-body {
  padding: 1.25rem;
}

.card-footer {
  background-color: #f8f9fa;
  border-top: 1px solid rgba(0, 0, 0, 0.125);
  padding: 0.75rem 1.25rem;
}

/* === TABLES CUSTOMIZATIONS === */

.table {
  border-collapse: separate;
  border-spacing: 0;
}

.table thead th {
  background-color: #f8f9fa;
  border-bottom: 2px solid #dee2e6;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.875rem;
  letter-spacing: 0.5px;
  padding: 0.75rem;
}

.table tbody tr {
  transition: background-color 0.15s ease-in-out;
}

.table-hover tbody tr:hover {
  background-color: rgba(0, 102, 204, 0.05);
}

.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(0, 0, 0, 0.02);
}

/* === BADGES CUSTOMIZATIONS === */

.badge {
  font-weight: 500;
  padding: 0.35em 0.65em;
  border-radius: var(--bs-border-radius-sm);
  letter-spacing: 0.3px;
}

.badge-lg {
  font-size: 0.875rem;
  padding: 0.5rem 0.75rem;
}

/* === ALERTS CUSTOMIZATIONS === */

.alert {
  border: none;
  border-left: 4px solid;
  border-radius: var(--bs-border-radius);
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.alert-success {
  background-color: #d4edda;
  border-left-color: #28a745;
  color: #155724;
}

.alert-danger {
  background-color: #f8d7da;
  border-left-color: #dc3545;
  color: #721c24;
}

.alert-warning {
  background-color: #fff3cd;
  border-left-color: #ffc107;
  color: #856404;
}

.alert-info {
  background-color: #d1ecf1;
  border-left-color: #17a2b8;
  color: #0c5460;
}

.alert-heading {
  font-weight: 600;
  margin-bottom: 0.5rem;
}

/* === NAVIGATION CUSTOMIZATIONS === */

.nav-tabs {
  border-bottom: 2px solid #dee2e6;
}

.nav-tabs .nav-link {
  border: none;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 0.75rem 1.25rem;
  font-weight: 500;
  color: #6c757d;
  transition: all 0.15s ease-in-out;
}

.nav-tabs .nav-link:hover {
  border-bottom-color: #0066cc;
  color: #0066cc;
}

.nav-tabs .nav-link.active {
  border-bottom-color: #0066cc;
  color: #0066cc;
  background-color: transparent;
}

.nav-pills .nav-link {
  border-radius: var(--bs-border-radius);
  font-weight: 500;
  transition: all 0.15s ease-in-out;
}

.nav-pills .nav-link.active {
  background-color: #0066cc;
}

/* === BREADCRUMB CUSTOMIZATIONS === */

.breadcrumb {
  background-color: transparent;
  padding: 0.75rem 0;
  margin-bottom: 1rem;
  font-size: 0.875rem;
}

.breadcrumb-item + .breadcrumb-item::before {
  content: "›";
  color: #6c757d;
  font-size: 1.25rem;
  vertical-align: middle;
}

.breadcrumb-item a {
  color: #6c757d;
  text-decoration: none;
}

.breadcrumb-item a:hover {
  color: #0066cc;
  text-decoration: underline;
}

.breadcrumb-item.active {
  color: #212529;
  font-weight: 500;
}

/* === PAGINATION CUSTOMIZATIONS === */

.pagination {
  gap: 0.25rem;
}

.page-link {
  border: 1px solid #dee2e6;
  border-radius: var(--bs-border-radius-sm);
  color: #0066cc;
  padding: 0.5rem 0.75rem;
  transition: all 0.15s ease-in-out;
  margin: 0 2px;
}

.page-link:hover {
  background-color: #e9ecef;
  border-color: #dee2e6;
  color: #0052a3;
}

.page-item.active .page-link {
  background-color: #0066cc;
  border-color: #0066cc;
  color: white;
}

.page-item.disabled .page-link {
  background-color: #fff;
  border-color: #dee2e6;
  color: #6c757d;
}

/* === MODAL CUSTOMIZATIONS === */

.modal-content {
  border: none;
  border-radius: var(--bs-border-radius-lg);
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.modal-header {
  background-color: #f8f9fa;
  border-bottom: 1px solid #dee2e6;
  border-radius: var(--bs-border-radius-lg) var(--bs-border-radius-lg) 0 0;
  padding: 1.25rem 1.5rem;
}

.modal-title {
  font-weight: 600;
}

.modal-body {
  padding: 1.5rem;
}

.modal-footer {
  background-color: #f8f9fa;
  border-top: 1px solid #dee2e6;
  border-radius: 0 0 var(--bs-border-radius-lg) var(--bs-border-radius-lg);
  padding: 1rem 1.5rem;
}

/* === PROGRESS BAR CUSTOMIZATIONS === */

.progress {
  height: 1rem;
  border-radius: var(--bs-border-radius);
  background-color: #e9ecef;
}

.progress-bar {
  background-color: #0066cc;
  border-radius: var(--bs-border-radius);
}

/* === DROPDOWN CUSTOMIZATIONS === */

.dropdown-menu {
  border: none;
  border-radius: var(--bs-border-radius);
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  padding: 0.5rem 0;
}

.dropdown-item {
  padding: 0.5rem 1rem;
  transition: background-color 0.15s ease-in-out;
}

.dropdown-item:hover {
  background-color: rgba(0, 102, 204, 0.1);
  color: #0066cc;
}

.dropdown-item.active {
  background-color: #0066cc;
  color: white;
}

.dropdown-divider {
  margin: 0.5rem 0;
}

/* === TOOLTIPS & POPOVERS === */

.tooltip-inner {
  background-color: #212529;
  border-radius: var(--bs-border-radius-sm);
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
}

.popover {
  border: none;
  border-radius: var(--bs-border-radius);
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

/* === ACCORDION CUSTOMIZATIONS === */

.accordion-button {
  font-weight: 500;
  padding: 1rem 1.25rem;
  background-color: #f8f9fa;
}

.accordion-button:not(.collapsed) {
  background-color: rgba(0, 102, 204, 0.1);
  color: #0066cc;
}

.accordion-button:focus {
  border-color: #0066cc;
  box-shadow: 0 0 0 0.25rem rgba(0, 102, 204, 0.25);
}

.accordion-body {
  padding: 1.25rem;
}

/* === RESPONSIVE CUSTOMIZATIONS === */

@media (max-width: 768px) {
  .btn-lg {
    padding: 0.625rem 1.25rem;
    font-size: 1rem;
  }
  
  .card-body {
    padding: 1rem;
  }
  
  .modal-body {
    padding: 1.25rem;
  }
}
