/*
 * Copibec Bootstrap Theme Override
 *
 * Recreates Bootstrap SCSS compile-time variable overrides as CSS custom property overrides.
 * Must be loaded AFTER bootstrap.min.css.
 *
 * Primary color: #008A9B (Copibec teal)
 * Warning color: #FFA800 (Copibec orange)
 */

/* ─── Root CSS custom properties ─── */
:root,
[data-bs-theme=light] {
  --bs-primary: #008A9B;
  --bs-primary-rgb: 0, 138, 155;
  --bs-primary-text-emphasis: #00373e;
  --bs-primary-bg-subtle: #cce8eb;
  --bs-primary-border-subtle: #99d0d7;

  --bs-warning: #FFA800;
  --bs-warning-rgb: 255, 168, 0;
  --bs-warning-text-emphasis: #664300;
  --bs-warning-bg-subtle: #ffeecc;
  --bs-warning-border-subtle: #ffdc99;

  --bs-link-color: #008A9B;
  --bs-link-color-rgb: 0, 138, 155;
  --bs-link-hover-color: #006e7c;
  --bs-link-hover-color-rgb: 0, 110, 124;

  --bs-focus-ring-color: rgba(0, 138, 155, 0.25);

  --bs-highlight-bg: #ffeecc;
}

/* ─── Primary button ─── */
.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #008A9B;
  --bs-btn-border-color: #008A9B;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #007584;
  --bs-btn-hover-border-color: #006e7c;
  --bs-btn-focus-shadow-rgb: 38, 156, 170;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #006e7c;
  --bs-btn-active-border-color: #006874;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #008A9B;
  --bs-btn-disabled-border-color: #008A9B;
}

/* ─── Outline primary button ─── */
.btn-outline-primary {
  --bs-btn-color: #008A9B;
  --bs-btn-border-color: #008A9B;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #008A9B;
  --bs-btn-hover-border-color: #008A9B;
  --bs-btn-focus-shadow-rgb: 0, 138, 155;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #008A9B;
  --bs-btn-active-border-color: #008A9B;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #008A9B;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: #008A9B;
  --bs-gradient: none;
}

/* ─── Warning button ─── */
.btn-warning {
  --bs-btn-color: #000;
  --bs-btn-bg: #FFA800;
  --bs-btn-border-color: #FFA800;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #FFB11A;
  --bs-btn-hover-border-color: #FFAC0D;
  --bs-btn-focus-shadow-rgb: 217, 143, 0;
  --bs-btn-active-color: #000;
  --bs-btn-active-bg: #FFB933;
  --bs-btn-active-border-color: #FFAC0D;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #000;
  --bs-btn-disabled-bg: #FFA800;
  --bs-btn-disabled-border-color: #FFA800;
}

/* ─── Outline warning button ─── */
.btn-outline-warning {
  --bs-btn-color: #FFA800;
  --bs-btn-border-color: #FFA800;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #FFA800;
  --bs-btn-hover-border-color: #FFA800;
  --bs-btn-focus-shadow-rgb: 255, 168, 0;
  --bs-btn-active-color: #000;
  --bs-btn-active-bg: #FFA800;
  --bs-btn-active-border-color: #FFA800;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #FFA800;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: #FFA800;
  --bs-gradient: none;
}

/* ─── Form control focus (hardcoded in Bootstrap dist, must override) ─── */
.form-control:focus {
  border-color: #80c5cd;
  box-shadow: 0 0 0 0.25rem rgba(0, 138, 155, 0.25);
}

.form-select:focus {
  border-color: #80c5cd;
  box-shadow: 0 0 0 0.25rem rgba(0, 138, 155, 0.25);
}

.form-check-input:focus {
  border-color: #80c5cd;
  box-shadow: 0 0 0 0.25rem rgba(0, 138, 155, 0.25);
}

.form-check-input:checked {
  background-color: #008A9B;
  border-color: #008A9B;
}

/* Form switch thumb on focus */
.form-switch .form-check-input:focus {
  --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2380c5cd'/%3e%3c/svg%3e");
}

/* Form range thumb focus */
.form-range:focus::-webkit-slider-thumb {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(0, 138, 155, 0.25);
}
.form-range:focus::-moz-range-thumb {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(0, 138, 155, 0.25);
}

/* Form range thumb active/checked color */
.form-range::-webkit-slider-thumb {
  background-color: #008A9B;
}
.form-range::-moz-range-thumb {
  background-color: #008A9B;
}

/* ─── Form select dropdown indicator (teal arrow) ─── */
.form-select {
  --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23008A9B' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

/* ─── Nav link focus ─── */
.nav-link:focus-visible {
  box-shadow: 0 0 0 0.25rem rgba(0, 138, 155, 0.25);
}

/* ─── Accordion ─── */
.accordion {
  --bs-accordion-btn-focus-border-color: #80c5cd;
  --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(0, 138, 155, 0.25);
  --bs-accordion-active-color: #00373e;
  --bs-accordion-active-bg: #cce8eb;
  --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2300373e'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* ─── Pagination ─── */
.pagination {
  --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(0, 138, 155, 0.25);
  --bs-pagination-active-bg: #008A9B;
  --bs-pagination-active-border-color: #008A9B;
}

/* ─── Close button ─── */
.btn-close {
  --bs-btn-close-focus-shadow: 0 0 0 0.25rem rgba(0, 138, 155, 0.25);
}

/* ─── Progress bar ─── */
.progress-bar {
  background-color: #008A9B;
}

/* ─── Tooltip max-width (replaces $tooltip-max-width: 300px) ─── */
.tooltip-inner {
  max-width: 300px;
}
