/*
 * bulma-compat.css — Capa de compatibilidad Bootstrap → Bulma
 * Reimplementa clases Bootstrap que Bulma no incluye nativamente.
 */

/* ── Material Symbols ─────────────────────────────────────────────── */
.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 1.1em;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-smoothing: antialiased;
  vertical-align: middle;
}
.material-symbols-outlined.fs-5  { font-size: 1.25rem; }
.material-symbols-outlined.fs-4  { font-size: 1.5rem; }
.material-symbols-outlined.fs-3  { font-size: 1.75rem; }
.material-symbols-outlined.fs-2  { font-size: 2rem; }
.material-symbols-outlined.fs-1  { font-size: 2.5rem; }
.material-symbols-outlined.small { font-size: 0.85em; }

/* ── Spin animation ───────────────────────────────────────────────── */
@keyframes spin { to { transform: rotate(360deg); } }
.spin, .fa-spin { animation: spin 1s linear infinite; }

/* ── Display utilities ────────────────────────────────────────────── */
.d-none     { display: none !important; }
.d-block    { display: block !important; }
.d-inline   { display: inline !important; }
.d-inline-block { display: inline-block !important; }
.d-flex     { display: flex !important; }
.d-inline-flex { display: inline-flex !important; }
.d-grid     { display: grid !important; }
.d-table    { display: table !important; }
.d-table-cell { display: table-cell !important; }

@media (min-width: 576px)  { .d-sm-none { display: none !important; } .d-sm-flex { display: flex !important; } .d-sm-block { display: block !important; } }
@media (min-width: 768px)  { .d-md-none { display: none !important; } .d-md-flex { display: flex !important; } .d-md-block { display: block !important; } }
@media (min-width: 992px)  { .d-lg-none { display: none !important; } .d-lg-flex { display: flex !important; } .d-lg-block { display: block !important; } }
@media (min-width: 1200px) { .d-xl-none { display: none !important; } .d-xl-flex { display: flex !important; } .d-xl-block { display: block !important; } }

/* ── Flexbox utilities ────────────────────────────────────────────── */
.flex-row         { flex-direction: row !important; }
.flex-column      { flex-direction: column !important; }
.flex-row-reverse { flex-direction: row-reverse !important; }
.flex-wrap        { flex-wrap: wrap !important; }
.flex-nowrap      { flex-wrap: nowrap !important; }
.flex-grow-1      { flex-grow: 1 !important; }
.flex-shrink-0    { flex-shrink: 0 !important; }
.flex-fill        { flex: 1 1 auto !important; }
.align-items-start    { align-items: flex-start !important; }
.align-items-center   { align-items: center !important; }
.align-items-end      { align-items: flex-end !important; }
.align-items-stretch  { align-items: stretch !important; }
.align-self-center    { align-self: center !important; }
.align-self-start     { align-self: flex-start !important; }
.align-self-end       { align-self: flex-end !important; }
.justify-content-start        { justify-content: flex-start !important; }
.justify-content-center       { justify-content: center !important; }
.justify-content-end          { justify-content: flex-end !important; }
.justify-content-between      { justify-content: space-between !important; }
.justify-content-around       { justify-content: space-around !important; }
.justify-content-evenly       { justify-content: space-evenly !important; }
.gap-0 { gap: 0 !important; }
.gap-1 { gap: 0.25rem !important; }
.gap-2 { gap: 0.5rem !important; }
.gap-3 { gap: 1rem !important; }
.gap-4 { gap: 1.5rem !important; }
.gap-5 { gap: 3rem !important; }

/* ── Margin / Padding shorthand (me, ms, pe, ps, mt, mb, mx, my) ── */
.m-0  { margin: 0 !important; }
.m-1  { margin: 0.25rem !important; }
.m-2  { margin: 0.5rem !important; }
.m-3  { margin: 1rem !important; }
.m-4  { margin: 1.5rem !important; }
.m-5  { margin: 3rem !important; }
.m-auto { margin: auto !important; }

.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: 0.25rem !important; }
.mt-2 { margin-top: 0.5rem !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mt-5 { margin-top: 3rem !important; }
.mt-auto { margin-top: auto !important; }

.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 0.25rem !important; }
.mb-2 { margin-bottom: 0.5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mb-5 { margin-bottom: 3rem !important; }
.mb-auto { margin-bottom: auto !important; }

.ms-0, .ml-0 { margin-left: 0 !important; }
.ms-1, .ml-1 { margin-left: 0.25rem !important; }
.ms-2, .ml-2 { margin-left: 0.5rem !important; }
.ms-3, .ml-3 { margin-left: 1rem !important; }
.ms-4, .ml-4 { margin-left: 1.5rem !important; }
.ms-5, .ml-5 { margin-left: 3rem !important; }
.ms-auto, .ml-auto { margin-left: auto !important; }

.me-0, .mr-0 { margin-right: 0 !important; }
.me-1, .mr-1 { margin-right: 0.25rem !important; }
.me-2, .mr-2 { margin-right: 0.5rem !important; }
.me-3, .mr-3 { margin-right: 1rem !important; }
.me-4, .mr-4 { margin-right: 1.5rem !important; }
.me-5, .mr-5 { margin-right: 3rem !important; }
.me-auto, .mr-auto { margin-right: auto !important; }

.mx-0  { margin-left: 0 !important; margin-right: 0 !important; }
.mx-1  { margin-left: 0.25rem !important; margin-right: 0.25rem !important; }
.mx-2  { margin-left: 0.5rem !important; margin-right: 0.5rem !important; }
.mx-3  { margin-left: 1rem !important; margin-right: 1rem !important; }
.mx-4  { margin-left: 1.5rem !important; margin-right: 1.5rem !important; }
.mx-5  { margin-left: 3rem !important; margin-right: 3rem !important; }
.mx-auto { margin-left: auto !important; margin-right: auto !important; }

.my-0  { margin-top: 0 !important; margin-bottom: 0 !important; }
.my-1  { margin-top: 0.25rem !important; margin-bottom: 0.25rem !important; }
.my-2  { margin-top: 0.5rem !important; margin-bottom: 0.5rem !important; }
.my-3  { margin-top: 1rem !important; margin-bottom: 1rem !important; }
.my-4  { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; }
.my-5  { margin-top: 3rem !important; margin-bottom: 3rem !important; }

.p-0  { padding: 0 !important; }
.p-1  { padding: 0.25rem !important; }
.p-2  { padding: 0.5rem !important; }
.p-3  { padding: 1rem !important; }
.p-4  { padding: 1.5rem !important; }
.p-5  { padding: 3rem !important; }

.pt-0 { padding-top: 0 !important; }
.pt-1 { padding-top: 0.25rem !important; }
.pt-2 { padding-top: 0.5rem !important; }
.pt-3 { padding-top: 1rem !important; }
.pt-4 { padding-top: 1.5rem !important; }
.pt-5 { padding-top: 3rem !important; }

.pb-0 { padding-bottom: 0 !important; }
.pb-1 { padding-bottom: 0.25rem !important; }
.pb-2 { padding-bottom: 0.5rem !important; }
.pb-3 { padding-bottom: 1rem !important; }
.pb-4 { padding-bottom: 1.5rem !important; }
.pb-5 { padding-bottom: 3rem !important; }

.ps-0, .pl-0 { padding-left: 0 !important; }
.ps-1, .pl-1 { padding-left: 0.25rem !important; }
.ps-2, .pl-2 { padding-left: 0.5rem !important; }
.ps-3, .pl-3 { padding-left: 1rem !important; }
.ps-4, .pl-4 { padding-left: 1.5rem !important; }
.ps-5, .pl-5 { padding-left: 3rem !important; }

.pe-0, .pr-0 { padding-right: 0 !important; }
.pe-1, .pr-1 { padding-right: 0.25rem !important; }
.pe-2, .pr-2 { padding-right: 0.5rem !important; }
.pe-3, .pr-3 { padding-right: 1rem !important; }
.pe-4, .pr-4 { padding-right: 1.5rem !important; }
.pe-5, .pr-5 { padding-right: 3rem !important; }

.px-0  { padding-left: 0 !important; padding-right: 0 !important; }
.px-1  { padding-left: 0.25rem !important; padding-right: 0.25rem !important; }
.px-2  { padding-left: 0.5rem !important; padding-right: 0.5rem !important; }
.px-3  { padding-left: 1rem !important; padding-right: 1rem !important; }
.px-4  { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
.px-5  { padding-left: 3rem !important; padding-right: 3rem !important; }

.py-0  { padding-top: 0 !important; padding-bottom: 0 !important; }
.py-1  { padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; }
.py-2  { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; }
.py-3  { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.py-4  { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
.py-5  { padding-top: 3rem !important; padding-bottom: 3rem !important; }

/* ── Width / Height utilities ─────────────────────────────────────── */
.w-25  { width: 25% !important; }
.w-50  { width: 50% !important; }
.w-75  { width: 75% !important; }
.w-100 { width: 100% !important; }
.w-auto { width: auto !important; }
.h-100 { height: 100% !important; }
.mw-100 { max-width: 100% !important; }
.min-vh-100 { min-height: 100vh !important; }
.vh-100 { height: 100vh !important; }

/* ── Float ────────────────────────────────────────────────────────── */
.float-start { float: left !important; }
.float-end   { float: right !important; }
.float-none  { float: none !important; }
.clearfix::after { content: ''; display: table; clear: both; }

/* ── Text utilities ───────────────────────────────────────────────── */
.text-center  { text-align: center !important; }
.text-left, .text-start  { text-align: left !important; }
.text-right, .text-end   { text-align: right !important; }
.text-justify { text-align: justify !important; }
.text-nowrap  { white-space: nowrap !important; }
.text-break   { word-break: break-word !important; }
.text-lowercase  { text-transform: lowercase !important; }
.text-uppercase  { text-transform: uppercase !important; }
.text-capitalize { text-transform: capitalize !important; }
.text-decoration-none { text-decoration: none !important; }
.text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.text-wrap    { white-space: normal !important; }

/* ── Font weight ──────────────────────────────────────────────────── */
.fw-lighter  { font-weight: lighter !important; }
.fw-light    { font-weight: 300 !important; }
.fw-normal   { font-weight: 400 !important; }
.fw-medium   { font-weight: 500 !important; }
.fw-semibold { font-weight: 600 !important; }
.fw-bold     { font-weight: 700 !important; }
.fw-bolder   { font-weight: bolder !important; }
.fst-italic  { font-style: italic !important; }
.fs-1 { font-size: 2.5rem !important; }
.fs-2 { font-size: 2rem !important; }
.fs-3 { font-size: 1.75rem !important; }
.fs-4 { font-size: 1.5rem !important; }
.fs-5 { font-size: 1.25rem !important; }
.fs-6 { font-size: 1rem !important; }
.small, .text-sm { font-size: 0.875em !important; }

/* ── Text colors ──────────────────────────────────────────────────── */
.text-primary   { color: #3273dc !important; }
.text-secondary { color: #6b7280 !important; }
.text-success   { color: #48c774 !important; }
.text-danger    { color: #f14668 !important; }
.text-warning   { color: #ffdd57 !important; }
.text-info      { color: #3298dc !important; }
.text-light     { color: #f5f5f5 !important; }
.text-dark      { color: #363636 !important; }
.text-white     { color: #fff !important; }
.text-black     { color: #0a0a0a !important; }
.text-muted     { color: #6b7280 !important; }
.text-body      { color: #363636 !important; }
.link-primary   { color: #3273dc !important; text-decoration: underline; }

/* ── Background colors ────────────────────────────────────────────── */
.bg-primary   { background-color: #3273dc !important; }
.bg-secondary { background-color: #6b7280 !important; }
.bg-success   { background-color: #48c774 !important; }
.bg-danger    { background-color: #f14668 !important; }
.bg-warning   { background-color: #ffdd57 !important; }
.bg-info      { background-color: #3298dc !important; }
.bg-light     { background-color: #f5f5f5 !important; }
.bg-dark      { background-color: #363636 !important; }
.bg-white     { background-color: #fff !important; }
.bg-transparent { background-color: transparent !important; }

/* ── Overflow ─────────────────────────────────────────────────────── */
.overflow-auto    { overflow: auto !important; }
.overflow-hidden  { overflow: hidden !important; }
.overflow-visible { overflow: visible !important; }
.overflow-scroll  { overflow: scroll !important; }
.overflow-x-auto  { overflow-x: auto !important; }
.overflow-y-auto  { overflow-y: auto !important; }

/* ── Position ─────────────────────────────────────────────────────── */
.position-static   { position: static !important; }
.position-relative { position: relative !important; }
.position-absolute { position: absolute !important; }
.position-fixed    { position: fixed !important; }
.position-sticky   { position: sticky !important; }
.top-0    { top: 0 !important; }
.bottom-0 { bottom: 0 !important; }
.start-0, .left-0  { left: 0 !important; }
.end-0, .right-0   { right: 0 !important; }
.translate-middle  { transform: translate(-50%, -50%) !important; }

/* ── Border ───────────────────────────────────────────────────────── */
.border       { border: 1px solid #dbdbdb !important; }
.border-0     { border: 0 !important; }
.border-top   { border-top: 1px solid #dbdbdb !important; }
.border-bottom { border-bottom: 1px solid #dbdbdb !important; }
.border-start { border-left: 1px solid #dbdbdb !important; }
.border-end   { border-right: 1px solid #dbdbdb !important; }
.border-primary { border-color: #3273dc !important; }
.border-danger  { border-color: #f14668 !important; }
.border-success { border-color: #48c774 !important; }
.border-warning { border-color: #ffdd57 !important; }

/* ── Rounded ──────────────────────────────────────────────────────── */
.rounded        { border-radius: 0.375rem !important; }
.rounded-0      { border-radius: 0 !important; }
.rounded-1      { border-radius: 0.25rem !important; }
.rounded-2      { border-radius: 0.375rem !important; }
.rounded-3      { border-radius: 0.5rem !important; }
.rounded-4      { border-radius: 1rem !important; }
.rounded-circle { border-radius: 50% !important; }
.rounded-pill   { border-radius: 50rem !important; }
.rounded-top    { border-top-left-radius: 0.375rem !important; border-top-right-radius: 0.375rem !important; }
.rounded-bottom { border-bottom-left-radius: 0.375rem !important; border-bottom-right-radius: 0.375rem !important; }

/* ── Shadow ───────────────────────────────────────────────────────── */
.shadow-none { box-shadow: none !important; }
.shadow-sm   { box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,.075) !important; }
.shadow      { box-shadow: 0 0.5rem 1rem rgba(0,0,0,.15) !important; }
.shadow-lg   { box-shadow: 0 1rem 3rem rgba(0,0,0,.175) !important; }

/* ── Visibility ───────────────────────────────────────────────────── */
.visible   { visibility: visible !important; }
.invisible { visibility: hidden !important; }

/* ── Z-index ──────────────────────────────────────────────────────── */
.z-0    { z-index: 0 !important; }
.z-1    { z-index: 1 !important; }
.z-2    { z-index: 2 !important; }
.z-3    { z-index: 3 !important; }
.z-n1   { z-index: -1 !important; }

/* ── Pointer events ───────────────────────────────────────────────── */
.pe-none { pointer-events: none !important; }
.pe-auto { pointer-events: auto !important; }
.cursor-pointer { cursor: pointer !important; }

/* ── User select ──────────────────────────────────────────────────── */
.user-select-none  { user-select: none !important; }
.user-select-all   { user-select: all !important; }

/* ── Vertical align ───────────────────────────────────────────────── */
.align-middle  { vertical-align: middle !important; }
.align-top     { vertical-align: top !important; }
.align-bottom  { vertical-align: bottom !important; }
.align-baseline { vertical-align: baseline !important; }

/* ── Container & Layout ───────────────────────────────────────────── */
.container-fluid {
  width: 100%;
  padding-right: 1rem;
  padding-left: 1rem;
  margin-right: auto;
  margin-left: auto;
}
.container-sm, .container-md, .container-lg, .container-xl {
  width: 100%;
  padding-right: 1rem;
  padding-left: 1rem;
  margin-right: auto;
  margin-left: auto;
}
@media (min-width: 576px)  { .container-sm  { max-width: 540px; } }
@media (min-width: 768px)  { .container-md  { max-width: 720px; } }
@media (min-width: 992px)  { .container-lg  { max-width: 960px; } }
@media (min-width: 1200px) { .container-xl  { max-width: 1140px; } }
@media (min-width: 1400px) { .container-xxl { max-width: 1320px; } }

.row { display: flex; flex-wrap: wrap; margin-right: -0.75rem; margin-left: -0.75rem; }
.col { flex: 1 0 0%; padding-right: 0.75rem; padding-left: 0.75rem; }

/* ── Sticky top ───────────────────────────────────────────────────── */
.sticky-top {
  position: sticky !important;
  top: 0;
  z-index: 1020;
}

/* ── Navbar ───────────────────────────────────────────────────────── */
.navbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 0.5rem 1rem; }
.navbar-brand { display: inline-flex; align-items: center; white-space: nowrap; text-decoration: none; }
.navbar-nav { display: flex; flex-direction: column; padding-left: 0; margin-bottom: 0; list-style: none; }
.nav-link { display: block; padding: 0.5rem 1rem; color: inherit; text-decoration: none; }
.navbar-toggler { padding: 0.25rem 0.75rem; background: transparent; border: 1px solid transparent; border-radius: 0.375rem; cursor: pointer; }

/* ── Form controls ────────────────────────────────────────────────── */
.form-control,
.form-select {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #363636;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #dbdbdb;
  border-radius: 0.375rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  box-sizing: border-box;
}
.form-control:focus,
.form-select:focus {
  border-color: #3273dc;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(50,115,220,.25);
}
.form-control:disabled,
.form-control[readonly],
.form-select:disabled {
  background-color: #f5f5f5;
  opacity: 1;
}
.form-control-sm { padding: 0.25rem 0.5rem; font-size: 0.875rem; border-radius: 0.25rem; }
.form-control-lg { padding: 0.5rem 1rem; font-size: 1.125rem; border-radius: 0.5rem; }
.form-select { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23363636' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right 0.75rem center; background-size: 16px 12px; padding-right: 2.25rem; -webkit-appearance: none; appearance: none; }
.form-select-sm  { padding: 0.25rem 0.5rem; font-size: 0.875rem; }
.form-select-lg  { padding: 0.5rem 1rem; font-size: 1.125rem; }
.form-label { display: inline-block; margin-bottom: 0.5rem; font-weight: 500; }
.form-text  { display: block; margin-top: 0.25rem; font-size: 0.875em; color: #6b7280; }
.form-check { display: block; min-height: 1.5rem; padding-left: 1.5rem; margin-bottom: 0.125rem; }
.form-check-input { width: 1em; height: 1em; margin-top: 0.25em; vertical-align: top; border: 1px solid #dbdbdb; border-radius: 0.25em; }
.form-check-label { cursor: pointer; }
.form-floating { position: relative; }
.form-floating > .form-control { padding: 1rem 0.75rem; }
.invalid-feedback { display: none; width: 100%; margin-top: 0.25rem; font-size: 0.875em; color: #f14668; }
.valid-feedback   { display: none; width: 100%; margin-top: 0.25rem; font-size: 0.875em; color: #48c774; }
.was-validated .form-control:invalid ~ .invalid-feedback,
.form-control.is-invalid ~ .invalid-feedback { display: block; }
.was-validated .form-control:valid ~ .valid-feedback,
.form-control.is-valid ~ .valid-feedback { display: block; }
.form-control.is-invalid,
.was-validated .form-control:invalid { border-color: #f14668; }
.form-control.is-valid,
.was-validated .form-control:valid   { border-color: #48c774; }
.input-group-text { display: flex; align-items: center; padding: 0.375rem 0.75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #363636; text-align: center; white-space: nowrap; background-color: #f5f5f5; border: 1px solid #dbdbdb; border-radius: 0.375rem; }
.input-group { position: relative; display: flex; flex-wrap: wrap; align-items: stretch; width: 100%; }
.input-group > .form-control,
.input-group > .form-select { position: relative; flex: 1 1 auto; width: 1%; min-width: 0; }
.input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) { margin-left: -1px; border-top-left-radius: 0; border-bottom-left-radius: 0; }

/* ── Buttons ──────────────────────────────────────────────────────── */
.btn-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0.375rem;
  opacity: 0.7;
  cursor: pointer;
  font-size: 1.25rem;
  line-height: 1;
  color: #363636;
}
.btn-close:hover   { opacity: 1; }
.btn-close::before { content: '✕'; }
.btn-close-white   { filter: invert(1); }

/* ── Badges / Tags ────────────────────────────────────────────────── */
.badge {
  display: inline-block;
  padding: 0.35em 0.65em;
  font-size: 0.75em;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: 0.375rem;
  color: #fff;
}
.badge.bg-primary   { background-color: #3273dc !important; }
.badge.bg-secondary { background-color: #6b7280 !important; }
.badge.bg-success   { background-color: #48c774 !important; color: #fff !important; }
.badge.bg-danger    { background-color: #f14668 !important; }
.badge.bg-warning   { background-color: #ffdd57 !important; color: #363636 !important; }
.badge.bg-info      { background-color: #3298dc !important; }
.badge.bg-light     { background-color: #f5f5f5 !important; color: #363636 !important; }
.badge.bg-dark      { background-color: #363636 !important; }
.rounded-pill.badge { border-radius: 50rem; }

/* ── Alerts / Notifications ───────────────────────────────────────── */
.alert {
  position: relative;
  padding: 1rem 1rem;
  margin-bottom: 1rem;
  border: 1px solid transparent;
  border-radius: 0.375rem;
}
.alert-heading { color: inherit; }
.alert-dismissible { padding-right: 3rem; }
.alert-dismissible .btn-close { position: absolute; top: 0; right: 0; z-index: 2; padding: 1.25rem 1rem; }
.alert-link { font-weight: 700; }
.alert-primary   { color: #084298; background-color: #cfe2ff; border-color: #b6d4fe; }
.alert-secondary { color: #41464b; background-color: #e2e3e5; border-color: #d3d6d8; }
.alert-success   { color: #0f5132; background-color: #d1e7dd; border-color: #badbcc; }
.alert-danger    { color: #842029; background-color: #f8d7da; border-color: #f5c2c7; }
.alert-warning   { color: #664d03; background-color: #fff3cd; border-color: #ffecb5; }
.alert-info      { color: #055160; background-color: #cff4fc; border-color: #b6effb; }
.alert-light     { color: #636464; background-color: #fefefe; border-color: #fdfdfe; }
.alert-dark      { color: #141619; background-color: #d3d3d4; border-color: #bcbebf; }

/* ── List group ───────────────────────────────────────────────────── */
.list-group { display: flex; flex-direction: column; padding-left: 0; margin-bottom: 0; border-radius: 0.375rem; }
.list-group-item {
  position: relative;
  display: block;
  padding: 0.5rem 1rem;
  color: #363636;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid rgba(0,0,0,.125);
}
.list-group-item:first-child { border-top-left-radius: inherit; border-top-right-radius: inherit; }
.list-group-item:last-child  { border-bottom-left-radius: inherit; border-bottom-right-radius: inherit; }
.list-group-item + .list-group-item { border-top-width: 0; }
.list-group-item.active { z-index: 2; color: #fff; background-color: #3273dc; border-color: #3273dc; }
.list-group-item.disabled { color: #6b7280; pointer-events: none; background-color: #fff; }
.list-group-item-action { width: 100%; color: #363636; text-align: inherit; cursor: pointer; }
.list-group-item-action:hover { background-color: #f5f5f5; }
.list-group-flush .list-group-item { border-right-width: 0; border-left-width: 0; border-radius: 0; }

/* ── Cards ────────────────────────────────────────────────────────── */
.card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  background-color: #fff;
  border: 1px solid rgba(0,0,0,.125);
  border-radius: 0.375rem;
}
.card-body    { flex: 1 1 auto; padding: 1rem; }
.card-title   { margin-bottom: 0.5rem; font-weight: 600; }
.card-text    { margin-bottom: 1rem; }
.card-header  { padding: 0.5rem 1rem; background-color: rgba(0,0,0,.03); border-bottom: 1px solid rgba(0,0,0,.125); }
.card-footer  { padding: 0.5rem 1rem; background-color: rgba(0,0,0,.03); border-top: 1px solid rgba(0,0,0,.125); }
.card-img-top { width: 100%; border-top-left-radius: calc(0.375rem - 1px); border-top-right-radius: calc(0.375rem - 1px); }

/* ── Spinners ─────────────────────────────────────────────────────── */
.spinner-border {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  vertical-align: text-bottom;
  border: 0.25em solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: spin 0.75s linear infinite;
}
.spinner-border-sm { width: 1rem; height: 1rem; border-width: 0.2em; }
.spinner-grow {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  vertical-align: text-bottom;
  background-color: currentColor;
  border-radius: 50%;
  opacity: 0;
  animation: spinner-grow 0.75s linear infinite;
}
.spinner-grow-sm { width: 1rem; height: 1rem; }
@keyframes spinner-grow { 0% { transform: scale(0); } 50% { opacity: 1; transform: none; } }

/* ── Progress ─────────────────────────────────────────────────────── */
.progress {
  display: flex;
  height: 1rem;
  overflow: hidden;
  font-size: 0.75rem;
  background-color: #e9ecef;
  border-radius: 0.375rem;
}
.progress-bar {
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  background-color: #3273dc;
  transition: width 0.6s ease;
}
.progress-bar-striped  { background-image: linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent); background-size: 1rem 1rem; }
.progress-bar-animated { animation: progress-bar-stripes 1s linear infinite; }
@keyframes progress-bar-stripes { from { background-position-x: 1rem; } }

/* ── Tables ───────────────────────────────────────────────────────── */
.table { width: 100%; margin-bottom: 1rem; color: #363636; vertical-align: top; border-color: #dee2e6; }
.table > :not(caption) > * > * { padding: 0.5rem; border-bottom-width: 1px; }
.table-sm > :not(caption) > * > * { padding: 0.25rem; }
.table-striped > tbody > tr:nth-of-type(odd) > * { background-color: rgba(0,0,0,.05); }
.table-hover > tbody > tr:hover > * { background-color: rgba(0,0,0,.075); }
.table-bordered > :not(caption) > * { border-width: 1px 0; }
.table-bordered > :not(caption) > * > * { border-width: 0 1px; }
.table-responsive { overflow-x: auto; }
.table-container  { overflow-x: auto; }
.table-responsive-sm  { overflow-x: auto; }
.thead-dark > tr > th { background-color: #363636; color: #fff; }
.thead-light > tr > th { background-color: #f5f5f5; color: #363636; }

/* ── Modal ────────────────────────────────────────────────────────── */
.modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1055;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  outline: 0;
}
.modal.show { display: block; }
.modal-dialog {
  position: relative;
  width: auto;
  margin: 1.75rem auto;
  max-width: 500px;
  pointer-events: none;
}
.modal-dialog-centered {
  display: flex;
  align-items: center;
  min-height: calc(100% - 3.5rem);
}
.modal-dialog-scrollable { height: calc(100% - 3.5rem); }
.modal-dialog-scrollable .modal-content { overflow: hidden; }
.modal-dialog-scrollable .modal-body { overflow-y: auto; }
.modal-content {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  pointer-events: auto;
  background-color: #fff;
  border: 1px solid rgba(0,0,0,.2);
  border-radius: 0.5rem;
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,.5);
  outline: 0;
}
.modal-header {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: space-between;
  padding: 1rem;
  border-bottom: 1px solid #dee2e6;
  border-top-left-radius: calc(0.5rem - 1px);
  border-top-right-radius: calc(0.5rem - 1px);
}
.modal-title  { margin-bottom: 0; line-height: 1.5; font-weight: 600; }
.modal-body   { position: relative; flex: 1 1 auto; padding: 1rem; }
.modal-footer {
  display: flex;
  flex-wrap: wrap;
  flex-shrink: 0;
  align-items: center;
  justify-content: flex-end;
  padding: 0.75rem;
  border-top: 1px solid #dee2e6;
  border-bottom-right-radius: calc(0.5rem - 1px);
  border-bottom-left-radius: calc(0.5rem - 1px);
  gap: 0.5rem;
}
.modal-sm  { max-width: 300px; }
.modal-lg  { max-width: 800px; }
.modal-xl  { max-width: 1140px; }
.modal-fullscreen { width: 100vw; max-width: none; height: 100%; margin: 0; }
.modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1050;
  width: 100vw;
  height: 100vh;
  background-color: #000;
  opacity: 0.5;
}
.modal-backdrop.fade  { opacity: 0; }
.modal-backdrop.show  { opacity: 0.5; }
body.modal-open { overflow: hidden; }

/* ── Offcanvas ────────────────────────────────────────────────────── */
.offcanvas {
  position: fixed;
  bottom: 0;
  z-index: 1045;
  display: flex;
  flex-direction: column;
  max-width: 100%;
  visibility: hidden;
  background-color: #fff;
  background-clip: padding-box;
  outline: 0;
  transition: transform 0.3s ease-in-out;
}
.offcanvas.show { visibility: visible; transform: none !important; }
.offcanvas.showing { visibility: visible; }
.offcanvas.hiding  { transition: transform 0.3s ease-in-out, visibility 0.3s; }
.offcanvas-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1040;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0,0,0,0.5);
}
.offcanvas-start {
  top: 0;
  left: 0;
  width: 400px;
  border-right: 1px solid rgba(0,0,0,.2);
  transform: translateX(-100%);
}
.offcanvas-end {
  top: 0;
  right: 0;
  width: 400px;
  border-left: 1px solid rgba(0,0,0,.2);
  transform: translateX(100%);
}
.offcanvas-top {
  top: 0;
  right: 0;
  left: 0;
  height: 30vh;
  max-height: 100%;
  border-bottom: 1px solid rgba(0,0,0,.2);
  transform: translateY(-100%);
}
.offcanvas-bottom {
  right: 0;
  left: 0;
  height: 30vh;
  max-height: 100%;
  border-top: 1px solid rgba(0,0,0,.2);
  transform: translateY(100%);
}
.offcanvas-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem;
  border-bottom: 1px solid rgba(0,0,0,.1);
}
.offcanvas-title  { margin-bottom: 0; line-height: 1.5; }
.offcanvas-body   { flex-grow: 1; padding: 1rem; overflow-y: auto; }

/* ── Dropdown ─────────────────────────────────────────────────────── */
.dropdown         { position: relative; }
.dropdown-toggle  { white-space: nowrap; cursor: pointer; }
.dropdown-toggle::after { display: inline-block; margin-left: 0.255em; vertical-align: 0.255em; content: ''; border-top: 0.3em solid; border-right: 0.3em solid transparent; border-bottom: 0; border-left: 0.3em solid transparent; }
.dropdown-toggle-no-caret.dropdown-toggle::after { display: none; }
.dropdown-menu {
  position: absolute;
  z-index: 1000;
  display: none;
  min-width: 10rem;
  padding: 0.5rem 0;
  margin: 0;
  font-size: 1rem;
  color: #363636;
  text-align: left;
  list-style: none;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 0.375rem;
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,.175);
}
.dropdown-menu.show { display: block; }
.dropdown-menu-end { right: 0; left: auto; }
.dropdown-item {
  display: block;
  width: 100%;
  padding: 0.4rem 1rem;
  clear: both;
  font-weight: 400;
  color: #363636;
  text-align: inherit;
  text-decoration: none;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
  cursor: pointer;
}
.dropdown-item:hover, .dropdown-item:focus { color: #1a1a1a; background-color: #f5f5f5; }
.dropdown-item.active, .dropdown-item:active { color: #fff; text-decoration: none; background-color: #3273dc; }
.dropdown-item.disabled, .dropdown-item:disabled { color: #adb5bd; pointer-events: none; background-color: transparent; }
.dropdown-divider { height: 0; margin: 0.5rem 0; overflow: hidden; border-top: 1px solid rgba(0,0,0,.15); }
.dropdown-header  { display: block; padding: 0.5rem 1rem; margin-bottom: 0; font-size: 0.875rem; color: #6b7280; white-space: nowrap; }

/* ── Tabs ─────────────────────────────────────────────────────────── */
.nav { display: flex; flex-wrap: wrap; padding-left: 0; margin-bottom: 0; list-style: none; }
.nav-tabs { border-bottom: 1px solid #dee2e6; }
.nav-tabs .nav-link { margin-bottom: -1px; border: 1px solid transparent; border-top-left-radius: 0.375rem; border-top-right-radius: 0.375rem; }
.nav-tabs .nav-link:hover { border-color: #e9ecef #e9ecef #dee2e6; }
.nav-tabs .nav-link.active { color: #363636; background-color: #fff; border-color: #dee2e6 #dee2e6 #fff; }
.nav-pills .nav-link { border-radius: 0.375rem; }
.nav-pills .nav-link.active { color: #fff; background-color: #3273dc; }
.tab-content > .tab-pane { display: none; }
.tab-content > .active    { display: block; }

/* ── Accordion ────────────────────────────────────────────────────── */
.accordion-item   { background-color: #fff; border: 1px solid rgba(0,0,0,.125); }
.accordion-header { margin-bottom: 0; }
.accordion-button { position: relative; display: flex; align-items: center; width: 100%; padding: 1rem; font-size: 1rem; color: #363636; text-align: left; background-color: #fff; border: 0; cursor: pointer; }
.accordion-button:not(.collapsed) { color: #3273dc; background-color: #e8f0fe; }
.accordion-button::after { flex-shrink: 0; width: 1.25rem; height: 1.25rem; margin-left: auto; content: '▼'; font-size: 0.75rem; transition: transform 0.2s ease-in-out; }
.accordion-button.collapsed::after { transform: rotate(-90deg); }
.accordion-collapse { overflow: hidden; }
.accordion-body { padding: 1rem; }

/* ── Tooltip ──────────────────────────────────────────────────────── */
.tooltip { position: absolute; z-index: 1080; display: block; font-size: 0.875rem; }
.tooltip-inner { max-width: 200px; padding: 0.25rem 0.5rem; color: #fff; text-align: center; background-color: #000; border-radius: 0.375rem; }

/* ── Breadcrumb ───────────────────────────────────────────────────── */
.breadcrumb { display: flex; flex-wrap: wrap; padding: 0; margin-bottom: 1rem; list-style: none; }
.breadcrumb-item + .breadcrumb-item { padding-left: 0.5rem; }
.breadcrumb-item + .breadcrumb-item::before { float: left; padding-right: 0.5rem; color: #6b7280; content: '/'; }
.breadcrumb-item.active { color: #6b7280; }

/* ── Pagination ───────────────────────────────────────────────────── */
.pagination { display: flex; padding-left: 0; list-style: none; }
.page-link { position: relative; display: block; color: #3273dc; text-decoration: none; background-color: #fff; border: 1px solid #dee2e6; padding: 0.375rem 0.75rem; }
.page-link:hover { z-index: 2; color: #1a5eb8; background-color: #e9ecef; border-color: #dee2e6; }
.page-item.active .page-link { z-index: 3; color: #fff; background-color: #3273dc; border-color: #3273dc; }
.page-item.disabled .page-link { color: #6b7280; pointer-events: none; background-color: #fff; border-color: #dee2e6; }

/* ── Select2 – Bulma compat ───────────────────────────────────────── */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
  border: 1px solid #dbdbdb !important;
  border-radius: 0.375rem !important;
  min-height: 2.25rem;
}
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single {
  border-color: #3273dc !important;
  box-shadow: 0 0 0 0.2rem rgba(50,115,220,.25) !important;
  outline: 0;
}
.select2-container { width: 100% !important; }
.select2-dropdown  { border: 1px solid #dbdbdb; border-radius: 0.375rem; box-shadow: 0 0.5rem 1rem rgba(0,0,0,.175); }
.select2-results__option--highlighted { background-color: #3273dc !important; color: #fff !important; }

/* ── DataTables – Bulma compat ────────────────────────────────────── */
.dataTables_wrapper .dataTables_filter input { border: 1px solid #dbdbdb; border-radius: 0.375rem; padding: 0.375rem 0.75rem; }
.dataTables_wrapper .dataTables_length select { border: 1px solid #dbdbdb; border-radius: 0.375rem; padding: 0.25rem 0.5rem; }
.dataTables_wrapper .dataTables_paginate .paginate_button { cursor: pointer; padding: 0.375rem 0.75rem; border-radius: 0.375rem; border: 1px solid transparent; }
.dataTables_wrapper .dataTables_paginate .paginate_button:hover { background: #f5f5f5; border-color: #dbdbdb; }
.dataTables_wrapper .dataTables_paginate .paginate_button.current { background: #3273dc; color: #fff !important; border-color: #3273dc; }
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled { opacity: 0.5; cursor: default; }
table.dataTable thead th, table.dataTable thead td { border-bottom: 2px solid #dbdbdb; }
table.dataTable.no-footer { border-bottom: 1px solid #dbdbdb; }