/* Fleetexo v116 fluid responsive guard layer. Keeps the existing palette; fixes sizing, wrapping and overflow. */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: clamp(14px, 0.88rem + 0.18vw, 17px); max-width: 100%; overflow-x: hidden; }
body { max-width: 100%; overflow-x: hidden; text-size-adjust: 100%; }
img, svg, video, canvas, iframe { max-width: 100%; height: auto; }
img, video { object-fit: cover; }
pre, code, textarea, input, select, button { max-width: 100%; }
pre { white-space: pre-wrap; overflow-wrap: anywhere; }

:root {
  --fx-fluid-page: min(100% - clamp(1rem, 3vw, 2.5rem), 1480px);
  --fx-fluid-card-gap: clamp(0.75rem, 1.5vw, 1.35rem);
  --fx-fluid-pad: clamp(0.9rem, 1.8vw, 1.55rem);
}

.topbar,
.section,
.auth-wrap,
.content,
.fx-public-job-inner {
  width: var(--fx-fluid-page);
  max-width: 1480px;
  margin-inline: auto;
}

.panel {
  display: grid;
  grid-template-columns: minmax(13rem, 15rem) minmax(0, 1fr);
  width: min(100%, 1680px);
  margin-inline: auto;
}

.content {
  min-width: 0;
  padding-inline: clamp(0.9rem, 2vw, 1.7rem);
}

.panel > .content {
  width: 100%;
  max-width: none;
  margin-inline: 0;
}

.card,
.notice,
.alert,
.auth-card,
.fx-job-hero,
.fx-job-side {
  max-width: 100%;
  padding: var(--fx-fluid-pad);
  overflow-wrap: anywhere;
}

h1 { font-size: clamp(1.75rem, 1.25rem + 2vw, 3.25rem); line-height: 1.08; letter-spacing: 0; }
h2 { font-size: clamp(1.2rem, 1rem + 0.9vw, 2rem); line-height: 1.15; letter-spacing: 0; }
h3 { font-size: clamp(1rem, 0.92rem + 0.38vw, 1.35rem); line-height: 1.2; letter-spacing: 0; }
p, li, label, input, select, textarea, button, .btn { font-size: clamp(0.9rem, 0.86rem + 0.16vw, 1rem); }

.grid,
.form-row,
.mini-grid,
.fx87-kpis,
.fx87-finance-summary,
.fx-job-metrics,
.fx115-pool-card-top,
.fx116-document-request-form,
.fx116-document-review-form {
  display: grid;
  gap: var(--fx-fluid-card-gap);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
}

.grid.cols-2,
.grid.cols-3,
.grid.cols-4,
.grid.cols-5,
.grid.cols-6 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15.5rem), 1fr));
}

.form-row > *,
.grid > *,
.fx87-kpis > *,
.fx87-finance-summary > *,
.fx-job-metrics > * {
  min-width: 0;
}

form,
.inline-form,
.actions,
.topnav,
.pool-alert-toolbar,
.fx115-mini-actions,
.fx-cta-stack {
  max-width: 100%;
}

.inline-form,
.actions,
.topnav,
.pool-alert-toolbar,
.fx115-mini-actions {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0.5rem, 1vw, 0.9rem);
  align-items: center;
}

input,
select,
textarea,
button,
.btn {
  min-height: 2.75rem;
  border-radius: min(0.75rem, 12px);
}

textarea { min-height: 5rem; resize: vertical; }
button, .btn { white-space: normal; text-align: center; line-height: 1.2; }

.table-wrap {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

table {
  width: 100%;
  border-collapse: collapse;
}

th, td {
  overflow-wrap: anywhere;
  vertical-align: top;
}

.fx-pool-desktop,
.fx-pool-cards,
.fx-pool-card,
.fx115-route,
.fx115-info-list,
.fx115-pax,
.fx115-source,
.fx115-payment,
.fx116-missing-docs,
.fx-document-gate {
  min-width: 0;
  max-width: 100%;
}

.fx-public-job-inner {
  grid-template-columns: minmax(0, 1.1fr) minmax(min(100%, 21rem), 0.9fr);
}

.fx-job-title { font-size: clamp(2rem, 1.25rem + 3.2vw, 4rem); letter-spacing: 0; }
.fx-price-box strong { font-size: clamp(1.65rem, 1.1rem + 2vw, 2.35rem); }

@media (min-width: 1600px) {
  .content, .section, .auth-wrap { max-width: 1480px; }
}

@media (max-width: 980px) {
  .panel {
    display: block;
    width: 100%;
  }

  .content {
    width: min(100% - 1rem, 100%);
    padding: clamp(0.75rem, 2.5vw, 1rem);
  }

  .topbar {
    width: min(100% - 1rem, 100%);
  }

  .fx-public-job-inner,
  .fx-job-metrics,
  .fx115-pool-card-top {
    grid-template-columns: 1fr;
  }

  .card, .notice, .alert {
    border-radius: min(0.9rem, 14px);
  }
}

@media (max-width: 640px) {
  :root { --fx-fluid-page: min(100% - 0.75rem, 100%); }
  .content { padding-inline: 0.55rem; }
  .card, .notice, .alert { padding: clamp(0.75rem, 3.5vw, 1rem); }
  .grid,
  .form-row,
  .grid.cols-2,
  .grid.cols-3,
  .grid.cols-4,
  .grid.cols-5,
  .grid.cols-6 {
    grid-template-columns: 1fr;
  }
  .inline-form,
  .actions,
  .pool-alert-toolbar,
  .fx115-mini-actions {
    align-items: stretch;
  }
  .inline-form > *,
  .actions > *,
  .pool-alert-toolbar > *,
  .fx115-mini-actions > * {
    flex: 1 1 auto;
  }
  input, select, textarea, button, .btn { width: 100%; }
}
