/**
 * Bootstrap Grid — minimal subset
 * Solo le classi effettivamente usate nelle pagine Medlight.
 * Niente Bootstrap JS, niente componenti — solo grid + flex utilities.
 */

/* ── Variables ─────────────────────────────────────────────────────────────── */
:root {
  --bs-gutter-x: 20px;
  --bs-gutter-y: 0;
  --bs-breakpoint-sm: 576px;
  --bs-breakpoint-md: 768px;
  --bs-breakpoint-lg: 992px;
  --bs-breakpoint-xl: 1200px;
  --bs-breakpoint-xxl: 1400px;
}

/* ── Container ─────────────────────────────────────────────────────────────── */
.container, .container-fluid {
  width: 100%;
  padding-right: calc(var(--bs-gutter-x) * .5);
  padding-left:  calc(var(--bs-gutter-x) * .5);
  margin-right: auto;
  margin-left:  auto;
}
@media (min-width: 576px)  { .container { max-width: 540px; } }
@media (min-width: 768px)  { .container { max-width: 720px; } }
@media (min-width: 992px)  { .container { max-width: 960px; } }
@media (min-width: 1200px) { .container { max-width: 1140px; } }
@media (min-width: 1400px) { .container { max-width: 1330px; } }

/* ── Row ───────────────────────────────────────────────────────────────────── */
.row {
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(-1 * var(--bs-gutter-y));
  margin-right: calc(-.5 * var(--bs-gutter-x));
  margin-left:  calc(-.5 * var(--bs-gutter-x));
}
.row > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) * .5);
  padding-left:  calc(var(--bs-gutter-x) * .5);
  margin-top: var(--bs-gutter-y);
}

/* ── Columns — no breakpoint ───────────────────────────────────────────────── */
.col-6  { flex: 0 0 auto; width: 50%; }
.col-12 { flex: 0 0 auto; width: 100%; }

/* ── Columns — sm (≥576px) ─────────────────────────────────────────────────── */
@media (min-width: 576px) {
  .col-sm-4  { flex: 0 0 auto; width: 33.33333333%; }
  .col-sm-12 { flex: 0 0 auto; width: 100%; }
}

/* ── Columns — md (≥768px) ─────────────────────────────────────────────────── */
@media (min-width: 768px) {
  .col-md-2  { flex: 0 0 auto; width: 16.66666667%; }
  .col-md-4  { flex: 0 0 auto; width: 33.33333333%; }
  .col-md-5  { flex: 0 0 auto; width: 41.66666667%; }
  .col-md-6  { flex: 0 0 auto; width: 50%; }
  .col-md-12 { flex: 0 0 auto; width: 100%; }
}

/* ── Columns — lg (≥992px) ─────────────────────────────────────────────────── */
@media (min-width: 992px) {
  .col-lg-3  { flex: 0 0 auto; width: 25%; }
  .col-lg-4  { flex: 0 0 auto; width: 33.33333333%; }
  .col-lg-5  { flex: 0 0 auto; width: 41.66666667%; }
  .col-lg-6  { flex: 0 0 auto; width: 50%; }
  .col-lg-7  { flex: 0 0 auto; width: 58.33333333%; }
  .col-lg-8  { flex: 0 0 auto; width: 66.66666667%; }
  .col-lg-9  { flex: 0 0 auto; width: 75%; }
  .col-lg-12 { flex: 0 0 auto; width: 100%; }
}

/* ── Columns — xl (≥1200px) ────────────────────────────────────────────────── */
@media (min-width: 1200px) {
  .col-xl-3  { flex: 0 0 auto; width: 25%; }
  .col-xl-4  { flex: 0 0 auto; width: 33.33333333%; }
  .col-xl-5  { flex: 0 0 auto; width: 41.66666667%; }
  .col-xl-6  { flex: 0 0 auto; width: 50%; }
  .col-xl-7  { flex: 0 0 auto; width: 58.33333333%; }
}

/* ── Columns — xxl (≥1400px) ───────────────────────────────────────────────── */
@media (min-width: 1400px) {
  .col-xxl-5 { flex: 0 0 auto; width: 41.66666667%; }
  .col-xxl-7 { flex: 0 0 auto; width: 58.33333333%; }
}

/* ── Flex utilities ─────────────────────────────────────────────────────────── */
.d-flex             { display: flex !important; }
.align-items-center { align-items: center !important; }
.align-items-end    { align-items: flex-end !important; }
.align-self-end     { align-self: flex-end !important; }
.justify-content-between { justify-content: space-between !important; }
.justify-content-center  { justify-content: center !important; }
.float-end { float: right !important; }

@media (min-width: 992px) {
  .justify-content-lg-end { justify-content: flex-end !important; }
}
@media (min-width: 1200px) {
  .justify-content-xl-start { justify-content: flex-start !important; }
}

/* ── Spacing utilities ─────────────────────────────────────────────────────── */
.mb-0 { margin-bottom: 0 !important; }
.mb-2 { margin-bottom: .5rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mb-5 { margin-bottom: 3rem !important; }
.p-0  { padding: 0 !important; }
.p-2  { padding: .5rem !important; }
.me-lg-5 { }  /* override specifico sotto */

@media (min-width: 768px) {
  .mb-md-0 { margin-bottom: 0 !important; }
}
@media (min-width: 576px) {
  .mb-sm-4 { margin-bottom: 1.5rem !important; }
  .mb-sm-5 { margin-bottom: 3rem !important; }
}
@media (min-width: 992px) {
  .mb-lg-0 { margin-bottom: 0 !important; }
  .me-lg-5 { margin-right: 3rem !important; }
}
@media (min-width: 1200px) {
  .mb-xl-0 { margin-bottom: 0 !important; }
}

/* ── Display / Layout utilities ────────────────────────────────────────────── */
.h-100           { height: 100% !important; }
.overflow-hidden  { overflow: hidden !important; }
.position-relative { position: relative !important; }
.clearfix::after  { content: ''; display: table; clear: both; }
