:root {
  --ink: #172026;
  --muted: #5c6972;
  --line: rgba(23, 32, 38, 0.13);
  --paper: #fbfaf6;
  --blue: #145f7c;
  --teal: #167164;
  --coral: #c95649;
  --night: #10212c;
  --shadow: 0 14px 34px rgba(18, 38, 48, 0.10);
  --max: 1180px;
}

/* Rental admin calendar subscription */
.calendar-admin-page .admin-main {
  max-width: none;
}

.calendar-flash {
  border-left: 3px solid #079c96;
  border-radius: 2px;
  padding: 14px 18px;
}

.calendar-integration-panel {
  padding: 0;
  overflow: hidden;
  border-radius: 4px;
}

.calendar-integration-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 22px 24px;
  border-bottom: 1px solid #e3eaf0;
}

.calendar-integration-head h2,
.calendar-connect-layout h3 {
  margin: 4px 0 0;
}

.calendar-status {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #596b7a;
  font-weight: 750;
  white-space: nowrap;
}

.calendar-status > span {
  width: 3px;
  height: 28px;
  background: #94a3b0;
}

.calendar-status.is-active {
  color: #087b76;
}

.calendar-status.is-active > span {
  background: #08a59e;
}

.calendar-setup {
  display: grid;
  grid-template-columns: minmax(260px, 1.5fr) minmax(220px, .8fr) minmax(260px, 1fr) auto;
  align-items: end;
  gap: 22px;
  padding: 28px 24px;
}

.calendar-setup-copy strong {
  display: block;
  color: #142433;
  font-size: 18px;
}

.calendar-setup-copy p {
  margin: 7px 0 0;
  color: #6d7f8e;
  line-height: 1.55;
}

.calendar-connect-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr);
}

.calendar-connect-main,
.calendar-settings-side {
  position: relative;
  padding: 28px 28px 30px 76px;
}

.calendar-settings-side {
  border-left: 1px solid #e3eaf0;
  background: #f8fafb;
}

.calendar-step-label {
  position: absolute;
  top: 30px;
  left: 26px;
  color: #8a9aa8;
  font-size: 12px;
  font-weight: 850;
}

.calendar-step-label::after {
  content: '';
  display: block;
  width: 22px;
  height: 2px;
  margin-top: 7px;
  background: #08a59e;
}

.calendar-iphone-action {
  width: 100%;
  min-height: 48px;
  margin-top: 24px;
  justify-content: center;
}

.calendar-url-block {
  margin-top: 24px;
}

.calendar-url-block > label,
.calendar-field > span {
  display: block;
  margin-bottom: 8px;
  color: #687b8b;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.calendar-url-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
}

.calendar-url-row input {
  min-width: 0;
  direction: ltr;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 12px;
}

.calendar-sync-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 24px 0 0;
  border-top: 1px solid #e3eaf0;
}

.calendar-sync-meta > div {
  padding-top: 18px;
}

.calendar-sync-meta > div + div {
  padding-left: 20px;
  border-left: 1px solid #e3eaf0;
}

.calendar-sync-meta dt {
  color: #8192a0;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.calendar-sync-meta dd {
  margin: 6px 0 0;
  color: #142433;
  font-weight: 750;
}

.calendar-settings-form {
  display: grid;
  gap: 20px;
  margin-top: 24px;
}

.calendar-field select {
  width: 100%;
}

.calendar-privacy-option {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: start;
  gap: 11px;
  color: #142433;
  cursor: pointer;
}

.calendar-privacy-option input {
  width: 18px;
  height: 18px;
  margin: 2px 0 0;
}

.calendar-privacy-option strong,
.calendar-privacy-option small {
  display: block;
}

.calendar-privacy-option small {
  margin-top: 4px;
  color: #718391;
  line-height: 1.45;
}

.calendar-security-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 18px 24px;
  border-top: 1px solid #e3eaf0;
  background: #fff;
}

.calendar-security-row strong {
  display: block;
  margin-top: 4px;
  color: #344857;
  font-size: 13px;
}

.calendar-security-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

@media (max-width: 1050px) {
  .calendar-setup {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .calendar-primary-action {
    width: 100%;
  }

  .calendar-connect-layout {
    grid-template-columns: 1fr;
  }

  .calendar-settings-side {
    border-top: 1px solid #e3eaf0;
    border-left: 0;
  }
}

@media (max-width: 700px) {
  .calendar-integration-head,
  .calendar-security-row {
    align-items: flex-start;
    flex-direction: column;
  }

  .calendar-integration-head,
  .calendar-setup,
  .calendar-security-row {
    padding: 18px;
  }

  .calendar-setup {
    grid-template-columns: 1fr;
  }

  .calendar-connect-main,
  .calendar-settings-side {
    padding: 22px 18px;
  }

  .calendar-step-label {
    position: static;
    margin-bottom: 15px;
  }

  .calendar-url-row,
  .calendar-sync-meta {
    grid-template-columns: 1fr;
  }

  .calendar-url-row .link-button,
  .calendar-iphone-action,
  .calendar-settings-form .primary-button,
  .calendar-security-actions,
  .calendar-security-actions form,
  .calendar-security-actions button {
    width: 100%;
  }

  .calendar-sync-meta > div + div {
    padding-left: 0;
    border-left: 0;
  }

  .calendar-security-actions {
    flex-direction: column;
  }
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "Avenir Next", "Segoe UI", Arial, sans-serif;
  line-height: 1.45;
}
body.checkout-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }

.topbar {
  position: relative;
  z-index: 20;
  background: rgba(255, 253, 248, 0.94);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(18px);
}
.topbar-inner {
  width: min(calc(100% - 32px), var(--max));
  min-height: 66px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  font-weight: 650;
  font-size: 17px;
}
.brand-logo {
  width: 100px;
  height: 100px;
  object-fit: contain;
  flex: 0 0 auto;
}
.brand-mark {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(135deg, var(--blue), var(--teal));
  border-radius: 8px;
}
.brand-copy,
.brand span:last-child { display: flex; flex-direction: column; line-height: 1.04; }
.brand small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.drive-topbar {
  position: relative;
  z-index: 601;
  background: #0f1722;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.drive-topbar-inner {
  min-height: 74px;
}

.drive-brand {
  gap: 0;
}

.drive-brand .brand-logo {
  width: 84px;
  height: 84px;
}

.drive-brand-logo {
  object-position: left center;
}

.drive-brand-copy {
  display: grid;
  line-height: 1;
}

.drive-brand-copy strong {
  font-size: 22px;
  color: #0f1722;
  font-weight: 750;
}

.drive-brand-copy small {
  margin-top: 6px;
  color: #7a8794;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.drive-nav {
  gap: 12px;
}

.drive-nav a {
  padding: 0 12px;
  color: rgba(255, 255, 255, 0.76);
}

.drive-nav a:hover {
  color: #ffffff;
}
.nav { display: flex; align-items: center; gap: 8px; }
.nav a, .cart-button, .primary-button, .dark-button, .link-button {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0;
  font-weight: 650;
  cursor: pointer;
}
.danger-button {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(201, 86, 73, 0.28);
  border-radius: 0;
  padding: 0 12px;
  color: #a83e35;
  background: #fff;
  font-weight: 650;
  cursor: pointer;
}
.nav a {
  padding: 0 10px;
  color: var(--muted);
  font-size: 13px;
}

.language-switch,
.currency-switch {
  min-height: 36px;
  display: inline-grid;
  grid-auto-flow: column;
  align-items: stretch;
  gap: 0;
  padding: 0;
  border: 1px solid rgba(255,255,255,0.16);
  border-radius: 0;
  background: rgba(12, 20, 28, 0.78);
  overflow: hidden;
}

.language-switch a,
.currency-switch a {
  min-width: 40px;
  min-height: 34px;
  padding: 0 10px;
  border-right: 1px solid rgba(255,255,255,0.1);
  color: #97aab7;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.language-switch a.active,
.currency-switch a.active {
  color: #111a22;
  background: #f3f6f8;
}

.language-switch a:last-child,
.currency-switch a:last-child {
  border-right: 0;
}

.session-pill {
  max-width: 220px;
  min-height: 34px;
  gap: 6px;
  padding: 0 10px;
  border: 1px solid #dfe5ea;
  border-radius: 0;
  color: #344450;
  background: #fff;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.session-pill span {
  color: var(--teal);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.cart-button, .dark-button {
  gap: 8px;
  padding: 0 13px;
  border: 0;
  color: #fff;
  background: var(--night);
}
.cart-button span {
  min-width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  color: var(--night);
  background: #fff;
  border-radius: 999px;
  font-size: 12px;
}
.primary-button {
  border: 0;
  padding: 0 18px;
  color: #fff;
  background: var(--coral);
}
.link-button {
  padding: 0 14px;
  color: var(--night);
  background: #fff;
  border: 1px solid var(--line);
}

.hero {
  min-height: 560px;
  display: grid;
  align-items: center;
  color: #fff;
  background:
    linear-gradient(90deg, rgba(7, 19, 28, 0.84), rgba(7, 19, 28, 0.36)),
    url("/assets/insideauto/viber_image_2026-05-19_12-07-08-080.jpg") center / cover no-repeat;
}

.drive-results-hero {
  position: relative;
  background:
    linear-gradient(90deg, rgba(12, 22, 31, 0.58), rgba(12, 22, 31, 0.18)),
    url("/assets/insideauto/viber_image_2026-05-19_12-07-08-080.jpg") center / cover no-repeat;
  border-bottom: 1px solid #d8e0e6;
  min-height: 280px;
}

.drive-search-stage {
  position: sticky;
  top: 88px;
  z-index: 18;
  margin-top: -78px;
  margin-bottom: 24px;
}

.drive-results-shell {
  width: min(calc(100% - 32px), var(--max));
  margin: 0 auto;
}

.drive-results-head {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.85fr);
  gap: 24px;
  align-items: end;
  padding: 42px 0 118px;
}

.drive-results-head h1 {
  margin: 8px 0 10px;
  max-width: 760px;
  font-size: 42px;
  line-height: 0.98;
  color: #ffffff;
}

.drive-results-head p {
  max-width: 760px;
  margin: 0;
  color: rgba(255, 255, 255, 0.86);
  font-size: 15px;
}

.drive-results-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.drive-results-stats article {
  display: grid;
  gap: 6px;
  padding: 16px 18px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.34);
}

.drive-results-stats span,
.drive-result-status span,
.drive-result-facts span {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #7b8795;
}

.drive-results-stats strong {
  font-size: 22px;
  color: #101922;
}

.drive-hero-search-card {
  display: grid;
  gap: 14px;
  padding: 28px 24px 24px;
  margin-bottom: 0;
  background: rgba(255, 255, 255, 0.97);
  border: 1px solid rgba(255, 255, 255, 0.42);
  box-shadow: 0 24px 50px rgba(10, 17, 24, 0.18);
}

.drive-hero-search-top {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
}

.drive-hero-search-note {
  color: #65717f;
  font-size: 13px;
}

.drive-hero-search-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  align-items: end;
}

.drive-inline-check {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 0 14px;
  background: #f4f7fa;
  border: 1px solid #dbe4ea;
  color: #1c2935;
  font-size: 13px;
  font-weight: 600;
}

.drive-inline-check input {
  margin: 0;
  width: 16px;
  height: 16px;
  accent-color: var(--coral);
}

.drive-search-submit {
  min-height: 46px;
}

.drive-sticky-searchbar {
  position: relative;
  z-index: 16;
  background: rgba(255, 255, 255, 0.97);
  border-bottom: 0;
  backdrop-filter: blur(14px);
}

.drive-filter-bar {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  align-items: end;
  padding: 0;
  margin-bottom: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.drive-filter-bar label {
  display: grid;
  gap: 8px;
}

.drive-filter-bar .primary-button {
  min-height: 46px;
}

.drive-inline-check-compact {
  align-self: center;
  min-height: 46px;
  padding-top: 18px;
}

.drive-results-main {
  padding: 0 0 32px;
  background: #f7fafc;
}

.drive-trust-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.drive-trust-strip article {
  display: grid;
  gap: 6px;
  padding: 16px 18px;
  background: #fff;
  border: 1px solid #d8e0e6;
}

.drive-trust-strip strong {
  color: #101922;
  font-size: 15px;
}

.drive-trust-strip span {
  color: #687583;
  font-size: 13px;
}

.drive-results-title {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: end;
  margin-bottom: 18px;
}

.drive-results-title h2 {
  margin: 6px 0 0;
  font-size: 30px;
  line-height: 1.04;
  color: #101922;
}

.drive-results-title p {
  max-width: 480px;
  margin: 0;
  color: #6b7785;
}

.drive-results-list {
  display: grid;
  gap: 16px;
}

.drive-result-card {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr) 220px;
  background: #fff;
  border: 1px solid #d8e0e6;
  box-shadow: 0 16px 34px rgba(12, 18, 25, 0.06);
  overflow: hidden;
}

.drive-result-media {
  position: relative;
  display: block;
  background: #eef3f6;
  min-height: 210px;
}

.drive-result-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  padding: 16px;
}

.drive-result-type {
  position: absolute;
  top: 14px;
  left: 14px;
  padding: 7px 10px;
  background: rgba(15, 23, 34, 0.88);
  color: #f4f7fa;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.drive-result-main {
  display: grid;
  gap: 16px;
  padding: 20px 22px;
  border-left: 1px solid #e5ebf0;
}

.drive-result-heading {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: start;
}

.drive-result-heading h3 {
  margin: 0 0 6px;
  font-size: 24px;
  color: #0f1722;
}

.drive-result-heading p {
  margin: 0;
  color: #6a7684;
  font-size: 14px;
}

.drive-result-price {
  text-align: right;
  white-space: nowrap;
}

.drive-result-price span {
  display: block;
  margin-bottom: 4px;
  color: #7a8794;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.drive-result-price strong {
  display: block;
  font-size: 24px;
  color: #101922;
}

.drive-result-price small {
  color: #7a8794;
  font-size: 12px;
}

.drive-result-specs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.drive-result-specs span {
  padding: 7px 10px;
  background: #f4f7f9;
  border: 1px solid #dde5eb;
  color: #263341;
  font-size: 12px;
}

.drive-result-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.drive-result-facts article {
  display: grid;
  gap: 5px;
  padding: 12px 14px;
  background: #f8fafb;
  border: 1px solid #e2e8ee;
}

.drive-result-facts strong,
.drive-result-status strong {
  color: #101922;
  font-size: 15px;
}

.drive-result-side {
  display: grid;
  align-content: space-between;
  gap: 18px;
  padding: 20px;
  background: #f8fafb;
  border-left: 1px solid #e2e8ee;
}

.drive-result-status {
  display: grid;
  gap: 6px;
  padding-bottom: 16px;
  border-bottom: 1px solid #e2e8ee;
}

.drive-result-actions {
  display: grid;
  gap: 10px;
}

.drive-result-actions .primary-button,
.drive-result-actions .link-button {
  justify-content: center;
}

.drive-footer {
  border-top: 1px solid #d9e1e7;
  background: #fff;
}

.drive-footer-inner {
  width: min(calc(100% - 32px), var(--max));
  margin: 0 auto;
  padding: 28px 0 34px;
  display: grid;
  /* `auto` rather than a fixed share: the menu asks for exactly the width its labels need, so
     four of them stay on one line instead of wrapping inside a column sized for three. */
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: start;
}

.drive-footer-brand strong {
  display: block;
  margin-bottom: 10px;
  font-size: 18px;
  color: #0f1722;
}

.drive-footer-brand p {
  margin: 0;
  max-width: 620px;
  color: #677482;
}

.drive-footer-links {
  display: flex;
  flex-wrap: nowrap;
  gap: 12px 18px;
  justify-content: flex-end;
}

.drive-footer-links a { white-space: nowrap; }

.drive-footer-links a {
  color: #44515d;
  font-size: 13px;
}

.drive-footer-credit {
  width: min(calc(100% - 32px), var(--max));
  margin: -10px auto 0;
  padding: 0 0 24px;
  text-align: center;
  color: #7a8590;
  font-size: 13px;
  font-weight: 400;
}

.drive-footer-credit a {
  color: #44515d;
  font-weight: 400;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.insideauto-contact-page {
  background: #f5f5f5;
}

.insideauto-contact-hero {
  padding: 44px 0 28px;
  background: #111111;
  color: #ffffff;
}

.insideauto-contact-hero h1 {
  margin: 8px 0 0;
  font-size: clamp(34px, 5vw, 58px);
  line-height: 1;
  font-weight: 500;
}

.insideauto-contact-hero p {
  max-width: 680px;
  margin: 14px 0 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: 16px;
}

.insideauto-contact-shell {
  width: min(calc(100% - 48px), 1120px);
  margin: 0 auto;
  padding: 34px 0 72px;
}

.insideauto-contact-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 18px;
  align-items: start;
}

.insideauto-contact-form,
.insideauto-contact-info {
  display: grid;
  gap: 16px;
  padding: 22px;
  border: 1px solid #dfdfdf;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.05);
}

.insideauto-contact-form h2,
.insideauto-contact-info h2 {
  margin: 0;
  font-size: 24px;
  font-weight: 500;
}

.insideauto-contact-submit {
  min-height: 48px;
  border: 0;
  border-radius: 10px;
  background: #ed3237;
  color: #ffffff;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
}

.insideauto-contact-info dl,
.insideauto-contact-info dd {
  margin: 0;
}

.insideauto-contact-info dl {
  display: grid;
  gap: 16px;
}

.insideauto-contact-info dt {
  color: #777777;
  font-size: 12px;
}

.insideauto-contact-info dd,
.insideauto-contact-info a {
  color: #111111;
  font-size: 16px;
  text-decoration: none;
}

/* Cover summary on the review step: liability and exclusions stated before committing. */
.insideauto-cover-summary {
  margin: 18px 0;
  padding: 14px 16px;
  border: 1px solid #e2e8f0;
  border-left: 4px solid #d69e2e;
  border-radius: 8px;
  background: #fffaf0;
}

.insideauto-cover-summary strong { display: block; color: #111; font-size: 15px; }
.insideauto-cover-summary p { margin: 6px 0 0; color: #4a4a4a; font-size: 14px; line-height: 1.45; }
.insideauto-cover-summary-label { display: block; margin-top: 10px; font-size: 13px; font-weight: 600; color: #7a5410; }
.insideauto-cover-summary ul { margin: 6px 0 0; padding-left: 18px; color: #4a4a4a; font-size: 13px; line-height: 1.45; }
.insideauto-cover-summary li { margin-bottom: 2px; }

/* Office location map on the contact page */
.insideauto-contact-map {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
}

/* Deliberately a plain link, matching .drive-footer-links a — the map itself is the
   call to action here, and a bordered button next to it competed with the panel's
   real action (the contact form's submit). The parent selector is required, not
   decorative: `.insideauto-contact-info a` (0,0,1,1) outranks a lone class, so a
   single-class rule here silently loses and the link keeps rendering 16px/#111. */
.insideauto-contact-info .insideauto-contact-map-link {
  color: #44515d;
  font-size: 13px;
  text-decoration: none;
}

.insideauto-contact-info .insideauto-contact-map-link:hover,
.insideauto-contact-info .insideauto-contact-map-link:focus-visible {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.insideauto-contact-map iframe {
  width: 100%;
  height: 240px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  display: block;
  /* Google's own map chrome is already light; keep it neutral in both themes. */
  background: #eef0f4;
}

@media (max-width: 860px) {
  .insideauto-contact-map iframe {
    height: 200px;
  }
}

.insideauto-chat {
  position: fixed;
  right: 18px;
  bottom: 88px;
  z-index: 100;
  width: min(420px, calc(100vw - 32px));
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px);
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.insideauto-chat.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.insideauto-chat-panel {
  overflow: hidden;
  border-radius: 0 0 18px 18px;
  background: #ffffff;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.24);
}

.insideauto-chat-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  min-height: 66px;
  padding: 0 18px;
  background: #141414;
  color: #ffffff;
}

.insideauto-chat-head strong {
  font-size: 17px;
  font-weight: 500;
}

.insideauto-chat-head button {
  width: 34px;
  height: 34px;
  border: 0;
  background: transparent;
  color: #ffffff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}

.insideauto-chat-mark {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
}

.insideauto-chat-mark img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.insideauto-chat-body {
  display: grid;
  gap: 12px;
  min-height: 310px;
  padding: 26px 18px;
  background: #ffffff;
}

.insideauto-chat-status {
  margin: 0 0 10px;
  text-align: center;
  color: #777777;
  font-size: 13px;
}

.insideauto-chat-message {
  max-width: 84%;
  padding: 12px 14px;
  border: 1px solid #dddddd;
  border-radius: 12px;
  color: #262626;
  font-size: 14px;
  line-height: 1.35;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.insideauto-chat-message.is-agent {
  justify-self: start;
}

.insideauto-chat-form {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 44px;
  gap: 8px;
  padding: 14px 16px 16px;
  border-top: 1px solid #e5e5e5;
}

.insideauto-chat-form input,
.insideauto-chat-form textarea {
  min-height: 40px;
  border: 1px solid #dddddd;
  border-radius: 9px;
  padding: 0 10px;
  font: inherit;
}

.insideauto-chat-form input {
  grid-column: 1;
  width: 100%;
}

.insideauto-chat-form textarea {
  grid-column: 1 / 2;
  min-height: 42px;
  padding-top: 10px;
  resize: none;
}

.insideauto-chat-form button {
  grid-column: 2;
  grid-row: 1;
  border: 0;
  border-radius: 999px;
  background: #ed3237;
  color: #ffffff;
  font-size: 30px;
  line-height: 1;
  cursor: pointer;
}

.insideauto-chat-launcher {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 99;
  width: 54px;
  height: 54px;
  border: 0;
  border-radius: 999px;
  padding: 7px;
  background: #ffffff;
  cursor: pointer;
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.24);
}

.insideauto-chat-launcher img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.drive-reservation-shell {
  width: min(calc(100% - 32px), var(--max));
  margin: 0 auto;
  padding: 28px 0 44px;
}

.drive-reservation-banner {
  margin-bottom: 16px;
}

.drive-reservation-hero {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: start;
  margin-bottom: 18px;
}

.drive-reservation-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 18px;
}

.drive-reservation-notes {
  display: grid;
  gap: 14px;
}

@media (max-width: 1180px) {
  .drive-results-head,
  .drive-result-card,
  .drive-footer-inner,
  .drive-support-grid,
  .drive-reservation-grid {
    grid-template-columns: 1fr;
  }

  .drive-hero-search-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .drive-result-main,
  .drive-result-side {
    border-left: 0;
  }

  .drive-result-side {
    border-top: 1px solid #e2e8ee;
  }
}

@media (max-width: 760px) {
  .drive-results-head,
  .drive-results-stats,
  .drive-filter-bar,
  .drive-trust-strip,
  .drive-results-title,
  .drive-result-heading,
  .drive-result-facts {
    grid-template-columns: 1fr;
  }

  .drive-hero-search-top,
  .drive-hero-search-grid {
    grid-template-columns: 1fr;
    display: grid;
  }

  .drive-results-head {
    padding-top: 24px;
  }

  .drive-results-head h1 {
    font-size: 36px;
  }

  .drive-search-stage {
    top: 74px;
    margin-top: -36px;
  }

  .drive-brand-copy {
    display: none;
  }

.drive-reservation-hero {
  flex-direction: column;
}

  .drive-result-price {
    text-align: left;
  }

  .drive-result-media {
    min-height: 220px;
  }

  .drive-footer-links {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}

.site-footer {
  border-top: 1px solid var(--line);
  background: #f3f0e9;
}
.site-footer-inner {
  width: min(calc(100% - 32px), var(--max));
  min-height: 72px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 0;
  color: #51606a;
  font-size: 13px;
}
.site-footer-inner strong {
  display: block;
  color: var(--ink);
  font-size: 14px;
  font-weight: 500;
}

.site-footer-inner span {
  font-weight: 400;
}
.site-footer-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}
.site-footer-nav a {
  color: var(--ink);
}

.legal-shell {
  padding-top: 42px;
  padding-bottom: 56px;
}
.legal-hero {
  margin-bottom: 22px;
}
.legal-content {
  display: grid;
  gap: 22px;
}
.legal-block h2 {
  margin-bottom: 10px;
  font-size: 20px;
}
.legal-block p {
  max-width: 860px;
  margin-bottom: 10px;
  color: #45545e;
}
.hero-inner {
  width: min(calc(100% - 32px), var(--max));
  margin: 0 auto;
  padding: 44px 0;
}
.hero-copy { width: min(640px, 100%); }
.eyebrow, .section-kicker {
  display: block;
  margin-bottom: 8px;
  color: #d9b96a;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
h1, h2, h3, p { margin-top: 0; }
h1 {
  margin-bottom: 14px;
  font-size: clamp(34px, 4.8vw, 56px);
  line-height: 1.02;
}
.hero p {
  max-width: 580px;
  margin-bottom: 20px;
  color: rgba(255,255,255,0.86);
  font-size: 16px;
}
.search-panel {
  width: min(820px, 100%);
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(160px, 0.55fr) auto;
  gap: 8px;
  padding: 8px;
  background: rgba(255,255,255,0.96);
  border-radius: 10px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.22);
}
label { display: grid; gap: 6px; color: var(--ink); font-weight: 500; }
label span {
  color: var(--muted);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
input, select, textarea {
  width: 100%;
  min-height: 42px;
  padding: 0 11px;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  outline: none;
}
button:disabled,
.primary-button:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}
textarea { min-height: 92px; padding-top: 10px; resize: vertical; }

.offer-date-picker {
  position: relative;
}

.offer-date-picker .insideauto-picker-trigger {
  min-height: 44px;
  border-radius: 8px;
}

.offer-date-picker .insideauto-picker-popover {
  width: min(540px, calc(100vw - 32px));
}

.offer-calendar-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.insideauto-calendar-day.is-disabled,
.insideauto-calendar-day:disabled {
  color: #b8c0c7;
  background: #f2f4f5;
  box-shadow: none;
  cursor: not-allowed;
  text-decoration: line-through;
}

.insideauto-calendar-day.is-blocked {
  background: repeating-linear-gradient(-45deg, #fde8e8 0px, #fde8e8 4px, #fdf4f4 4px, #fdf4f4 8px);
  color: #c9a0a0;
  cursor: not-allowed;
  text-decoration: none;
  box-shadow: none;
  font-weight: 400;
}

.insideauto-calendar-day.is-blocked.is-today {
  box-shadow: inset 0 0 0 1px #f4b4b4;
}
.metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: min(720px, 100%);
  margin-top: 18px;
}
.metrics article {
  padding: 14px;
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 8px;
  background: rgba(255,255,255,0.11);
}
.metrics strong { display: block; font-size: 22px; }
.metrics span { color: rgba(255,255,255,0.76); font-size: 12px; font-weight: 700; }

.section {
  width: min(calc(100% - 32px), var(--max));
  margin: 0 auto;
  padding: 52px 0;
}
.section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 20px;
}
.section-kicker { color: var(--teal); }
h2 { max-width: 620px; margin-bottom: 0; font-size: clamp(25px, 3vw, 38px); line-height: 1.08; }
.section-head p { max-width: 380px; margin-bottom: 0; color: var(--muted); font-size: 14px; }
.category-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.category-tabs a {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  padding: 0 13px;
  color: var(--muted);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
}
.category-tabs a.active { color: #fff; border-color: var(--blue); background: var(--blue); }
.offers-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.offer-card, .panel, .steps article, .voucher-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--shadow);
}
.offer-card-link {
  display: block;
  color: inherit;
  text-decoration: none;
}
.offer-image { height: 158px; background: #eee center / cover no-repeat; }
.offer-body { display: grid; gap: 10px; padding: 16px; }
.offer-meta, .partner-line {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 400;
}
.offer-card h3 { margin-bottom: 0; font-size: 18px; line-height: 1.15; }
.offer-card p { margin-bottom: 0; color: var(--muted); font-size: 13px; }
.offer-footer, .total-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.price { display: grid; }
.price small { color: var(--muted); font-size: 12px; text-decoration: line-through; font-weight: 400; }
.price strong { color: var(--coral); font-size: 19px; font-weight: 500; }
.workflow { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 24px; }
.steps { display: grid; gap: 10px; }
.steps article { padding: 16px; box-shadow: none; }
.steps strong { display: block; margin-bottom: 4px; }
.steps span, .note, .empty-state { color: var(--muted); font-size: 13px; }

.drawer {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: none;
  background: rgba(8, 17, 23, 0.5);
}
.drawer.open { display: block; }
.drawer-panel {
  width: min(460px, calc(100% - 24px));
  height: calc(100% - 24px);
  margin: 12px 12px 12px auto;
  display: grid;
  grid-template-rows: auto 1fr;
  background: #fff;
  border-radius: 10px;
}
.drawer-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px;
  border-bottom: 1px solid var(--line);
}
.drawer-head h2 { font-size: 24px; }
.drawer-head button {
  width: 40px;
  height: 40px;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 8px;
  font-size: 22px;
}
.drawer-body { overflow: auto; display: grid; align-content: start; gap: 12px; padding: 18px; }
.cart-item { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.cart-item strong { display: block; }
.cart-item span { color: var(--muted); font-size: 12px; font-weight: 700; }
.cart-item button { border: 0; color: var(--coral); background: transparent; font-weight: 800; cursor: pointer; }
.qty-controls {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.qty-controls button {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--night);
  background: #fff;
}
.qty-controls span {
  min-width: 18px;
  text-align: center;
}

.page-shell { width: min(calc(100% - 32px), 900px); margin: 0 auto; padding: 38px 0; }
.panel { padding: 20px; margin-top: 16px; max-width: 100%; overflow-x: auto; }
.form-grid { display: grid; gap: 12px; }
.admin-grid { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 16px; align-items: start; }
.table-actions, .form-actions { display: flex; flex-wrap: wrap; gap: 2px; align-items: center; }
.table-actions form { margin: 0; }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th, td { padding: 10px 8px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { color: var(--muted); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; }
.voucher-list { display: grid; gap: 12px; }
.voucher-card {
  padding: 16px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: center;
  box-shadow: none;
}
.voucher-card > div {
  min-width: 0;
}
.voucher-code {
  padding: 0;
  border: 0;
  color: var(--ink);
  background: transparent;
  font-size: 24px;
  font-weight: 900;
  letter-spacing: 0.06em;
  cursor: pointer;
}
.voucher-qr {
  width: 168px;
  height: 168px;
  object-fit: contain;
  border: 1px solid #edf0f2;
  border-radius: 10px;
  background: #fff;
}
.qr-thumb {
  width: 58px;
  height: 58px;
  object-fit: contain;
  border: 1px solid #edf0f2;
  border-radius: 8px;
  background: #fff;
}
.pagination-note {
  padding-top: 14px;
  color: var(--muted);
  font-size: 13px;
}
.voucher-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 10px 0 12px;
  color: var(--muted);
  font-size: 13px;
}
.voucher-card-actions {
  margin-top: 12px;
}
.customer-order-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: end;
}
.customer-order-hero-actions {
  justify-content: flex-end;
}
.cpay-redirect-panel {
  display: grid;
  gap: 12px;
  justify-items: start;
}
.status-unused { color: var(--teal); font-weight: 900; }
.status-used { color: var(--coral); font-weight: 900; }
.checkbox-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.checkbox-row input {
  width: 16px;
  min-height: 16px;
}

@media (max-width: 880px) {
  .search-panel, .offers-grid, .workflow, .admin-grid { grid-template-columns: 1fr; }
  .section-head, .metrics { display: grid; grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .topbar-inner { display: grid; padding: 14px 0; }
  .nav { flex-wrap: wrap; }
  .session-pill { max-width: 100%; }
  .cart-button { width: 100%; }
  .hero { min-height: auto; }
  .section { padding: 40px 0; }
  .weekday-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .editor-section { padding: 14px; }
  .sticky-form-actions { justify-content: stretch; }
  .sticky-form-actions .primary-button,
  .sticky-form-actions .link-button { width: 100%; }
}

/* Marketplace home: cleaner travel-platform treatment inspired by search-first tour marketplaces. */
.marketplace-home {
  --paper: #ffffff;
  --ink: #1f2933;
  --muted: #5f6b76;
  --line: rgba(31, 41, 51, 0.12);
  --blue: #0b6e69;
  --teal: #0b6e69;
  --coral: #ff5a1f;
  --night: #14213d;
  background: #fff;
}

.marketplace-home .topbar {
  background: #fff;
  border-bottom: 1px solid #edf0f2;
  backdrop-filter: none;
}

.marketplace-home .topbar-inner {
  min-height: 72px;
}

.marketplace-home .brand-mark {
  width: 34px;
  height: 34px;
  background: #0b6e69;
  border-radius: 7px;
  box-shadow: none;
}

.marketplace-home .brand-logo {
  width: 100px;
  height: 100px;
}

.marketplace-home .brand {
  font-size: 18px;
  font-weight: 500;
}

.marketplace-home .brand small {
  color: #697784;
}

.marketplace-home .nav a {
  font-size: 14px;
  font-weight: 500;
}

.marketplace-home .language-switch a {
  font-size: 11px;
}

.marketplace-home .cart-button {
  color: var(--night);
  background: #fff;
  border: 1px solid #dfe5ea;
  box-shadow: none;
}

.marketplace-home .cart-button span {
  color: #fff;
  background: var(--coral);
}

.marketplace-home .marketplace-hero {
  min-height: 440px;
  color: var(--ink);
  background: linear-gradient(180deg, #f5fbfa 0%, #fff 78%);
  background-image: linear-gradient(180deg, #f5fbfa 0%, #fff 78%);
}

.marketplace-home .hero-inner {
  display: grid;
  justify-items: center;
  padding: 58px 0 38px;
  text-align: center;
}

.marketplace-home .hero-copy {
  width: min(820px, 100%);
}

.marketplace-home .eyebrow {
  margin-bottom: 12px;
  color: var(--coral);
  font-size: 12px;
}

.marketplace-home h1 {
  max-width: 860px;
  margin: 0 auto 14px;
  color: #1f2933;
  font-size: clamp(34px, 5vw, 58px);
  line-height: 1.04;
  letter-spacing: 0;
}

.marketplace-home .hero p {
  max-width: 680px;
  margin: 0 auto 18px;
  color: #52606d;
  font-size: 17px;
}

.marketplace-home .search-panel {
  width: min(860px, 100%);
  grid-template-columns: minmax(260px, 1fr) 220px 132px;
  gap: 0;
  padding: 6px;
  background: #fff;
  border: 1px solid #dfe5ea;
  border-radius: 999px;
  box-shadow: 0 18px 48px rgba(20, 33, 61, 0.13);
}

.marketplace-home .search-panel label {
  gap: 2px;
  padding: 8px 18px;
  border-right: 1px solid #edf0f2;
  text-align: left;
}

.marketplace-home .search-panel label:nth-child(2) {
  border-right: 0;
}

.marketplace-home .search-panel input,
.marketplace-home .search-panel select {
  min-height: 30px;
  padding: 0;
  border: 0;
  border-radius: 0;
  font-size: 15px;
}

.marketplace-home .search-panel .primary-button {
  min-height: 52px;
  border-radius: 999px;
  background: var(--coral);
  font-size: 15px;
  font-weight: 500;
}

.sticky-searchbar {
  position: sticky;
  top: 0;
  z-index: 18;
  padding: 10px 0;
  background: rgba(255, 255, 255, 0.94);
  border-top: 1px solid #edf0f2;
  border-bottom: 1px solid #edf0f2;
  backdrop-filter: blur(16px);
}

.sticky-search-form {
  width: min(calc(100% - 32px), 920px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 220px 118px;
  gap: 0;
  padding: 5px;
  background: #fff;
  border: 1px solid #dfe5ea;
  border-radius: 999px;
  box-shadow: 0 8px 24px rgba(20, 33, 61, 0.08);
}

.sticky-search-form label {
  gap: 1px;
  padding: 6px 16px;
  border-right: 1px solid #edf0f2;
}

.sticky-search-form label:nth-child(2) {
  border-right: 0;
}

.sticky-search-form input,
.sticky-search-form select {
  min-height: 28px;
  padding: 0;
  border: 0;
  border-radius: 0;
  font-size: 14px;
}

.sticky-search-form .primary-button {
  min-height: 46px;
  border-radius: 999px;
  background: var(--coral);
  font-size: 14px;
  font-weight: 500;
}

.quick-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 18px;
}

.quick-links a {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  padding: 0 14px;
  color: #344450;
  background: #fff;
  border: 1px solid #dfe5ea;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
}

.admin-page {
  --paper: #f6f7f9;
  --ink: #202830;
  --muted: #66717c;
  --line: rgba(32, 40, 48, 0.11);
  background: var(--paper);
  font-weight: 400;
  font-family: Arial, "Helvetica Neue", sans-serif;
}

.partner-page {
  --paper: #f6f7f9;
  --ink: #202830;
  --muted: #66717c;
  --line: rgba(32, 40, 48, 0.11);
  background: var(--paper);
  font-weight: 400;
  font-family: Arial, "Helvetica Neue", sans-serif;
}

.customer-page {
  --paper: #f6f7f9;
  --ink: #202830;
  --muted: #66717c;
  --line: rgba(32, 40, 48, 0.11);
  background: var(--paper);
  font-weight: 400;
  font-family: Arial, "Helvetica Neue", sans-serif;
}

.partner-page h1,
.partner-page h2,
.partner-page h3,
.partner-page strong,
.partner-page .brand {
  font-weight: 500;
}

.admin-page,
.partner-page,
.customer-page {
  color: #15202a;
  background:
    radial-gradient(circle at top left, rgba(60, 83, 100, 0.28), transparent 26%),
    linear-gradient(180deg, #0f1720 0, #121c25 180px, #e9edf1 181px, #eef2f5 100%);
}

.admin-page .topbar,
.partner-page .topbar {
  background: rgba(13, 21, 29, 0.92);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  backdrop-filter: blur(10px);
  box-shadow: 0 14px 30px rgba(8, 14, 20, 0.18);
}

.admin-page .topbar-inner {
  max-width: none;
  width: calc(100% - 48px);
  min-height: 64px;
}

.partner-page .topbar-inner {
  max-width: none;
  width: min(calc(100% - 32px), 1380px);
  min-height: 64px;
}

.customer-page .topbar {
  background: rgba(13, 21, 29, 0.92);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  backdrop-filter: blur(10px);
  box-shadow: 0 14px 30px rgba(8, 14, 20, 0.18);
}

.customer-page .topbar-inner {
  max-width: none;
  width: min(calc(100% - 32px), 1180px);
  min-height: 64px;
}

.customer-page h1,
.customer-page h2,
.customer-page h3,
.customer-page strong,
.customer-page .brand {
  font-weight: 500;
}

.admin-page h1,
.admin-page h2,
.admin-page h3,
.admin-page strong,
.admin-page .brand {
  font-weight: 500;
}

.admin-page h1 {
  font-size: clamp(26px, 3.2vw, 34px);
  letter-spacing: 0;
}

.admin-page .topbar::after,
.partner-page .topbar::after,
.customer-page .topbar::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.16) 20%, rgba(255,255,255,0.08) 80%, transparent 100%);
  pointer-events: none;
}


.admin-page .brand,
.partner-page .brand,
.customer-page .brand {
  gap: 10px;
  font-size: 16px;
  color: #f2f5f7;
}

.admin-page .brand-logo,
.partner-page .brand-logo,
.customer-page .brand-logo {
  width: 88px;
  height: 44px;
  object-fit: contain;
  object-position: left center;
}

.admin-page .brand small,
.partner-page .brand small,
.customer-page .brand small {
  margin-top: 3px;
  color: #98a9b7;
  font-size: 9px;
  letter-spacing: 0.14em;
}

.admin-page .nav,
.partner-page .nav,
.customer-page .nav {
  gap: 6px;
}

.admin-page .nav a,
.partner-page .nav a,
.customer-page .nav a {
  min-height: 34px;
  padding: 0 10px;
  border-radius: 7px;
  font-size: 12px;
  color: #98a9b7; 
}

.admin-page .nav a:hover,
.partner-page .nav a:hover,
.customer-page .nav a:hover {
  color: #000;
  background: rgba(255, 255, 255, 0.08);
}

.admin-page .session-pill,
.partner-page .session-pill,
.customer-page .session-pill {
  min-height: 32px;
  border-color: rgba(255,255,255,0.08);
  border-radius: 7px;
  background: rgba(255,255,255,0.08);
  color: #eef3f6;
  font-size: 11px;
}

.customer-shell {
  width: min(calc(100% - 40px), 1320px);
  margin: 0 auto;
  padding: 20px 0 56px;
}

.customer-shell-login {
  min-height: auto;
  display: grid;
  align-items: start;
  padding-top: 28px;
}

.customer-login-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(340px, 420px);
  gap: 32px;
  align-items: stretch;
  padding: 28px;
  border: 1px solid rgba(255,255,255,0.06);
  background: linear-gradient(135deg, rgba(11, 18, 25, 0.98) 0%, rgba(18, 29, 38, 0.96) 58%, rgba(234, 239, 243, 0.94) 58%, rgba(241, 244, 247, 0.98) 100%);
  box-shadow: 0 28px 60px rgba(8, 14, 20, 0.18);
}

.customer-login-copy {
  min-height: 540px;
  display: grid;
  align-content: space-between;
  gap: 24px;
  padding: 40px 32px;
  color: #f4f7f9;
  background: linear-gradient(180deg, rgba(10, 18, 25, 0.98) 0%, rgba(16, 26, 35, 0.92) 100%);
  border: 1px solid rgba(255,255,255,0.06);
}

.customer-login-copy h1 {
  max-width: 700px;
  margin-bottom: 16px;
  font-size: clamp(34px, 4vw, 56px);
  line-height: 0.98;
}

.customer-login-copy p {
  max-width: 620px;
  margin-bottom: 20px;
  color: #b7c5cf;
  font-size: 15px;
}

.customer-login-highlights {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.customer-login-highlights article,
.customer-summary-metrics article,
.customer-empty-state {
  padding: 18px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04);
}

.customer-login-highlights strong,
.customer-summary-metrics strong {
  display: block;
  margin-bottom: 8px;
  font-size: 16px;
}

.customer-login-highlights span,
.customer-summary-metrics span {
  color: #9db0bd;
  font-size: 12px;
}

.customer-login-card,
.customer-summary-panel,
.customer-booking-card,
.customer-empty-state {
  border: 1px solid #dbe4ea;
  background: #fdfefe;
  box-shadow: 0 24px 54px rgba(12, 21, 28, 0.08);
}

.customer-login-card {
  display: grid;
  gap: 14px;
  align-content: start;
  padding: 30px;
  align-self: stretch;
  background: linear-gradient(180deg, #ffffff 0%, #f7fafc 100%);
}

.customer-login-card-head h2,
.customer-summary-head h2,
.customer-group-head h2 {
  margin: 4px 0 0;
  font-size: 24px;
}

.customer-info-banner {
  padding: 12px 14px;
  border: 1px solid #cfdbe3;
  background: #f3f7fa;
  color: #24323c;
  font-size: 13px;
}

.customer-hero {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 22px;
  color: #f4f7f9;
}

.customer-hero-copy h1 {
  margin: 4px 0 8px;
  font-size: clamp(32px, 4vw, 48px);
  line-height: 0.98;
}

.customer-hero-copy p {
  margin: 0;
  color: #aec0cb;
  font-size: 14px;
}

.customer-hero-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.customer-overview-grid {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.customer-summary-panel {
  position: sticky;
  top: 96px;
  display: grid;
  gap: 18px;
  padding: 22px;
}

.customer-summary-metrics {
  display: grid;
  gap: 10px;
}

.customer-summary-metrics article {
  border-color: #e1e8ed;
  background: #f5f8fa;
}

.customer-summary-metrics strong {
  margin-bottom: 4px;
  color: #15212b;
  font-size: 24px;
}

.customer-filter-panel {
  display: grid;
  gap: 12px;
  padding-top: 10px;
  border-top: 1px solid #e6edf1;
}

.customer-filter-head h3 {
  margin: 4px 0 0;
  font-size: 18px;
}

.customer-content-column,
.customer-order-groups,
.customer-order-stack {
  display: grid;
  gap: 18px;
}

.customer-order-group {
  display: grid;
  gap: 14px;
}

.customer-group-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
}

.customer-booking-card {
  display: grid;
  gap: 14px;
  padding: 22px;
}

.customer-booking-top {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 18px;
}

.customer-booking-top h3 {
  margin: 4px 0 0;
  font-size: 24px;
}

.customer-booking-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.customer-booking-meta,
.customer-voucher-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.customer-booking-meta span,
.customer-voucher-meta span {
  padding: 7px 10px;
  border: 1px solid #dbe4ea;
  background: #f3f7fa;
  font-size: 12px;
  color: #33424f;
}

.customer-voucher-grid {
  display: grid;
  gap: 14px;
}

.customer-voucher-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 200px;
  gap: 16px;
  align-items: center;
  padding: 18px;
  border: 1px solid #e1e8ed;
  background: #fbfdfe;
}

.customer-voucher-main {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.customer-voucher-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.customer-voucher-head h3 {
  margin: 4px 0 0;
  font-size: 22px;
  line-height: 1.04;
}

.customer-voucher-code {
  width: fit-content;
  padding: 0;
  border: 0;
  background: transparent;
  color: #16364a;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: 0.08em;
  cursor: pointer;
}

.customer-voucher-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.customer-voucher-qr {
  justify-self: end;
}

.customer-pagination {
  margin-top: 18px;
}

.auth-page .topbar-inner {
  width: min(calc(100% - 40px), 1320px);
}

.auth-page {
  background: linear-gradient(180deg, #eef2f5 0%, #f5f7f9 100%);
}

.auth-page .topbar {
  position: relative;
  background: #ffffff;
  border-bottom: 1px solid #dde4ea;
  backdrop-filter: none;
  box-shadow: 0 8px 20px rgba(12, 21, 28, 0.04);
}

.rental-admin-auth-page .topbar {
  background: rgba(13, 21, 29, 0.97);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 8px 24px rgba(8, 14, 20, 0.22);
}

.rental-admin-auth-page .brand {
  color: #ffffff;
}

/* show/hide password toggle */
.pw-field-wrap {
  position: relative;
  display: flex;
  align-items: center;
}

.pw-field-wrap input {
  width: 100%;
  padding-right: 40px !important;
}

.pw-toggle-btn {
  position: absolute;
  right: 10px;
  background: none;
  border: none;
  padding: 4px;
  cursor: pointer;
  color: #8a9bac;
  display: flex;
  align-items: center;
  line-height: 1;
}

.pw-toggle-btn:hover {
  color: #1a2533;
}

.auth-page .topbar::after {
  display: none;
}

.auth-page .brand {
  color: #17222c;
}

.auth-page .brand-logo {
  width: 116px;
  height: 64px;
}

.auth-page .language-switch {
  border-color: #d7e0e6;
  background: #ffffff;
}

.auth-page .language-switch a {
  color: #657684;
  border-right-color: #e0e6eb;
}

.auth-page .language-switch a.active {
  color: #ffffff;
  background: #15212b;
}

.auth-page .nav {
  margin-left: auto;
}

.auth-shell {
  width: min(calc(100% - 40px), 1120px);
  min-height: auto;
  margin: 0 auto;
  padding: 32px 0 56px;
  display: grid;
  align-items: start;
}

.auth-card {
  display: grid;
  grid-template-columns: minmax(280px, 0.9fr) minmax(340px, 1.1fr);
  background: #ffffff;
  border: 1px solid #dbe4ea;
  box-shadow: 0 24px 54px rgba(12, 21, 28, 0.08);
  overflow: hidden;
}

.auth-copy {
  display: grid;
  align-content: end;
  gap: 14px;
  min-height: 420px;
  padding: 38px 34px;
  color: #f4f7f9;
  background: linear-gradient(180deg, #111a22 0%, #1b2630 100%);
}

.auth-copy h1 {
  margin: 0;
  font-size: clamp(34px, 4vw, 48px);
  line-height: 0.98;
}

.auth-copy p {
  max-width: 420px;
  margin: 0;
  color: #b6c5cf;
  font-size: 15px;
}

.auth-form {
  display: grid;
  gap: 14px;
  align-content: center;
  padding: 34px 34px 30px;
  background: #ffffff;
}

.auth-form-options,
.auth-remember-option {
  display: flex;
  align-items: center;
}

.auth-form-options {
  justify-content: space-between;
  gap: 16px;
  font-size: 14px;
}

.auth-form-options a,
.auth-back-link {
  color: var(--teal);
  font-weight: 800;
  text-decoration: none;
}

.auth-remember-option {
  gap: 9px;
  cursor: pointer;
}

.auth-remember-option input {
  width: 18px;
  min-height: 18px;
  margin: 0;
  accent-color: var(--teal);
}

.auth-status-message {
  padding: 12px 14px;
  border-left: 3px solid var(--teal);
  color: #174d4b;
  background: #edf9f8;
  font-size: 14px;
  line-height: 1.5;
}

.auth-reset-page .auth-card {
  grid-template-columns: minmax(300px, 0.82fr) minmax(440px, 1.18fr);
}

.auth-reset-page .auth-form {
  justify-items: center;
  padding: 44px;
}

.auth-reset-page .auth-form > *,
.auth-reset-page .auth-reset-form {
  width: min(100%, 480px);
}

.auth-reset-form,
.auth-reset-heading,
.auth-reset-fields,
.auth-reset-actions,
.auth-reset-guidance,
.auth-reset-guidance div {
  display: grid;
}

.auth-reset-form {
  gap: 24px;
}

.auth-reset-heading {
  gap: 7px;
}

.auth-reset-heading h2,
.auth-reset-heading p {
  margin: 0;
}

.auth-reset-heading h2 {
  color: #172631;
  font-size: 28px;
  line-height: 1.15;
}

.auth-reset-heading p {
  color: #71818c;
  font-size: 14px;
  line-height: 1.5;
}

.auth-reset-fields {
  gap: 16px;
}

.auth-reset-fields label {
  gap: 7px;
}

.auth-reset-fields input {
  min-height: 52px;
  background: #fbfcfd;
}

.auth-reset-actions {
  gap: 12px;
}

.auth-reset-actions .primary-button {
  width: 100%;
  min-height: 48px;
}

.auth-reset-guidance {
  gap: 12px;
  margin-top: 18px;
}

.auth-reset-guidance div {
  gap: 4px;
  padding: 12px 0 12px 14px;
  border-left: 2px solid #1ba7a2;
}

.auth-reset-guidance strong {
  color: #f4f7f9;
  font-size: 13px;
}

.auth-reset-guidance span {
  color: #9fb0bb;
  font-size: 12px;
  line-height: 1.45;
}

.auth-code-input {
  text-align: center;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: 8px;
  font-variant-numeric: tabular-nums;
}

.auth-secondary-action {
  width: 100%;
}

.auth-back-link {
  display: inline-flex;
  justify-content: center;
  padding: 4px 0;
}

.admin-shell {
  width: calc(100% - 48px);
  max-width: none;
  margin: 0 auto;
  padding: 10px 0 52px;
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 24px;
}

.admin-sidebar-panel {
  position: sticky;
  align-self: start;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 18px;
  min-height: calc(100vh - 120px);
  padding: 20px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 0;
  color: #dbe4ea;
  background:
    linear-gradient(180deg, rgba(27, 39, 49, 0.98) 0%, rgba(18, 28, 37, 0.98) 100%);
  box-shadow: 0 30px 60px rgba(5, 12, 17, 0.28);
}

.admin-sidebar-panel > div:first-child {
  display: grid;
  gap: 8px;
  padding: 4px 6px 10px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.admin-sidebar-panel .section-kicker,
.admin-sidebar-panel .note {
  color: #94a5b1;
}

.admin-sidebar-panel h1,
.admin-titlebar h1 {
  margin-bottom: 6px;
  font-size: 28px;
  line-height: 1.12;
}

.admin-side-nav {
  display: grid;
  gap: 6px;
  align-content: start;
}

.admin-side-nav a {
  min-height: 46px;
  display: flex;
  align-items: center;
  padding: 0 16px;
  border: 1px solid transparent;
  border-radius: 0;
  color: #ced8df;
  font-size: 12px;
  font-weight: 500;
}

.admin-side-nav a:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.06);
}

.admin-side-nav a.active {
  color: #fff;
  background: linear-gradient(135deg, #1d8f8a 0%, #15626f 100%);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 14px 28px rgba(20, 98, 111, 0.24);
}

.admin-sidebar-panel .sidebar-logout {
  width: 100%;
  min-height: 48px;
  justify-content: center;
  padding: 0 18px;
  margin-top: 10px;
  border-color: rgba(255,255,255,0.12);
  color: #f0f4f7;
  background: rgba(255,255,255,0.04);
}

.admin-sidebar-panel .sidebar-logout:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.16);
}

.admin-main {
  display: grid;
  gap: 18px;
  align-items: start;
  align-content: start;
  /* Without this, a 1fr grid track won't shrink below the width of its widest
     child (e.g. a wide table), so the whole page stretches and scrolls
     horizontally instead of just that one table scrolling within its box. */
  min-width: 0;
}

.admin-two-column {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.admin-main > * {
  min-width: 0;
}

.admin-titlebar,
.panel-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.admin-titlebar {
  padding: 8px 2px 2px;
  color: #f4f7f9;
}

.admin-titlebar .link-button {
  background: #fff;
}

.admin-titlebar .table-actions {
  justify-content: flex-end;
}

/* Jump nav on long single-scroll admin pages (e.g. the rental detail page) — a sticky strip of
   anchor links to each section below, so an operator doesn't have to scroll past everything to
   reach e.g. Check-in or Refund. Kept flat/square, not pill-shaped, to match the rest of this
   admin's chip styling. */
.rental-detail-jumpnav {
  position: sticky;
  top: 0;
  z-index: 15;
  padding: 8px 2px;
  background: rgba(238, 240, 244, 0.96);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(219, 227, 233, 0.9);
}

.rental-detail-jumpnav-inner {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.rental-detail-jumpnav-inner a {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid #d3dde4;
  background: #fff;
  color: #17323f;
  font-size: 11px;
  font-weight: 600;
  text-decoration: none;
}

.rental-detail-jumpnav-inner a:hover {
  background: #eef4f6;
}

.stat-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.partner-stat-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* The five money figures stay on one line: read side by side they are a statement about the
   month, split across two rows they are just five numbers. */
.stat-grid--money {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

/* The accordion rules themselves live at the end of this file: `.admin-page .stat-grid article`
   and `.dashboard-page .stat-grid article` are declared much further down and would otherwise
   win the padding and the label margin back. */

@media (max-width: 1100px) {
  .stat-grid--money { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .stat-grid--money { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.stat-grid article {
  padding: 14px;
  border: 0;
  border-radius: 0;
  background: linear-gradient(180deg, #fcfdfe 0%, #f5f8fa 100%);
  box-shadow: 0 18px 36px rgba(15, 26, 34, 0.08);
}

.stat-grid span {
  display: block;
  margin-bottom: 6px;
  color: #778591;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.09em;
}

.stat-grid strong {
  font-size: 21px;
  line-height: 1.1;
}

.admin-page .panel {
  margin-top: 0;
  border-color: rgba(219, 227, 233, 0.9);
  border-radius: 0;
  background: #fff;
  box-shadow: 0 24px 48px rgba(15, 26, 34, 0.08);
}

.admin-page .panel-head .table-actions input,
.admin-page .panel-head .table-actions select {
  min-height: 36px;
}

.admin-page .section-kicker {
  color: #6f7f8d;
  font-weight: 600;
  font-size: 10px;
  letter-spacing: 0.11em;
}

.admin-page h2 {
  font-size: 19px;
}

.admin-form-columns {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 16px;
}

.inline-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.admin-page input,
.admin-page select,
.admin-page textarea {
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid #c3d0d8;
  border-radius: 0;
  background: #f3f6f8;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.partner-page input,
.partner-page select,
.partner-page textarea,
.customer-page input,
.customer-page select,
.customer-page textarea {
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid #c3d0d8;
  border-radius: 0;
  background: #f3f6f8;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.admin-page input:focus,
.admin-page select:focus,
.admin-page textarea:focus,
.partner-page input:focus,
.partner-page select:focus,
.partner-page textarea:focus,
.customer-page input:focus,
.customer-page select:focus,
.customer-page textarea:focus {
  border-color: #8ea8ba;
  box-shadow: 0 0 0 5px rgba(37, 92, 124, 0.12);
  background: #fff;
}

.admin-page input[type="file"] {
  padding: 9px 11px;
}

.admin-thumb {
  width: 58px;
  height: 46px;
  object-fit: cover;
  border-radius: 8px;
  background: #eef1f4;
}

.admin-preview {
  width: 180px;
  height: 128px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid #e2e8ee;
  background: #eef1f4;
}

.image-edit-row {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 14px;
  align-items: start;
}

.offer-editor {
  padding: 0;
  overflow: clip;
}

.editor-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}

.offer-editor-nav {
  margin-bottom: 10px;
}

.editor-section {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 22px;
  border-right: 1px solid #e9eef2;
  border-bottom: 1px solid #e9eef2;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%);
}

.editor-section:nth-child(2n) {
  border-right: 0;
}

.editor-section:last-child {
  grid-column: 1 / -1;
  border-bottom: 0;
}

.editor-section-span {
  grid-column: 1 / -1;
}

.editor-section-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 2px;
}

.editor-section-head span {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 0;
  color: #fff;
  background: linear-gradient(135deg, #17384a 0%, #25556f 100%);
  font-size: 11px;
}

.admin-page .editor-section-head h2 {
  margin: 0;
  font-size: 16px;
  line-height: 1.2;
}

.compact-grid {
  display: grid;
  gap: 10px;
}

.compact-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.compact-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.compact-grid.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.vehicle-management-panel {
  display: grid;
  gap: 16px;
}

.vehicle-management-panel .panel-head {
  padding-bottom: 12px;
  border-bottom: 1px solid #edf2f5;
}

.vehicle-management-form {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 10px;
  padding: 14px;
  border: 1px solid #e5edf2;
  background: #fbfdfe;
}

.vehicle-management-form label {
  grid-column: span 3;
  min-width: 0;
}

.vehicle-preset-form label:first-child {
  grid-column: span 6;
}

.vehicle-custom-extra-form label:nth-child(1),
.vehicle-custom-extra-form label:nth-child(2),
.vehicle-custom-extra-form label:nth-child(3),
.vehicle-custom-extra-form label:nth-child(4) {
  grid-column: span 3;
}

.vehicle-blackout-form label:nth-child(1),
.vehicle-blackout-form label:nth-child(2) {
  grid-column: span 2;
}

.vehicle-blackout-form label:nth-child(3) {
  grid-column: span 4;
}

.vehicle-blackout-form label:nth-child(4) {
  grid-column: span 2;
}

.vehicle-management-actions {
  grid-column: span 2;
  display: flex;
  align-items: end;
  justify-content: flex-start;
}

.vehicle-management-actions .primary-button {
  width: 100%;
  min-height: 44px;
}

.vehicle-management-table {
  table-layout: fixed;
}

.vehicle-management-table th,
.vehicle-management-table td {
  vertical-align: middle;
}

.vehicle-management-table td:first-child {
  color: #162733;
}

.vehicle-management-table small {
  display: block;
  margin-top: 4px;
  line-height: 1.35;
}

.vehicle-management-table .danger-button {
  min-height: 36px;
  padding: 0 12px;
}

.vehicle-preset-note {
  margin: 18px;
  padding: 14px 16px;
  border-left: 3px solid #0d9e97;
  color: #526575;
  background: #f4f9fa;
  font-size: 13px;
  line-height: 1.55;
}

.vehicle-preset-note a {
  color: #087f7a;
  font-weight: 700;
}

.invoice-items-editor {
  display: grid;
  gap: 10px;
}

.invoice-items-head,
.invoice-item-row {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 90px 140px 140px 92px;
  gap: 10px;
  align-items: center;
}

.invoice-items-head {
  padding: 0 4px;
  color: #8ea0b2;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.invoice-item-row {
  padding: 10px;
  border: 1px solid #e6edf4;
  border-radius: 10px;
  background: #f9fbfd;
}

.invoice-item-row input,
.invoice-item-row output {
  min-height: 42px;
}

.invoice-item-row output {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 10px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid #e7edf4;
  color: #12202f;
  font-size: 14px;
  font-weight: 700;
}

.invoice-edit-page {
  max-width: 1180px;
}

.invoice-edit-page .admin-titlebar {
  align-items: flex-end;
  padding-bottom: 12px;
}

.invoice-title-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.invoice-title-actions .link-button,
.invoice-title-actions .primary-button {
  min-height: 38px;
  padding-inline: 14px;
}

.invoice-editor-form {
  display: grid;
  gap: 0;
  padding: 0;
  overflow: hidden;
}

.invoice-editor-section {
  border-right: 0;
  border-bottom: 1px solid #edf1f5;
  background: #fff;
  padding: 18px 20px 20px;
}

.invoice-editor-section:nth-child(2n) {
  border-right: 0;
}

.invoice-editor-section:last-child {
  border-bottom: 1px solid #edf1f5;
}

.invoice-edit-page .editor-section-head {
  margin-bottom: 8px;
  padding-bottom: 10px;
  border-bottom: 1px solid #eef2f6;
}

.invoice-edit-page .editor-section-head span {
  width: 28px;
  height: 28px;
  font-size: 10px;
}

.invoice-details-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.85fr 0.85fr 0.65fr;
  gap: 12px;
  align-items: start;
}

.invoice-details-grid .editor-section-span {
  grid-column: 1 / -1;
}

.invoice-edit-page label span {
  margin-bottom: 6px;
  color: #7c8b99;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.invoice-edit-page input {
  min-height: 40px;
  width: 100%;
  padding: 0 11px;
  font-size: 13px;
  background: #fff;
}

.invoice-items-section {
  padding-bottom: 18px;
}

.invoice-edit-page .invoice-items-editor {
  gap: 8px;
}

.invoice-edit-page .invoice-items-head,
.invoice-edit-page .invoice-item-row {
  grid-template-columns: minmax(320px, 1fr) 76px 132px 132px 88px;
  gap: 8px;
}

.invoice-edit-page .invoice-items-head {
  padding: 0 10px 2px;
  color: #7f8d9b;
  font-size: 10px;
  font-weight: 700;
}

.invoice-edit-page .invoice-item-row {
  padding: 8px;
  border-radius: 10px;
  background: #fbfcfe;
  border-color: #e4eaf1;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
}

.invoice-edit-page .invoice-item-row input,
.invoice-edit-page .invoice-item-row output {
  min-height: 38px;
  border-radius: 8px;
  font-size: 13px;
}

.invoice-edit-page .invoice-item-row output {
  color: #172536;
  background: #fff;
  font-weight: 600;
}

.invoice-edit-page .invoice-remove-row,
.invoice-edit-page .invoice-add-row {
  min-height: 38px;
  padding-inline: 12px;
  font-size: 12px;
  white-space: nowrap;
}

.invoice-edit-page .invoice-add-row {
  justify-self: start;
  margin-top: 4px;
}

.invoice-summary-card {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid #e4e9ef;
  background: #f8fafc;
}

.invoice-summary-card > div {
  padding: 16px 20px;
  border-right: 1px solid #e4e9ef;
}

.invoice-summary-card > div:last-child {
  border-right: 0;
}

.invoice-summary-card .note {
  display: block;
  margin-bottom: 6px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.invoice-summary-card h3 {
  margin: 0;
  color: #172536;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0;
}

.invoice-summary-card .invoice-summary-total {
  background: #10212c;
}

.invoice-summary-card .invoice-summary-total .note {
  color: #9fb2c2;
}

.invoice-summary-card .invoice-summary-total h3 {
  color: #fff;
}

.invoice-form-actions {
  justify-content: flex-end;
  padding: 14px 20px;
  margin: 0;
  background: #fff;
}

.invoice-form-actions .primary-button {
  min-width: 180px;
}

.geo-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.vehicle-image-preview {
  width: 220px;
  max-width: 100%;
  margin-top: 10px;
  border-radius: 12px;
  border: 1px solid #e4e9ef;
  object-fit: cover;
  aspect-ratio: 4 / 3;
}

.vehicle-upload-form {
  display: flex;
  gap: 10px;
  align-items: center;
}

.vehicle-upload-form input[type="file"] {
  flex: 1;
}

.vehicle-photo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.vehicle-photo-item {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #e4e9ef;
  background: #f7f9fb;
}

.vehicle-photo-item img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.vehicle-photo-remove {
  position: absolute;
  top: 6px;
  right: 6px;
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(15, 23, 34, 0.62);
  color: #fff;
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
  transition: background 0.15s;
}

.vehicle-photo-remove:hover {
  background: rgba(200, 40, 40, 0.85);
}

.sticky-form-actions {
  justify-content: flex-end;
  padding: 14px 18px;
  border-top: 1px solid #e9eef2;
  background: #f7f9fb;
}

.vehicle-create-panel {
  padding: 0;
}

.vehicle-create-panel .form-error-panel,
.vehicle-create-panel > .panel:not(.vehicle-create-panel),
.vehicle-create-panel > .editor-grid,
.vehicle-create-panel > .sticky-form-actions {
  margin-left: 20px;
  margin-right: 20px;
}

.vehicle-create-panel .form-error-panel {
  margin-top: 20px;
}

.vehicle-create-panel > .panel-head {
  padding: 22px 24px 18px;
  border-bottom: 1px solid #e9eef2;
  background: linear-gradient(180deg, #ffffff 0%, #f7fafc 100%);
}

.vehicle-create-panel > .panel-head h2 {
  margin: 0;
}

.vehicle-create-panel > .editor-grid {
  margin-top: 0;
}

.vehicle-create-panel > .sticky-form-actions {
  margin-left: 0;
  margin-right: 0;
}

.availability-panel {
  overflow: clip;
}

.availability-builder {
  display: grid;
  gap: 14px;
  padding-bottom: 16px;
  border-bottom: 1px solid #e7ebef;
}

.weekday-picker {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}

.weekday-picker label {
  min-height: 68px;
  display: grid;
  place-items: center;
  gap: 3px;
  padding: 8px 6px;
  border: 1px solid #d9e1e7;
  border-radius: 0;
  background: linear-gradient(180deg, #fff 0%, #f8fafb 100%);
  cursor: pointer;
}

.weekday-picker input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.weekday-picker span {
  color: #18242d;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: none;
}

.weekday-picker small {
  color: #66737d;
  font-size: 10px;
}

.weekday-picker label:has(input:checked) {
  border-color: #17384a;
  background: linear-gradient(180deg, #eef4f8 0%, #e6eef4 100%);
  box-shadow: inset 0 0 0 1px #17384a;
}

.time-builder-row {
  display: grid;
  grid-template-columns: 150px minmax(260px, 1fr) 140px 140px;
  gap: 10px;
  align-items: end;
}

.time-field input {
  font-variant-numeric: tabular-nums;
}

.time-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-content: end;
  min-height: 42px;
}

.time-presets button {
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid #d7e0e6;
  border-radius: 0;
  color: #27333d;
  background: #f9fbfc;
  cursor: pointer;
}

.time-presets button.active,
.time-presets button:hover {
  border-color: #17384a;
  color: #17384a;
  background: #eef4f8;
}

.map-link {
  width: fit-content;
  margin-top: 8px;
}

.gallery-uploader {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(180px, 0.8fr) 110px auto;
  gap: 10px;
  align-items: end;
}

.gallery-admin-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.gallery-admin-grid article {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid #dde5ea;
  border-radius: 0;
  background: linear-gradient(180deg, #fff 0%, #fafcfd 100%);
}

.gallery-admin-grid img {
  width: 96px;
  height: 72px;
  object-fit: cover;
  border-radius: 6px;
}

.gallery-admin-grid strong,
.gallery-admin-grid span {
  display: block;
  font-size: 12px;
}

.gallery-admin-grid span {
  color: var(--muted);
}

.gallery-admin-grid form {
  grid-column: 1 / -1;
}

.offers-filter-bar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 140px 160px minmax(180px, 0.8fr) auto;
  gap: 10px;
  align-items: end;
  padding: 14px;
  border: 1px solid #dce4e9;
  border-radius: 0;
  background: linear-gradient(180deg, #fafcfd 0%, #f5f8fa 100%);
}

.admin-page .invoice-filter-panel {
  padding: 18px 20px;
  border: 1px solid #dfe5ea;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 4px 14px rgba(15, 26, 34, 0.045);
}

.admin-page .invoice-filter-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1.45fr) 92px 130px minmax(145px, 0.85fr) 140px 140px 104px;
  gap: 16px;
  align-items: end;
}

.admin-page .invoice-filter-grid label { min-width: 0; }
.admin-page .invoice-filter-grid input,
.admin-page .invoice-filter-grid select { width: 100%; }

.admin-page .invoice-date-field,
.admin-page .invoice-date-field input {
  min-width: 0;
}

.admin-page .invoice-date-field input[type="date"] {
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  display: block;
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  max-inline-size: 100% !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden;
}

.admin-page .invoice-date-field input[type="date"]::-webkit-date-and-time-value {
  min-width: 0;
  text-align: left;
}

.invoice-turnover-summary {
  display: grid;
  grid-template-columns: minmax(150px, .65fr) minmax(260px, 1.35fr) minmax(170px, .75fr);
  border: 1px solid #dfe5ea;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 4px 14px rgba(15, 26, 34, 0.04);
}

.invoice-turnover-summary article {
  position: relative;
  min-width: 0;
  padding: 17px 20px 16px;
  border-right: 1px solid #e7ebef;
}

.invoice-turnover-summary article:last-child { border-right: 0; }
.invoice-turnover-summary article::before {
  position: absolute;
  top: -1px;
  right: 20px;
  left: 20px;
  height: 2px;
  background: #cbd5dd;
  content: "";
}
.invoice-turnover-summary .invoice-summary-primary::before { background: #079b95; }

.invoice-turnover-summary span,
.invoice-turnover-summary small {
  display: block;
  color: #738493;
  font-size: 10.5px;
}

.invoice-turnover-summary span {
  font-weight: 800;
  text-transform: uppercase;
}

.invoice-turnover-summary strong {
  display: block;
  margin: 7px 0 3px;
  overflow-wrap: anywhere;
  color: #172534;
  font-size: 25px;
  font-weight: 700;
  line-height: 1.05;
}

.admin-page .invoice-list-panel {
  padding: 0;
  overflow: hidden;
  border: 1px solid #dfe5ea;
  border-radius: 2px;
  box-shadow: 0 5px 16px rgba(15, 26, 34, 0.045);
}

.admin-page .invoice-list-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  padding: 17px 20px 14px;
  border-bottom: 1px solid #e7ebef;
}

.admin-page .invoice-list-head .section-kicker { margin-bottom: 3px; }
.admin-page .invoice-list-head h2 { margin: 0; font-size: 18px; }
.admin-page .invoice-list-head > span { color: #71808e; font-size: 11px; font-weight: 700; }
.admin-page .invoice-empty-state { margin: 0; padding: 26px 20px; }

.admin-page .invoice-admin-table { border-collapse: collapse; }
.admin-page .invoice-admin-table thead th {
  height: 42px;
  padding: 10px 12px;
  background: #f6f8fa;
  color: #657686;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0;
}

.admin-page .invoice-admin-table tbody td {
  height: 68px;
  padding: 12px;
  vertical-align: middle;
  background: #fff;
}

.admin-page .invoice-admin-table tbody tr:hover td { background: #f5f8fa; }
.admin-page .invoice-admin-table tbody tr:hover td:first-child { border-left-color: #079b95; }

.admin-page .invoice-number-cell { width: 170px; padding-left: 20px !important; white-space: nowrap; }
.admin-page .invoice-number-cell > strong,
.admin-page .invoice-customer-cell > strong { display: block; color: #1d2b38; font-size: 13px; }
.admin-page .invoice-number-cell > small,
.admin-page .invoice-customer-cell > small { display: block; margin-top: 2px; color: #7a8a98; font-size: 10.5px; }

.admin-page .invoice-number-editor { margin-top: 4px; }
.admin-page .invoice-number-editor summary {
  width: max-content;
  color: #667786;
  font-size: 10.5px;
  font-weight: 700;
  cursor: pointer;
}
.admin-page .invoice-number-editor form { display: flex; gap: 6px; margin-top: 7px; }
.admin-page .invoice-number-editor input { width: 145px; min-height: 34px; padding: 6px 8px; font-size: 12px; }
.admin-page .invoice-number-editor .link-button { min-height: 34px; padding: 6px 10px; font-size: 11px; }

.admin-page .invoice-customer-cell { min-width: 210px; }
.admin-page .invoice-customer-cell > strong,
.admin-page .invoice-customer-cell > small { overflow-wrap: anywhere; }
.admin-page .invoice-vehicle-cell { min-width: 145px; color: #344452; }
.admin-page .invoice-date-cell,
.admin-page .invoice-total-cell,
.admin-page .invoice-status-cell { text-align: center; white-space: nowrap; }
.admin-page .invoice-total-cell { color: #172534; font-weight: 700; }

.admin-page .invoice-payment-state {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #5f7180;
  font-size: 11px;
  font-weight: 800;
}
.admin-page .invoice-payment-state::before { width: 3px; height: 16px; background: #98a6b2; content: ""; }
.admin-page .invoice-payment-state.paid { color: #08756f; }
.admin-page .invoice-payment-state.paid::before { background: #079b95; }
.admin-page .invoice-payment-state.pending { color: #9a6206; }
.admin-page .invoice-payment-state.pending::before { background: #d99513; }

.admin-page .invoice-actions-cell {
  padding-right: 18px !important;
  white-space: nowrap;
}
.admin-page .invoice-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.admin-page .invoice-row-actions .link-button { min-height: 34px; padding: 7px 12px; }
.admin-page .invoice-open-link {
  color: #405261;
  font-size: 11px;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 1180px) {
  .admin-page .invoice-filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .vehicle-editor-page .admin-main {
    padding: 12px 12px 42px;
  }

  .admin-page .invoice-filter-panel { padding: 16px; }
  .admin-page .invoice-filter-grid,
  .invoice-turnover-summary { grid-template-columns: 1fr; }
  .admin-page .invoice-filter-grid > *,
  .admin-page .invoice-list-head { width: 100%; }
  .invoice-turnover-summary article { border-right: 0; border-bottom: 1px solid #e7ebef; }
  .invoice-turnover-summary article:last-child { border-bottom: 0; }
  .admin-page .invoice-list-head { align-items: stretch; }
}

.admin-orders-filter-bar {
  display: grid;
  grid-template-columns: minmax(240px, 1.4fr) 170px minmax(180px, 1fr) 150px 150px auto;
  gap: 10px;
  align-items: end;
  padding: 14px;
  border: 1px solid #dce4e9;
  border-radius: 0;
  background: linear-gradient(180deg, #fafcfd 0%, #f5f8fa 100%);
}

.customer-account-filter-bar {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) 190px auto;
  gap: 10px;
  align-items: end;
  padding: 14px;
  border: 1px solid #dce4e9;
  border-radius: 0;
  background: linear-gradient(180deg, #fafcfd 0%, #f5f8fa 100%);
}

.manifest-filter-bar {
  display: grid;
  grid-template-columns: minmax(220px, 1.3fr) minmax(180px, 1fr) 160px 160px auto;
  gap: 10px;
  align-items: end;
  margin-bottom: 14px;
  padding: 14px;
  border: 1px solid #dce4e9;
  border-radius: 0;
  background: linear-gradient(180deg, #fafcfd 0%, #f5f8fa 100%);
}

.booking-view-switch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.segmented-control {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px;
  border: 1px solid #d5dee4;
  border-radius: 8px;
  background: #f6f8fa;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.65);
}

.segmented-control a {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  padding: 0 12px;
  border-radius: 6px;
  color: #5a6976;
  font-size: 12px;
}

.segmented-control button {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  padding: 0 12px;
  border: 0;
  border-radius: 6px;
  color: #5a6976;
  background: transparent;
  font-size: 12px;
  cursor: pointer;
}

.segmented-control a.active {
  color: #102028;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 26, 34, 0.08);
}

.segmented-control button.active {
  color: #102028;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 26, 34, 0.08);
}

.compact-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-orders-stats,
.customer-account-stats {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.customer-account-stats {
  margin-bottom: 16px;
}

.customer-order-groups {
  display: grid;
  gap: 16px;
}

.customer-order-group .panel-head {
  margin-bottom: 14px;
}

.customer-order-card {
  margin-top: 0;
}

.customer-order-head {
  gap: 12px;
}

.customer-order-actions {
  justify-content: flex-end;
}

.customer-voucher-grid {
  gap: 10px;
}

.customer-voucher-card {
  border: 1px solid #dce4e9;
  border-radius: 0;
  background: linear-gradient(180deg, #fff 0%, #fbfcfd 100%);
}

.offer-admin-list {
  display: grid;
  gap: 10px;
}

.order-admin-list {
  display: grid;
  gap: 10px;
}

.offer-admin-row {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 16px;
  border: 0;
  border-radius: 0;
  background: linear-gradient(180deg, #ffffff 0%, #f6f9fb 100%);
  box-shadow: 0 18px 40px rgba(15, 26, 34, 0.08);
}

.offer-admin-row > img {
  width: 112px;
  height: 84px;
  object-fit: cover;
  border-radius: 0;
  background: #eef1f4;
}

.offer-admin-main {
  min-width: 0;
  display: grid;
  gap: 8px;
}

.offer-admin-title {
    display: flex;
    align-items: start;
    gap: 12px;
    flex-direction: column;
}

.admin-page .offer-admin-title h2 {
  margin: 0 0 3px;
  font-size: 16px;
  line-height: 1.25;
}

.offer-admin-title p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.offer-admin-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.offer-admin-meta span {
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  padding: 0 8px;
  border: 1px solid #dde5ea;
  border-radius: 0;
  color: #43515d;
  background: #f4f7f9;
  font-size: 11px;
}

.offer-admin-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.offer-admin-actions form {
  margin: 0;
}

.order-admin-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 18px;
  border: 0;
  border-radius: 0;
  background: linear-gradient(180deg, #ffffff 0%, #f6f9fb 100%);
  box-shadow: 0 18px 40px rgba(15, 26, 34, 0.08);
}

.order-admin-main {
  min-width: 0;
  display: grid;
  gap: 9px;
}

.bulk-actions-bar {
  justify-content: flex-end;
}

.bulk-check-label,
.bulk-row-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.bulk-row-check {
  align-self: start;
  padding-top: 6px;
}

.order-admin-top {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.admin-page .order-admin-top h2 {
  margin: 0 0 4px;
  font-size: 17px;
  line-height: 1.2;
}

.order-admin-top p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.order-admin-meta,
.order-admin-codes,
.order-admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.bulk-actions-bar select {
  min-height: 36px;
}

.order-payment-panel {
  margin-top: 16px;
}

.order-payment-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.order-payment-grid article {
  padding: 14px;
  border: 1px solid #dce4e9;
  border-radius: 0;
  background: #f7f9fb;
}

.order-payment-grid span {
  display: block;
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 12px;
}

.order-admin-meta span,
.order-admin-codes span {
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  padding: 0 9px;
  border: 1px solid #dde5ea;
  border-radius: 0;
  color: #475664;
  background: #f4f7f9;
  font-size: 11px;
}

.order-admin-actions {
  justify-content: flex-end;
}

.order-admin-actions form {
  margin: 0;
}

.partner-service-create {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  align-items: end;
}

.reservation-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  align-items: end;
}

.reservation-form .span-2 {
  grid-column: span 2;
}

.partner-service-create .primary-button,
.reservation-form .primary-button {
  min-width: 0;
  white-space: normal;
}

.form-error-panel {
  border-color: rgba(201, 86, 73, 0.34);
  color: #7c3029;
  background: #fff6f4;
  box-shadow: none;
  border-left: 4px solid #c95649;
  border-radius: 0;
}

/* A retired protection tier, still applicable to one reservation but no longer sold on the
   site. Muted rather than hidden — it has to be pickable, just clearly not the default. */
.rental-extra-option.is-retired-extra {
  opacity: 0.78;
  border-left: 3px solid #d69e2e;
  padding-left: 9px;
}

.rental-extra-option.is-retired-extra small {
  color: #8a6420;
}

/* A day with no bookable slot left, in the admin date pickers. Marked, not disabled: an
   admin may still book it deliberately, and the turnaround warning on save covers that. */
.flatpickr-day.is-fully-booked:not(.flatpickr-disabled) {
  color: #b03a2e;
  background: repeating-linear-gradient(
    -45deg,
    rgba(201, 86, 73, 0.10) 0 5px,
    transparent 5px 10px
  );
  border-color: rgba(201, 86, 73, 0.35);
}

.flatpickr-day.is-fully-booked.selected {
  color: #fff;
}

/* Amber, not red: the save succeeded and the override was intentional. Sharing red with
   .form-error-panel would train admins to read a normal tight turnover as a failure. */
.rental-turnaround-warning {
  border-color: rgba(180, 130, 20, 0.34);
  color: #7a5410;
  background: #fffaf0;
  box-shadow: none;
  border-left: 4px solid #d69e2e;
  border-radius: 0;
}

.rental-turnaround-warning strong {
  display: block;
  margin-bottom: 6px;
}

.rental-turnaround-warning ul {
  margin: 0;
  padding-left: 18px;
}

.rental-turnaround-warning .note {
  margin: 8px 0 0;
  color: #8a6420;
}

.field-error {
  margin: -2px 0 0;
  color: #a83e35;
  font-size: 12px;
  font-weight: 600;
}

.booking-error {
  margin: 10px 0 0;
  padding: 10px 12px;
  border: 1px solid rgba(237, 50, 55, 0.32);
  border-radius: 8px;
  background: rgba(237, 50, 55, 0.08);
  color: #b42318;
  font-size: 14px;
  font-weight: 500;
}

.input-invalid,
input.input-invalid,
select.input-invalid,
textarea.input-invalid {
  border-color: rgba(201, 86, 73, 0.72);
  box-shadow: 0 0 0 3px rgba(201, 86, 73, 0.12);
}

.input-invalid:focus,
input.input-invalid:focus,
select.input-invalid:focus,
textarea.input-invalid:focus {
  border-color: rgba(201, 86, 73, 0.9);
  box-shadow: 0 0 0 4px rgba(201, 86, 73, 0.16);
}

.form-error-panel strong {
  display: block;
  margin-bottom: 6px;
}

.form-error-panel ul {
  margin: 0;
  padding-left: 18px;
}

.booking-service-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid #dce4e9;
  border-radius: 0;
  background: #fff;
}

.booking-service-row h3 {
  margin: 0 0 3px;
  font-size: 15px;
}

.booking-service-row p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.status-mini-form {
  display: inline-grid;
  grid-template-columns: 130px auto;
  gap: 6px;
  align-items: center;
}

.status-mini-form select {
  min-height: 34px;
}

.booking-calendar-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.booking-weekdays {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 8px;
}

.booking-weekdays span {
  padding: 0 6px;
  color: #667481;
  font-size: 11px;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.booking-calendar {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}

.calendar-day {
  min-height: 96px;
  display: grid;
  align-content: start;
  gap: 5px;
  padding: 12px;
  border: 1px solid #dce4e9;
  border-radius: 0;
  background: linear-gradient(180deg, #fff 0%, #fbfcfd 100%);
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.calendar-day:hover {
  border-color: #bac7d1;
  box-shadow: 0 10px 24px rgba(16, 33, 44, 0.06);
}

.calendar-day.active {
  border-color: #0b6e69;
  box-shadow: inset 0 0 0 1px #0b6e69;
  background: #f5fbfa;
}

.calendar-day.is-today strong {
  color: #0b6e69;
}

.calendar-day.is-outside {
  color: #a2aeb8;
  background: #f6f8fa;
}

.calendar-day.is-outside strong,
.calendar-day.is-outside span,
.calendar-day.is-outside small {
  color: #a2aeb8;
}

.booking-calendar strong {
  font-size: 18px;
}

.booking-calendar span,
.booking-calendar small {
  color: var(--muted);
  font-size: 12px;
}

.reservation-edit-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.reservation-edit-form .span-2 {
  grid-column: 1 / -1;
}

.reservation-card-list {
  display: grid;
  gap: 10px;
}

.reservation-card {
  padding: 14px;
  border: 1px solid #dce4e9;
  border-radius: 0;
  background: linear-gradient(180deg, #fff 0%, #fbfcfd 100%);
}

.reservation-card-top {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.reservation-card-top strong {
  display: block;
  margin-bottom: 4px;
  font-size: 14px;
}

.reservation-card-top p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.reservation-card-meta,
.reservation-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.reservation-card-meta span {
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  padding: 0 9px;
  border: 1px solid #e2e8ee;
  border-radius: 0;
  color: #4c5d69;
  background: #f8fafb;
  font-size: 12px;
}

.reservation-detail-drawer .drawer-panel {
  max-width: 760px;
}

.reservation-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.reservation-detail-grid article {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid #dce4e9;
  border-radius: 0;
  background: linear-gradient(180deg, #fff 0%, #fafcfd 100%);
}

.reservation-detail-grid article.span-2 {
  grid-column: 1 / -1;
}

.reservation-detail-grid span {
  color: #66737d;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.reservation-detail-grid strong {
  font-size: 14px;
  font-weight: 500;
}

.reservation-quick-edit {
  display: grid;
  gap: 12px;
  margin-top: 12px;
}

.activity-log {
  display: grid;
  gap: 10px;
}

.activity-log-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 16px;
  border: 0;
  border-radius: 0;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%);
  box-shadow: 0 12px 28px rgba(15, 26, 34, 0.06);
}

.activity-log-item strong {
  display: block;
  margin-bottom: 3px;
  font-size: 14px;
}

.activity-log-item p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.activity-log-item > div {
  min-width: 0;
}

.activity-log-item .status-pill {
  justify-self: end;
}

.activity-log-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 12px;
}

.exception-builder-row {
  grid-template-columns: 160px 140px 160px 140px;
}

.preview-banner {
  margin-bottom: 14px;
  padding: 10px 12px;
  border: 1px solid #d7dee5;
  border-radius: 0;
  color: #34424f;
  background: #fff;
  font-size: 13px;
}

.offer-gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.offer-gallery-grid figure {
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 0;
  background: #fff;
}

.offer-gallery-grid img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
}

.offer-gallery-grid figcaption {
  padding: 8px 10px;
  color: var(--muted);
  font-size: 12px;
}

.status-pill {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  padding: 0 8px;
  border: 0;
  border-radius: 0;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #53636f;
}

.status-pill.active {
  color: #0f4f64;
  border-color: #bdd1db;
  background: #e9f1f6;
}

.status-pill.paused {
  color: #78511d;
  border-color: #e8d9ba;
  background: #f7efde;
}

.status-pill.pending_payment {
  color: #78511d;
  border-color: #e8d9ba;
  background: #f7efde;
}

.status-pill.paid,
.status-pill.unused {
  color: #0f4f64;
  border-color: #bdd1db;
  background: #e9f1f6;
}

.status-pill.citypass {
  color: #17384a;
  border-color: #c7d7e2;
  background: #edf3f7;
}

.status-pill.manual {
  color: #56646f;
  border-color: #d9e1e6;
  background: #f3f6f8;
}

.status-pill.cancelled,
.status-pill.refunded,
.status-pill.used {
  color: #8d453d;
  border-color: #ebc8c2;
  background: #f9eeeb;
}

.status-pill.checked_in {
  color: #0f4f64;
  border-color: #bdd1db;
  background: #e9f1f6;
}

.status-pill.no_show {
  color: #78511d;
  border-color: #e8d9ba;
  background: #f7efde;
}

.status-pill.blocked {
  color: #604958;
  border-color: #ddcfda;
  background: #f3edf2;
}

.status-pill.admin {
  color: #17384a;
  border-color: #c7d7e2;
  background: #edf3f7;
}

.status-pill.partner {
  color: #0f4f64;
  border-color: #bdd1db;
  background: #e9f1f6;
}

.status-pill.system {
  color: #56646f;
  border-color: #d9e1e6;
  background: #f3f6f8;
}

.admin-detail-page {
  width: 100%;
}

.admin-detail-shell {
  padding-top: 24px;
}

.order-detail-grid {
  display: grid;
  grid-template-columns: 1fr 0.7fr 0.9fr;
  gap: 18px;
  align-items: end;
}

.order-admin-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
  gap: 16px;
}

.order-summary-panel,
.order-payment-panel {
  align-content: start;
}

.order-info-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.order-info-grid article {
  padding: 14px;
  border: 1px solid #e3e8ed;
  border-radius: 8px;
  background: #fbfcfd;
}

.order-info-grid span,
.order-info-grid p {
  color: var(--muted);
  font-size: 12px;
}

.order-info-grid span {
  display: block;
  margin-bottom: 6px;
}

.order-info-grid p {
  margin: 6px 0 0;
}

.rental-price-breakdown {
  margin-top: 16px;
  overflow: hidden;
  border: 1px solid #dfe6eb;
  border-radius: 12px;
  background: #fff;
}

.rental-price-breakdown-head,
.rental-price-breakdown-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 13px 15px;
}

.rental-price-breakdown-head {
  background: #f6f9fa;
  border-bottom: 1px solid #dfe6eb;
}

.rental-price-breakdown-head h3 {
  margin: 3px 0 0;
  font-size: 16px;
}

.rental-price-breakdown-head > small,
.rental-price-breakdown-row small {
  color: var(--muted);
  font-size: 12px;
}

.rental-price-breakdown-row + .rental-price-breakdown-row {
  border-top: 1px solid #edf1f3;
}

.rental-price-breakdown-row > div {
  min-width: 0;
}

.rental-price-breakdown-row > div > strong,
.rental-price-breakdown-row > div > span,
.rental-price-breakdown-row > div > small {
  display: block;
}

.rental-price-breakdown-row > div > small {
  margin-top: 3px;
}

.rental-price-breakdown-row > strong {
  white-space: nowrap;
  font-size: 14px;
}

.rental-price-breakdown-subrow {
  margin-left: 15px;
  padding-block: 10px;
  border-left: 3px solid #14a3a5;
  background: #fbfdfd;
}

.rental-price-breakdown-discount > strong {
  color: #16835f;
}

.rental-price-breakdown-total {
  background: #17212a;
  color: #fff;
}

.rental-price-breakdown-total small {
  color: #b8c4cc;
}

.rental-price-breakdown-total > strong {
  font-size: 18px;
}

.rental-price-breakdown-note {
  margin: 0;
  padding: 11px 15px;
  border-top: 1px solid #dfe6eb;
  color: #53616c;
  font-size: 12px;
  background: #f8fafb;
}

.rental-price-breakdown-note-warning {
  color: #8a4b12;
  background: #fff8ed;
}

.order-update-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.order-update-form .span-2 {
  grid-column: 1 / -1;
}

.responsive-table-wrap {
  width: 100%;
  overflow-x: auto;
}

.order-detail-grid h2 {
  margin-bottom: 4px;
}

.status-update {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: end;
}

.admin-page .rental-period-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-page .rental-period-form > * {
  min-width: 0;
}

.customer-order-card .panel-head {
  align-items: start;
}

.voucher-code-small {
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 12px;
  color: #202830;
}

button.voucher-code-small {
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.qr-button {
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.qr-lightbox {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: none;
  place-items: center;
  padding: 24px;
  background: rgba(12, 20, 28, 0.62);
}

.qr-lightbox.open {
  display: grid;
}

.qr-lightbox-panel {
  width: min(440px, 100%);
  display: grid;
  justify-items: center;
  gap: 14px;
  padding: 24px;
  border-radius: 14px;
  background: #fff;
}

.qr-lightbox-panel img {
  width: min(320px, 76vw);
  height: min(320px, 76vw);
  object-fit: contain;
}

.qr-lightbox-panel div {
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 18px;
  color: var(--ink);
}

.qr-lightbox-close {
  position: fixed;
  top: 18px;
  right: 18px;
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 999px;
  color: var(--ink);
  background: #fff;
  font-size: 24px;
  cursor: pointer;
}

.validator-panel {
  margin-top: 0;
}

.validator-form {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) auto;
  gap: 10px;
  align-items: end;
}

.voucher-result {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: end;
}

.admin-page table {
  font-size: 12px;
  background: #fff;
}

.admin-page td {
  color: #27333d;
}

.admin-page .primary-button {
  background: linear-gradient(135deg, #1b455e 0%, #163446 100%);
  box-shadow: 0 14px 28px rgba(22, 52, 70, 0.18);
}

.admin-page .danger-button,
.partner-page .danger-button,
.admin-page .link-button,
.partner-page .link-button,
.admin-page .dark-button,
.partner-page .dark-button,
.admin-page .primary-button,
.partner-page .primary-button,
.admin-page .nav a,
.partner-page .nav a,
.admin-page label,
.partner-page label,
.admin-page input,
.partner-page input,
.admin-page select,
.partner-page select,
.admin-page textarea,
.partner-page textarea {
  font-weight: 400;
}

.admin-page .primary-button,
.partner-page .primary-button,
.customer-page .primary-button {
  min-height: 42px;
  padding: 0 16px;
  border-radius: 0;
  font-size: 12px;
  letter-spacing: 0.01em;
}

.admin-page .link-button,
.partner-page .link-button,
.customer-page .link-button,
.admin-page .danger-button,
.partner-page .danger-button {
  min-height: 42px;
  padding: 0 14px;
  border-radius: 0;
  font-size: 12px;
}

.admin-page .link-button,
.partner-page .link-button,
.customer-page .link-button {
  border-color: #d3dde4;
  color: #25313b;
  background: #f8fbfc;
}

.admin-page .link-button:hover,
.partner-page .link-button:hover,
.customer-page .link-button:hover {
  background: #f4f7f9;
}

.admin-page .danger-button,
.partner-page .danger-button {
  border-color: #ebc2bc;
  color: #9a4137;
  background: #fff8f7;
}

.admin-page th,
.partner-page th {
  padding: 14px 10px;
  color: #8fa1ad;
  font-size: 10px;
  letter-spacing: 0.14em;
  background: #15202a;
}

.admin-page td,
.partner-page td {
  padding: 14px 10px;
  border-bottom: 1px solid #dfe7ec;
}

.admin-page tr:hover td,
.partner-page tr:hover td {
  background: #f0f4f7;
}

.admin-page table,
.partner-page table {
  border-collapse: separate;
  border-spacing: 0;
}

.admin-page thead th:first-child,
.partner-page thead th:first-child {
  border-left: 0;
}

.admin-page thead th,
.partner-page thead th {
  border-right: 1px solid rgba(255,255,255,0.08);
}

.admin-page tbody tr:nth-child(even) td,
.partner-page tbody tr:nth-child(even) td {
  background: #fbfdfe;
}

.admin-page tbody tr td:first-child,
.partner-page tbody tr td:first-child {
  border-left: 4px solid transparent;
}

.admin-page tbody tr:hover td:first-child,
.partner-page tbody tr:hover td:first-child {
  border-left-color: #17384a;
}

.responsive-table-wrap {
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: 0 24px 48px rgba(15, 26, 34, 0.08);
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}

.admin-table-scroll,
.admin-table-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-inline: contain;
}

.admin-table-scroll > table,
.admin-table-wrap > table {
  width: 100%;
  min-width: var(--admin-table-min-width, 720px);
}

.admin-table-scroll::-webkit-scrollbar,
.admin-table-wrap::-webkit-scrollbar {
  height: 8px;
}

.admin-table-scroll::-webkit-scrollbar-thumb,
.admin-table-wrap::-webkit-scrollbar-thumb {
  background: #c7d2dc;
  border: 2px solid #fff;
  border-radius: 8px;
}

@media (max-width: 980px) {
  .sticky-search-form {
    grid-template-columns: minmax(220px, 1fr) 170px 104px;
  }

  .admin-shell {
    width: calc(100% - 32px);
    grid-template-columns: 1fr;
  }

  .admin-sidebar-panel {
    position: static;
  }

  .admin-side-nav {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .auth-reset-page .auth-card {
    grid-template-columns: 1fr;
  }

  .admin-form-columns,
  .auth-card,
  .customer-login-hero,
  .customer-overview-grid,
  .image-edit-row,
  .order-detail-grid,
  .order-payment-grid,
  .order-admin-layout,
  .order-info-grid,
  .editor-grid,
  .compact-grid.two,
  .compact-grid.three,
  .compact-grid.four,
  .vehicle-management-form,
  .time-builder-row,
  .offers-filter-bar,
  .admin-orders-filter-bar,
  .customer-account-filter-bar,
  .gallery-uploader,
  .gallery-admin-grid,
  .offer-admin-row,
  .order-admin-row,
  .offer-gallery-grid,
  .partner-service-create,
  .reservation-form,
  .booking-service-row,
  .reservation-edit-form,
  .manifest-filter-bar,
  .reservation-detail-grid,
  .exception-builder-row {
    grid-template-columns: 1fr;
  }

  .reservation-form .span-2,
  .reservation-edit-form .span-2,
  .reservation-detail-grid article.span-2,
  .vehicle-management-form label,
  .vehicle-management-actions {
    grid-column: auto;
  }

  .invoice-items-head {
    display: none;
  }

  .invoice-details-grid,
  .invoice-summary-card {
    grid-template-columns: 1fr;
  }

  .invoice-title-actions {
    width: 100%;
    justify-content: stretch;
  }

  .invoice-title-actions .link-button,
  .invoice-title-actions .primary-button,
  .invoice-form-actions .primary-button {
    width: 100%;
  }

  .invoice-item-row {
    grid-template-columns: 1fr;
  }

  .invoice-item-row output {
    justify-content: flex-start;
  }

  .booking-view-switch,
  .reservation-card-top,
  .activity-log-item,
  .order-admin-top,
  .customer-order-hero,
  .customer-order-head {
    display: grid;
    justify-content: stretch;
  }

  .booking-calendar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .booking-weekdays {
    display: none;
  }

  .editor-section,
  .editor-section:nth-child(2n) {
    border-right: 0;
  }

  .weekday-picker {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .status-update {
    grid-template-columns: 1fr;
  }

  .order-update-form .span-2 {
    grid-column: auto;
  }

  .admin-orders-stats,
  .customer-account-stats {
    grid-template-columns: 1fr;
  }

  .validator-form,
  .voucher-result {
    grid-template-columns: 1fr;
  }

  .customer-order-actions,
  .customer-order-hero-actions,
  .order-admin-actions,
  .customer-hero,
  .customer-group-head,
  .customer-booking-top {
    justify-content: stretch;
  }

  .bulk-actions-bar {
    width: 100%;
    justify-content: stretch;
  }

  .bulk-actions-bar select,
  .bulk-actions-bar .primary-button {
    width: 100%;
  }

  .customer-voucher-card .qr-button,
  .voucher-card .qr-button {
    width: 100%;
  }

  .voucher-qr {
    width: min(100%, 184px);
    height: auto;
  }
}

@media (max-width: 760px) {
  .auth-shell {
    width: min(calc(100% - 24px), 1120px);
    padding-top: 24px;
  }

  .auth-copy,
  .auth-form {
    padding: 24px 22px;
  }

  .auth-reset-page .auth-form {
    justify-items: stretch;
    padding: 28px 22px;
  }

  .auth-reset-page .auth-copy {
    min-height: 0;
  }

  .auth-reset-heading h2 {
    font-size: 24px;
  }

  .customer-shell {
    width: min(calc(100% - 24px), 1320px);
  }

  .customer-login-copy {
    padding: 18px 0 0;
  }

  .customer-login-highlights,
  .customer-voucher-card {
    grid-template-columns: 1fr;
  }

  .customer-hero-actions,
  .customer-booking-actions,
  .customer-voucher-actions {
    justify-content: stretch;
  }

  .customer-voucher-qr {
    justify-self: start;
  }

  .stacked-table thead {
    display: none;
  }

  .stacked-table,
  .stacked-table tbody,
  .stacked-table tr,
  .stacked-table td {
    display: block;
    width: 100%;
  }

  .stacked-table tr {
    padding: 12px 0;
    border-bottom: 1px solid #e7ebef;
  }

  .stacked-table td {
    padding: 8px 0;
    border-bottom: 0;
  }

  .stacked-table td::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 4px;
    color: var(--muted);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
  }
}

.marketplace-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding-top: 24px;
  padding-bottom: 28px;
}

.marketplace-strip article {
  padding: 18px;
  border: 1px solid #edf0f2;
  border-radius: 12px;
  background: #fff;
}

.marketplace-strip strong {
  display: block;
  margin-bottom: 4px;
  font-size: 15px;
}

.marketplace-strip span {
  color: var(--muted);
  font-size: 13px;
}

.marketplace-home .section {
  padding: 42px 0;
}

.marketplace-home .section-head {
  align-items: start;
}

.marketplace-home .section-kicker {
  color: var(--coral);
}

.marketplace-home h2 {
  font-size: clamp(24px, 2.7vw, 34px);
}

.marketplace-home .category-tabs {
  gap: 10px;
}

.marketplace-home .category-tabs a {
  min-height: 40px;
  padding: 0 16px;
  color: #344450;
  border-color: #dfe5ea;
  background: #fff;
}

.marketplace-home .category-tabs a.active {
  color: #fff;
  border-color: #14213d;
  background: #14213d;
}

.marketplace-home .offers-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.marketplace-home .offer-card {
  border: 1px solid #dfe5ea;
  border-radius: 14px;
  box-shadow: none;
  transition: box-shadow 160ms ease, transform 160ms ease;
}

.marketplace-home .offer-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 34px rgba(20, 33, 61, 0.12);
}

.marketplace-home .offer-image {
  height: 176px;
}

.marketplace-home .offer-body {
  gap: 9px;
  padding: 14px;
}

.marketplace-home .offer-meta,
.marketplace-home .partner-line {
  font-size: 12px;
}

.marketplace-home .offer-card h3 {
  min-height: 42px;
  font-size: 16px;
  line-height: 1.28;
}

.rating-line {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  color: #5f6b76;
  font-size: 12px;
}

.rating-line strong {
  color: #0b6e69;
}

.marketplace-home .offer-card p {
  display: -webkit-box;
  min-height: 38px;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.marketplace-home .offer-footer {
  align-items: end;
  margin-top: 4px;
}

.marketplace-home .price span {
  color: #5f6b76;
  font-size: 11px;
  font-weight: 400;
}

.marketplace-home .price strong {
  color: #1f2933;
  font-size: 18px;
  font-weight: 500;
}

.marketplace-home .dark-button {
  min-height: 36px;
  color: #fff;
  background: #14213d;
}

.marketplace-home .workflow {
  display: none;
}

.offer-detail-shell {
  width: min(calc(100% - 32px), var(--max));
  margin: 0 auto;
  padding: 34px 0 56px;
}

.offer-detail-hero {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 28px;
  align-items: center;
}

.offer-detail-hero img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 14px;
}

.offer-detail-hero h1 {
  font-size: clamp(32px, 4.2vw, 52px);
  color: var(--ink);
}

.offer-detail-hero p {
  color: var(--muted);
  font-size: 16px;
}

.detail-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.detail-badges span {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 0 11px;
  border: 1px solid #dfe5ea;
  border-radius: 999px;
  background: #fff;
  font-size: 12px;
}

.offer-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 24px;
  margin-top: 32px;
}

.detail-content {
  display: grid;
  gap: 22px;
}

.detail-content section,
.booking-panel {
  padding: 20px;
  border: 1px solid #dfe5ea;
  border-radius: 14px;
  background: #fff;
}

.detail-content h2,
.booking-panel h2 {
  margin-bottom: 10px;
  font-size: 22px;
}

.detail-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
}

.detail-list div {
  padding: 12px;
  border: 1px solid #edf0f2;
  border-radius: 10px;
}

.detail-list dt {
  color: var(--muted);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.detail-list dd {
  margin: 4px 0 0;
  font-size: 14px;
}

.detail-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.booking-panel {
  position: sticky;
  top: 92px;
  align-self: start;
  display: grid;
  gap: 14px;
}

.booking-panel .primary-button {
  width: 100%;
}

.booking-fields {
  display: grid;
  gap: 10px;
}

@media (max-width: 1080px) {
  .marketplace-home .offers-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .offer-detail-layout,
  .offer-detail-hero {
    grid-template-columns: 1fr;
  }

  .booking-panel {
    position: static;
  }
}

@media (max-width: 820px) {
  .marketplace-home .search-panel,
  .sticky-search-form,
  .marketplace-strip {
    grid-template-columns: 1fr;
  }

  .marketplace-home .search-panel,
  .sticky-search-form {
    border-radius: 18px;
  }

  .marketplace-home .search-panel label,
  .sticky-search-form label,
  .sticky-search-form label:nth-child(2) {
    border-right: 0;
    border-bottom: 1px solid #edf0f2;
  }

  .sticky-searchbar {
    padding: 8px 0;
  }

  .sticky-search-form {
    width: min(calc(100% - 24px), 560px);
  }

  .marketplace-home .offers-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .marketplace-home .topbar-inner {
    gap: 12px;
  }

  .sticky-searchbar {
    top: 112px;
  }

  .marketplace-home .nav {
    gap: 6px;
  }

  .marketplace-home .nav a {
    font-size: 13px;
  }

  .marketplace-home .cart-button {
    width: auto;
  }

  .marketplace-home .hero-inner {
    padding: 42px 0 26px;
  }

  .marketplace-home h1 {
    font-size: 34px;
  }

  .marketplace-home .offers-grid {
    grid-template-columns: 1fr;
  }

  .detail-list,
  .detail-columns {
    grid-template-columns: 1fr;
  }
}

.rental-vertical-page .hero.marketplace-hero {
  background: linear-gradient(180deg, #0f1722 0%, #17212c 100%);
}

.rental-vertical-page {
  width: 100%;
  max-width: 100vw;
  background: #f5f5f5;
  color: #111111;
  overflow-x: hidden;
}

html:has(.rental-vertical-page) {
  max-width: 100%;
  overflow-x: hidden;
}

.rental-vertical-page .topbar,
.rental-vertical-page .drive-topbar,
.insideauto-checkout-page,
.insideauto-checkout-shell,
.insideauto-checkout-topbar,
.insideauto-checkout-trip,
.insideauto-selected-car,
.insideauto-checkout-layout,
.insideauto-review-layout,
.insideauto-terms-strip,
.insideauto-panel,
.insideauto-booking-overview {
  min-width: 0;
  max-width: 100%;
}

.rental-vertical-page .topbar {
  position: static;
}

.drive-topbar {
  background: linear-gradient(180deg, #0d0d0d 0%, #141414 100%);
  border-bottom: 1px solid rgba(237, 50, 55, 0.2);
}
.drive-topbar::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, #ed3237 20%, #f05458 50%, #ed3237 80%, transparent 100%);
  z-index: 1;
}

.drive-topbar-inner {
  width: min(calc(100% - 48px), 1280px);
  min-height: 80px;
  gap: 0;
}

/* Elegant nav links */
.drive-nav {
  gap: 0;
}
.drive-nav > a {
  position: relative;
  padding: 0 16px;
  color: rgba(255, 255, 255, 0.55);
  font-size: 11.5px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  font-weight: 600;
  transition: color 0.2s;
  overflow: visible;
}
.drive-nav > a::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 16px; right: 16px;
  height: 1px;
  background: #ed3237;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}
.drive-nav > a:hover {
  color: rgba(255, 255, 255, 0.95);
}
.drive-nav > a:hover::after {
  transform: scaleX(1);
}

/* Vertical divider */
.drive-nav-divider {
  width: 1px;
  height: 18px;
  background: rgba(255, 255, 255, 0.1);
  flex-shrink: 0;
  margin: 0 8px;
}

/* CTA Резервирај button — matches insideauto-search-cta style */
.drive-cta-button {
  display: inline-flex !important;
  align-items: center;
  padding: 0 22px !important;
  height: 38px;
  min-height: 38px !important;
  background: #ed3237;
  color: #ffffff !important;
  font-size: 13px !important;
  letter-spacing: 0.03em;
  text-transform: none;
  font-weight: 600 !important;
  border-radius: 12px !important;
  border: 0;
  flex-shrink: 0;
  cursor: pointer;
  transition: background 0.18s, transform 0.12s;
}
.drive-cta-button:hover {
  background: #c92226 !important;
  color: #ffffff !important;
  transform: translateY(-1px);
}
.drive-cta-button::after { display: none !important; }
.drive-cta-button::before { display: none !important; }

/* Currency / language switches */
.drive-nav .currency-switch,
.drive-nav .language-switch {
  border-color: rgba(255, 255, 255, 0.12);
  border-radius: 3px;
  margin: 0 6px;
}
.drive-nav .currency-switch a,
.drive-nav .language-switch a {
  color: rgba(255, 255, 255, 0.42);
  font-size: 10.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 600;
  transition: color 0.15s;
}
.drive-nav .currency-switch a:hover,
.drive-nav .language-switch a:hover {
  color: rgba(255, 255, 255, 0.8);
}
.drive-nav .currency-switch a.active,
.drive-nav .language-switch a.active {
  background: rgba(237, 50, 55, 0.18);
  color: #ed3237;
}

/* Hamburger toggle — hidden on desktop, margin-left: auto pushes it right */
.drive-nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 42px;
  height: 42px;
  margin-left: auto;
  background: none;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 3px;
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
  transition: border-color 0.2s;
}
.drive-nav-toggle span {
  display: block;
  width: 18px;
  height: 1.5px;
  background: rgba(255, 255, 255, 0.8);
  border-radius: 1px;
  transition: transform 0.22s, opacity 0.18s;
}
.drive-nav-toggle:hover { border-color: rgba(237, 50, 55, 0.6); }
body.drive-drawer-open .drive-nav-toggle span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
body.drive-drawer-open .drive-nav-toggle span:nth-child(2) { opacity: 0; transform: scaleX(0); }
body.drive-drawer-open .drive-nav-toggle span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* Mobile slide-in drawer */
.drive-mobile-drawer {
  position: fixed;
  top: 0; right: 0; bottom: 0;
  width: 280px;
  max-width: 85vw;
  background: #0f0f0f;
  border-left: 1px solid rgba(237, 50, 55, 0.2);
  transform: translateX(100%);
  transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 600;
  padding-top: 66px;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.drive-mobile-drawer::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: #ed3237;
}
body.drive-drawer-open .drive-mobile-drawer { transform: translateX(0); }
body.drive-drawer-open::after {
  content: '';
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.65);
  z-index: 599;
}
body.drive-drawer-open { overflow: hidden; }

.drive-mobile-drawer a {
  display: flex;
  align-items: center;
  padding: 17px 28px;
  color: rgba(255, 255, 255, 0.68);
  font-size: 13px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  font-weight: 600;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  transition: color 0.15s, background 0.15s;
  gap: 10px;
}
.drive-mobile-drawer a:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.03);
}

.drive-drawer-switches {
  display: flex;
  gap: 12px;
  padding: 20px 28px 0;
  flex-wrap: wrap;
}
.drive-drawer-switches .currency-switch,
.drive-drawer-switches .language-switch {
  border-color: rgba(255, 255, 255, 0.15);
  border-radius: 3px;
}
.drive-drawer-switches .currency-switch a,
.drive-drawer-switches .language-switch a {
  color: rgba(255, 255, 255, 0.48);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.drive-drawer-switches .currency-switch a.active,
.drive-drawer-switches .language-switch a.active {
  background: rgba(237, 50, 55, 0.18);
  color: #ed3237;
}

.drive-drawer-cta {
  margin: 24px 28px 0;
  width: calc(100% - 56px);
  justify-content: center;
  height: 46px !important;
  min-height: 46px !important;
  font-size: 14px !important;
  letter-spacing: 0.01em;
}

.insideauto-shell {
  width: min(calc(100% - 48px), 1280px);
  max-width: 100%;
  margin: 0 auto;
}

.insideauto-results-kicker {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #ed3237;
}

.insideauto-offerlist-hero {
  position: sticky;
  top: 0;
  z-index: 18;
  background:
    linear-gradient(180deg, rgba(17, 17, 17, 0.96), rgba(17, 17, 17, 0.92)),
    radial-gradient(circle at center, rgba(255, 95, 0, 0.12), transparent 40%);
  padding: 10px 0 12px;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.16);
}

.drive-search-is-fixed .insideauto-offerlist-hero {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
}

.drive-search-is-fixed .insideauto-offerlist-results {
  padding-top: var(--drive-sticky-offset, 0);
}

.insideauto-offerlist,
.insideauto-checkout-page {
  max-width: 100%;
  overflow-x: clip;
}

.drive-home-page .insideauto-offerlist {
  overflow-x: visible;
}

.insideauto-searchbar {
  display: grid;
  gap: 10px;
  padding: 14px;
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 20px 44px rgba(0, 0, 0, 0.16);
}

.insideauto-searchbar-expanded {
  display: grid;
  gap: 10px;
}

.insideauto-mobile-search-card {
  display: none;
}

.insideauto-searchbar-top {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.insideauto-searchbar-summary {
  display: none;
}

.insideauto-searchbar-route {
  display: grid;
  gap: 2px;
  padding: 6px 10px;
  border-radius: 12px;
  border: 1px solid #e3e3e3;
  background: #f7f7f7;
  color: #161616;
}

.insideauto-searchbar-route small {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #7a7a7a;
}

.insideauto-searchbar-route strong {
  font-size: 13px;
  line-height: 1.2;
  font-weight: 600;
}

.insideauto-searchbar-route span {
  font-size: 11px;
  color: #6a6a6a;
}

.insideauto-same-dropoff {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 0 4px;
  border-radius: 0;
  border: 0;
  background: transparent;
  font-size: 12px;
  font-weight: 600;
  color: #4a4a4a;
  cursor: pointer;
}

.insideauto-same-dropoff input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.insideauto-same-dropoff-switch {
  position: relative;
  display: block;
  box-sizing: border-box;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  border-radius: 4px;
  border: 1.5px solid #7d8993;
  background: #ffffff;
  transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.insideauto-same-dropoff-switch::after {
  content: "";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  line-height: 18px;
  font-weight: 800;
  color: #ffffff;
}

.insideauto-same-dropoff > span:last-child {
  display: block;
  line-height: 18px;
}

.insideauto-same-dropoff input:checked + .insideauto-same-dropoff-switch {
  border-color: #ed3237;
  background: #ed3237;
}

.insideauto-same-dropoff input:checked + .insideauto-same-dropoff-switch::after {
  content: "\2713";
  color: #ffffff;
}

.insideauto-same-dropoff input:focus-visible + .insideauto-same-dropoff-switch {
  outline: 2px solid rgba(237, 50, 55, 0.28);
  outline-offset: 2px;
}

.insideauto-searchbar-grid {
  display: grid;
  grid-template-columns: 1fr 1.25fr 1fr 1.25fr auto;
  gap: 10px;
  align-items: end;
}

.insideauto-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.insideauto-field span {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #666666;
}

.insideauto-field input,
.insideauto-field select,
.insideauto-field textarea {
  width: 100%;
  max-width: 100%;
  min-height: 44px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid #d6d6d6;
  background: #ffffff;
  color: #111111;
  font-size: 13px;
  box-sizing: border-box;
}

.insideauto-google-address-input.is-invalid {
  border-color: #c62828;
  box-shadow: 0 0 0 3px rgba(198, 40, 40, 0.12);
}

.insideauto-google-suggestions {
  display: grid;
  max-height: 260px;
  overflow-y: auto;
  border: 1px solid #dfe5eb;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(15, 23, 34, 0.16);
}

.insideauto-google-suggestions[hidden] {
  display: none !important;
}

.insideauto-google-suggestion {
  width: 100%;
  padding: 10px 12px;
  border: 0;
  border-bottom: 1px solid #edf0f3;
  background: #ffffff;
  color: #17212b;
  font: inherit;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
}

.insideauto-google-suggestion:hover,
.insideauto-google-suggestion:focus-visible {
  background: #f3f7f8;
  outline: 0;
}

.insideauto-google-attribution {
  width: 120px;
  max-width: 50%;
  margin: 7px 10px 7px auto;
}

.insideauto-location-address-anchor {
  position: relative;
  z-index: 2;
}

.insideauto-location-address-anchor:has(.insideauto-location-address-popover:not([hidden])) {
  z-index: 40;
}

.insideauto-location-address-popover {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  display: grid;
  gap: 7px;
  min-width: 280px;
  padding: 12px;
  border: 1px solid #dfe5eb;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 18px 42px rgba(15, 23, 34, 0.2);
  box-sizing: border-box;
  z-index: 10020;
}

.insideauto-location-address-popover[hidden] {
  display: none !important;
}

@media (max-width: 680px) {
  .insideauto-location-address-popover {
    min-width: min(320px, calc(100vw - 48px));
  }
}

.insideauto-field textarea {
  min-height: 110px;
  padding: 14px 16px;
  resize: vertical;
}

.insideauto-field--location select {
  padding-left: 32px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 10px center;
  background-size: 15px 15px;
}

.insideauto-field-combo {
  min-width: 0;
}

.insideauto-combo-shell {
  display: flex;
  align-items: stretch;
  min-height: 44px;
  border-radius: 10px;
  border: 1px solid #d6d6d6;
  background: #ffffff;
}

.insideauto-combo-shell .insideauto-picker-shell {
  flex: 1 1 0;
  min-width: 0;
}

.insideauto-combo-shell .insideauto-picker-trigger {
  height: 100%;
  min-height: 44px;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.insideauto-combo-divider {
  align-self: stretch;
  width: 1px;
  margin: 8px 0;
  flex: 0 0 auto;
  background: #e2e2e2;
}

.insideauto-picker-shell {
  position: relative;
}

.insideauto-picker-trigger {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 44px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid #d6d6d6;
  background: #ffffff;
  color: #111111;
  font-size: 13px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
}

.insideauto-picker-trigger-icon {
  flex: 0 0 auto;
  font-size: 13px;
  opacity: 0.7;
}

.insideauto-picker-popover {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 30;
  width: min(620px, 92vw);
  border-radius: 18px;
  border: 1px solid #e4e4e4;
  background: #ffffff;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.16);
}

.insideauto-calendar-popover {
  padding: 18px;
}

.insideauto-calendar-nav {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}

.insideauto-calendar-nav-button {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 999px;
  background: #f2f2f2;
  color: #171717;
  font-size: 24px;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
}

.insideauto-calendar-nav-button:hover {
  background: #111111;
  color: #ffffff;
}

.insideauto-calendar-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.insideauto-calendar-month {
  display: grid;
  gap: 10px;
}

.insideauto-calendar-month-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.insideauto-calendar-month-head strong {
  font-size: 16px;
  font-weight: 700;
}

.insideauto-calendar-weekdays,
.insideauto-calendar-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
}

.insideauto-calendar-weekdays span {
  font-size: 11px;
  font-weight: 600;
  color: #8a8a8a;
  text-align: center;
  text-transform: uppercase;
}

.insideauto-calendar-day,
.insideauto-calendar-blank {
  display: grid;
  place-items: center;
  min-height: 34px;
  border-radius: 10px;
}

.insideauto-calendar-day {
  width: 34px;
  height: 34px;
  min-height: 0;
  padding: 0;
  justify-self: center;
  align-self: center;
  border: 0;
  background: transparent;
  color: #191919;
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.insideauto-calendar-day:hover:not(.is-selected):not(.is-disabled):not(:disabled) {
  background: #111111;
  color: #ffffff;
}

.insideauto-calendar-day.is-selected {
  background: #111111;
  color: #ffffff;
}

.insideauto-calendar-day.is-selected:hover {
  background: #111111;
}

.insideauto-calendar-day.is-today {
  box-shadow: inset 0 0 0 1px #ed3237;
  color: #ed3237;
}

.insideauto-calendar-day.is-selected.is-today {
  color: #ffffff;
}

.insideauto-time-popover {
  width: min(360px, 92vw);
  padding: 14px;
}

.insideauto-time-popover-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 12px;
}

.insideauto-time-popover-head strong {
  font-size: 16px;
  font-weight: 700;
}

.insideauto-time-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  max-height: 360px;
  overflow: auto;
}

.insideauto-time-option {
  min-height: 44px;
  border: 0;
  border-radius: 12px;
  background: #f3f3f3;
  color: #181818;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.insideauto-time-option:hover:not(.is-selected) {
  background: #111111;
  color: #ffffff;
}

.insideauto-time-option.is-selected {
  background: #111111;
  color: #ffffff;
}

.insideauto-time-option.is-selected:hover {
  background: #111111;
}

.insideauto-time-option.is-outside-hours {
  position: relative;
}

.insideauto-time-option.is-outside-hours::after {
  content: attr(data-note);
  display: block;
  font-size: 10px;
  font-weight: 500;
  color: inherit;
  opacity: 0.72;
}

.insideauto-time-option:disabled,
.insideauto-time-option.is-unavailable {
  background: #f3f3f3;
  color: #b7b7b7;
  cursor: not-allowed;
  text-decoration: line-through;
}

.insideauto-time-option:disabled:hover,
.insideauto-time-option.is-unavailable:hover {
  background: #f3f3f3;
  color: #b7b7b7;
}

.insideauto-search-cta {
  min-height: 44px;
  padding: 0 26px;
  border: 0;
  border-radius: 10px;
  background: #ed3237;
  color: #ffffff;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  transition: background 0.15s ease;
}

.insideauto-search-cta:hover {
  background: #d32a2f;
}

.insideauto-searchbar-note {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  font-size: 10px;
  color: #666666;
}

.insideauto-offerlist-results {
  padding: 22px 0 72px;
}

.insideauto-results-header {
  display: grid;
  gap: 14px;
  padding: 10px 0 20px;
}

.insideauto-results-header h1 {
  margin: 8px 0 0;
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.02;
  letter-spacing: -0.02em;
  color: #141414;
  font-weight: 700;
}

.insideauto-results-meta,
.insideauto-filterbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.insideauto-results-meta span,
.insideauto-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid #e3e3e3;
  font-size: 13px;
  font-weight: 500;
  color: #181818;
  text-decoration: none;
  cursor: pointer;
}

.insideauto-filter-chip b {
  display: inline-grid;
  place-items: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #ed3237;
  color: #ffffff;
  font-size: 11px;
  line-height: 1;
}

.insideauto-filter-chip.is-active,
.insideauto-filter-chip-dark {
  background: #111111;
  color: #ffffff;
  border-color: #111111;
}

.insideauto-filter-chip:hover {
  border-color: #111111;
}

.insideauto-sort-control {
  position: relative;
}

.insideauto-sort-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 40;
  width: 224px;
  padding: 18px 14px;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.18);
}

.insideauto-sort-menu strong {
  display: block;
  margin: 0 0 14px;
  font-size: 12px;
  font-weight: 700;
}

.insideauto-sort-menu a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  margin-top: 8px;
  border-radius: 8px;
  background: #f3f3f3;
  color: #181818;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}

.insideauto-sort-menu a.is-active {
  background: #111111;
  color: #ffffff;
}

.insideauto-filter-drawer {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  background: rgba(0, 0, 0, 0.52);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease;
}

.insideauto-filter-drawer.is-open {
  opacity: 1;
  pointer-events: auto;
}

.insideauto-filter-drawer-panel {
  width: min(520px, 100vw);
  min-height: 100%;
  background: #ffffff;
  color: #111111;
  transform: translateX(-100%);
  transition: transform 0.22s ease;
  overflow: auto;
}

.insideauto-filter-drawer.is-open .insideauto-filter-drawer-panel {
  transform: translateX(0);
}

.insideauto-filter-drawer-head {
  position: sticky;
  top: 0;
  z-index: 2;
  display: grid;
  grid-template-columns: 44px 1fr auto;
  align-items: center;
  gap: 12px;
  min-height: 76px;
  padding: 12px 22px;
  background: #ffffff;
  border-bottom: 1px solid #eeeeee;
}

.insideauto-filter-drawer-head button {
  width: 36px;
  height: 36px;
  border: 0;
  background: transparent;
  color: #111111;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}

.insideauto-filter-drawer-head strong {
  text-align: center;
  font-size: 18px;
  font-weight: 700;
}

.insideauto-filter-drawer-head a {
  color: #111111;
  font-size: 14px;
  font-weight: 600;
}

.insideauto-filter-form {
  display: grid;
  gap: 30px;
  padding: 28px 22px 96px;
}

.insideauto-filter-form section {
  display: grid;
  gap: 14px;
}

.insideauto-filter-form h2 {
  margin: 0;
  font-size: 17px;
  line-height: 1.2;
}

.insideauto-filter-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.insideauto-filter-options input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.insideauto-filter-options label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 0 18px;
  border-radius: 8px;
  background: #f3f3f3;
  border: 1px solid transparent;
  color: #222222;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}

.insideauto-filter-options-tight label {
  min-width: 52px;
  padding: 0 14px;
}

.insideauto-filter-options input:checked + label {
  background: #111111;
  color: #ffffff;
}

.insideauto-filter-submit {
  position: sticky;
  bottom: 16px;
  min-height: 54px;
  border: 0;
  border-radius: 8px;
  background: #ed3237;
  color: #ffffff;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 14px 34px rgba(237, 50, 55, 0.24);
}

.insideauto-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 20px;
}

.insideauto-vehicle-card {
  min-width: 0;
}

.insideauto-vehicle-card-link {
  display: grid;
  grid-template-rows: auto auto 1fr auto auto;
  gap: 12px;
  min-height: 100%;
  padding: 18px 18px 16px;
  border-radius: 8px;
  background:
    radial-gradient(circle at 72% 34%, rgba(215, 229, 237, 0.95), rgba(96, 112, 122, 0.88) 30%, transparent 54%),
    linear-gradient(180deg, #101315 0%, #2e3a40 48%, #0d1011 100%);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.18);
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition: border-color 0.2s ease, transform 0.2s ease;
  overflow: hidden;
}

.insideauto-vehicle-card-link:hover {
  border-color: #ed3237;
  transform: translateY(-2px);
}

.insideauto-vehicle-card-head h2 {
  margin: 0;
  font-size: 22px;
  line-height: 1.06;
  color: #ffffff;
  font-weight: 800;
}

.insideauto-vehicle-card-head h2 span {
  font-size: 12px;
  font-weight: 700;
  text-transform: none;
  color: rgba(255, 255, 255, 0.88);
}

.insideauto-vehicle-card-head p {
  margin: 7px 0 0;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.9);
  font-weight: 400;
}

.insideauto-vehicle-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.insideauto-vehicle-badges span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 26px;
  padding: 0 9px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  color: #ffffff;
  font-size: 11px;
  font-weight: 400;
}

.insideauto-card-icon {
  position: relative;
  display: inline-block;
  width: 13px;
  height: 13px;
  flex: 0 0 13px;
  opacity: 0.95;
}

.insideauto-card-icon-person::before {
  content: "";
  position: absolute;
  top: 1px;
  left: 4px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
}

.insideauto-card-icon-person::after {
  content: "";
  position: absolute;
  left: 2px;
  bottom: 1px;
  width: 9px;
  height: 5px;
  border-radius: 8px 8px 2px 2px;
  background: currentColor;
}

.insideauto-card-icon-bag::before {
  content: "";
  position: absolute;
  left: 2px;
  bottom: 2px;
  width: 9px;
  height: 7px;
  border-radius: 2px;
  border: 2px solid currentColor;
}

.insideauto-card-icon-bag::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 1px;
  width: 5px;
  height: 4px;
  border: 2px solid currentColor;
  border-bottom: 0;
  border-radius: 4px 4px 0 0;
}

.insideauto-card-icon-gear::before {
  content: "";
  position: absolute;
  inset: 2px;
  border: 2px dotted currentColor;
  border-radius: 50%;
}

.insideauto-card-icon-gear::after {
  content: "";
  position: absolute;
  top: 5px;
  left: 5px;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: currentColor;
}

.insideauto-vehicle-stage {
  min-height: 236px;
  display: grid;
  place-items: end center;
  margin: -6px -8px 0;
}

.insideauto-vehicle-stage img {
  width: 100%;
  max-height: 224px;
  object-fit: contain;
}

.insideauto-vehicle-included {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 12px;
  font-weight: 700;
}

.insideauto-vehicle-included span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: rgba(255, 255, 255, 0.88);
  font-weight: 400;
}

.insideauto-vehicle-included span::before {
  content: "✓";
  color: #25c15f;
  font-weight: 900;
}

.insideauto-vehicle-equipment {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 10px;
  margin-top: -6px;
}

.insideauto-vehicle-equipment span {
  display: flex;
  align-items: center;
  gap: 6px;
  color: rgba(255, 255, 255, 0.86);
  font-size: 11px;
  font-weight: 400;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.insideauto-vehicle-equipment span::before {
  content: "✓";
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  width: 13px;
  height: 13px;
  border-radius: 999px;
  background: #25c15f;
  color: #ffffff;
  font-size: 8px;
  line-height: 1;
}

.insideauto-vehicle-equipment-more {
  color: rgba(255, 255, 255, 0.56) !important;
  font-style: italic;
}

.insideauto-vehicle-equipment-more::before {
  content: "" !important;
  width: 0 !important;
  height: 0 !important;
  background: none !important;
}

.insideauto-vehicle-footer {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
  padding-top: 0;
  border-top: 0;
}

.insideauto-vehicle-price strong {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  font-size: 24px;
  line-height: 1;
  color: #ffffff;
  font-weight: 850;
}

.insideauto-vehicle-price strong small {
  font-size: 13px;
  color: #ffffff;
  font-weight: 750;
}

.insideauto-vehicle-price span {
  margin-left: 8px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.76);
  font-weight: 400;
}

.insideauto-vehicle-action {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 40px;
  border-radius: 12px;
  background: #ed3237;
  color: #ffffff;
  font-weight: 600;
  font-size: 14px;
}

.insideauto-empty-state {
  grid-column: 1 / -1;
  padding: 28px;
  border-radius: 24px;
  background: #ffffff;
  border: 1px solid #dfdfdf;
}

.insideauto-empty-state h2,
.insideauto-empty-state p {
  margin: 0;
}

.insideauto-empty-state p {
  margin-top: 8px;
  color: #666666;
}

.insideauto-checkout-page {
  padding: 28px 0 72px;
}

.insideauto-checkout-shell {
  width: min(calc(100% - 48px), 1280px);
  max-width: 100%;
  margin: 0 auto;
}

.insideauto-checkout-topbar {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: center;
  margin-bottom: 18px;
}

.insideauto-back-link {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 14px;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid #e1e1e1;
  color: #171717;
  font-size: 13px;
  font-weight: 500;
}

.insideauto-checkout-trip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.insideauto-checkout-trip article {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 12px 14px;
  border-radius: 14px;
  background: #111111;
  color: #ffffff;
}

.insideauto-checkout-trip strong {
  font-size: 14px;
  font-weight: 600;
}

.insideauto-checkout-trip span {
  color: rgba(255, 255, 255, 0.75);
  font-size: 12px;
}

.insideauto-alert {
  margin-bottom: 18px;
  padding: 18px 20px;
  border-radius: 20px;
  border: 1px solid #f4c4c4;
  background: #fff1f1;
}

.insideauto-alert strong {
  display: block;
  margin-bottom: 8px;
}

.insideauto-alert-success {
  border-color: #cfe8d6;
  background: #f0fbf3;
}

.insideauto-alert ul {
  margin: 0;
  padding-left: 18px;
}

.insideauto-inline-error {
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid #f0b8b8;
  background: #fff3f3;
  color: #a02020;
  font-size: 13px;
  font-weight: 500;
}

.insideauto-results-error {
  margin: 18px 0 0;
}

.insideauto-field.is-invalid select,
.insideauto-field.is-invalid input,
.insideauto-field.is-invalid .insideauto-picker-trigger {
  border-color: #d53b3b;
  box-shadow: 0 0 0 3px rgba(213, 59, 59, 0.1);
}

.insideauto-selected-car {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, 420px);
  gap: 0;
  overflow: hidden;
  border-radius: 28px;
  background: #ffffff;
  border: 1px solid #dfdfdf;
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.08);
}

.insideauto-selected-car-copy {
  display: grid;
  align-content: start;
  gap: 14px;
  padding: 24px;
}

.insideauto-selected-car-copy h1 {
  margin: 0;
  font-size: clamp(30px, 4vw, 46px);
  line-height: 0.98;
  letter-spacing: -0.02em;
  color: #101010;
  font-weight: 700;
}

.insideauto-selected-car-copy p {
  margin: -4px 0 0;
  font-size: 15px;
  color: #666666;
}

.insideauto-selected-car-badges,
.insideauto-selected-car-specs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.insideauto-selected-car-badges span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid #dfdfdf;
  background: #fafafa;
  color: #202020;
  font-size: 12px;
  font-weight: 500;
}

.insideauto-selected-car-equipment {
  padding: 16px 18px;
  border-radius: 14px;
  border: 1px solid #ececec;
  background: #fbfbfb;
}

.insideauto-selected-car-equipment-title {
  display: block;
  margin-bottom: 12px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #8a8a8a;
}

.insideauto-selected-car-equipment-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 16px;
}

.insideauto-selected-car-equipment-grid span {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 13px;
  font-weight: 500;
  color: #242424;
  overflow-wrap: anywhere;
}

.insideauto-selected-car-equipment-grid span::before {
  content: "✓";
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #25c15f;
  color: #ffffff;
  font-size: 10px;
  line-height: 1;
}

.insideauto-selected-car-specs article {
  display: grid;
  gap: 4px;
  min-width: 116px;
  padding: 12px 14px;
  border-radius: 14px;
  background: #f6f6f6;
}

.insideauto-selected-car-specs strong {
  font-size: 15px;
  color: #111111;
  overflow-wrap: anywhere;
  font-weight: 600;
}

.insideauto-selected-car-specs span {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #757575;
}

.insideauto-selected-car-stage {
  display: grid;
  place-items: center;
  padding: 28px;
  background:
    radial-gradient(circle at 70% 28%, rgba(230, 236, 241, 0.92), transparent 28%),
    linear-gradient(180deg, #191c1f 0%, #495662 50%, #111315 100%);
}

.insideauto-selected-car-stage img {
  width: 100%;
  max-height: 330px;
  object-fit: contain;
}

.insideauto-checkout-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 18px;
  align-items: start;
  margin-top: 24px;
}

.insideauto-checkout-main,
.insideauto-checkout-side {
  display: grid;
  gap: 18px;
}

.insideauto-panel,
.insideauto-booking-overview,
.insideauto-terms-strip article {
  background: #ffffff;
  border: 1px solid #e4e8ed;
  border-radius: 20px;
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.055);
}

.insideauto-panel {
  padding: 22px 24px;
}

.insideauto-panel-head {
  display: grid;
  gap: 4px;
  padding-bottom: 16px;
  margin-bottom: 18px;
  border-bottom: 1px solid #f0f0f0;
}

.insideauto-panel-head h2 {
  margin: 0;
  font-size: 20px;
  line-height: 1.1;
  letter-spacing: -0.01em;
  color: #111;
  font-weight: 700;
}

.insideauto-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.insideauto-field-span {
  grid-column: 1 / -1;
}

.insideauto-form-grid-single {
  grid-template-columns: minmax(0, 420px);
}

.insideauto-form-grid-period {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.insideauto-addon-list {
  display: grid;
  gap: 12px;
}

.insideauto-addon-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  min-height: 96px;
  padding: 16px 18px;
  border-radius: 14px;
  border: 1px solid #dddddd;
  background: #ffffff;
  cursor: pointer;
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.insideauto-addon-row:hover {
  border-color: #cfcfcf;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.05);
}

.insideauto-addon-main {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  min-width: 0;
}

.insideauto-addon-icon {
  position: relative;
  width: 24px;
  height: 24px;
  margin-top: 2px;
  border-radius: 50%;
  background: #111111;
}

.insideauto-addon-icon::before,
.insideauto-addon-icon::after {
  content: "";
  position: absolute;
  background: #ffffff;
}

.insideauto-addon-icon::before {
  left: 6px;
  top: 11px;
  width: 12px;
  height: 2px;
  border-radius: 999px;
}

.insideauto-addon-icon::after {
  left: 11px;
  top: 6px;
  width: 2px;
  height: 12px;
  border-radius: 999px;
}

.insideauto-addon-copy {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.insideauto-addon-copy strong {
  font-size: 16px;
  line-height: 1.15;
  color: #121212;
  font-weight: 600;
}

.insideauto-addon-copy span {
  color: #111111;
  font-size: 13px;
  font-weight: 600;
}

.insideauto-addon-copy p {
  margin: 0;
  color: #666666;
  font-size: 12px;
  line-height: 1.35;
  max-width: 48ch;
}

.insideauto-addon-meta a,
.insideauto-addon-details summary {
  color: #171717;
  text-decoration: underline;
  text-underline-offset: 3px;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  list-style: none;
}

.insideauto-addon-details summary::-webkit-details-marker {
  display: none;
}

.insideauto-addon-details {
  position: relative;
}

.insideauto-addon-details p {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 20;
  width: min(240px, 70vw);
  margin: 0;
  padding: 10px 12px;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  background: #ffffff;
  color: #555555;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.14);
}

.insideauto-addon-meta {
  display: flex;
  align-items: center;
  gap: 16px;
  justify-content: end;
  min-width: 150px;
}

.insideauto-addon-toggle {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.insideauto-addon-toggle input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.insideauto-addon-switch {
  position: relative;
  width: 54px;
  height: 32px;
  flex: 0 0 54px;
  border-radius: 999px;
  background: #d7d9db;
  transition: background 0.18s ease;
}

.insideauto-addon-switch::after {
  content: "";
  position: absolute;
  top: 4px;
  left: 4px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
  transition: transform 0.18s ease;
}

/* General sibling, not adjacent: a required add-on renders a hidden field between the
   checkbox and the switch to submit the extra, which broke `+` and left the switch grey
   while the label beside it said "included". */
.insideauto-addon-toggle input:checked ~ .insideauto-addon-switch {
  background: #ed3237;
}

.insideauto-addon-toggle input:checked ~ .insideauto-addon-switch::after {
  transform: translateX(22px);
}

/* Locked on rather than merely off-limits: it is included, not unavailable. */
.insideauto-addon-toggle.is-required .insideauto-addon-switch {
  opacity: 0.75;
  cursor: default;
}

.insideauto-addon-toggle em {
  font-style: normal;
  font-size: 11px;
  color: #686868;
}

.insideauto-addon-toggle.is-required em {
  font-weight: 700;
  color: #ed3237;
}

.insideauto-booking-overview {
  position: sticky;
  top: 16px;
  padding: 20px;
  overflow: hidden;
}

.insideauto-booking-price {
  display: grid;
  gap: 0;
  margin-top: 8px;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid #e4e8ed;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}

.insideauto-booking-price > div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding: 18px 20px 16px;
  background: #f7f8fa;
  border-bottom: 1px solid #e4e8ed;
}

.insideauto-booking-price span {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #888;
}

.insideauto-booking-price strong {
  font-size: 28px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: #111111;
  font-weight: 800;
}

.insideauto-booking-price button {
  width: 100%;
  min-height: 52px;
  padding: 0 20px;
  border: 0;
  border-radius: 0;
  background: #ed3237;
  color: #ffffff;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.01em;
  cursor: pointer;
  transition: background 180ms ease;
}

.insideauto-booking-price button:hover {
  background: #c8282c;
}

.insideauto-booking-details {
  display: grid;
  gap: 16px;
  padding-top: 18px;
}

.insideauto-booking-details h3 {
  margin: 0;
  font-size: 20px;
  line-height: 1.1;
  letter-spacing: -0.01em;
  font-weight: 700;
}

.insideauto-booking-details ul {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.insideauto-booking-details li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid #eeeeee;
}

.insideauto-booking-details li span {
  color: #555555;
  font-size: 13px;
}

.insideauto-booking-details li strong {
  color: #121212;
  font-size: 14px;
  text-align: right;
  font-weight: 600;
}

.insideauto-booking-info {
  display: grid;
  gap: 8px;
  padding: 18px;
  border-radius: 18px;
  background: #f3f3f3;
}

.insideauto-booking-info p {
  margin: 0;
  color: #4f4f4f;
  font-size: 13px;
  line-height: 1.45;
}

/* ── Dashboard revenue chart ── */
.fc-dash-chart-panel {
  padding: 20px 20px 16px;
}

.fc-dash-chart {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  height: 180px;
  padding-top: 28px;
  margin-top: 12px;
  border-bottom: 2px solid #e8edf2;
}

.fc-dash-bar-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  height: 100%;
  justify-content: flex-end;
}

.fc-dash-bar-val {
  font-size: 9px;
  color: #5a7080;
  text-align: center;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  max-width: 100%;
  text-overflow: ellipsis;
}

.fc-dash-bar-wrap {
  width: 100%;
  flex: 1;
  display: flex;
  align-items: flex-end;
}

.fc-dash-bar {
  width: 100%;
  min-height: 2px;
  background: linear-gradient(180deg, #0fb8b0 0%, #0a8f89 100%);
  border-radius: 4px 4px 0 0;
  transition: opacity 0.15s;
}

.fc-dash-bar:hover {
  opacity: 0.8;
}

.fc-dash-bar-label {
  font-size: 9px;
  color: #8a9bac;
  text-align: center;
  margin-top: 6px;
  white-space: nowrap;
}

/* ── Vehicle profit table ── */
.fc-profit-table {
  width: 100%;
  table-layout: auto;
}

.fc-profit-table thead th {
  background: #f8fafc;
  color: #6b7a8a;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 10px 8px;
  border-bottom: 1px solid #e4eaf0;
  text-align: center;
}

.fc-profit-table tbody tr:hover td {
  background: #f5f8fb;
}

.fc-profit-table tbody td {
  border-bottom: 1px solid #edf0f4;
  font-size: 13px;
  color: #1a2533;
}

/* ── Waitlist / interest section ── */
.insideauto-waitlist-section {
  background: #f8fafc;
  border: 1px solid #e4eaf0;
  border-radius: 16px;
  padding: 28px 28px 24px;
  margin-top: 22px;
}

.insideauto-waitlist-copy {
  margin-bottom: 20px;
}

.insideauto-waitlist-copy h2 {
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 6px;
}

.insideauto-waitlist-copy p {
  margin: 0;
  color: #5a6a7a;
  font-size: 14px;
}

.insideauto-waitlist-form .insideauto-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.insideauto-waitlist-form .insideauto-field--full {
  grid-column: 1 / -1;
}

@media (max-width: 700px) {
  .insideauto-waitlist-form .insideauto-form-grid {
    grid-template-columns: 1fr;
  }
}

/* Rental admin vehicles: match the quiet, column-based reservation list. */
.admin-page .vehicles-titlebar {
  align-items: flex-end;
}

.admin-page .vehicles-title-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

.admin-page .vehicles-filter-panel {
  padding: 18px 20px;
  border: 1px solid #dfe5ea;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 4px 14px rgba(15, 26, 34, 0.045);
}

.admin-page .vehicles-tool-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
  padding-bottom: 13px;
  border-bottom: 1px solid #e7ebef;
}

.admin-page .vehicles-tool-head .section-kicker { margin-bottom: 3px; }
.admin-page .vehicles-tool-head h2 { margin: 0; font-size: 18px; }

.admin-page .vehicles-reset-link {
  color: #667786;
  font-size: 12px;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.admin-page .vehicles-filter-grid {
  display: grid;
  grid-template-columns: minmax(260px, 1.6fr) minmax(145px, .8fr) minmax(175px, 1fr) minmax(190px, 1.1fr) auto;
  gap: 12px;
  align-items: end;
}

.admin-page .vehicles-filter-grid label { min-width: 0; }
.admin-page .vehicles-filter-grid input,
.admin-page .vehicles-filter-grid select { width: 100%; }

.admin-page .vehicles-list-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin: 24px 0 10px;
  padding: 0 2px;
}

.admin-page .vehicles-list-head div > span,
.admin-page .vehicles-list-head div > strong { display: block; }
.admin-page .vehicles-list-head .section-kicker { margin: 0 0 2px; }
.admin-page .vehicles-list-head strong { color: #23313e; font-size: 15px; }

.admin-page .vehicle-admin-list {
  display: grid;
  gap: 12px;
}

.admin-page .vehicle-admin-row {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 18px;
  align-items: stretch;
  padding: 18px 20px;
  border: 1px solid #dfe5ea;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 5px 16px rgba(15, 26, 34, 0.055);
  transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.admin-page .vehicle-admin-row:hover,
.admin-page .vehicle-admin-row:focus-within {
  border-color: #c9d7df;
  background: #f6fafb;
  box-shadow: 0 7px 20px rgba(15, 26, 34, 0.075);
}

.admin-page .vehicle-admin-image {
  width: 150px;
  height: 112px;
  align-self: start;
  object-fit: cover;
  border: 1px solid #e1e7eb;
  border-radius: 2px;
  background: #f3f6f8;
}

.admin-page .vehicle-admin-main {
  min-width: 0;
  display: grid;
  gap: 15px;
}

.admin-page .vehicle-admin-top {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.admin-page .vehicle-admin-top > div:first-child { min-width: 0; }
.admin-page .vehicle-admin-top h2 { margin: 0 0 4px; font-size: 17px; line-height: 1.2; }
.admin-page .vehicle-admin-top p { margin: 0; color: #71808e; font-size: 12px; overflow-wrap: anywhere; }

.admin-page .vehicle-admin-idline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  margin-bottom: 5px;
}

.admin-page .vehicle-admin-idline .section-kicker {
  margin: 0;
  color: #152331;
  font-size: 12px;
  letter-spacing: 0;
}

.admin-page .vehicle-status-label {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  padding-left: 8px;
  border-left: 2px solid #8a99a7;
  color: #657483;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  text-transform: uppercase;
}

.admin-page .vehicle-status-label.active { border-color: #0a938c; color: #08756f; }
.admin-page .vehicle-status-label.maintenance { border-color: #c7800a; color: #9a6206; }
.admin-page .vehicle-status-label.inactive { border-color: #c75249; color: #a64139; }

.admin-page .vehicle-admin-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.admin-page .vehicle-admin-actions .primary-button,
.admin-page .vehicle-admin-actions .link-button {
  min-height: 38px;
  padding: 9px 13px;
  white-space: nowrap;
}

.admin-page .vehicle-admin-meta {
  display: grid;
  grid-template-columns: repeat(6, minmax(88px, 1fr));
  gap: 0;
  margin: 0;
  padding-top: 12px;
  border-top: 1px solid #e7ebef;
}

.admin-page .vehicle-admin-meta .vehicle-admin-meta-item {
  min-width: 0;
  min-height: 54px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 3px;
  padding: 0 13px;
  border-right: 1px solid #e7ebef;
  color: #23313e;
  background: transparent;
}

.admin-page .vehicle-admin-meta .vehicle-admin-meta-item:first-child { padding-left: 0; }
.admin-page .vehicle-admin-meta .vehicle-admin-meta-item:last-child { padding-right: 0; border-right: 0; }

.admin-page .vehicle-admin-meta-item small {
  color: #8493a1;
  font-size: 9.5px;
  font-weight: 700;
  line-height: 1.2;
  text-transform: uppercase;
}

.admin-page .vehicle-admin-meta-item strong {
  overflow-wrap: anywhere;
  color: #23313e;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
}

@media (max-width: 1180px) {
  .admin-page .vehicles-filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .admin-page .vehicle-admin-top { display: grid; }
  .admin-page .vehicle-admin-actions { justify-content: flex-start; }
  .admin-page .vehicle-admin-meta { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .admin-page .vehicle-admin-meta .vehicle-admin-meta-item {
    padding: 10px 12px;
    border-right: 0;
    border-bottom: 1px solid #e7ebef;
  }
  .admin-page .vehicle-admin-meta .vehicle-admin-meta-item:nth-last-child(-n + 3) { border-bottom: 0; }
  .admin-page .vehicle-admin-meta .vehicle-admin-meta-item:first-child { padding-left: 12px; }
  .admin-page .vehicle-admin-meta .vehicle-admin-meta-item:last-child { padding-right: 12px; }
}

@media (max-width: 700px) {
  .admin-page .vehicles-titlebar,
  .admin-page .vehicles-tool-head,
  .admin-page .vehicles-list-head { align-items: stretch; }

  .admin-page .vehicles-title-actions,
  .admin-page .vehicles-tool-head,
  .admin-page .vehicles-list-head { width: 100%; }

  .admin-page .vehicles-title-actions > *,
  .admin-page .vehicles-filter-grid > * { width: 100%; }

  .admin-page .vehicles-filter-grid { grid-template-columns: 1fr; }
  .admin-page .vehicles-filter-panel { padding: 16px; }

  .admin-page .vehicle-admin-row {
    grid-template-columns: 1fr;
    padding: 16px;
  }

  .admin-page .vehicle-admin-image {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 8;
    object-fit: contain;
  }

  .admin-page .vehicle-admin-main,
  .admin-page .vehicle-admin-top,
  .admin-page .vehicle-admin-top > div {
    width: 100%;
  }

  .admin-page .vehicle-admin-actions {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .admin-page .vehicle-admin-actions .primary-button,
  .admin-page .vehicle-admin-actions .link-button {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    justify-content: center;
    text-align: center;
  }

  .admin-page .vehicle-admin-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-page .vehicle-admin-meta .vehicle-admin-meta-item:nth-last-child(-n + 3) { border-bottom: 1px solid #e7ebef; }
  .admin-page .vehicle-admin-meta .vehicle-admin-meta-item:nth-last-child(-n + 2) { border-bottom: 0; }
}

.insideauto-alert-success {
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 10px;
  padding: 14px 16px;
  color: #166534;
}

.insideauto-alert-success strong {
  display: block;
  margin-bottom: 4px;
}

/* ── Terms strip ── */
.insideauto-terms-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 22px;
}

.insideauto-terms-strip article {
  padding: 18px;
}

.insideauto-terms-strip h3 {
  margin: 0 0 8px;
  font-size: 18px;
  line-height: 1.05;
  font-weight: 700;
}

.insideauto-terms-strip p {
  margin: 0;
  color: #5f5f5f;
  font-size: 13px;
  line-height: 1.5;
}

.insideauto-review-title {
  display: grid;
  gap: 4px;
}

.insideauto-review-title h1 {
  margin: 0;
  color: #111111;
  font-size: clamp(30px, 4vw, 42px);
  line-height: 1;
  font-weight: 700;
}

.insideauto-review-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 420px;
  gap: 24px;
  align-items: start;
}

.insideauto-review-main {
  display: grid;
  gap: 18px;
}

.insideauto-review-side {
  display: grid;
  gap: 18px;
}

.insideauto-review-car {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding-bottom: 16px;
  border-bottom: 1px solid #e6e6e6;
}

.insideauto-review-car img {
  width: 86px;
  height: 58px;
  object-fit: contain;
  border-radius: 10px;
  background:
    radial-gradient(circle at 70% 28%, rgba(230, 236, 241, 0.92), transparent 30%),
    linear-gradient(180deg, #191c1f 0%, #495662 55%, #111315 100%);
}

.insideauto-review-car strong {
  display: block;
  color: #111111;
  font-size: 17px;
  font-weight: 700;
}

.insideauto-review-car span {
  display: block;
  margin-top: 3px;
  color: #666666;
  font-size: 13px;
}

.insideauto-reservation-layout {
  margin-top: 24px;
}

.insideauto-reservation-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.insideauto-reservation-facts article,
.insideauto-reservation-timeline article {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 14px;
  border-radius: 14px;
  background: #f6f6f6;
}

.insideauto-reservation-facts span,
.insideauto-reservation-timeline span {
  color: #727272;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.insideauto-reservation-facts strong,
.insideauto-reservation-timeline strong {
  color: #111111;
  font-size: 15px;
  font-weight: 600;
  overflow-wrap: anywhere;
}

.insideauto-reservation-timeline {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.insideauto-reservation-timeline p,
.insideauto-reservation-note {
  margin: 0;
  color: #5f5f5f;
  font-size: 13px;
  line-height: 1.45;
}

.insideauto-reservation-extras {
  display: grid;
  gap: 10px;
}

.insideauto-reservation-extras article {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid #e3e3e3;
  background: #ffffff;
}

.insideauto-reservation-extras strong {
  display: block;
  color: #111111;
  font-size: 14px;
  font-weight: 600;
}

.insideauto-reservation-extras span {
  display: block;
  margin-top: 3px;
  color: #666666;
  font-size: 12px;
}

.insideauto-reservation-extras em {
  color: #111111;
  font-style: normal;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}

.insideauto-reservation-notes-head {
  margin-top: 18px;
}

/* ── Reservation documents (customer self-upload) ── */
.insideauto-doc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 12px;
}

.insideauto-doc-grid + .insideauto-doc-grid {
  margin-top: 12px;
}

.insideauto-doc-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px;
  border-radius: 14px;
  background: #f6f6f6;
}

.insideauto-doc-card-label {
  color: #727272;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.insideauto-doc-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-height: 90px;
  border-radius: 10px;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid #e3e3e3;
}

.insideauto-doc-preview img {
  width: 100%;
  height: 90px;
  object-fit: cover;
  display: block;
}

.insideauto-doc-preview.insideauto-doc-preview-pdf {
  padding: 10px;
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  color: #111111;
}

.insideauto-doc-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-height: 90px;
  border-radius: 10px;
  border: 1px dashed #d5d5d5;
  color: #9ca3af;
  font-size: 12px;
  text-align: center;
  padding: 8px;
}

.insideauto-doc-dropzone {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex: 1;
  min-height: 90px;
  padding: 10px;
  border-radius: 10px;
  border: 1px dashed #c7c7c7;
  background: #ffffff;
  color: #5f5f5f;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.insideauto-doc-dropzone:hover {
  border-color: #ed3237;
  background: #fff5f5;
}

.insideauto-doc-dropzone input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
}

.insideauto-doc-dropzone-filename {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #111111;
}

.insideauto-doc-note-input {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid #ddd;
  border-radius: 8px;
  font-size: 12px;
  background: #ffffff;
}

.insideauto-doc-delete {
  position: absolute;
  top: -8px;
  right: -8px;
  width: 22px;
  height: 22px;
  line-height: 20px;
  padding: 0;
  border-radius: 50%;
  background: #ef3340;
  color: #ffffff;
  border: 2px solid #ffffff;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}

.insideauto-doc-submit-row {
  display: flex;
  justify-content: center;
  margin-top: 16px;
}

@media (max-width: 700px) {
  .insideauto-doc-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.insideauto-pay-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  min-width: 132px;
  padding: 0 16px;
  border-radius: 12px;
  background: #ed3237;
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;
}

@media (max-width: 1180px) {
  .admin-two-column,
  .insideauto-card-grid,
  .insideauto-checkout-layout,
  .insideauto-review-layout,
  .insideauto-selected-car,
  .insideauto-terms-strip {
    grid-template-columns: 1fr;
  }

  .insideauto-searchbar-grid,
  .insideauto-form-grid-period {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .insideauto-search-cta {
    grid-column: 1 / -1;
  }

  .insideauto-searchbar-top,
  .insideauto-searchbar-summary {
    grid-template-columns: 1fr;
  }

  .insideauto-calendar-grid {
    grid-template-columns: 1fr;
  }

  .insideauto-booking-overview {
    position: static;
  }
}

@media (max-width: 760px) {
  html,
  body.rental-vertical-page {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
  }

  body.rental-vertical-page {
    position: relative;
  }

  .drive-vehicle-page * {
    min-width: 0;
  }

  .drive-vehicle-page .drive-topbar,
  .drive-home-page .drive-topbar {
    width: 100vw;
    max-width: 100vw;
  }

  /* Public rent-a-car pages only — admin/partner/customer sections keep the
     compact 88px logo (see .admin-page .brand-logo etc. above), otherwise
     this !important forces the bigger public logo everywhere and overflows
     the admin topbar on small screens. */
  body:not(.admin-page):not(.partner-page):not(.customer-page) .drive-brand-logo {
    width: 160px !important;
    max-width: 52vw;
    height: auto !important;
  }

  .insideauto-shell,
  .insideauto-checkout-shell {
    width: calc(100vw - 24px);
    max-width: calc(100vw - 24px);
  }

  .drive-topbar-inner {
    width: calc(100vw - 32px);
    max-width: calc(100vw - 32px);
    min-width: 0;
    min-height: 62px;
  }

  /* Hide desktop nav, show hamburger */
  .drive-nav { display: none; }
  .drive-topbar-inner { position: relative; }
  .drive-nav-toggle {
    display: flex;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 0;
  }

  .insideauto-searchbar-top,
  .insideauto-searchbar-summary,
  .insideauto-searchbar-grid,
  .insideauto-review-layout,
  .insideauto-form-grid,
  .insideauto-form-grid-period,
  .insideauto-reservation-facts,
  .insideauto-reservation-timeline,
  .insideauto-checkout-trip {
    grid-template-columns: 1fr;
  }

  .insideauto-search-cta {
    grid-column: 1 / -1;
  }

  .insideauto-results-header h1,
  .insideauto-selected-car-copy h1 {
    font-size: 30px;
  }

  .insideauto-checkout-page {
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden;
  }

  .insideauto-checkout-topbar,
  .insideauto-checkout-trip,
  .insideauto-checkout-layout,
  .insideauto-review-layout,
  .insideauto-terms-strip,
  .insideauto-selected-car {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .drive-vehicle-page .insideauto-checkout-page {
    padding: 14px 0 42px;
  }

  .drive-vehicle-page .insideauto-checkout-topbar {
    margin-bottom: 10px;
  }

  .drive-vehicle-page .insideauto-checkout-trip {
    display: none;
  }

  .drive-vehicle-page .insideauto-back-link {
    min-height: 34px;
    padding: 0 12px;
    font-size: 12px;
  }

  .drive-vehicle-page .insideauto-selected-car {
    border-radius: 16px;
  }

  .drive-vehicle-page .insideauto-selected-car-copy {
    gap: 10px;
  }

  .drive-vehicle-page .insideauto-selected-car-copy h1 {
    font-size: 24px;
    line-height: 1.02;
  }

  .drive-vehicle-page .insideauto-selected-car-copy p {
    font-size: 13px;
  }

  .drive-vehicle-page .insideauto-selected-car-badges,
  .drive-vehicle-page .insideauto-selected-car-specs {
    gap: 8px;
  }

  .drive-vehicle-page .insideauto-selected-car-badges span {
    min-height: 28px;
    padding: 0 9px;
    font-size: 11px;
  }

  .drive-vehicle-page .insideauto-selected-car-specs article {
    flex: 1 1 calc(50% - 8px);
    padding: 9px 10px;
    border-radius: 10px;
  }

  .drive-vehicle-page .insideauto-selected-car-equipment {
    padding: 13px 14px;
  }

  .drive-vehicle-page .insideauto-selected-car-equipment-grid {
    grid-template-columns: 1fr;
    gap: 9px;
  }

  .drive-vehicle-page .insideauto-selected-car-specs strong {
    font-size: 13px;
  }

  .drive-vehicle-page .insideauto-selected-car-specs span {
    font-size: 9px;
  }

  .drive-vehicle-page .insideauto-selected-car-stage {
    min-height: 176px;
    padding: 16px;
  }

  .drive-vehicle-page .insideauto-selected-car-stage img {
    max-height: 180px;
  }

  .drive-vehicle-page .insideauto-checkout-layout {
    gap: 12px;
    margin-top: 14px;
  }

  .drive-vehicle-page .insideauto-checkout-main,
  .drive-vehicle-page .insideauto-checkout-side {
    gap: 12px;
  }

  .drive-vehicle-page .insideauto-panel,
  .drive-vehicle-page .insideauto-booking-overview {
    border-radius: 16px;
  }

  .drive-vehicle-page .insideauto-panel-head h2 {
    font-size: 18px;
  }

  .insideauto-selected-car-copy,
  .insideauto-selected-car-stage,
  .insideauto-panel,
  .insideauto-booking-overview,
  .insideauto-terms-strip article {
    padding: 18px;
  }

  .insideauto-offerlist-hero {
    padding: 8px 0;
  }

  .insideauto-searchbar {
    padding: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .insideauto-searchbar-expanded {
    display: none;
  }

  .insideauto-searchbar.is-expanded {
    position: fixed;
    inset: 0;
    z-index: 300;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 0;
    padding: 12px 12px 56px;
    background: #111111;
    align-content: start;
  }

  .insideauto-searchbar.is-expanded .insideauto-searchbar-expanded {
    display: grid;
    gap: 10px;
    margin-top: 10px;
    padding: 12px;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.16);
  }

  body.drive-search-open {
    overflow: hidden;
  }

  .insideauto-searchbar.is-expanded .insideauto-picker-popover {
    z-index: 310;
  }

  body.drive-search-open.drive-picker-open::before {
    display: none;
  }

  .insideauto-mobile-search-card {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 58px;
    padding: 0 16px;
    border: 1px solid #e2e2e2;
    border-radius: 18px;
    background: #ffffff;
    color: #111111;
    text-align: left;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.18);
  }

  .insideauto-mobile-search-icon {
    flex: 0 0 auto;
    position: relative;
    width: 24px;
    height: 24px;
    font-size: 0;
    line-height: 1;
  }

  .insideauto-mobile-search-icon::before,
  .insideauto-mobile-search-icon::after {
    content: "";
    position: absolute;
    display: block;
  }

  .insideauto-mobile-search-icon::before {
    top: 2px;
    left: 2px;
    width: 12px;
    height: 12px;
    border: 3px solid #111111;
    border-radius: 50%;
  }

  .insideauto-mobile-search-icon::after {
    right: 3px;
    bottom: 4px;
    width: 10px;
    height: 3px;
    border-radius: 999px;
    background: #111111;
    transform: rotate(45deg);
    transform-origin: center;
  }

  .insideauto-mobile-search-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
  }

  .insideauto-mobile-search-copy strong {
    overflow: hidden;
    color: #111111;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .insideauto-mobile-search-copy small {
    color: #6a6a6a;
    font-size: 12px;
    font-weight: 400;
  }

  .insideauto-picker-popover {
    position: fixed;
    top: auto;
    bottom: 0;
    left: 0 !important;
    right: 0;
    width: 100% !important;
    max-height: 78vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 20px 20px 0 0;
    transform: none !important;
    z-index: 200;
  }

  .insideauto-time-popover {
    width: 100%;
  }

  body.drive-picker-open::before {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 199;
  }

  body.drive-picker-open {
    overflow: hidden;
  }

  .insideauto-addon-row,
  .insideauto-addon-main,
  .insideauto-booking-price,
  .insideauto-checkout-topbar {
    grid-template-columns: 1fr;
    display: grid;
  }

  .insideauto-addon-row {
    gap: 12px;
    min-height: 0;
    padding: 14px;
  }

  .insideauto-selected-car-badges span,
  .insideauto-selected-car-specs article {
    min-width: 0;
    max-width: 100%;
  }

  .insideauto-selected-car-stage img {
    max-width: 100%;
  }

  .insideauto-addon-main {
    grid-template-columns: 28px minmax(0, 1fr);
  }

  .insideauto-addon-meta {
    width: 100%;
    justify-content: space-between;
    min-width: 0;
  }

  .insideauto-booking-price button {
    width: 100%;
    min-width: 0;
  }

  .insideauto-contact-shell {
    width: min(calc(100% - 24px), 1120px);
  }

  .insideauto-contact-grid {
    grid-template-columns: 1fr;
  }

  .insideauto-chat {
    right: 8px;
    bottom: 76px;
    width: calc(100vw - 16px);
  }

  .insideauto-chat-body {
    min-height: 260px;
  }

  .insideauto-chat-form {
    grid-template-columns: 1fr 44px;
  }

  .insideauto-chat-form input,
  .insideauto-chat-form textarea {
    grid-column: 1;
  }

  .insideauto-chat-form button {
    grid-column: 2;
    grid-row: 1 / 4;
  }
}

.rental-vertical-page :is(h1, h2, h3, h4, strong, b, button, .insideauto-results-kicker, .insideauto-filter-chip, .insideauto-vehicle-card-head h2, .insideauto-vehicle-price strong) {
  font-weight: 500;
}

.rental-vertical-page :is(.insideauto-selected-car-specs strong, .insideauto-booking-price strong, .insideauto-panel-head h2, .insideauto-results-header h1) {
  font-weight: 500;
}

.insideauto-checkout-same-dropoff {
  width: fit-content;
  margin: -4px 0 14px;
}

/* --- Coupon & Agreement panel overrides (smaller, less prominent) --- */
.insideauto-coupon-panel,
.insideauto-agreement-panel {
  padding: 16px 18px;
}

.insideauto-coupon-panel .insideauto-panel-head,
.insideauto-agreement-panel .insideauto-panel-head {
  margin-bottom: 12px;
  gap: 3px;
}

.insideauto-coupon-panel .insideauto-panel-head h2,
.insideauto-agreement-panel .insideauto-panel-head h2 {
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: 0;
  color: #2a2a2a;
}

.insideauto-coupon-panel .insideauto-results-kicker,
.insideauto-agreement-panel .insideauto-results-kicker {
  font-size: 9px;
  letter-spacing: 0.07em;
}

/* --- Coupon code --- */
.insideauto-coupon-row {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto auto;
  column-gap: 8px;
  row-gap: 0;
  align-items: end;
}

.insideauto-coupon-label {
  grid-column: 1 / -1;
  display: block;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #666666;
  margin-bottom: 6px;
}

.insideauto-coupon-input {
  grid-column: 1;
  grid-row: 1;
  width: 100%;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid #d6d6d6;
  border-radius: 12px;
  background: #ffffff;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #111111;
  box-sizing: border-box;
}

.insideauto-coupon-input::placeholder {
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: #b8b8b8;
  font-size: 13px;
}

.insideauto-coupon-input:focus {
  outline: none;
  border-color: #999999;
}

.insideauto-coupon-apply-btn {
  grid-column: 2;
  grid-row: 1;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 16px;
  background: #111111 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 12px;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.03em;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s;
  box-sizing: border-box;
}

.insideauto-coupon-apply-btn:hover {
  background: #333333 !important;
}

.insideauto-coupon-apply-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.insideauto-coupon-msg {
  grid-column: 1 / -1;
  grid-row: 2;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.4;
  margin-top: 7px;
}

.insideauto-coupon-msg-ok  { color: #1a7a3c; }
.insideauto-coupon-msg-error { color: #cc1f1f; }

.insideauto-discount-value { color: #1a7a3c; }

/* --- Rental agreement --- */
.insideauto-agreement-text {
  max-height: 200px;
  overflow-y: auto;
  padding: 12px 14px;
  background: #f7f7f7;
  border: 1px solid #e8e8e8;
  border-radius: 10px;
  font-size: 11px;
  line-height: 1.7;
  color: #555555;
  white-space: pre-wrap;
  margin-bottom: 12px;
}

.insideauto-agreement-placeholder {
  padding: 4px 0 10px;
}

.insideauto-agreement-placeholder .note {
  font-size: 12px;
  color: #999999;
}

.insideauto-agreement-check {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 38px;
  padding: 0 12px 0 10px;
  border-radius: 12px;
  border: 1px solid #d9d9d9;
  background: #fafafa;
  font-size: 12px;
  font-weight: 400;
  color: #444444;
  cursor: pointer;
  user-select: none;
  width: 100%;
  box-sizing: border-box;
  transition: border-color 0.15s;
  line-height: 1.35;
}

.insideauto-agreement-check:hover {
  border-color: #bbbbbb;
}

.insideauto-agreement-check input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  pointer-events: none;
}

.insideauto-agreement-switch {
  position: relative;
  flex-shrink: 0;
  width: 34px;
  height: 20px;
  border-radius: 999px;
  background: #d8d8d8;
  transition: background 0.2s ease;
}

.insideauto-agreement-switch::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
  transition: transform 0.2s ease;
}

.insideauto-agreement-check input:checked + .insideauto-agreement-switch {
  background: #ed3237;
}

.insideauto-agreement-check input:checked + .insideauto-agreement-switch::after {
  transform: translateX(14px);
}

.insideauto-agreement-check.is-error {
  border-color: #cc1f1f;
  background: #fff5f5;
}

.insideauto-field-error {
  font-size: 11px;
  font-weight: 500;
  color: #cc1f1f;
  margin-top: 6px;
}

/* ═══════════════════════════════════════════════════════════════════════
   ADMIN REDESIGN — modern dark sidebar + clean rounded cards (v2)
   Targets .admin-page, .partner-page (sidebar variant) only.
   Does NOT touch public-facing or drive (rent-a-car public) styles.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Global admin background ───────────────────────────────────────── */
body.admin-page {
  background: #eef0f4;
}

/* ── Admin shell spacing ───────────────────────────────────────────── */
.admin-page .admin-shell {
  padding: 28px 0 72px;
  gap: 24px;
}

/* ── Sidebar ───────────────────────────────────────────────────────── */
.admin-page .admin-sidebar-panel {
  border-radius: 20px;
  top: 28px;
  padding: 22px 14px 18px;
  min-height: calc(100vh - 140px);
  max-height: calc(100vh - 56px);
  overflow-y: auto;
  overscroll-behavior: contain;
  background: linear-gradient(168deg, #1c2b3a 0%, #101922 100%);
  border: 1px solid rgba(255,255,255,0.05);
  box-shadow:
    0 4px 6px rgba(0,0,0,0.06),
    0 12px 40px rgba(5, 12, 22, 0.30),
    inset 0 1px 0 rgba(255,255,255,0.06);
  gap: 20px;
}

.admin-page .admin-sidebar-panel > div:first-child {
  padding: 6px 10px 18px;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  gap: 3px;
}

.admin-page .admin-sidebar-panel h1 {
  font-size: 21px;
  font-weight: 700;
  letter-spacing: -0.3px;
  color: #f4f7fa;
  margin-bottom: 0;
}

.admin-page .admin-sidebar-panel .section-kicker {
  font-size: 9px;
  letter-spacing: 0.15em;
  color: #4d8fa8;
  margin-bottom: 4px;
}

.admin-page .admin-sidebar-panel .note {
  font-size: 11.5px;
  color: #6e8899;
}

/* Nav items */
.admin-page .admin-side-nav {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.admin-page .admin-side-nav a {
  border-radius: 11px;
  min-height: 42px;
  width: 100%;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 500;
  color: #b0c2cf;
  letter-spacing: 0.01em;
  border: 1px solid transparent;
  transition: color 0.13s, background 0.13s, border-color 0.13s, box-shadow 0.13s;
}

.admin-page .admin-side-nav a:hover {
  color: #e8f0f5;
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.08);
}

.admin-page .admin-side-nav a.active {
  color: #fff;
  font-weight: 600;
  background: linear-gradient(135deg, #0d9e97 0%, #0a6b79 100%);
  border-color: rgba(255,255,255,0.1);
  box-shadow: 0 3px 12px rgba(13, 158, 151, 0.38), inset 0 1px 0 rgba(255,255,255,0.12);
}

.admin-page .admin-sidebar-panel .sidebar-logout {
  border-radius: 11px;
  min-height: 40px;
  font-size: 13px;
  background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.1);
  color: #a0b4c2;
  transition: background 0.13s, border-color 0.13s, color 0.13s;
}

.admin-page .admin-sidebar-panel .sidebar-logout:hover {
  background: rgba(255,255,255,0.09);
  border-color: rgba(255,255,255,0.16);
  color: #d8e6ef;
}

/* ── Main area ─────────────────────────────────────────────────────── */
.admin-page .admin-main {
  gap: 18px;
  min-width: 0;
}

/* ── Titlebar ──────────────────────────────────────────────────────── */
.admin-page .admin-titlebar {
  padding: 2px 0 10px;
  border-bottom: none;
}

.admin-page .admin-titlebar h1 {
  font-size: 26px;
  font-weight: 800;
  color: #1a2736;
  letter-spacing: -0.5px;
  margin-bottom: 2px;
}

.admin-page .admin-titlebar .section-kicker {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: #0d9e97;
  margin-bottom: 4px;
}

.admin-page .admin-titlebar .link-button {
  background: #fff;
  border-color: #d0d9e2;
  color: #354454;
  border-radius: 10px;
}

/* ── Stat cards ────────────────────────────────────────────────────── */
.admin-page .stat-grid article {
  border-radius: 16px;
  padding: 18px 16px 16px;
  background: #fff;
  border: 1px solid #e4e9ef;
  box-shadow: 0 1px 3px rgba(10,20,34,0.05), 0 4px 12px rgba(10,20,34,0.05);
  position: relative;
  overflow: hidden;
  transition: box-shadow 0.15s;
}

.admin-page .stat-grid article:hover {
  box-shadow: 0 2px 6px rgba(10,20,34,0.07), 0 8px 20px rgba(10,20,34,0.08);
}

.admin-page .stat-grid article::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  border-radius: 16px 16px 0 0;
}

.admin-page .stat-grid article:nth-child(5n+1)::before { background: linear-gradient(90deg,#0d9e97,#0a6b79); }
.admin-page .stat-grid article:nth-child(5n+2)::before { background: linear-gradient(90deg,#3b82f6,#1d5bbf); }
.admin-page .stat-grid article:nth-child(5n+3)::before { background: linear-gradient(90deg,#8b5cf6,#5b21b6); }
.admin-page .stat-grid article:nth-child(5n+4)::before { background: linear-gradient(90deg,#f59e0b,#b45309); }
.admin-page .stat-grid article:nth-child(5n+5)::before { background: linear-gradient(90deg,#10b981,#047857); }

.admin-page .stat-grid span {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: #8a9bac;
  margin-bottom: 10px;
}

.admin-page .stat-grid strong {
  font-size: 24px;
  font-weight: 800;
  color: #1a2736;
  letter-spacing: -0.5px;
  line-height: 1.1;
}

/* ── Panels ────────────────────────────────────────────────────────── */
.admin-page .panel {
  border-radius: 16px;
  border: 1px solid #e4e9ef;
  background: #fff;
  box-shadow: 0 1px 3px rgba(10,20,34,0.04), 0 4px 12px rgba(10,20,34,0.04);
  padding: 22px 22px 24px;
}

.admin-page .panel-head {
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid #f0f3f7;
}

.admin-page .panel-head h2 {
  font-size: 16px;
  font-weight: 700;
  color: #1a2736;
  letter-spacing: -0.2px;
  margin: 0;
}

.admin-page .section-kicker {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.13em;
  color: #0d9e97;
}

/* ── Primary & link buttons ────────────────────────────────────────── */
.admin-page .primary-button {
  border-radius: 10px;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.01em;
  background: linear-gradient(135deg, #0d9e97 0%, #0a6b79 100%);
  border-color: transparent;
  box-shadow: 0 2px 6px rgba(13,158,151,0.28), inset 0 1px 0 rgba(255,255,255,0.14);
  transition: transform 0.12s, box-shadow 0.12s, filter 0.12s;
}

.admin-page .primary-button:hover {
  filter: brightness(1.07);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(13,158,151,0.38);
}

.admin-page .primary-button:active {
  transform: translateY(0);
  filter: brightness(0.97);
}

.admin-page .link-button {
  border-radius: 10px;
  font-weight: 500;
  font-size: 13px;
  background: #fff;
  border-color: #d0d9e2;
  color: #354454;
  transition: background 0.12s, border-color 0.12s;
}

.admin-page .link-button:hover {
  background: #f5f8fc;
  border-color: #b0bfcc;
}

.admin-page .danger-button {
  border-radius: 10px;
  font-weight: 500;
  font-size: 13px;
  min-height: 42px;
  padding: 0 14px;
  color: #b91c1c;
  background: #fff;
  border-color: rgba(185, 28, 28, 0.25);
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}

.admin-page .danger-button:hover {
  background: #fff1f1;
  border-color: rgba(185, 28, 28, 0.5);
  color: #991b1b;
}

/* Danger button (used inline via style="background:#dc2626") — add radius via specificity */
.admin-page button[style*="background:#dc2626"],
.admin-page button[style*="background: #dc2626"] {
  border-radius: 10px;
}

/* ── Inputs & selects ──────────────────────────────────────────────── */
.admin-page input,
.admin-page select,
.admin-page textarea {
  border-radius: 9px;
  border-color: #d0d9e2;
  background: #f8fafc;
  transition: border-color 0.14s, box-shadow 0.14s, background 0.14s;
}

.admin-page input:focus,
.admin-page select:focus,
.admin-page textarea:focus {
  border-color: #0d9e97;
  box-shadow: 0 0 0 3px rgba(13,158,151,0.14);
  background: #fff;
  outline: none;
}

/* ── Filter bars ───────────────────────────────────────────────────── */
.admin-page .offers-filter-bar,
.admin-page .admin-orders-filter-bar,
.admin-page .manifest-filter-bar {
  border-radius: 13px;
  border-color: #e4e9ef;
  background: linear-gradient(180deg, #fafcfd 0%, #f3f6f9 100%);
  box-shadow: 0 1px 3px rgba(10,20,34,0.04);
  padding: 16px;
}

/* ── Row cards in lists ────────────────────────────────────────────── */
.admin-page .order-admin-row,
.admin-page .offer-admin-row {
  border-radius: 13px;
  border: 1px solid #e4e9ef;
  background: #fff;
  box-shadow: 0 1px 3px rgba(10,20,34,0.04), 0 2px 8px rgba(10,20,34,0.04);
  transition: box-shadow 0.14s, border-color 0.14s;
}

.admin-page .order-admin-row:hover,
.admin-page .offer-admin-row:hover {
  border-color: #c6d2de;
  box-shadow: 0 2px 8px rgba(10,20,34,0.07), 0 8px 24px rgba(10,20,34,0.07);
}

.admin-page .offer-admin-row > img {
  border-radius: 9px;
}

/* ── Meta / codes chips ────────────────────────────────────────────── */
.admin-page .order-admin-meta span,
.admin-page .order-admin-codes span,
.admin-page .offer-admin-meta span {
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  background: #f0f4f8;
  border-color: #dde5ec;
  color: #3e5164;
}

/* ── Status pills (redesign — more vivid, fully rounded) ───────────── */
.status-pill {
  border-radius: 20px;
  border: 1px solid transparent;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
}

/* Rental-specific statuses */
.status-pill.pending {
  color: #92520d;
  background: #fff3dc;
  border-color: #f5d9a0;
}

.status-pill.confirmed {
  color: #0a6040;
  background: #d1fae5;
  border-color: #6ee7b7;
}

.status-pill.completed {
  color: #1e3a5f;
  background: #dbeafe;
  border-color: #93c5fd;
}

.status-pill.no_show {
  color: #7c3830;
  background: #fee2e2;
  border-color: #fca5a5;
}

.status-pill.cancelled,
.status-pill.refunded {
  color: #7c3830;
  background: #fee2e2;
  border-color: #fca5a5;
}

.status-pill.paid {
  color: #0a6040;
  background: #d1fae5;
  border-color: #6ee7b7;
}

.status-pill.active {
  color: #0a5a6e;
  background: #e0f2fe;
  border-color: #7dd3fc;
}

.status-pill.paused,
.status-pill.pending_payment {
  color: #92520d;
  background: #fff3dc;
  border-color: #f5d9a0;
}

/* ── Payment grid ──────────────────────────────────────────────────── */
.admin-page .order-payment-grid article {
  border-radius: 10px;
  border-color: #e4e9ef;
  background: #f7f9fc;
}

/* ── Form error panel ──────────────────────────────────────────────── */
.admin-page .form-error-panel {
  border-radius: 12px;
}

/* ── Editor sections (vehicle create / edit) ───────────────────────── */
.admin-page .editor-section-head span {
  border-radius: 9px;
  width: 30px;
  height: 30px;
}

.admin-page .gallery-admin-grid article {
  border-radius: 12px;
  border-color: #e4e9ef;
  background: #fafcfd;
}

/* ── Weekday picker ────────────────────────────────────────────────── */
.admin-page .weekday-picker label {
  border-radius: 10px;
  border-color: #dde5ec;
}

.admin-page .weekday-picker label:has(input:checked) {
  border-color: #0d9e97;
  background: linear-gradient(180deg, #e6f7f7 0%, #d8f2f1 100%);
  box-shadow: inset 0 0 0 1px #0d9e97;
}

/* ── Time presets ──────────────────────────────────────────────────── */
.admin-page .time-presets button {
  border-radius: 7px;
}

.admin-page .time-presets button.active,
.admin-page .time-presets button:hover {
  border-color: #0d9e97;
  color: #0d9e97;
  background: #e6f7f7;
}

/* ── Sticky form actions ───────────────────────────────────────────── */
.admin-page .sticky-form-actions {
  border-top-color: #e4e9ef;
  background: #f5f8fb;
  border-radius: 0 0 16px 16px;
}

/* ── Admin detail stats ────────────────────────────────────────────── */
.admin-page .order-payment-panel {
  margin-top: 0;
}

/* ── Booking service rows ──────────────────────────────────────────── */
.admin-page .booking-service-row {
  border-radius: 10px;
  border-color: #e4e9ef;
}

/* ── Reservation cards ─────────────────────────────────────────────── */
.admin-page .reservation-card {
  border-radius: 12px;
  border-color: #e4e9ef;
  background: #fff;
}

/* ── Table actions bar ─────────────────────────────────────────────── */
.admin-page .table-actions {
  gap: 8px;
}

/* ── Activity log pill ─────────────────────────────────────────────── */
.activity-log-item .status-pill {
  border-radius: 20px;
}

/* ── Fleet calendar cells ──────────────────────────────────────────── */
.admin-page .fleet-cell-booked { border-radius: 4px; }
.admin-page .fleet-cell-pending { border-radius: 4px; }
.admin-page .fleet-cell-blackout { border-radius: 4px; }

/* ── Two-column gap ────────────────────────────────────────────────── */
.admin-page .admin-two-column {
  gap: 18px;
}

/* Dashboard recent activity: compact rows with plain metadata. */
.admin-page .dashboard-recent-panel {
  padding-bottom: 8px;
}

.admin-page .dashboard-recent-list {
  gap: 0;
  border-top: 1px solid #e5eaf0;
}

.admin-page .dashboard-recent-row,
.admin-page .dashboard-recent-row:hover {
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 15px 2px;
  border: 0;
  border-bottom: 1px solid #e5eaf0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.admin-page .dashboard-recent-row:hover {
  background: #f7f9fb;
}

.admin-page .dashboard-recent-titleline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 5px;
}

.admin-page .dashboard-recent-titleline .section-kicker,
.admin-page .dashboard-recent-titleline h2 {
  margin: 0;
}

.admin-page .dashboard-recent-titleline .status-pill {
  min-height: 0;
  padding: 2px 0 2px 7px;
  border: 0;
  border-left: 2px solid currentColor;
  border-radius: 0;
  background: transparent;
  line-height: 1.2;
}

.admin-page .dashboard-recent-row .order-admin-meta,
.admin-page .dashboard-recent-row .offer-admin-meta {
  gap: 0;
  color: #526171;
}

.admin-page .dashboard-recent-row .order-admin-meta span,
.admin-page .dashboard-recent-row .offer-admin-meta span {
  min-height: 0;
  padding: 0 9px;
  border: 0;
  border-right: 1px solid #d7dfe7;
  border-radius: 0;
  background: transparent;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
}

.admin-page .dashboard-recent-row .order-admin-meta span:first-child,
.admin-page .dashboard-recent-row .offer-admin-meta span:first-child {
  padding-left: 0;
}

.admin-page .dashboard-recent-row .order-admin-meta span:last-child,
.admin-page .dashboard-recent-row .offer-admin-meta span:last-child {
  border-right: 0;
}

.admin-page .dashboard-vehicle-row {
  grid-template-columns: 72px minmax(0, 1fr) auto;
}

.admin-page .dashboard-vehicle-row > img {
  width: 72px;
  height: 54px;
  border-radius: 3px;
}

@media (max-width: 640px) {
  .admin-page .dashboard-recent-row {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .admin-page .dashboard-vehicle-row {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .admin-page .dashboard-vehicle-row > img {
    width: 64px;
    height: 48px;
  }

  .admin-page .dashboard-vehicle-row .offer-admin-actions {
    grid-column: 1 / -1;
  }

  .admin-page .dashboard-recent-row .order-admin-actions,
  .admin-page .dashboard-recent-row .offer-admin-actions {
    justify-content: flex-start;
  }
}

/* iOS does not expose a native PWA install prompt, so show a compact guide. */
.pwa-install-prompt[hidden] {
  display: none;
}

.pwa-install-prompt {
  position: fixed;
  left: 20px;
  bottom: 20px;
  z-index: 119;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 32px;
  align-items: center;
  gap: 12px;
  width: min(410px, calc(100vw - 40px));
  padding: 14px;
  border: 1px solid #dfe4e9;
  border-left: 4px solid #ef3340;
  border-radius: 6px;
  background: #ffffff;
  box-shadow: 0 18px 48px rgba(17, 24, 32, 0.2);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 180ms ease, transform 180ms ease;
}

.pwa-install-prompt.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.pwa-install-prompt > img {
  width: 48px;
  height: 48px;
  border-radius: 6px;
}

.pwa-install-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.pwa-install-copy strong {
  color: #111820;
  font-size: 15px;
  line-height: 1.25;
}

.pwa-install-copy span {
  color: #5f6c79;
  font-size: 13px;
  line-height: 1.35;
}

.pwa-install-prompt > button {
  align-self: start;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #536170;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}

@media (max-width: 640px) {
  .pwa-install-prompt {
    right: 12px;
    bottom: 88px;
    left: 12px;
    width: auto;
  }
}

/* ── Note text ─────────────────────────────────────────────────────── */
.admin-page .note {
  color: #7a8fa0;
  font-size: 12.5px;
}

/* ── Admin h2 ──────────────────────────────────────────────────────── */
.admin-page h2 {
  color: #1a2736;
}

/* ── Segmented control ─────────────────────────────────────────────── */
.admin-page .segmented-control {
  border-radius: 10px;
  border-color: #dde5ec;
}

/* ═══════════════════════════════════════════════════════════════════════
   MOBILE HAMBURGER SIDEBAR
   ═══════════════════════════════════════════════════════════════════════ */

.admin-mobile-topbar {
  display: none;
}

.admin-sidebar-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(10, 20, 34, 0.48);
  backdrop-filter: blur(3px);
  z-index: 119;
  opacity: 0;
  transition: opacity 0.25s ease;
}

.admin-sidebar-backdrop.is-visible {
  opacity: 1;
}

.topbar-hamburger {
  display: none;
  flex-shrink: 0;
}

@media (max-width: 860px) {
  .topbar-hamburger {
    display: flex;
    margin-left: 12px;
  }

  /* Keep admin/partner topbar as a single flex row on small screens */
  .admin-page .topbar-inner,
  .partner-page .topbar-inner {
    display: flex;
    flex-wrap: nowrap;
    padding: 0;
    gap: 10px;
  }

  .admin-page .topbar-inner .nav,
  .partner-page .topbar-inner .nav {
    flex: 1;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 8px;
  }
}

/* Rental admin list: quiet, column-based reservation rows. */
.admin-page .rentals-titlebar {
  align-items: flex-end;
}

.admin-page .rentals-title-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

.admin-page .rentals-filter-panel,
.admin-page .rentals-export-panel {
  padding: 18px 20px;
  border: 1px solid #dfe5ea;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 4px 14px rgba(15, 26, 34, 0.045);
}

.admin-page .rentals-tool-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
  padding-bottom: 13px;
  border-bottom: 1px solid #e7ebef;
}

.admin-page .rentals-tool-head .section-kicker { margin-bottom: 3px; }
.admin-page .rentals-tool-head h2 { margin: 0; font-size: 18px; }

.admin-page .rentals-reset-link {
  color: #667786;
  font-size: 12px;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.admin-page .rentals-filter-grid {
  display: grid;
  grid-template-columns: minmax(260px, 1.6fr) minmax(210px, 1.2fr) minmax(145px, .8fr) minmax(155px, .85fr) auto;
  gap: 12px;
  align-items: end;
}

.admin-page .rentals-filter-grid label,
.admin-page .rentals-export-panel label {
  min-width: 0;
}

.admin-page .rentals-filter-grid input,
.admin-page .rentals-filter-grid select,
.admin-page .rentals-export-panel input,
.admin-page .rentals-export-panel select {
  width: 100%;
}

.admin-page .rentals-export-panel {
  padding-top: 14px;
  padding-bottom: 14px;
  background: #f8fafb;
}

.admin-page .rentals-export-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 13px;
  padding-bottom: 11px;
  border-bottom: 1px solid #e1e7eb;
}

.admin-page .rentals-export-head .section-kicker { margin: 0 0 2px; }
.admin-page .rentals-export-head h2 { margin: 0; color: #23313e; font-size: 16px; }
.admin-page .rentals-export-head > span { color: #71808e; font-size: 11px; }

.admin-page .rentals-export-grid {
  display: grid;
  grid-template-columns: minmax(155px, .85fr) minmax(155px, .85fr) minmax(220px, 1.25fr) minmax(145px, .75fr) minmax(155px, .8fr) 126px;
  gap: 12px;
  align-items: end;
}

.admin-page .rentals-export-button {
  width: 126px;
  white-space: nowrap;
}

.admin-page .rentals-list-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin: 24px 0 10px;
  padding: 0 2px;
}

.admin-page .rentals-list-head div > span,
.admin-page .rentals-list-head div > strong { display: block; }
.admin-page .rentals-list-head .section-kicker { margin: 0 0 2px; }
.admin-page .rentals-list-head strong { color: #23313e; font-size: 15px; }
.admin-page .rentals-list-head > span { color: #8493a1; font-size: 11px; }

.admin-page .order-admin-list {
  gap: 12px;
}

.admin-page .order-admin-row {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  padding: 18px 20px;
  border: 1px solid #dfe5ea;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 5px 16px rgba(15, 26, 34, 0.055);
  transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.admin-page .order-admin-row:hover,
.admin-page .order-admin-row:focus-within {
  border-color: #c9d7df;
  background: #f6fafb;
  box-shadow: 0 7px 20px rgba(15, 26, 34, 0.075);
}

.admin-page .rental-admin-action-button {
  max-width: 100%;
  justify-self: start;
}

.admin-page .rental-refund-fields {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.admin-page .rental-refund-actions {
  margin-top: 14px;
}

.admin-page .rental-refund-button {
  background: #dc2626;
  box-shadow: 0 2px 6px rgba(220, 38, 38, 0.24);
}

.admin-page .rental-refund-button:hover {
  background: #bd1e1e;
}

.admin-page .order-admin-main {
  gap: 15px;
}

.admin-page .order-admin-idline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  margin-bottom: 5px;
}

.admin-page .order-admin-idline .section-kicker {
  margin: 0;
  color: #152331;
  font-size: 12px;
  letter-spacing: 0;
}

.admin-page .order-status-label {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  padding-left: 8px;
  border-left: 2px solid #8a99a7;
  color: #657483;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  text-transform: uppercase;
}

.admin-page .order-status-label.pending { border-color: #c7800a; color: #9a6206; }
.admin-page .order-status-label.confirmed { border-color: #0a938c; color: #08756f; }
.admin-page .order-status-label.completed { border-color: #2670c9; color: #205fa9; }
.admin-page .order-status-label.cancelled,
.admin-page .order-status-label.no_show,
.admin-page .order-status-label.refunded { border-color: #c75249; color: #a64139; }

.admin-page .order-admin-meta {
  display: grid;
  grid-template-columns: minmax(165px, 1.35fr) repeat(5, minmax(105px, 1fr));
  gap: 0;
  margin: 0;
  padding-top: 12px;
  border-top: 1px solid #e7ebef;
}

.admin-page .order-admin-meta .order-admin-meta-item {
  min-width: 0;
  min-height: 54px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 3px;
  padding: 0 13px;
  border: 0;
  border-right: 1px solid #e7ebef;
  border-radius: 0;
  color: #23313e;
  background: transparent;
  font-size: 12px;
}

.admin-page .order-admin-meta .order-admin-meta-item:first-child { padding-left: 0; }
.admin-page .order-admin-meta .order-admin-meta-item:last-child { padding-right: 0; border-right: 0; }

.admin-page .order-admin-meta-item small {
  color: #8493a1;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: uppercase;
}

.admin-page .order-admin-meta-item strong {
  overflow-wrap: anywhere;
  color: #23313e;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
}

.admin-page .order-admin-meta-item em {
  color: #71808e;
  font-size: 10.5px;
  font-style: normal;
  line-height: 1.25;
}

.admin-page .order-admin-payment.pending strong,
.admin-page .order-admin-payment.pending_payment strong { color: #9a6206; }
.admin-page .order-admin-payment.paid strong { color: #08756f; }
.admin-page .order-admin-payment.failed strong,
.admin-page .order-admin-payment.refunded strong { color: #a64139; }

@media (max-width: 1180px) {
  .admin-page .rentals-filter-grid,
  .admin-page .rentals-export-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .admin-page .order-admin-meta {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .admin-page .order-admin-meta .order-admin-meta-item {
    padding: 10px 12px;
    border-right: 0;
    border-bottom: 1px solid #e7ebef;
  }

  .admin-page .order-admin-meta .order-admin-meta-item:nth-last-child(-n + 3) { border-bottom: 0; }
  .admin-page .order-admin-meta .order-admin-meta-item:first-child { padding-left: 12px; }
  .admin-page .order-admin-meta .order-admin-meta-item:last-child { padding-right: 12px; }
}

@media (max-width: 700px) {
  .admin-page .rentals-titlebar,
  .admin-page .rentals-tool-head,
  .admin-page .rentals-export-head,
  .admin-page .rentals-list-head {
    align-items: stretch;
  }

  .admin-page .rentals-title-actions,
  .admin-page .rentals-tool-head,
  .admin-page .rentals-export-head,
  .admin-page .rentals-list-head {
    width: 100%;
  }

  .admin-page .rentals-title-actions > *,
  .admin-page .rentals-filter-grid > *,
  .admin-page .rentals-export-grid > * { width: 100%; }

  .admin-page .rentals-filter-grid,
  .admin-page .rentals-export-grid {
    grid-template-columns: 1fr;
  }

  .admin-page .rentals-filter-panel,
  .admin-page .rentals-export-panel { padding: 16px; }

  .admin-page .order-admin-row {
    grid-template-columns: 1fr;
    padding: 16px;
  }

  .admin-page .order-admin-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-page .order-admin-meta .order-admin-meta-item:nth-last-child(-n + 3) { border-bottom: 1px solid #e7ebef; }
  .admin-page .order-admin-meta .order-admin-meta-item:nth-last-child(-n + 2) { border-bottom: 0; }
  .admin-page .order-admin-actions,
  .admin-page .order-admin-actions .link-button { width: 100%; }
  .admin-page .rental-admin-action-button { width: 100%; }

  /* Rental detail: keep every operation readable inside the mobile viewport. */
  .admin-page .admin-detail-page,
  .admin-page .admin-detail-shell,
  .admin-page .admin-detail-page .admin-main,
  .admin-page .admin-detail-page .order-admin-layout,
  .admin-page .admin-detail-page .panel,
  .admin-page .admin-detail-page form,
  .admin-page .admin-detail-page form > *,
  .admin-page .admin-detail-page label {
    min-width: 0;
    max-width: 100%;
  }

  .admin-page .admin-detail-page .admin-main {
    padding: 12px 12px 42px;
  }

  .admin-page .admin-detail-page .admin-titlebar {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    padding-inline: 2px;
  }

  .admin-page .admin-detail-page .admin-titlebar .table-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 7px;
  }

  .admin-page .admin-detail-page .admin-titlebar .table-actions .link-button,
  .admin-page .admin-detail-page .admin-titlebar .table-actions .primary-button {
    width: 100%;
    min-width: 0;
    padding-inline: 10px;
    text-align: center;
    white-space: normal;
  }

  .admin-page .admin-detail-page .panel {
    padding: 18px 16px 20px;
    border-radius: 12px;
  }

  .admin-page .admin-detail-page .panel-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    align-items: start;
  }

  .admin-page .admin-detail-page .panel-head > *,
  .admin-page .admin-detail-page .panel-head .table-actions {
    min-width: 0;
    width: 100%;
  }

  .admin-page .admin-detail-page .panel-head h2 {
    overflow-wrap: anywhere;
    font-size: 17px;
    line-height: 1.35;
  }

  .admin-page .admin-detail-page .panel-head .table-actions .link-button {
    width: 100%;
    justify-content: center;
    white-space: normal;
  }

  .admin-page .admin-detail-page .order-info-grid,
  .admin-page .admin-detail-page .order-update-form,
  .admin-page .admin-detail-page .agreement-field-row,
  .admin-page .admin-detail-page .agreement-option-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .admin-page .admin-detail-page .order-update-form .span-2 {
    grid-column: 1;
  }

  .admin-page .admin-detail-page input,
  .admin-page .admin-detail-page select,
  .admin-page .admin-detail-page textarea,
  .admin-page .admin-detail-page button {
    max-width: 100%;
  }

  .admin-page .admin-detail-page .note,
  .admin-page .admin-detail-page p,
  .admin-page .admin-detail-page td,
  .admin-page .admin-detail-page strong {
    overflow-wrap: anywhere;
  }

  .admin-page .rental-billing-panel .responsive-table-wrap {
    padding: 4px 14px 8px;
    border: 1px solid #edf1f4;
    border-radius: 8px;
    background: #fafcfd;
    box-shadow: none;
  }

  .admin-page .rental-billing-panel .stacked-table tr {
    padding: 8px 0;
  }

  .admin-page .rental-agreement-panel .order-update-form {
    gap: 14px;
  }

  .admin-page .rental-agreement-panel .agreement-field-row {
    gap: 14px !important;
  }

  .admin-page .rental-agreement-panel .weekday-picker label {
    min-height: auto;
  }

  .admin-page .rental-refund-fields {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }

  .admin-page .rental-refund-fields label,
  .admin-page .rental-refund-fields input,
  .admin-page .rental-refund-fields select {
    width: 100%;
    min-width: 0;
  }

  .admin-page .rental-refund-actions,
  .admin-page .rental-refund-actions .rental-refund-button {
    width: 100%;
  }

  .admin-page .rental-refund-button {
    min-height: 48px;
    padding: 12px 14px;
    white-space: normal;
    line-height: 1.35;
    text-align: center;
  }
}

.admin-hamburger {
  display: flex;
  flex-direction: column;
  gap: 5px;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 9px 10px;
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 10px;
  background: rgba(255,255,255,0.08);
  cursor: pointer;
  transition: background 0.15s;
}

.admin-hamburger.topbar-hamburger {
  display: none;
}

.admin-hamburger:hover {
  background: rgba(255,255,255,0.15);
}

.admin-hamburger span {
  display: block;
  height: 2px;
  border-radius: 2px;
  background: #fff;
  transition: transform 0.22s ease, opacity 0.22s ease;
}

/* Animate to X when open */
.admin-sidebar-panel.is-open ~ * .admin-hamburger span:nth-child(1),
[aria-expanded="true"].admin-hamburger span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
[aria-expanded="true"].admin-hamburger span:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}
[aria-expanded="true"].admin-hamburger span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

@media (max-width: 860px) {
  .admin-hamburger.topbar-hamburger {
    display: flex;
  }

  /* Show mobile topbar, hide desktop sidebar in grid */
  .admin-page .admin-shell {
    grid-template-columns: 1fr;
    padding-top: 0;
    gap: 0;
  }

  .admin-mobile-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px;
    height: 56px;
    background: linear-gradient(135deg, #1c2b3a 0%, #101922 100%);
    position: sticky;
    top: 0;
    z-index: 120;
    box-shadow: 0 2px 12px rgba(5,12,22,0.28);
  }

  .admin-mobile-brand {
    font-size: 15px;
    font-weight: 700;
    color: #f0f5f9;
    letter-spacing: -0.2px;
  }

  .admin-sidebar-backdrop {
    display: block;
    pointer-events: none;
  }

  .admin-sidebar-backdrop.is-visible {
    pointer-events: auto;
  }

  /* Sidebar becomes a fixed drawer */
  .admin-page .admin-sidebar-panel {
    position: fixed !important;
    top: 0;
    left: 0;
    bottom: 0;
    width: 280px;
    border-radius: 0 20px 20px 0;
    z-index: 130;
    transform: translateX(-100%);
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    min-height: 100dvh;
    overflow-y: auto;
  }

  .admin-page .admin-sidebar-panel.is-open {
    transform: translateX(0);
  }

  .admin-page .admin-main {
    padding: 16px 16px 48px;
  }

  .admin-page .admin-titlebar h1 {
    font-size: 20px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   FLEET CALENDAR  — Gantt bar design
   ═══════════════════════════════════════════════════════════════════════ */

/* Override global admin-page table rules for the fleet calendar table */
.fc-table th {
  background: #f8fafc;
  color: #8a9bac;
  padding: 0;
  letter-spacing: 0;
  border-right: none;
}

.fc-table td {
  padding: 0;
  border-bottom: none;
}

.admin-page .fc-table tr:hover td,
.admin-page .fc-table tr:hover td:first-child {
  background: transparent;
}

/* Month nav */
.fc-nav-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12.5px;
  padding: 0 12px;
  min-height: 34px;
  border-radius: 9px;
}

.fc-today-btn {
  font-weight: 600;
}

.fc-month-label {
  font-size: 16px;
  font-weight: 700;
  color: #1a2736;
  letter-spacing: -0.2px;
  white-space: nowrap;
  align-self: center;
}

/* ── Category filter ── */
.admin-page .fc-filter-panel {
  display: flex;
  align-items: end;
  gap: 12px;
  padding: 14px 18px;
  border: 1px solid #dfe5ea;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 4px 14px rgba(15, 26, 34, 0.045);
  /* The shared `.panel` base sets `overflow-x: auto`, which browsers also clip
     overflow-y with by default — that silently hid the category popover below,
     since it renders as an absolutely-positioned child meant to escape this box. */
  overflow: visible;
  /* And a stacking context above the calendar, so the popover opens over it. The calendar's
     sticky vehicle column is positioned at z-index 20; the popover carried 20 as well, and on a
     tie the later element in the document wins — which is the calendar. Raising the whole panel
     rather than the popover alone means anything else added here is covered too. */
  position: relative;
  z-index: 60;
}

.admin-page .fc-filter-panel label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 220px;
}

.admin-page .fc-filter-panel label span {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #8a9bac;
}

/* Multi-select category popover — a <details>/<summary> checkbox list so several
   categories (e.g. Economy + Scooter) can be picked in one go without needing
   ctrl/cmd-click on a native <select multiple>, which most admins never discover. */
.admin-page .fc-category-multiselect {
  position: relative;
}

.admin-page .fc-category-multiselect summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid #d3dde4;
  background: #fff;
  color: #17323f;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
  user-select: none;
}

.admin-page .fc-category-multiselect summary::-webkit-details-marker {
  display: none;
}

.admin-page .fc-category-multiselect summary::after {
  content: '';
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  border-right: 2px solid #8a9bac;
  border-bottom: 2px solid #8a9bac;
  transform: rotate(45deg);
  margin-top: -4px;
}

.admin-page .fc-category-multiselect[open] summary::after {
  margin-top: 2px;
  transform: rotate(-135deg);
}

.admin-page .fc-category-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  z-index: 20;
  min-width: 230px;
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 10px;
  border: 1px solid #dfe5ea;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(15, 26, 34, 0.16);
}

.admin-page .fc-category-option {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 9px;
  min-width: 0 !important;
  padding: 7px 6px;
  font-size: 13px;
  font-weight: 500;
  color: #263746;
  text-transform: none;
  letter-spacing: normal;
  cursor: pointer;
}

.admin-page .fc-category-option:hover {
  background: #f4f7fb;
}

/* Beats the generic `.fc-filter-panel label span` uppercase/small-caps rule, which would
   otherwise also catch these nested checkbox labels. */
.admin-page .fc-category-menu .fc-category-option span {
  font-size: 13px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: normal;
  color: #263746;
}

.admin-page .fc-category-option input {
  width: auto;
  min-height: 0;
  margin: 0;
}

.admin-page .fc-category-apply {
  margin-top: 6px;
  min-height: 38px;
  width: 100%;
  justify-content: center;
}

/* ── Summary strip ── */
.fc-summary-strip {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.fc-summary-item {
  flex: 1 1 110px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 14px 16px 12px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid #e4e9ef;
  box-shadow: 0 1px 3px rgba(10,20,34,0.04);
}

.fc-summary-item span {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #8a9bac;
}

.fc-summary-item strong {
  font-size: 22px;
  font-weight: 800;
  color: #1a2736;
  letter-spacing: -0.4px;
  line-height: 1.1;
}

.fc-confirmed { color: #059669; }
.fc-pending   { color: #d97706; }
.fc-blocked   { color: #64748b; }
.fc-occ       { color: #6366f1; }

/* Occupancy progress bar inside summary card */
.fc-occ-progress {
  margin-top: 6px;
  height: 4px;
  border-radius: 4px;
  background: #eef0f5;
  overflow: hidden;
}

.fc-occ-fill {
  height: 100%;
  border-radius: 4px;
  background: linear-gradient(90deg, #6366f1, #818cf8);
  transition: width 0.4s ease;
}

/* ── Calendar container ── */
.fc-wrap {
  padding: 0;
  overflow: hidden;
}

.fc-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* ── Table ── */
.fc-table {
  width: 100%;
  min-width: var(--fc-calendar-width, 1344px);
  /* `separate`, not `collapse`, and this is the whole reason the vehicle column kept being
     drawn over. Under `collapse` the cell borders belong to the *table*, not to the cells, and
     they paint in a layer above a `position: sticky` cell — so scrolling sideways slid the day
     grid lines, and the bars sitting between them, straight across the vehicle name. No z-index
     could win that, because the contest was never between the cells. `separate` gives every
     cell its own borders and lets the sticky one cover what passes beneath it.
     border-spacing must be 0 or every cell gains a gap. */
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

/* ── Header ── */
.fc-th-vehicle {
  width: 210px;
  min-width: 210px;
  max-width: 210px;
  padding: 11px 16px;
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8a9bac;
  background: #f8fafc;
  border-bottom: 2px solid #e8ecf0;
  position: sticky;
  left: 0;
  z-index: 5;
  white-space: nowrap;
}

.fc-th-day {
  width: 40px;
  min-width: 40px;
  max-width: 40px;
  padding: 8px 2px 6px;
  text-align: center;
  background: #f8fafc;
  border-bottom: 2px solid #e8ecf0;
  border-left: 1px solid #edf0f4;
}

.fc-th-day.fc-weekend {
  background: #f3f4f7;
}

.fc-th-day.fc-today-col {
  background: linear-gradient(180deg, #e8f8f7 0%, #d8f4f2 100%);
  border-bottom-color: #0d9e97;
}

/* Marks the Monday of each ISO week so a long horizontal scan of many days has a
   visual anchor every 7 columns, independent of which weekday the month starts on. */
.fc-th-day.fc-week-start {
  border-left: 2px solid #d3dbe3;
}

.fc-th-occ-col {
  width: 80px;
  min-width: 70px;
  padding: 11px 12px;
  text-align: center;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8a9bac;
  background: #f8fafc;
  border-bottom: 2px solid #e8ecf0;
  border-left: 2px solid #e8ecf0;
  white-space: nowrap;
}

.fc-weekday-label {
  display: block;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #b0bbc8;
  margin-bottom: 3px;
}

.fc-day-num {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: #4a5568;
  line-height: 1;
}

.fc-today-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #0d9e97;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}

/* ── Rows ── */
/* One solid, unconditional white for the vehicle column in every state, and `!important` so
   nothing can water it down. The tinted variants — #f4f7fb on hover, #fbfcfe on an alternate
   row — are what let the booking bars show through beneath it: proved by painting the column
   red, which covered them completely in exactly the situation the tints did not. The row
   striping and hover highlight still read from the day cells; the column simply stays opaque,
   which is the one job it has. */
.fc-td-vehicle,
.fc-row-alt .fc-td-vehicle,
.fc-row:hover .fc-td-vehicle {
  background: #fff !important;
  box-shadow: -24px 0 0 0 #fff !important;
}

.fc-row:hover .fc-cell {
  background-color: rgba(0,0,0,0.01);
}

/* The booking bars genuinely scroll *underneath* this column — that is how a sticky column
   works — so the only thing keeping the vehicle name readable is this cell's own paint. Two
   things make that reliable: a decisive z-index, and a box-shadow that extends the same colour
   past the left edge so a sub-pixel seam has nothing to show through. Without them a bar leaks
   over the name, which is what happens on a hovered row. */
.fc-td-vehicle {
  position: sticky;
  left: 0;
  /* Well clear of anything inside the scrolling area (the handover dot is the highest at 3).
     It was 6, which left far too little daylight for a defence this calendar has needed
     three times. */
  z-index: 20;
  background: #fff;
  box-shadow: -24px 0 0 0 #fff;
  padding: 10px 14px;
  border-bottom: 1px solid #edf0f4;
  border-right: 2px solid #e8ecf0;
  width: 210px;
  min-width: 210px;
  max-width: 210px;
  transition: background 0.12s;
}

.fc-vehicle-link {
  display: block;
  text-decoration: none;
}

.fc-vehicle-link strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: #1a2736;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 190px;
  transition: color 0.12s;
}

.fc-vehicle-link:hover strong {
  color: #0d9e97;
}

.fc-vehicle-link span {
  display: block;
  font-size: 11px;
  color: #8a9bac;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 190px;
  margin-top: 1px;
}

/* ── Cells ── */
.admin-page .fc-cell {
  width: 40px;
  min-width: 40px;
  max-width: 40px;
  height: 54px !important;
  padding: 11px 0 !important;
  border-bottom: 1px solid #edf0f4 !important;
  border-left: 1px solid #edf0f4 !important;
  border-right: none !important;
  vertical-align: top !important;
  position: relative;
  overflow: hidden;
  background: transparent !important;
}

.admin-page .fc-cell.fc-cell-weekend {
  background: #f9fafb !important;
}

.admin-page .fc-cell.fc-cell-today {
  background: rgba(13, 158, 151, 0.06) !important;
  box-shadow: inset 2px 0 0 rgba(13,158,151,0.4), inset -2px 0 0 rgba(13,158,151,0.4);
}

.admin-page .fc-cell.fc-cell-week-start {
  border-left: 2px solid #d3dbe3 !important;
}

/* ── Gantt bars — in-flow display:block, cross-browser safe ── */
.fc-bar {
  display: flex !important;
  align-items: center;
  justify-content: center;
  height: 32px !important;
  width: 100% !important;
  border-radius: 0 !important;
  margin: 0 !important;
  /* No transition, for the same reason no bar may carry a `filter`: while a property is
     animating the browser promotes the element to its own compositing layer, and on a
     horizontally scrolled table that layer paints above the sticky vehicle column. Only the
     hovered row leaked, because only its bars were mid-transition — which is exactly what it
     looked like. The hover colour change is instant now. */
}

.fc-bar-rental-id {
  display: block;
  max-width: 100%;
  overflow: hidden;
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.2px;
  text-align: center;
  text-overflow: clip;
  white-space: nowrap;
  pointer-events: none;
}

/* Row hover, without a filter. This one was the leak: applied to every bar in the hovered row,
   it made each its own compositing layer and painted the lot over the sticky vehicle column —
   which is why only the row under the cursor was ever affected. Same lift, from the gradient. */
.fc-row:hover .fc-bar-booked {
  background: linear-gradient(90deg, #0a978f 0%, #13c1b9 100%) !important;
}

.fc-row:hover .fc-bar-pending {
  background: linear-gradient(90deg, #cf850b 0%, #fbaf2f 100%) !important;
}

.fc-reservation-link {
  position: absolute;
  inset: 0;
  /* Deliberately no z-index. A positioned element with one joins the same painting layer the
     sticky vehicle column sits in and is then ordered against it, which is how a hovered row's
     bars — and the day grid lines behind them — ended up drawn over the vehicle name once the
     calendar was scrolled sideways. With `auto` the link paints in the layer below every
     positioned element that does have a z-index, so the column always wins. It still covers its
     own cell and stays clickable: it is absolutely positioned inside that cell either way. */
  display: block;
  padding: 9px 0;
  cursor: pointer;
  text-decoration: none;
}

/* Lighter gradients rather than filter: brightness(). A filter makes the bar its own stacking
   context and, on a scrolling table, its own compositing layer — which is how a bar ended up
   painted over the sticky vehicle column even though that column outranks it. */
.fc-reservation-link:hover .fc-bar-booked,
.fc-reservation-link:focus-visible .fc-bar-booked {
  background: linear-gradient(90deg, #0ba49d 0%, #18ccc3 100%) !important;
}

.fc-reservation-link:hover .fc-bar-pending,
.fc-reservation-link:focus-visible .fc-bar-pending {
  background: linear-gradient(90deg, #d98c0c 0%, #ffb43a 100%) !important;
}

.fc-reservation-link:focus-visible {
  outline: 2px solid #0d9e97;
  outline-offset: -2px;
}

/* Start: left indent + left rounding */
.fc-bar-s {
  width: auto !important;
  margin-left: 4px !important;
  border-radius: 7px 0 0 7px !important;
}

/* End: right indent + right rounding */
.fc-bar-e {
  width: calc(100% - 4px) !important;
  border-radius: 0 7px 7px 0 !important;
}

/* Single-day pill: both sides indented */
.fc-bar-s.fc-bar-e {
  margin-left: 5px !important;
  width: calc(100% - 10px) !important;
  border-radius: 7px !important;
}

/* Bar colours */
.fc-bar-booked {
  background: linear-gradient(90deg, #0a8f89 0%, #0fb8b0 100%) !important;
  box-shadow: 0 2px 4px rgba(13,158,151,0.3);
}

.fc-bar-pending {
  background: linear-gradient(90deg, #c47d0a 0%, #f5a623 100%) !important;
  box-shadow: 0 2px 4px rgba(245,166,35,0.3);
}

.fc-bar-blackout {
  background: repeating-linear-gradient(
    -45deg,
    #dde3ea 0px,
    #dde3ea 5px,
    #eaecf0 5px,
    #eaecf0 10px
  ) !important;
  border-top: 1px solid #c8cdd5;
  border-bottom: 1px solid #c8cdd5;
}

.fc-bar-blackout.fc-bar-s {
  border-left: 1px solid #c8cdd5;
}

.fc-bar-blackout.fc-bar-e {
  border-right: 1px solid #c8cdd5;
}

/* ── Split cell: more than one reservation touches this vehicle/day (same-day
   turnover) ── Two stacked halves plus a small handover marker pinned to the
   seam between them, so a same-day turnover reads unmistakably as "two things
   meeting here" instead of looking like one continuous bar at a glance.
   The flex layout lives on an inner wrapper, not the <td> itself — forcing
   display:flex directly on a table cell doubled the whole row's height in
   testing (the browser stops treating it as a table-cell for row sizing). */
.admin-page .fc-cell.fc-cell-split {
  padding: 5px 3px !important;
}

.fc-split-inner {
  display: flex;
  flex-direction: column;
  gap: 3px;
  height: 100%;
}

.fc-reservation-link-split {
  position: relative !important;
  inset: auto !important;
  flex: 1 1 0 !important;
  display: block !important;
  padding: 0 !important;
  min-height: 0;
}

.fc-bar-split {
  height: 100% !important;
  width: 100% !important;
  border-radius: 3px !important;
  margin: 0 !important;
}

.fc-bar-split .fc-bar-rental-id {
  font-size: 8px;
}

/* Upper half: the reservation ending/returning today — rounded only on top. */
.fc-reservation-link-split:first-child .fc-bar-split {
  border-radius: 6px 6px 3px 3px !important;
}

/* Lower half: the reservation starting/picked-up today — rounded only on bottom. */
.fc-reservation-link-split:last-child .fc-bar-split {
  border-radius: 3px 3px 6px 6px !important;
}

/* A returning vehicle is slightly muted (it's leaving); the new pickup stays full
   strength — a subtle but immediate visual cue for which half is which, on top of
   the "Враќање"/"Подигање" wording already in the tooltip. */
/* Muted straight in the gradient rather than through a filter, for the same reason as the hover
   above: a filter on a bar lifts it out of the table's paint order. This one is permanent, so it
   would leak on any day with a handover. */
.fc-bar-split-out.fc-bar-booked {
  background: linear-gradient(90deg, #4f9d98 0%, #62bdb8 100%) !important;
}

.fc-bar-split-out.fc-bar-pending {
  background: linear-gradient(90deg, #c2924a 0%, #e0b072 100%) !important;
}

.fc-bar-split-in {
  box-shadow: 0 0 0 1px rgba(255,255,255,0.5) inset;
}

/* The handover marker itself: a small ringed dot sitting exactly on the seam
   between the two stacked halves. Deliberately a neutral ink colour, not teal or
   amber, so it never gets mistaken for a booked/pending status. */
.admin-page .fc-cell.fc-cell-split::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #1a2736;
  box-shadow: 0 1px 3px rgba(10,20,34,0.35);
  z-index: 3;
  pointer-events: none;
}

/* ── Half day ── The car is back before the afternoon (15:00 by default, see
   cp_rental_calendar_half_day_hour()), so its last calendar day is taken until lunchtime and free
   after it. The bar stops at the middle of the cell and fades toward that edge; the half it leaves
   behind is simply the cell background, which is exactly what a free day already looks like.

   These carry their own hover/focus rules rather than relying on source order: `.fc-row:hover
   .fc-bar-booked` is (0,3,0) and would otherwise outrank a plain `.fc-bar-booked.fc-bar-half` at
   (0,2,0) no matter where it sits in the file. And no `filter:` here either — see the note above
   the hover rules for why a filter on a bar leaks over the sticky vehicle column. */
.fc-bar-e.fc-bar-half {
  width: 50% !important;
  border-radius: 0 7px 7px 0 !important;
}

/* Picked up and returned the same morning: indented on both sides, like the full-day pill. */
.fc-bar-s.fc-bar-e.fc-bar-half {
  margin-left: 5px !important;
  width: calc(50% - 5px) !important;
  border-radius: 7px !important;
}

.fc-bar-booked.fc-bar-half {
  background: linear-gradient(90deg, #0a8f89 0%, #79d7cd 100%) !important;
  box-shadow: 0 2px 4px rgba(13,158,151,0.22);
}

.fc-row:hover .fc-bar-booked.fc-bar-half,
.fc-reservation-link:hover .fc-bar-booked.fc-bar-half,
.fc-reservation-link:focus-visible .fc-bar-booked.fc-bar-half {
  background: linear-gradient(90deg, #0a978f 0%, #8ee3d9 100%) !important;
}

.fc-bar-pending.fc-bar-half {
  background: linear-gradient(90deg, #c47d0a 0%, #f8cd8d 100%) !important;
  box-shadow: 0 2px 4px rgba(245,166,35,0.22);
}

.fc-row:hover .fc-bar-pending.fc-bar-half,
.fc-reservation-link:hover .fc-bar-pending.fc-bar-half,
.fc-reservation-link:focus-visible .fc-bar-pending.fc-bar-half {
  background: linear-gradient(90deg, #cf850b 0%, #ffdba5 100%) !important;
}

/* ── Per-vehicle occupancy column ── */
.fc-td-occ-col {
  border-bottom: 1px solid #edf0f4;
  border-left: 2px solid #e8ecf0;
  padding: 0 12px;
  width: 80px;
  vertical-align: middle;
}

.fc-veh-occ-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
}

.fc-veh-occ-bar {
  flex: 1;
  height: 5px;
  border-radius: 5px;
  background: #eef0f5;
  overflow: hidden;
}

.fc-veh-occ-fill {
  height: 100%;
  border-radius: 5px;
  background: #d1d5db;
  transition: width 0.3s ease;
}

.fc-veh-occ-fill.fc-veh-occ-active {
  background: linear-gradient(90deg, #0d9e97, #38c8c0);
}

.fc-veh-occ-pct {
  font-size: 11px;
  font-weight: 600;
  color: #8a9bac;
  white-space: nowrap;
  width: 28px;
  text-align: right;
}

/* ── Empty state ── */
.fc-empty {
  padding: 56px 16px;
  text-align: center;
  color: #8a9bac;
  font-size: 14px;
}

/* ── Legend ── */
.fc-legend {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  align-items: center;
  padding: 12px 18px;
  border-top: 1px solid #edf0f4;
  background: #f8fafc;
}

.fc-legend-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #5a6a7a;
  font-weight: 500;
}

.fc-legend-bar {
  display: inline-block;
  width: 28px;
  height: 10px;
  border-radius: 4px;
  flex-shrink: 0;
}

.fc-legend-bar-booked {
  background: linear-gradient(90deg, #0a8f89, #0fb8b0);
}

.fc-legend-bar-pending {
  background: linear-gradient(90deg, #c47d0a, #f5a623);
}

/* Half the swatch is the bar, half is the legend's own background showing through — the same
   read as the cell itself. */
.fc-legend-bar-half {
  background: linear-gradient(90deg, #0a8f89 0%, #79d7cd 50%, rgba(10,143,137,0) 50%);
  border-radius: 4px 0 0 4px;
}

.fc-legend-bar-blackout {
  background: repeating-linear-gradient(
    -45deg,
    #dde3ea 0px,
    #dde3ea 4px,
    #eaecf0 4px,
    #eaecf0 8px
  );
  border: 1px solid #c8cdd5;
}

.fc-legend-split-swatch {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
  width: 28px;
  height: 18px;
  flex-shrink: 0;
}

.fc-legend-split-swatch::before,
.fc-legend-split-swatch::after {
  content: '';
  display: block;
  flex: 1;
  border-radius: 3px;
  background: linear-gradient(90deg, #0a8f89, #0fb8b0);
}

.fc-legend-split-dot {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #1a2736;
  z-index: 1;
}

.fc-legend-today-item .fc-legend-today-circle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #0d9e97;
  font-size: 10px;
  font-weight: 800;
  color: #fff;
  flex-shrink: 0;
}

/* Preserve unfinished admin input when a long rental form is interrupted. */
.rental-draft-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 4px;
  padding: 9px 11px;
  border: 1px solid #b7e3df;
  background: #f0fbfa;
  color: #376561;
}

.rental-draft-status[hidden] {
  display: none;
}

.rental-draft-discard {
  flex: 0 0 auto;
  padding: 0;
  border: 0;
  background: transparent;
  color: #087f79;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.rental-draft-discard:hover {
  color: #075e59;
  text-decoration: underline;
}

.rental-payment-link-active {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 190px;
  gap: 24px;
  align-items: center;
  margin-bottom: 18px;
  padding: 16px;
  border: 1px solid #dbe4ea;
  background: #f8fafc;
}

.rental-payment-qr {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  margin: 0;
  text-align: center;
}

.rental-payment-qr img {
  display: block;
  width: 168px;
  height: 168px;
  padding: 8px;
  border: 1px solid #d9e1e7;
  background: #fff;
}

.rental-payment-qr figcaption {
  color: #263746;
  font-size: 13px;
  font-weight: 700;
}

.rental-payment-qr a {
  color: #087f79;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}

.rental-payment-qr a:hover {
  text-decoration: underline;
}

.rental-deposit-panel {
  overflow: hidden;
}

.rental-deposit-summary article {
  min-width: 0;
}

.rental-deposit-summary strong,
.rental-deposit-summary p {
  overflow-wrap: anywhere;
}

.rental-deposit-actions {
  margin-top: 1rem;
}

.rental-deposit-processing {
  display: grid;
  gap: 4px;
  margin-top: 1rem;
  padding: 14px 16px;
  border-left: 3px solid #d99a16;
  background: #fff9e8;
  color: #4d3a12;
}

.rental-deposit-processing strong {
  color: #2a2417;
  font-size: 14px;
}

.rental-deposit-processing span {
  font-size: 13px;
  line-height: 1.5;
}

.rental-deposit-form {
  margin-top: 1rem;
}

.rental-deposit-form--compact,
.rental-deposit-form--inline {
  margin-top: .75rem;
}

.rental-deposit-grid {
  gap: .75rem;
  align-items: end;
}

.rental-deposit-grid--apply,
.rental-deposit-grid--capture {
  grid-template-columns: minmax(130px, 1fr) minmax(220px, 2fr) minmax(170px, auto);
}

.rental-deposit-grid--release {
  grid-template-columns: minmax(0, 2fr) minmax(170px, auto);
}

.rental-deposit-submit {
  align-self: end;
  width: 100%;
  justify-content: center;
  text-align: center;
  white-space: nowrap;
}

.rental-deposit-submit--danger {
  background: #dc2626;
}

/* ── Responsive ── */
@media (max-width: 860px) {
  .fc-summary-strip {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }

  .fc-summary-item {
    padding: 10px 12px;
  }

  .fc-summary-item strong {
    font-size: 18px;
  }

  .fc-month-label {
    font-size: 14px;
  }

  .admin-page .admin-titlebar .table-actions {
    gap: 6px;
  }

  .fc-th-occ-col,
  .fc-td-occ-col {
    display: none;
  }

  .fc-table {
    min-width: var(--fc-calendar-mobile-width, var(--fc-calendar-width, 1124px));
  }

  .fc-th-vehicle,
  .fc-td-vehicle {
    width: 138px;
    min-width: 138px;
    max-width: 138px;
    padding-left: 8px;
    padding-right: 8px;
  }

  .fc-vehicle-link strong,
  .fc-vehicle-link span {
    max-width: 118px;
  }

  .fc-vehicle-link strong {
    font-size: 12px;
  }

  .fc-vehicle-link span {
    font-size: 10px;
  }

  .rental-draft-status {
    align-items: flex-start;
    flex-direction: column;
  }

  .rental-payment-link-active {
    grid-template-columns: 1fr;
  }

  .rental-deposit-panel .panel-head {
    align-items: flex-start;
  }

  .rental-deposit-panel .panel-head h2 {
    font-size: 22px;
    line-height: 1.15;
  }

  .rental-deposit-summary {
    grid-template-columns: 1fr;
  }

  .rental-deposit-actions,
  .rental-deposit-actions .primary-button {
    width: 100%;
  }

  .rental-deposit-grid--apply,
  .rental-deposit-grid--capture,
  .rental-deposit-grid--release {
    grid-template-columns: 1fr;
  }

  .rental-deposit-grid label,
  .rental-deposit-grid input,
  .rental-deposit-submit,
  .rental-deposit-form--inline .link-button {
    width: 100%;
  }
}
.rental-extras-editor {
  display: grid;
  gap: 16px;
  margin: 0 0 20px;
  padding: 18px;
  border: 1px solid #dbe3ea;
  background: #f8fafc;
}

.rental-extras-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.rental-extra-option {
  align-items: flex-start;
  min-height: 66px;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid #dbe3ea;
  background: #fff;
}

.rental-extra-option span,
.rental-extra-option strong,
.rental-extra-option small {
  display: block;
  text-transform: none;
  letter-spacing: 0;
}

.rental-extra-option strong {
  color: var(--ink);
  font-size: 14px;
}

.rental-extra-option small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}

.rental-extras-quote {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.rental-extras-notify {
  margin: 0;
}

.rental-extras-paid-warning {
  color: #9a3412;
}

.rental-agreement-insurance-summary {
  display: grid;
  gap: 5px;
  margin-top: 8px;
  padding: 14px 16px;
  border-left: 3px solid #0f9f99;
  background: #f4f8f8;
}

.rental-agreement-insurance-summary strong,
.rental-agreement-insurance-summary span,
.rental-agreement-insurance-summary small {
  display: block;
  letter-spacing: 0;
  text-transform: none;
}

.rental-agreement-insurance-summary small {
  color: var(--muted);
}

@media (max-width: 720px) {
  .rental-extras-editor {
    padding: 14px;
  }

  .rental-extras-options,
  .rental-extras-quote {
    grid-template-columns: 1fr;
  }

  .rental-extras-editor .rental-admin-action-button {
    width: 100%;
  }
}

/* Keep dashboard recent rows stable after the rentals-list overrides. */
.admin-page .dashboard-recent-list .dashboard-recent-row,
.admin-page .dashboard-recent-list .dashboard-recent-row:hover,
.admin-page .dashboard-recent-list .dashboard-recent-row:focus-within {
  align-items: start;
  padding: 15px 2px;
  border: 0;
  border-bottom: 1px solid #e5eaf0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transform: none;
}

.admin-page .dashboard-recent-list .dashboard-recent-row:hover,
.admin-page .dashboard-recent-list .dashboard-recent-row:focus-within {
  background: #f7f9fb;
}

.admin-page .dashboard-recent-list .order-admin-actions,
.admin-page .dashboard-recent-list .offer-admin-actions {
  align-self: start;
  justify-self: end;
  justify-content: flex-end;
  margin: 0;
}

.admin-page .dashboard-recent-list .order-admin-actions .link-button,
.admin-page .dashboard-recent-list .offer-admin-actions .link-button {
  width: auto;
  min-height: 36px;
  padding: 0 12px;
}

.admin-page .dashboard-recent-list .dashboard-vehicle-row,
.admin-page .dashboard-recent-list .dashboard-vehicle-row:hover,
.admin-page .dashboard-recent-list .dashboard-vehicle-row:focus-within {
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  min-height: 85px;
  transition: background-color 140ms ease;
}

.admin-page .dashboard-recent-list .dashboard-vehicle-row > img,
.admin-page .dashboard-recent-list .dashboard-vehicle-row:hover > img {
  width: 72px;
  height: 54px;
  border-radius: 3px;
  transform: none;
}

.admin-page .dashboard-recent-list .dashboard-vehicle-row .offer-admin-actions {
  align-self: center;
}

@media (max-width: 640px) {
  .admin-page .dashboard-recent-list .order-admin-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
  }

  .admin-page .dashboard-recent-list .order-admin-actions,
  .admin-page .dashboard-recent-list .order-admin-actions .link-button {
    width: auto;
  }

  .admin-page .dashboard-recent-list .dashboard-vehicle-row,
  .admin-page .dashboard-recent-list .dashboard-vehicle-row:hover,
  .admin-page .dashboard-recent-list .dashboard-vehicle-row:focus-within {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .admin-page .dashboard-recent-list .dashboard-vehicle-row > img,
  .admin-page .dashboard-recent-list .dashboard-vehicle-row:hover > img {
    width: 64px;
    height: 48px;
  }

  .admin-page .dashboard-recent-list .dashboard-vehicle-row .offer-admin-actions {
    grid-column: 1 / -1;
    justify-self: start;
  }
}
/* InsideAuto AI chat and operator inbox */
.insideauto-chat-panel {
  border-radius: 6px;
}

.insideauto-chat-head-info {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.insideauto-chat-head-info strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.insideauto-chat-head .insideauto-chat-status {
  margin: 0;
  color: #c1cbd1;
  font-size: 11px;
  line-height: 1.25;
  text-align: left;
}

.insideauto-chat-body {
  align-content: start;
  height: min(440px, 56vh);
  min-height: 300px;
  overflow-y: auto;
}

.insideauto-chat-message.is-user {
  justify-self: end;
  border-color: #17384a;
  background: #17384a;
  color: #ffffff;
}

.insideauto-chat-message.is-system {
  justify-self: center;
  max-width: 94%;
  padding: 8px 10px;
  border: 0;
  background: #f0f4f6;
  color: #667681;
  font-size: 12px;
  text-align: center;
}

.insideauto-chat-message a {
  display: inline-block;
  margin-top: 8px;
  color: inherit;
  font-weight: 700;
  text-decoration: underline;
}

.insideauto-chat-tools {
  display: flex;
  justify-content: flex-end;
  gap: 16px;
  padding: 9px 16px 0;
  border-top: 1px solid #e5e5e5;
}

.insideauto-chat-tools button {
  border: 0;
  padding: 3px 0;
  background: transparent;
  color: #5d6c76;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}

.insideauto-chat-status[data-status="waiting_operator"] {
  color: #ffd082;
}

.insideauto-chat-status[data-status="operator_active"] {
  color: #7eeabf;
}

.admin-nav-count {
  display: inline-grid;
  place-items: center;
  min-width: 20px;
  height: 20px;
  margin-left: auto;
  padding: 0 6px;
  border-radius: 10px;
  background: #ed3237;
  color: #ffffff;
  font-size: 11px;
  font-weight: 700;
}

.admin-side-nav a:has(.admin-nav-count) {
  display: flex;
  align-items: center;
}

.chat-inbox-filter label {
  display: grid;
  gap: 6px;
  color: #71818c;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.chat-inbox-filter select {
  min-width: 210px;
  min-height: 36px;
  border: 1px solid #d9e2e7;
  border-radius: 4px;
  padding: 0 10px;
  background: #ffffff;
  color: #172631;
  font: inherit;
  font-size: 13px;
  text-transform: none;
}

.chat-inbox-layout {
  display: grid;
  grid-template-columns: minmax(240px, 300px) minmax(0, 1fr);
  min-height: 680px;
  border: 1px solid #dce4e8;
  background: #ffffff;
  box-shadow: 0 18px 44px rgba(15, 26, 34, 0.08);
  font-size: 13px;
}

.chat-thread-list {
  border-right: 1px solid #dce4e8;
  background: #f8fafb;
}

.chat-thread-item {
  display: grid;
  gap: 5px;
  padding: 11px 13px;
  border-bottom: 1px solid #e4eaed;
  border-left: 3px solid transparent;
  color: #172631;
  font-size: 13px;
  text-decoration: none;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.chat-thread-item:hover,
.chat-thread-item.is-active {
  border-left-color: #159b98;
  background: #ffffff;
}

.chat-thread-item.needs-attention {
  border-left-color: #ed3237;
}

.chat-thread-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.chat-thread-line strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-thread-line time,
.chat-admin-message time {
  color: #84939d;
  font-size: 10px;
  white-space: nowrap;
}

.chat-thread-item p {
  margin: 0;
  overflow: hidden;
  color: #647580;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-status-text {
  color: #16817f;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.chat-status-text[data-status="waiting_operator"] {
  color: #c13d3d;
}

.chat-thread-empty,
.chat-detail-placeholder {
  padding: 28px;
  color: #73838e;
}

.chat-thread-pagination {
  padding: 12px;
}

.chat-inbox-detail {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-width: 0;
}

.chat-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  border-bottom: 1px solid #dce4e8;
}

.chat-detail-head h2 {
  margin: 3px 0 0;
  font-size: 16px;
}

.chat-detail-head p {
  margin: 3px 0 0;
  color: #73838e;
  font-size: 12px;
}

.chat-visitor-context {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 10px 0 0;
  border: 1px solid #dce4e8;
  background: #f8fafb;
}

.chat-visitor-context div {
  min-width: 0;
  padding: 6px 9px;
  border-right: 1px solid #dce4e8;
}

.chat-visitor-context div:nth-child(4) {
  border-right: 0;
}

.chat-visitor-context .is-source {
  grid-column: 1 / -1;
  border-top: 1px solid #dce4e8;
  border-right: 0;
}

.chat-visitor-context dt {
  color: #84939d;
  font-size: 8px;
  font-weight: 800;
  text-transform: uppercase;
}

.chat-visitor-context dd {
  margin: 2px 0 0;
  overflow: hidden;
  color: #263640;
  font-size: 11px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-visitor-context a {
  color: #147c79;
}

.chat-detail-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.chat-detail-actions form {
  margin: 0;
}

.chat-admin-messages {
  display: flex;
  flex-direction: column;
  gap: 9px;
  max-height: 560px;
  padding: 16px;
  overflow-y: auto;
  background: #f5f7f8;
  font-size: 13px;
}

.chat-admin-message {
  align-self: flex-start;
  width: min(78%, 620px);
  padding: 9px 11px;
  border: 1px solid #dbe3e7;
  border-radius: 5px;
  background: #ffffff;
}

.chat-admin-message.is-visitor {
  align-self: flex-end;
  border-color: #17384a;
  background: #17384a;
  color: #ffffff;
}

.chat-admin-message.is-system {
  align-self: center;
  width: auto;
  border: 0;
  background: transparent;
  color: #72828d;
  font-size: 11px;
}

.chat-admin-message > div {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  font-size: 11px;
}

.chat-admin-message p {
  margin: 5px 0 0;
  white-space: pre-wrap;
}

.chat-operator-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 10px;
  padding: 12px 16px;
  border-top: 1px solid #dce4e8;
}

.chat-operator-form label {
  display: grid;
  gap: 5px;
  color: #667681;
  font-size: 11px;
  font-weight: 700;
}

.chat-operator-form textarea {
  width: 100%;
  min-height: 64px;
  resize: vertical;
  border: 1px solid #ccd8de;
  border-radius: 4px;
  padding: 8px 10px;
  font: inherit;
  font-size: 13px;
}

@media (max-width: 760px) {
  .insideauto-chat-body {
    height: min(390px, 52vh);
  }

  .chat-inbox-filter,
  .chat-inbox-filter select {
    width: 100%;
  }

  .chat-inbox-layout {
    grid-template-columns: 1fr;
  }

  .chat-thread-list {
    max-height: 280px;
    overflow-y: auto;
    border-right: 0;
    border-bottom: 1px solid #dce4e8;
  }

  .chat-detail-head,
  .chat-operator-form {
    grid-template-columns: 1fr;
    flex-direction: column;
    align-items: stretch;
  }

  .chat-detail-actions {
    justify-content: flex-start;
  }

  .chat-visitor-context {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .chat-visitor-context div:nth-child(2) {
    border-right: 0;
  }

  .chat-visitor-context div:nth-child(n + 3) {
    border-top: 1px solid #dce4e8;
  }

  .chat-admin-message {
    width: 90%;
  }

  .chat-operator-form .primary-button {
    width: 100%;
  }
}

/* Keep vehicle card actions full-width after all legacy admin button rules. */
@media (max-width: 700px) {
  .admin-page .vehicle-admin-row,
  .admin-page .vehicle-admin-main,
  .admin-page .vehicle-admin-top {
    min-width: 0;
    width: 100%;
  }

  .admin-page .vehicle-admin-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .admin-page .vehicle-admin-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    justify-self: stretch;
    min-width: 0;
    width: 100%;
    max-width: none;
  }

  .admin-page .vehicle-admin-actions > .primary-button,
  .admin-page .vehicle-admin-actions > .link-button {
    display: flex;
    inline-size: 100%;
    min-width: 0;
    max-width: none;
    margin: 0;
  }
}

/* Administrator accounts and per-user email 2FA controls. */
.admin-page .settings-users-panel {
  border-radius: 4px;
}

.admin-page .settings-user-row {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}

.admin-page .settings-user-profile {
  gap: 14px;
}

.admin-page .settings-user-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.admin-page .settings-user-heading h2 {
  margin: 0 0 4px;
  font-size: 17px;
}

.admin-page .settings-user-heading p {
  margin: 0;
  color: #71808e;
  font-size: 12px;
}

.admin-page .settings-user-idline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  margin-bottom: 5px;
}

.admin-page .settings-user-idline .section-kicker {
  margin: 0;
  color: #152331;
  font-size: 12px;
  letter-spacing: 0;
}

.admin-page .settings-current-user {
  padding-left: 8px;
  border-left: 2px solid #0a938c;
  color: #08756f;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.admin-page .settings-2fa-status {
  flex: 0 0 auto;
  padding-left: 8px;
  border-left: 2px solid #c75249;
  color: #a64139;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.admin-page .settings-2fa-status.enabled {
  border-color: #0a938c;
  color: #08756f;
}

.admin-page .settings-user-meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(110px, 1fr));
  border-top: 1px solid #e7ebef;
}

.admin-page .settings-user-meta > span {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 12px 13px 2px;
  border-right: 1px solid #e7ebef;
}

.admin-page .settings-user-meta > span:first-child { padding-left: 0; }
.admin-page .settings-user-meta > span:last-child { border-right: 0; }

.admin-page .settings-user-meta small {
  color: #8493a1;
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
}

.admin-page .settings-user-meta strong {
  overflow-wrap: anywhere;
  color: #23313e;
  font-size: 12px;
  font-weight: 600;
}

.admin-page .settings-user-actions {
  min-width: 160px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.admin-page .settings-user-actions > *,
.admin-page .settings-user-actions .link-button {
  width: 100%;
}

.admin-page .settings-2fa-form {
  display: flex;
}

.admin-page .settings-2fa-switch {
  width: 100%;
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 11px;
  border: 1px solid #d0d9e2;
  border-radius: 4px;
  background: #fff;
  color: #354454;
  cursor: pointer;
  box-sizing: border-box;
}

.admin-page .settings-2fa-switch > input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.admin-page .settings-2fa-switch-track {
  width: 34px;
  height: 18px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  padding: 2px;
  border-radius: 999px;
  background: #b6c0c8;
  transition: background-color 140ms ease;
  box-sizing: border-box;
}

.admin-page .settings-2fa-switch-track span {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(15, 26, 34, 0.22);
  transition: transform 140ms ease;
}

.admin-page .settings-2fa-switch > input:checked + .settings-2fa-switch-track {
  background: #0a938c;
}

.admin-page .settings-2fa-switch > input:checked + .settings-2fa-switch-track span {
  transform: translateX(16px);
}

.admin-page .settings-2fa-switch > input:focus-visible + .settings-2fa-switch-track {
  outline: 3px solid rgba(13, 158, 151, 0.2);
  outline-offset: 2px;
}

.admin-page .settings-2fa-switch > span:last-child {
  font-size: 12px;
  font-weight: 600;
}

.admin-page .settings-user-name-details,
.admin-page .settings-user-pw-details {
  position: relative;
}

.admin-page .settings-user-name-details summary,
.admin-page .settings-user-pw-details summary {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  list-style: none;
}

.admin-page .settings-user-name-details summary::-webkit-details-marker,
.admin-page .settings-user-pw-details summary::-webkit-details-marker { display: none; }

.admin-page .settings-user-name-form,
.admin-page .settings-user-password-form {
  width: min(300px, calc(100vw - 48px));
  display: grid;
  gap: 10px;
  margin-top: 10px;
  padding: 14px;
  border: 1px solid #dfe5ea;
  border-radius: 4px;
  background: #f8fafb;
}

.admin-page .settings-user-name-form label,
.admin-page .settings-user-password-form label {
  display: grid;
  gap: 5px;
}

.admin-page .settings-user-name-form .primary-button,
.admin-page .settings-user-password-form .primary-button { width: 100%; }
.admin-page .settings-user-delete { color: #b42318; }

.admin-page .operator-history-note {
  margin: 12px 0 0;
  padding: 10px 12px;
  border-left: 3px solid #0a938c;
  background: #f3fbfa;
  color: #52616f;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.45;
}

.admin-page .settings-create-2fa {
  grid-column: 1 / -1;
}

.admin-page .settings-checkbox-line {
  min-height: 46px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 12px;
  border: 1px solid #d7e0e7;
  border-radius: 4px;
  background: #f8fafb;
}

.admin-page .settings-checkbox-line input[type="checkbox"] {
  width: 18px;
  height: 18px;
  /* .admin-page input sets min-height: 44px for touch targets, which a checkbox inherits and
     which beats the height above — the box rendered 18x44 and looked stretched. Text inputs
     still want the 44px; a checkbox has to opt out explicitly. */
  min-height: 18px;
  flex: 0 0 auto;
  margin: 0;
  accent-color: #0a938c;
}

/* Same control inside a table cell: the standalone version is a full-width pill, which
   would stretch the column. It keeps the border, fill and accent so it still reads as the
   settings checkbox. */
.admin-page .settings-checkbox-line--cell {
  min-height: 38px;
  padding: 0 10px;
  cursor: pointer;
  justify-content: flex-start;
}

.admin-page .settings-checkbox-line--cell strong {
  white-space: nowrap;
}

.admin-page .settings-checkbox-line strong {
  color: #354454;
  font-size: 12px;
  font-weight: 600;
}

@media (max-width: 980px) {
  .admin-page .settings-user-row { grid-template-columns: 1fr; }
  .admin-page .settings-user-actions {
    width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .admin-page .settings-user-heading { display: grid; }
  .admin-page .settings-user-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-page .settings-user-meta > span {
    padding: 10px 12px;
    border-right: 0;
    border-bottom: 1px solid #e7ebef;
  }
  .admin-page .settings-user-meta > span:nth-last-child(-n + 2) { border-bottom: 0; }
  .admin-page .settings-user-meta > span:first-child { padding-left: 12px; }
  .admin-page .settings-user-actions { grid-template-columns: 1fr; }
  .admin-page .settings-user-actions > *,
  .admin-page .settings-user-actions .link-button { width: 100%; }
  .admin-page .settings-user-name-form,
  .admin-page .settings-user-password-form { width: 100%; box-sizing: border-box; }
}

/* Reservation email controls */
.admin-page .rental-notification-actions {
  display: grid;
  gap: 12px;
}

.admin-page .rental-notification-form {
  display: grid;
  grid-template-columns: minmax(220px, 1.25fr) minmax(170px, .75fr) auto;
  align-items: end;
  gap: 12px;
}

.admin-page .rental-notification-form label {
  min-width: 0;
  display: grid;
  gap: 6px;
}

.admin-page .rental-notification-form label > span {
  color: #718091;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.admin-page .rental-notification-form select,
.admin-page .rental-notification-form .primary-button {
  width: 100%;
  min-height: 46px;
}

.admin-page .rental-notification-operator {
  display: flex;
  justify-content: flex-start;
}

.admin-page .rental-checkin-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 320px));
  gap: 12px;
  align-items: center;
  justify-content: start;
}

.admin-page .rental-checkin-actions .link-button,
.admin-page .rental-checkin-actions .primary-button {
  width: 100%;
  min-height: 48px;
  white-space: normal;
  text-align: center;
}

.admin-page .rental-checkin-panel .order-info-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.admin-page .rental-checkin-form {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px 12px;
  align-items: start;
}

.admin-page .rental-checkin-form label {
  min-width: 0;
  display: grid;
  gap: 7px;
}

.admin-page .rental-checkin-form label > span {
  min-height: 28px;
  display: flex;
  align-items: flex-end;
  line-height: 1.2;
}

.admin-page .rental-checkin-form input,
.admin-page .rental-checkin-form select,
.admin-page .rental-checkin-form textarea {
  width: 100%;
  min-height: 46px;
  box-sizing: border-box;
}

.admin-page .rental-checkin-form textarea {
  min-height: 108px;
  resize: vertical;
}

.admin-page .rental-checkin-form .span-2 {
  grid-column: 1 / -1;
}

.admin-page .rental-checkin-form .note,
.admin-page .rental-checkin-form .rental-checkin-actions {
  grid-column: 1 / -1;
}

.admin-page .rental-checkin-notify {
  display: flex !important;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid #dbe4ed;
  background: #f8fafc;
}

.admin-page .rental-checkin-notify input {
  width: 18px;
  min-width: 18px;
  height: 18px;
  min-height: 18px;
}

.admin-page .rental-checkin-notify span {
  min-height: 0 !important;
  align-items: center !important;
  color: #425166;
  font-size: 13px;
  font-weight: 700;
  text-transform: none;
}

.admin-page .rental-checkin-form .note {
  margin: 0;
  padding: 12px 14px;
  border-left: 3px solid #0fa3a0;
  background: #f3fbfb;
  color: #425166;
}

.admin-page .rental-checkin-upload {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  padding: 14px;
  border: 1px dashed #cbd7e3;
  background: #fbfcfd;
}

.admin-page .rental-checkin-upload input[type="file"] {
  min-height: 44px;
  padding: 9px 10px;
  background: #fff;
}

.admin-page .rental-checkin-upload small {
  color: #7b8a9b;
  font-size: 12px;
  line-height: 1.35;
}

.admin-page .rental-checkin-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
  gap: 10px;
}

.admin-page .rental-checkin-gallery a {
  min-width: 0;
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid #dbe4ed;
  background: #fff;
  color: #425166;
  text-decoration: none;
}

.admin-page .rental-checkin-gallery img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border: 1px solid #edf1f5;
  background: #f8fafc;
}

.admin-page .rental-checkin-gallery span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #718091;
  font-size: 11px;
  font-weight: 700;
}

@media (max-width: 700px) {
  .admin-page .rental-notification-form { grid-template-columns: 1fr; }
  .admin-page .rental-notification-form .primary-button,
  .admin-page .rental-notification-operator,
  .admin-page .rental-notification-operator .link-button { width: 100%; }
  .admin-page .rental-checkin-panel .order-info-grid,
  .admin-page .rental-checkin-form { grid-template-columns: 1fr; }
  .admin-page .rental-checkin-form .span-2,
  .admin-page .rental-checkin-form .note,
  .admin-page .rental-checkin-form .rental-checkin-actions { grid-column: 1 / -1; }
  .admin-page .rental-checkin-form label > span { min-height: 0; }
  .admin-page .rental-checkin-actions { grid-template-columns: 1fr; }
}

/* Dashboard cleanup: align the overview with the simpler rentals/vehicles admin lists. */
.dashboard-page .admin-titlebar {
  padding: 0 0 16px;
  border-bottom: 1px solid #e5ebf1;
}

.dashboard-page .stat-grid {
  gap: 12px;
}

.dashboard-page .stat-grid article {
  border-radius: 8px;
  padding: 16px;
  border-color: #dfe6ed;
  box-shadow: none;
  transition: background-color 140ms ease, border-color 140ms ease;
}

.dashboard-page .stat-grid article::before {
  display: none;
}

.dashboard-page .stat-grid article:hover {
  background: #f8fafc;
  border-color: #cfd9e3;
  box-shadow: none;
}

.dashboard-page .panel {
  border-radius: 8px;
  border-color: #dfe6ed;
  box-shadow: none;
}

.dashboard-page .panel-head {
  align-items: start;
  border-bottom-color: #e8edf2;
}

.dashboard-page .dashboard-command-panel {
  overflow: hidden;
}

.dashboard-page .dashboard-command-grid {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(480px, 1.28fr);
  gap: 0;
}

.dashboard-page .dashboard-command-block {
  padding: 22px;
}

.dashboard-page .dashboard-command-block + .dashboard-command-block {
  border-left: 1px solid #e5ebf1;
}

.dashboard-page .dashboard-command-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  padding-bottom: 13px;
  border-bottom: 1px solid #e8edf2;
}

.dashboard-page .dashboard-command-heading span {
  color: #91a0ae;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.dashboard-page .dashboard-command-heading strong {
  color: #182534;
  font-size: clamp(26px, 3vw, 42px);
  line-height: 1;
  letter-spacing: 0;
}

.dashboard-page .dashboard-command-heading strong.is-positive,
.dashboard-page .dashboard-net-result-card.is-positive .dashboard-net-result-main strong,
.dashboard-page .dashboard-net-result-card.is-positive .dashboard-net-result-breakdown div:last-child dd,
.dashboard-page .dashboard-finance-ledger-row.is-positive > div:last-child strong {
  color: #0f766e;
}

.dashboard-page .dashboard-command-heading strong.is-negative,
.dashboard-page .dashboard-net-result-card.is-negative .dashboard-net-result-main strong,
.dashboard-page .dashboard-net-result-card.is-negative .dashboard-net-result-breakdown div:last-child dd,
.dashboard-page .dashboard-finance-ledger-row.is-negative > div:last-child strong {
  color: #b42318;
}

.dashboard-page .dashboard-net-result-card {
  display: grid;
  grid-template-columns: minmax(210px, .85fr) minmax(300px, 1.15fr);
  gap: 0;
  margin-bottom: 18px;
  background: #f8fafc;
  border: 1px solid #e1e8ef;
  border-left: 3px solid #9aa8b6;
}

.dashboard-page .dashboard-net-result-card.is-positive {
  border-left-color: #0f766e;
}

.dashboard-page .dashboard-net-result-card.is-negative {
  border-left-color: #b42318;
}

.dashboard-page .dashboard-net-result-main {
  padding: 18px;
}

.dashboard-page .dashboard-net-result-breakdown {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  background: #fff;
  border-left: 1px solid #edf1f5;
}

.dashboard-page .dashboard-net-result-card span,
.dashboard-page .dashboard-net-result-card dt,
.dashboard-page .dashboard-finance-ledger-head span,
.dashboard-page .dashboard-finance-ledger-row span {
  display: block;
  color: #8b99a7;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dashboard-page .dashboard-net-result-main strong {
  display: block;
  margin: 5px 0 4px;
  color: #172334;
  font-size: clamp(26px, 2.8vw, 38px);
  line-height: 1.05;
  letter-spacing: 0;
}

.dashboard-page .dashboard-net-result-main small,
.dashboard-page .dashboard-finance-ledger-row small {
  color: #68798b;
  font-size: 13px;
  font-weight: 650;
}

.dashboard-page .dashboard-net-result-breakdown div {
  min-width: 0;
  padding: 18px 14px;
}

.dashboard-page .dashboard-net-result-breakdown div + div {
  border-left: 1px solid #edf1f5;
}

.dashboard-page .dashboard-net-result-breakdown dd {
  margin: 5px 0 0;
  color: #172334;
  font-size: 15px;
  font-weight: 750;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.dashboard-page .dashboard-finance-ledger {
  border: 1px solid #e5ebf1;
  background: #fff;
}

.dashboard-page .dashboard-finance-ledger-head,
.dashboard-page .dashboard-finance-ledger-row {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) repeat(3, minmax(120px, .85fr));
  align-items: center;
}

.dashboard-page .dashboard-finance-ledger-head {
  min-height: 38px;
  background: #f8fafc;
  border-bottom: 1px solid #e5ebf1;
}

.dashboard-page .dashboard-finance-ledger-head span,
.dashboard-page .dashboard-finance-ledger-row > div {
  padding: 11px 12px;
}

.dashboard-page .dashboard-finance-ledger-head span:not(:first-child),
.dashboard-page .dashboard-finance-ledger-row > div:not(:first-child) {
  text-align: right;
}

.dashboard-page .dashboard-finance-ledger-row + .dashboard-finance-ledger-row {
  border-top: 1px solid #edf1f5;
}

.dashboard-page .dashboard-finance-ledger-row:hover {
  background: #fbfcfd;
}

.dashboard-page .dashboard-finance-ledger-row strong {
  display: block;
  color: #172334;
  font-size: 14px;
  font-weight: 750;
  line-height: 1.25;
}

.dashboard-page .dashboard-finance-ledger-row > div:first-child strong {
  font-size: 15px;
}

.dashboard-page .dashboard-metric-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin: 0;
}

.dashboard-page .dashboard-metric-list div {
  min-width: 0;
  padding: 13px 0;
  border-bottom: 1px solid #edf1f5;
}

.dashboard-page .dashboard-metric-list div:nth-child(odd) {
  padding-right: 18px;
}

.dashboard-page .dashboard-metric-list div:nth-child(even) {
  padding-left: 18px;
  border-left: 1px solid #edf1f5;
}

.dashboard-page .dashboard-metric-list dt {
  margin: 0 0 5px;
  color: #91a0ae;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dashboard-page .dashboard-metric-list dd {
  margin: 0;
  color: #172334;
  font-size: 18px;
  font-weight: 750;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.dashboard-page .dashboard-finance-foot {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding-top: 16px;
}

.dashboard-page .dashboard-finance-insight {
  min-width: 0;
  padding: 13px 15px;
  background: #fbfcfd;
  border: 1px solid #e5ebf1;
  border-left: 3px solid #0f766e;
}

.dashboard-page .dashboard-finance-insight span {
  display: block;
  color: #8b99a7;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dashboard-page .dashboard-finance-insight strong {
  display: block;
  margin-top: 5px;
  color: #172334;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: 0;
}

.dashboard-page .dashboard-recent-row,
.dashboard-page .dashboard-recent-row:hover,
.dashboard-page .dashboard-recent-row:focus-within {
  border-bottom-color: #e5ebf1;
}

.dashboard-page .dashboard-recent-list .dashboard-recent-row:hover,
.dashboard-page .dashboard-recent-list .dashboard-recent-row:focus-within {
  background: #f8fafc;
}

.dashboard-page .dashboard-today-row {
  align-items: center;
  padding: 15px 16px;
  border-radius: 2px;
  box-shadow: none;
}

.dashboard-page .dashboard-today-row .order-admin-top {
  align-items: center;
}

.dashboard-page .dashboard-today-titleline {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
}

.dashboard-page .dashboard-today-titleline h2 {
  margin: 0;
}

.dashboard-page .dashboard-today-titleline span {
  color: #8a98a6;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.dashboard-page .dashboard-today-row p {
  margin-top: 5px;
}

.dashboard-page .fc-profit-table {
  border-radius: 0;
}

@media (max-width: 700px) {
  .dashboard-page .admin-titlebar .table-actions {
    width: 100%;
    grid-template-columns: 1fr;
  }

  .dashboard-page .admin-titlebar .table-actions > * {
    width: 100%;
  }

  .dashboard-page .dashboard-command-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-page .dashboard-command-block {
    padding: 18px;
  }

  .dashboard-page .dashboard-command-block + .dashboard-command-block {
    border-left: 0;
    border-top: 1px solid #e5ebf1;
  }

  .dashboard-page .dashboard-net-result-card,
  .dashboard-page .dashboard-net-result-breakdown {
    grid-template-columns: 1fr;
  }

  .dashboard-page .dashboard-net-result-breakdown {
    border-left: 0;
    border-top: 1px solid #edf1f5;
  }

  .dashboard-page .dashboard-net-result-breakdown div + div {
    border-left: 0;
    border-top: 1px solid #edf1f5;
  }

  .dashboard-page .dashboard-metric-list {
    grid-template-columns: 1fr;
  }

  .dashboard-page .dashboard-metric-list div:nth-child(odd),
  .dashboard-page .dashboard-metric-list div:nth-child(even) {
    padding-left: 0;
    padding-right: 0;
    border-left: 0;
  }

  .dashboard-page .dashboard-finance-ledger-head {
    display: none;
  }

  .dashboard-page .dashboard-finance-ledger-row {
    grid-template-columns: 1fr;
    padding: 12px 0;
  }

  .dashboard-page .dashboard-finance-ledger-row > div {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    padding: 6px 14px;
    text-align: right;
  }

  .dashboard-page .dashboard-finance-ledger-row > div:not(:first-child) {
    text-align: right;
  }

  .dashboard-page .dashboard-finance-ledger-row > div:first-child {
    display: block;
    padding-bottom: 10px;
    text-align: left;
  }

  .dashboard-page .dashboard-finance-foot {
    grid-template-columns: 1fr;
  }
}

/* Vehicle editor: keep every management surface usable on narrow screens. */
@media (max-width: 700px) {
  .vehicle-editor-page .admin-main,
  .vehicle-editor-page .admin-main > *,
  .vehicle-editor-page .offer-editor,
  .vehicle-editor-page .editor-grid,
  .vehicle-editor-page .editor-section,
  .vehicle-editor-page .vehicle-management-form,
  .vehicle-editor-page label {
    min-width: 0;
    max-width: 100%;
  }

  .vehicle-editor-page .admin-titlebar {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .vehicle-editor-page .admin-titlebar h1 {
    overflow-wrap: anywhere;
    line-height: 1.25;
  }

  .vehicle-editor-page .admin-titlebar .table-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 8px;
  }

  .vehicle-editor-page .admin-titlebar .table-actions > *,
  .vehicle-editor-page .admin-titlebar .table-actions .link-button,
  .vehicle-editor-page .admin-titlebar .table-actions .danger-button {
    width: 100%;
    min-width: 0;
  }

  .vehicle-editor-page .admin-titlebar .table-actions > form {
    grid-column: 1 / -1;
  }

  .vehicle-editor-page .admin-titlebar .table-actions .link-button,
  .vehicle-editor-page .admin-titlebar .table-actions .danger-button {
    justify-content: center;
    padding-inline: 10px;
    text-align: center;
    white-space: normal;
  }

  .vehicle-editor-page .offer-editor {
    padding: 0;
    margin: 0;
    overflow: hidden;
  }

  .vehicle-editor-page .vehicle-preset-note,
  .vehicle-editor-page .form-error-panel {
    margin: 14px;
  }

  .vehicle-editor-page .editor-grid,
  .vehicle-editor-page .compact-grid.two,
  .vehicle-editor-page .compact-grid.three,
  .vehicle-editor-page .compact-grid.four,
  .vehicle-editor-page .vehicle-management-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .vehicle-editor-page .editor-section,
  .vehicle-editor-page .editor-section-span,
  .vehicle-editor-page .compact-grid > *,
  .vehicle-editor-page .vehicle-management-form > label,
  .vehicle-editor-page .vehicle-management-form > .note,
  .vehicle-editor-page .vehicle-management-actions {
    grid-column: 1 / -1 !important;
  }

  .vehicle-editor-page .editor-section {
    padding: 18px 16px;
    border-right: 0;
  }

  .vehicle-editor-page .editor-section-head {
    align-items: flex-start;
  }

  .vehicle-editor-page .editor-section-head span {
    flex: 0 0 32px;
  }

  .vehicle-editor-page input,
  .vehicle-editor-page select,
  .vehicle-editor-page textarea,
  .vehicle-editor-page input[type="file"] {
    width: 100%;
    max-width: 100%;
  }

  .vehicle-editor-page .sticky-form-actions,
  .vehicle-editor-page .form-actions,
  .vehicle-editor-page .vehicle-management-actions {
    width: 100%;
  }

  .vehicle-editor-page .sticky-form-actions .primary-button,
  .vehicle-editor-page .vehicle-management-actions .primary-button,
  .vehicle-editor-page #seasons .form-actions .primary-button {
    width: 100%;
    justify-content: center;
  }

  .vehicle-editor-page .vehicle-management-panel,
  .vehicle-editor-page .admin-main > section.panel:not(.offer-editor) {
    padding: 18px 16px 20px;
  }

  .vehicle-editor-page .vehicle-management-form {
    padding: 14px 12px;
  }

  .vehicle-editor-page .responsive-table-wrap {
    overflow: visible;
    box-shadow: none;
  }

  .vehicle-editor-page .stacked-table tr {
    padding: 10px 0;
  }

  .vehicle-editor-page .stacked-table td {
    overflow-wrap: anywhere;
  }

  .vehicle-editor-page .stacked-table td form,
  .vehicle-editor-page .stacked-table td .danger-button {
    width: 100%;
  }

  .vehicle-editor-page .vehicle-upload-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
  }

  .vehicle-editor-page .vehicle-upload-form .primary-button {
    width: 100%;
    justify-content: center;
  }

  .vehicle-editor-page .vehicle-photo-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .vehicle-editor-page .activity-log-item {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }

  .vehicle-editor-page .activity-log-item .status-pill {
    justify-self: start;
  }
}

@media (max-width: 390px) {
  .vehicle-editor-page .admin-titlebar .table-actions,
  .vehicle-editor-page .vehicle-photo-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .vehicle-editor-page .admin-titlebar .table-actions > form {
    grid-column: auto;
  }
}

/* --- appended: missing Tailwind theme variables + utility classes (pagination fix + other under-scanned views) --- */
:root,:host{--font-sans:"Instrument Sans", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-serif:ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-50:oklch(97.1% .013 17.38);--color-red-100:oklch(93.6% .032 17.717);--color-red-200:oklch(88.5% .062 18.334);--color-red-300:oklch(80.8% .114 19.571);--color-red-400:oklch(70.4% .191 22.216);--color-red-500:oklch(63.7% .237 25.331);--color-red-600:oklch(57.7% .245 27.325);--color-red-700:oklch(50.5% .213 27.518);--color-red-800:oklch(44.4% .177 26.899);--color-red-900:oklch(39.6% .141 25.723);--color-red-950:oklch(25.8% .092 26.042);--color-orange-50:oklch(98% .016 73.684);--color-orange-100:oklch(95.4% .038 75.164);--color-orange-200:oklch(90.1% .076 70.697);--color-orange-300:oklch(83.7% .128 66.29);--color-orange-400:oklch(75% .183 55.934);--color-orange-500:oklch(70.5% .213 47.604);--color-orange-600:oklch(64.6% .222 41.116);--color-orange-700:oklch(55.3% .195 38.402);--color-orange-800:oklch(47% .157 37.304);--color-orange-900:oklch(40.8% .123 38.172);--color-orange-950:oklch(26.6% .079 36.259);--color-amber-50:oklch(98.7% .022 95.277);--color-amber-100:oklch(96.2% .059 95.617);--color-amber-200:oklch(92.4% .12 95.746);--color-amber-300:oklch(87.9% .169 91.605);--color-amber-400:oklch(82.8% .189 84.429);--color-amber-500:oklch(76.9% .188 70.08);--color-amber-600:oklch(66.6% .179 58.318);--color-amber-700:oklch(55.5% .163 48.998);--color-amber-800:oklch(47.3% .137 46.201);--color-amber-900:oklch(41.4% .112 45.904);--color-amber-950:oklch(27.9% .077 45.635);--color-yellow-50:oklch(98.7% .026 102.212);--color-yellow-100:oklch(97.3% .071 103.193);--color-yellow-200:oklch(94.5% .129 101.54);--color-yellow-300:oklch(90.5% .182 98.111);--color-yellow-400:oklch(85.2% .199 91.936);--color-yellow-500:oklch(79.5% .184 86.047);--color-yellow-600:oklch(68.1% .162 75.834);--color-yellow-700:oklch(55.4% .135 66.442);--color-yellow-800:oklch(47.6% .114 61.907);--color-yellow-900:oklch(42.1% .095 57.708);--color-yellow-950:oklch(28.6% .066 53.813);--color-lime-50:oklch(98.6% .031 120.757);--color-lime-100:oklch(96.7% .067 122.328);--color-lime-200:oklch(93.8% .127 124.321);--color-lime-300:oklch(89.7% .196 126.665);--color-lime-400:oklch(84.1% .238 128.85);--color-lime-500:oklch(76.8% .233 130.85);--color-lime-600:oklch(64.8% .2 131.684);--color-lime-700:oklch(53.2% .157 131.589);--color-lime-800:oklch(45.3% .124 130.933);--color-lime-900:oklch(40.5% .101 131.063);--color-lime-950:oklch(27.4% .072 132.109);--color-green-50:oklch(98.2% .018 155.826);--color-green-100:oklch(96.2% .044 156.743);--color-green-200:oklch(92.5% .084 155.995);--color-green-300:oklch(87.1% .15 154.449);--color-green-400:oklch(79.2% .209 151.711);--color-green-500:oklch(72.3% .219 149.579);--color-green-600:oklch(62.7% .194 149.214);--color-green-700:oklch(52.7% .154 150.069);--color-green-800:oklch(44.8% .119 151.328);--color-green-900:oklch(39.3% .095 152.535);--color-green-950:oklch(26.6% .065 152.934);--color-emerald-50:oklch(97.9% .021 166.113);--color-emerald-100:oklch(95% .052 163.051);--color-emerald-200:oklch(90.5% .093 164.15);--color-emerald-300:oklch(84.5% .143 164.978);--color-emerald-400:oklch(76.5% .177 163.223);--color-emerald-500:oklch(69.6% .17 162.48);--color-emerald-600:oklch(59.6% .145 163.225);--color-emerald-700:oklch(50.8% .118 165.612);--color-emerald-800:oklch(43.2% .095 166.913);--color-emerald-900:oklch(37.8% .077 168.94);--color-emerald-950:oklch(26.2% .051 172.552);--color-teal-50:oklch(98.4% .014 180.72);--color-teal-100:oklch(95.3% .051 180.801);--color-teal-200:oklch(91% .096 180.426);--color-teal-300:oklch(85.5% .138 181.071);--color-teal-400:oklch(77.7% .152 181.912);--color-teal-500:oklch(70.4% .14 182.503);--color-teal-600:oklch(60% .118 184.704);--color-teal-700:oklch(51.1% .096 186.391);--color-teal-800:oklch(43.7% .078 188.216);--color-teal-900:oklch(38.6% .063 188.416);--color-teal-950:oklch(27.7% .046 192.524);--color-cyan-50:oklch(98.4% .019 200.873);--color-cyan-100:oklch(95.6% .045 203.388);--color-cyan-200:oklch(91.7% .08 205.041);--color-cyan-300:oklch(86.5% .127 207.078);--color-cyan-400:oklch(78.9% .154 211.53);--color-cyan-500:oklch(71.5% .143 215.221);--color-cyan-600:oklch(60.9% .126 221.723);--color-cyan-700:oklch(52% .105 223.128);--color-cyan-800:oklch(45% .085 224.283);--color-cyan-900:oklch(39.8% .07 227.392);--color-cyan-950:oklch(30.2% .056 229.695);--color-sky-50:oklch(97.7% .013 236.62);--color-sky-100:oklch(95.1% .026 236.824);--color-sky-200:oklch(90.1% .058 230.902);--color-sky-300:oklch(82.8% .111 230.318);--color-sky-400:oklch(74.6% .16 232.661);--color-sky-500:oklch(68.5% .169 237.323);--color-sky-600:oklch(58.8% .158 241.966);--color-sky-700:oklch(50% .134 242.749);--color-sky-800:oklch(44.3% .11 240.79);--color-sky-900:oklch(39.1% .09 240.876);--color-sky-950:oklch(29.3% .066 243.157);--color-blue-50:oklch(97% .014 254.604);--color-blue-100:oklch(93.2% .032 255.585);--color-blue-200:oklch(88.2% .059 254.128);--color-blue-300:oklch(80.9% .105 251.813);--color-blue-400:oklch(70.7% .165 254.624);--color-blue-500:oklch(62.3% .214 259.815);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-blue-800:oklch(42.4% .199 265.638);--color-blue-900:oklch(37.9% .146 265.522);--color-blue-950:oklch(28.2% .091 267.935);--color-indigo-50:oklch(96.2% .018 272.314);--color-indigo-100:oklch(93% .034 272.788);--color-indigo-200:oklch(87% .065 274.039);--color-indigo-300:oklch(78.5% .115 274.713);--color-indigo-400:oklch(67.3% .182 276.935);--color-indigo-500:oklch(58.5% .233 277.117);--color-indigo-600:oklch(51.1% .262 276.966);--color-indigo-700:oklch(45.7% .24 277.023);--color-indigo-800:oklch(39.8% .195 277.366);--color-indigo-900:oklch(35.9% .144 278.697);--color-indigo-950:oklch(25.7% .09 281.288);--color-violet-50:oklch(96.9% .016 293.756);--color-violet-100:oklch(94.3% .029 294.588);--color-violet-200:oklch(89.4% .057 293.283);--color-violet-300:oklch(81.1% .111 293.571);--color-violet-400:oklch(70.2% .183 293.541);--color-violet-500:oklch(60.6% .25 292.717);--color-violet-600:oklch(54.1% .281 293.009);--color-violet-700:oklch(49.1% .27 292.581);--color-violet-800:oklch(43.2% .232 292.759);--color-violet-900:oklch(38% .189 293.745);--color-violet-950:oklch(28.3% .141 291.089);--color-purple-50:oklch(97.7% .014 308.299);--color-purple-100:oklch(94.6% .033 307.174);--color-purple-200:oklch(90.2% .063 306.703);--color-purple-300:oklch(82.7% .119 306.383);--color-purple-400:oklch(71.4% .203 305.504);--color-purple-500:oklch(62.7% .265 303.9);--color-purple-600:oklch(55.8% .288 302.321);--color-purple-700:oklch(49.6% .265 301.924);--color-purple-800:oklch(43.8% .218 303.724);--color-purple-900:oklch(38.1% .176 304.987);--color-purple-950:oklch(29.1% .149 302.717);--color-fuchsia-50:oklch(97.7% .017 320.058);--color-fuchsia-100:oklch(95.2% .037 318.852);--color-fuchsia-200:oklch(90.3% .076 319.62);--color-fuchsia-300:oklch(83.3% .145 321.434);--color-fuchsia-400:oklch(74% .238 322.16);--color-fuchsia-500:oklch(66.7% .295 322.15);--color-fuchsia-600:oklch(59.1% .293 322.896);--color-fuchsia-700:oklch(51.8% .253 323.949);--color-fuchsia-800:oklch(45.2% .211 324.591);--color-fuchsia-900:oklch(40.1% .17 325.612);--color-fuchsia-950:oklch(29.3% .136 325.661);--color-pink-50:oklch(97.1% .014 343.198);--color-pink-100:oklch(94.8% .028 342.258);--color-pink-200:oklch(89.9% .061 343.231);--color-pink-300:oklch(82.3% .12 346.018);--color-pink-400:oklch(71.8% .202 349.761);--color-pink-500:oklch(65.6% .241 354.308);--color-pink-600:oklch(59.2% .249 .584);--color-pink-700:oklch(52.5% .223 3.958);--color-pink-800:oklch(45.9% .187 3.815);--color-pink-900:oklch(40.8% .153 2.432);--color-pink-950:oklch(28.4% .109 3.907);--color-rose-50:oklch(96.9% .015 12.422);--color-rose-100:oklch(94.1% .03 12.58);--color-rose-200:oklch(89.2% .058 10.001);--color-rose-300:oklch(81% .117 11.638);--color-rose-400:oklch(71.2% .194 13.428);--color-rose-500:oklch(64.5% .246 16.439);--color-rose-600:oklch(58.6% .253 17.585);--color-rose-700:oklch(51.4% .222 16.935);--color-rose-800:oklch(45.5% .188 13.697);--color-rose-900:oklch(41% .159 10.272);--color-rose-950:oklch(27.1% .105 12.094);--color-slate-50:oklch(98.4% .003 247.858);--color-slate-100:oklch(96.8% .007 247.896);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-300:oklch(86.9% .022 252.894);--color-slate-400:oklch(70.4% .04 256.788);--color-slate-500:oklch(55.4% .046 257.417);--color-slate-600:oklch(44.6% .043 257.281);--color-slate-700:oklch(37.2% .044 257.287);--color-slate-800:oklch(27.9% .041 260.031);--color-slate-900:oklch(20.8% .042 265.755);--color-slate-950:oklch(12.9% .042 264.695);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-gray-900:oklch(21% .034 264.665);--color-gray-950:oklch(13% .028 261.692);--color-zinc-50:oklch(98.5% 0 none);--color-zinc-100:oklch(96.7% .001 286.375);--color-zinc-200:oklch(92% .004 286.32);--color-zinc-300:oklch(87.1% .006 286.286);--color-zinc-400:oklch(70.5% .015 286.067);--color-zinc-500:oklch(55.2% .016 285.938);--color-zinc-600:oklch(44.2% .017 285.786);--color-zinc-700:oklch(37% .013 285.805);--color-zinc-800:oklch(27.4% .006 286.033);--color-zinc-900:oklch(21% .006 285.885);--color-zinc-950:oklch(14.1% .005 285.823);--color-neutral-50:oklch(98.5% 0 none);--color-neutral-100:oklch(97% 0 none);--color-neutral-200:oklch(92.2% 0 none);--color-neutral-300:oklch(87% 0 none);--color-neutral-400:oklch(70.8% 0 none);--color-neutral-500:oklch(55.6% 0 none);--color-neutral-600:oklch(43.9% 0 none);--color-neutral-700:oklch(37.1% 0 none);--color-neutral-800:oklch(26.9% 0 none);--color-neutral-900:oklch(20.5% 0 none);--color-neutral-950:oklch(14.5% 0 none);--color-stone-50:oklch(98.5% .001 106.423);--color-stone-100:oklch(97% .001 106.424);--color-stone-200:oklch(92.3% .003 48.717);--color-stone-300:oklch(86.9% .005 56.366);--color-stone-400:oklch(70.9% .01 56.259);--color-stone-500:oklch(55.3% .013 58.071);--color-stone-600:oklch(44.4% .011 73.639);--color-stone-700:oklch(37.4% .01 67.558);--color-stone-800:oklch(26.8% .007 34.298);--color-stone-900:oklch(21.6% .006 56.043);--color-stone-950:oklch(14.7% .004 49.25);--color-black:#000;--color-white:#fff;--spacing:.25rem;--breakpoint-sm:40rem;--breakpoint-md:48rem;--breakpoint-lg:64rem;--breakpoint-xl:80rem;--breakpoint-2xl:96rem;--container-3xs:16rem;--container-2xs:18rem;--container-xs:20rem;--container-sm:24rem;--container-md:28rem;--container-lg:32rem;--container-xl:36rem;--container-2xl:42rem;--container-3xl:48rem;--container-4xl:56rem;--container-5xl:64rem;--container-6xl:72rem;--container-7xl:80rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height: 1.5 ;--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height: 1.2 ;--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--text-5xl:3rem;--text-5xl--line-height:1;--text-6xl:3.75rem;--text-6xl--line-height:1;--text-7xl:4.5rem;--text-7xl--line-height:1;--text-8xl:6rem;--text-8xl--line-height:1;--text-9xl:8rem;--text-9xl--line-height:1;--font-weight-thin:100;--font-weight-extralight:200;--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--font-weight-black:900;--tracking-tighter:-.05em;--tracking-tight:-.025em;--tracking-normal:0em;--tracking-wide:.025em;--tracking-wider:.05em;--tracking-widest:.1em;--leading-tight:1.25;--leading-snug:1.375;--leading-normal:1.5;--leading-relaxed:1.625;--leading-loose:2;--radius-xs:.125rem;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--radius-4xl:2rem;--shadow-2xs:0 1px #0000000d;--shadow-xs:0 1px 2px 0 #0000000d;--shadow-sm:0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--shadow-xl:0 20px 25px -5px #0000001a, 0 8px 10px -6px #0000001a;--shadow-2xl:0 25px 50px -12px #00000040;--inset-shadow-2xs:inset 0 1px #0000000d;--inset-shadow-xs:inset 0 1px 1px #0000000d;--inset-shadow-sm:inset 0 2px 4px #0000000d;--drop-shadow-xs:0 1px 1px #0000000d;--drop-shadow-sm:0 1px 2px #00000026;--drop-shadow-md:0 3px 3px #0000001f;--drop-shadow-lg:0 4px 4px #00000026;--drop-shadow-xl:0 9px 7px #0000001a;--drop-shadow-2xl:0 25px 25px #00000026;--ease-in:cubic-bezier(.4, 0, 1, 1);--ease-out:cubic-bezier(0, 0, .2, 1);--ease-in-out:cubic-bezier(.4, 0, .2, 1);--animate-spin:spin 1s linear infinite;--animate-ping:ping 1s cubic-bezier(0, 0, .2, 1) infinite;--animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--animate-bounce:bounce 1s infinite;--blur-xs:4px;--blur-sm:8px;--blur-md:12px;--blur-lg:16px;--blur-xl:24px;--blur-2xl:40px;--blur-3xl:64px;--perspective-dramatic:100px;--perspective-near:300px;--perspective-normal:500px;--perspective-midrange:800px;--perspective-distant:1200px;--aspect-video:16 / 9;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}
.visible{visibility:visible}
.absolute{position:absolute}
.fixed{position:fixed}
.relative{position:relative}
.static{position:static}
.inset-0{inset:0}
.top-\[-1px\]{top:-1px}
.right-0{right:0}
.bottom-0{bottom:0}
.left-0{left:0}
.-z-10{z-index:-10}
.z-50{z-index:50}
.container{width:100%}
@media(min-width:40rem) {
.container{max-width:40rem}
}
@media(min-width:48rem) {
.container{max-width:48rem}
}
@media(min-width:64rem) {
.container{max-width:64rem}
}
@media(min-width:80rem) {
.container{max-width:80rem}
}
@media(min-width:96rem) {
.container{max-width:96rem}
}
.mx-auto{margin-inline:auto}
.-mt-3{margin-top:calc(var(--spacing) * -3)}
.-mt-5{margin-top:calc(var(--spacing) * -5)}
.-mt-\[4\.9rem\]{margin-top:-4.9rem}
.mr-6{margin-right:calc(var(--spacing) * 6)}
.-mb-px{margin-bottom:-1px}
.mb-1{margin-bottom:var(--spacing)}
.mb-2{margin-bottom:calc(var(--spacing) * 2)}
.mb-4{margin-bottom:calc(var(--spacing) * 4)}
.mb-6{margin-bottom:calc(var(--spacing) * 6)}
.mb-8{margin-bottom:calc(var(--spacing) * 8)}
.-ml-8{margin-left:calc(var(--spacing) * -8)}
.-ml-px{margin-left:-1px}
.ml-1{margin-left:var(--spacing)}
.block{display:block}
.flex{display:flex}
.grid{display:grid}
.hidden{display:none}
.inline-block{display:inline-block}
.inline-flex{display:inline-flex}
.inline-grid{display:inline-grid}
.table{display:table}
.aspect-\[335\/376\]{aspect-ratio:335/376}
.size-2{width:calc(var(--spacing) * 2);height:calc(var(--spacing) * 2)}
.size-3{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}
.h-0{height:0}
.h-1{height:var(--spacing)}
.h-1\.5{height:calc(var(--spacing) * 1.5)}
.h-2{height:calc(var(--spacing) * 2)}
.h-2\.5{height:calc(var(--spacing) * 2.5)}
.h-3{height:calc(var(--spacing) * 3)}
.h-3\.5{height:calc(var(--spacing) * 3.5)}
.h-5{height:calc(var(--spacing) * 5)}
.h-6{height:calc(var(--spacing) * 6)}
.h-7{height:calc(var(--spacing) * 7)}
.h-8{height:calc(var(--spacing) * 8)}
.h-10{height:calc(var(--spacing) * 10)}
.h-11{height:calc(var(--spacing) * 11)}
.h-14{height:calc(var(--spacing) * 14)}
.h-14\.5{height:calc(var(--spacing) * 14.5)}
.h-\[18px\]{height:18px}
.h-\[56px\]{height:56px}
.min-h-dvh{min-height:100dvh}
.min-h-screen{min-height:100vh}
.w-1{width:var(--spacing)}
.w-1\.5{width:calc(var(--spacing) * 1.5)}
.w-2{width:calc(var(--spacing) * 2)}
.w-2\.5{width:calc(var(--spacing) * 2.5)}
.w-3{width:calc(var(--spacing) * 3)}
.w-3\.5{width:calc(var(--spacing) * 3.5)}
.w-5{width:calc(var(--spacing) * 5)}
.w-6{width:calc(var(--spacing) * 6)}
.w-8{width:calc(var(--spacing) * 8)}
.w-\[18px\]{width:18px}
.w-\[448px\]{width:448px}
.w-fit{width:fit-content}
.w-full{width:100%}
.max-w-7xl{max-width:var(--container-7xl)}
.max-w-\[335px\]{max-width:335px}
.max-w-full{max-width:100%}
.max-w-none{max-width:none}
.min-w-0{min-width:0}
.min-w-5{min-width:calc(var(--spacing) * 5)}
.min-w-6{min-width:calc(var(--spacing) * 6)}
.flex-1{flex:1}
.flex-shrink{flex-shrink:1}
.flex-shrink-0,.shrink-0{flex-shrink:0}
.grow{flex-grow:1}
.border-collapse{border-collapse:collapse}
.translate-y-0{--tw-translate-y:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}
.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}
.cursor-default{cursor:default}
.cursor-not-allowed{cursor:not-allowed}
.cursor-not-allowed\!{cursor:not-allowed!important}
.cursor-pointer{cursor:pointer}
.resize{resize:both}
.flex-col{flex-direction:column}
.flex-col-reverse{flex-direction:column-reverse}
.flex-wrap{flex-wrap:wrap}
.items-baseline{align-items:baseline}
.items-center{align-items:center}
.items-start{align-items:flex-start}
.justify-between{justify-content:space-between}
.justify-center{justify-content:center}
.justify-end{justify-content:flex-end}
.justify-items-center{justify-items:center}
.gap-0\.5{gap:calc(var(--spacing) * .5)}
.gap-1{gap:var(--spacing)}
.gap-1\.5{gap:calc(var(--spacing) * 1.5)}
.gap-2{gap:calc(var(--spacing) * 2)}
.gap-2\.5{gap:calc(var(--spacing) * 2.5)}
.gap-3{gap:calc(var(--spacing) * 3)}
.gap-4{gap:calc(var(--spacing) * 4)}
.gap-5{gap:calc(var(--spacing) * 5)}
.gap-6{gap:calc(var(--spacing) * 6)}
.gap-8{gap:calc(var(--spacing) * 8)}
.gap-12{gap:calc(var(--spacing) * 12)}
:where(.space-x-1>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(var(--spacing) * var(--tw-space-x-reverse));margin-inline-end:calc(var(--spacing) * calc(1 - var(--tw-space-x-reverse)))}
:where(.divide-x>:not(:last-child)){--tw-divide-x-reverse:0;border-inline-style:var(--tw-border-style);border-inline-start-width:calc(1px * var(--tw-divide-x-reverse));border-inline-end-width:calc(1px * calc(1 - var(--tw-divide-x-reverse)))}
:where(.divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}
:where(.divide-neutral-200>:not(:last-child)){border-color:var(--color-neutral-200)}
.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
.overflow-hidden{overflow:hidden}
.overflow-x-auto{overflow-x:auto}
.overflow-x-hidden{overflow-x:hidden}
.rounded-full{border-radius:3.40282e38px}
.rounded-lg{border-radius:var(--radius-lg)}
.rounded-md{border-radius:var(--radius-md)}
.rounded-sm{border-radius:var(--radius-sm)}
.rounded-xl{border-radius:var(--radius-xl)}
.rounded-t-lg{border-top-left-radius:var(--radius-lg);border-top-right-radius:var(--radius-lg)}
.rounded-l-md{border-top-left-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md)}
.rounded-r-md{border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md)}
.rounded-b-lg{border-bottom-right-radius:var(--radius-lg);border-bottom-left-radius:var(--radius-lg)}
.rounded-br-lg{border-bottom-right-radius:var(--radius-lg)}
.rounded-bl-lg{border-bottom-left-radius:var(--radius-lg)}
.border{border-style:var(--tw-border-style);border-width:1px}
.border-x{border-inline-style:var(--tw-border-style);border-inline-width:1px}
.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}
.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}
.border-dashed{--tw-border-style:dashed;border-style:dashed}
.border-dotted{--tw-border-style:dotted;border-style:dotted}
.border-\[\#19140035\]{border-color:#19140035}
.border-\[\#e3e3e0\]{border-color:#e3e3e0}
.border-black{border-color:var(--color-black)}
.border-gray-300{border-color:var(--color-gray-300)}
.border-neutral-100{border-color:var(--color-neutral-100)}
.border-neutral-200{border-color:var(--color-neutral-200)}
.border-neutral-300{border-color:var(--color-neutral-300)}
.border-transparent{border-color:#0000}
.bg-\[\#1b1b18\]{background-color:#1b1b18}
.bg-\[\#FDFDFC\]{background-color:#fdfdfc}
.bg-\[\#dbdbd7\]{background-color:#dbdbd7}
.bg-\[\#fff2f2\]{background-color:#fff2f2}
.bg-amber-200{background-color:var(--color-amber-200)}
.bg-amber-600{background-color:var(--color-amber-600)}
.bg-black\/8{background-color:#00000014}
@supports (color:color-mix(in lab,red,red)){.bg-black\/8{background-color:color-mix(in oklab,var(--color-black) 8%,transparent)}}
.bg-black\/10{background-color:#0000001a}
@supports (color:color-mix(in lab,red,red)){.bg-black\/10{background-color:color-mix(in oklab,var(--color-black) 10%,transparent)}}
.bg-blue-100{background-color:var(--color-blue-100)}
.bg-blue-600{background-color:var(--color-blue-600)}
.bg-blue-700{background-color:var(--color-blue-700)}
.bg-emerald-200{background-color:var(--color-emerald-200)}
.bg-emerald-600{background-color:var(--color-emerald-600)}
.bg-gray-200{background-color:var(--color-gray-200)}
.bg-neutral-50{background-color:var(--color-neutral-50)}
.bg-neutral-600{background-color:var(--color-neutral-600)}
.bg-rose-200{background-color:var(--color-rose-200)}
.bg-rose-200\!{background-color:var(--color-rose-200)!important}
.bg-rose-500{background-color:var(--color-rose-500)}
.bg-rose-600{background-color:var(--color-rose-600)}
.bg-white{background-color:var(--color-white)}
.bg-white\/5{background-color:#ffffff0d}
@supports (color:color-mix(in lab,red,red)){.bg-white\/5{background-color:color-mix(in oklab,var(--color-white) 5%,transparent)}}
.bg-white\/\[2\%\]{background-color:#ffffff05}
@supports (color:color-mix(in lab,red,red)){.bg-white\/\[2\%\]{background-color:color-mix(in oklab,var(--color-white) 2%,transparent)}}
.p-1{padding:var(--spacing)}
.p-2{padding:calc(var(--spacing) * 2)}
.p-2\.5{padding:calc(var(--spacing) * 2.5)}
.p-4{padding:calc(var(--spacing) * 4)}
.p-5{padding:calc(var(--spacing) * 5)}
.p-6{padding:calc(var(--spacing) * 6)}
.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}
.px-2{padding-inline:calc(var(--spacing) * 2)}
.px-3{padding-inline:calc(var(--spacing) * 3)}
.px-4{padding-inline:calc(var(--spacing) * 4)}
.px-5{padding-inline:calc(var(--spacing) * 5)}
.px-6{padding-inline:calc(var(--spacing) * 6)}
.px-\[6px\]{padding-inline:6px}
.py-0{padding-block:0}
.py-1{padding-block:var(--spacing)}
.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}
.py-2{padding-block:calc(var(--spacing) * 2)}
.py-4{padding-block:calc(var(--spacing) * 4)}
.pt-8{padding-top:calc(var(--spacing) * 8)}
.pt-14{padding-top:calc(var(--spacing) * 14)}
.pr-2\.5{padding-right:calc(var(--spacing) * 2.5)}
.pb-0{padding-bottom:0}
.pb-12{padding-bottom:calc(var(--spacing) * 12)}
.pl-4{padding-left:calc(var(--spacing) * 4)}
.text-center{text-align:center}
.text-right{text-align:right}
.font-mono{font-family:var(--font-mono)}
.font-sans{font-family:var(--font-sans)}
.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}
.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}
.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}
.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}
.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}
.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}
.text-xs\/none{font-size:var(--text-xs);line-height:1}
.text-\[13px\]{font-size:13px}
.leading-3{--tw-leading:calc(var(--spacing) * 3);line-height:calc(var(--spacing) * 3)}
.leading-5{--tw-leading:calc(var(--spacing) * 5);line-height:calc(var(--spacing) * 5)}
.leading-\[20px\]{--tw-leading:20px;line-height:20px}
.leading-normal{--tw-leading:var(--leading-normal);line-height:var(--leading-normal)}
.font-light{--tw-font-weight:var(--font-weight-light);font-weight:var(--font-weight-light)}
.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}
.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}
.text-\[\#1b1b18\]{color:#1b1b18}
.text-\[\#706f6c\]{color:#706f6c}
.text-\[\#F53003\],.text-\[\#f53003\]{color:#f53003}
.text-amber-900{color:var(--color-amber-900)}
.text-blue-500{color:var(--color-blue-500)}
.text-blue-900{color:var(--color-blue-900)}
.text-emerald-500{color:var(--color-emerald-500)}
.text-emerald-900{color:var(--color-emerald-900)}
.text-gray-500{color:var(--color-gray-500)}
.text-gray-600{color:var(--color-gray-600)}
.text-gray-700{color:var(--color-gray-700)}
.text-gray-800{color:var(--color-gray-800)}
.text-neutral-100{color:var(--color-neutral-100)}
.text-neutral-400{color:var(--color-neutral-400)}
.text-neutral-500{color:var(--color-neutral-500)}
.text-neutral-500\!{color:var(--color-neutral-500)!important}
.text-neutral-600{color:var(--color-neutral-600)}
.text-neutral-800{color:var(--color-neutral-800)}
.text-neutral-900{color:var(--color-neutral-900)}
.text-neutral-950{color:var(--color-neutral-950)}
.text-rose-900{color:var(--color-rose-900)}
.text-white{color:var(--color-white)}
.uppercase{text-transform:uppercase}
.underline{text-decoration-line:underline}
.decoration-neutral-400{-webkit-text-decoration-color:var(--color-neutral-400);text-decoration-color:var(--color-neutral-400)}
.underline-offset-4{text-underline-offset:4px}
.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.scheme-light-dark{color-scheme:light dark}
.opacity-90{opacity:.9}
.opacity-100{opacity:1}
.shadow-\[0px_0px_1px_0px_rgba\(0\,0\,0\,0\.03\)\,0px_1px_2px_0px_rgba\(0\,0\,0\,0\.06\)\]{--tw-shadow:0px 0px 1px 0px var(--tw-shadow-color,#00000008), 0px 1px 2px 0px var(--tw-shadow-color,#0000000f);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}
.shadow-\[inset_0px_0px_0px_1px_rgba\(26\,26\,0\,0\.16\)\]{--tw-shadow:inset 0px 0px 0px 1px var(--tw-shadow-color,#1a1a0029);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}
.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}
.shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}
.ring-gray-300{--tw-ring-color:var(--color-gray-300)}
.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}
.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}
.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}
.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}
.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}
.delay-300{transition-delay:.3s}
.duration-150{--tw-duration:.15s;transition-duration:.15s}
.duration-200{--tw-duration:.2s;transition-duration:.2s}
.duration-750{--tw-duration:.75s;transition-duration:.75s}
.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}
.not-has-\[nav\]\:hidden:not(:has(:is(nav))){display:none}
@media(hover:hover) {
.group-hover\:text-blue-500:is(:where(.group):hover *){color:var(--color-blue-500)}
}
.before\:absolute:before{content:var(--tw-content);position:absolute}
.before\:top-0:before{content:var(--tw-content);top:0}
.before\:top-1\/2:before{content:var(--tw-content);top:50%}
.before\:bottom-0:before{content:var(--tw-content);bottom:0}
.before\:bottom-1\/2:before{content:var(--tw-content);bottom:50%}
.before\:left-\[0\.4rem\]:before{content:var(--tw-content);left:.4rem}
.before\:border-l:before{content:var(--tw-content);border-left-style:var(--tw-border-style);border-left-width:1px}
.before\:border-\[\#e3e3e0\]:before{content:var(--tw-content);border-color:#e3e3e0}
.odd\:bg-white\/2:nth-child(odd){background-color:#ffffff05}
@supports (color:color-mix(in lab,red,red)){.odd\:bg-white\/2:nth-child(odd){background-color:color-mix(in oklab,var(--color-white) 2%,transparent)}}
.even\:bg-white:nth-child(2n){background-color:var(--color-white)}
@media(hover:hover) {
.hover\:border-\[\#1915014a\]:hover{border-color:#1915014a}
.hover\:border-\[\#19140035\]:hover{border-color:#19140035}
.hover\:border-black:hover{border-color:var(--color-black)}
.hover\:bg-black:hover{background-color:var(--color-black)}
.hover\:bg-gray-100:hover{background-color:var(--color-gray-100)}
.hover\:bg-neutral-100:hover{background-color:var(--color-neutral-100)}
.hover\:bg-neutral-200:hover{background-color:var(--color-neutral-200)}
.hover\:bg-white\/50:hover{background-color:#ffffff80}
@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/50:hover{background-color:color-mix(in oklab,var(--color-white) 50%,transparent)}}
.hover\:text-gray-400:hover{color:var(--color-gray-400)}
.hover\:text-gray-700:hover{color:var(--color-gray-700)}
.hover\:underline:hover{text-decoration-line:underline}
}
.focus\:border-blue-300:focus{border-color:var(--color-blue-300)}
.focus\:ring:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}
.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}
.active\:bg-gray-100:active{background-color:var(--color-gray-100)}
.active\:text-gray-500:active{color:var(--color-gray-500)}
.active\:text-gray-700:active{color:var(--color-gray-700)}
.active\:text-gray-800:active{color:var(--color-gray-800)}
@media(min-width:40rem) {
.sm\:mb-16{margin-bottom:calc(var(--spacing) * 16)}
.sm\:flex{display:flex}
.sm\:hidden{display:none}
.sm\:flex-1{flex:1}
.sm\:items-center{align-items:center}
.sm\:justify-between{justify-content:space-between}
.sm\:gap-2{gap:calc(var(--spacing) * 2)}
.sm\:p-14{padding:calc(var(--spacing) * 14)}
.sm\:py-0{padding-block:0}
.sm\:pt-16{padding-top:calc(var(--spacing) * 16)}
.sm\:pb-0{padding-bottom:0}
}
@media(min-width:64rem) {
.lg\:-mt-\[6\.6rem\]{margin-top:-6.6rem}
.lg\:mb-0{margin-bottom:0}
.lg\:mb-6{margin-bottom:calc(var(--spacing) * 6)}
.lg\:-ml-px{margin-left:-1px}
.lg\:ml-0{margin-left:0}
.lg\:block{display:block}
.lg\:aspect-auto{aspect-ratio:auto}
.lg\:w-\[438px\]{width:438px}
.lg\:max-w-4xl{max-width:var(--container-4xl)}
.lg\:grow{flex-grow:1}
.lg\:flex-row{flex-direction:row}
.lg\:justify-center{justify-content:center}
.lg\:rounded-t-none{border-top-left-radius:0;border-top-right-radius:0}
.lg\:rounded-tl-lg{border-top-left-radius:var(--radius-lg)}
.lg\:rounded-r-lg{border-top-right-radius:var(--radius-lg);border-bottom-right-radius:var(--radius-lg)}
.lg\:rounded-br-none{border-bottom-right-radius:0}
.lg\:p-8{padding:calc(var(--spacing) * 8)}
.lg\:p-20{padding:calc(var(--spacing) * 20)}
}
.rtl\:flex-row-reverse:where(:dir(rtl),[dir=rtl],[dir=rtl] *){flex-direction:row-reverse}
@media(prefers-color-scheme:dark) {
.dark\:block{display:block}
.dark\:hidden{display:none}
:where(.dark\:divide-white\/5>:not(:last-child)){border-color:#ffffff0d}
@supports (color:color-mix(in lab,red,red)){:where(.dark\:divide-white\/5>:not(:last-child)){border-color:color-mix(in oklab,var(--color-white) 5%,transparent)}}
:where(.dark\:divide-white\/10>:not(:last-child)){border-color:#ffffff1a}
@supports (color:color-mix(in lab,red,red)){:where(.dark\:divide-white\/10>:not(:last-child)){border-color:color-mix(in oklab,var(--color-white) 10%,transparent)}}
.dark\:border{border-style:var(--tw-border-style);border-width:1px}
.dark\:border-none{--tw-border-style:none;border-style:none}
.dark\:border-\[\#3E3E3A\]{border-color:#3e3e3a}
.dark\:border-\[\#eeeeec\]{border-color:#eeeeec}
.dark\:border-amber-500{border-color:var(--color-amber-500)}
.dark\:border-amber-800{border-color:var(--color-amber-800)}
.dark\:border-blue-600{border-color:var(--color-blue-600)}
.dark\:border-blue-800{border-color:var(--color-blue-800)}
.dark\:border-emerald-500{border-color:var(--color-emerald-500)}
.dark\:border-emerald-600{border-color:var(--color-emerald-600)}
.dark\:border-gray-600{border-color:var(--color-gray-600)}
.dark\:border-neutral-500{border-color:var(--color-neutral-500)}
.dark\:border-neutral-700{border-color:var(--color-neutral-700)}
.dark\:border-neutral-800{border-color:var(--color-neutral-800)}
.dark\:border-rose-500{border-color:var(--color-rose-500)}
.dark\:border-rose-900{border-color:var(--color-rose-900)}
.dark\:border-white\/5{border-color:#ffffff0d}
@supports (color:color-mix(in lab,red,red)){.dark\:border-white\/5{border-color:color-mix(in oklab,var(--color-white) 5%,transparent)}}
.dark\:border-white\/8{border-color:#ffffff14}
@supports (color:color-mix(in lab,red,red)){.dark\:border-white\/8{border-color:color-mix(in oklab,var(--color-white) 8%,transparent)}}
.dark\:border-white\/10{border-color:#ffffff1a}
@supports (color:color-mix(in lab,red,red)){.dark\:border-white\/10{border-color:color-mix(in oklab,var(--color-white) 10%,transparent)}}
.dark\:border-white\/20{border-color:#fff3}
@supports (color:color-mix(in lab,red,red)){.dark\:border-white\/20{border-color:color-mix(in oklab,var(--color-white) 20%,transparent)}}
.dark\:border-white\/\[9\%\]{border-color:#ffffff17}
@supports (color:color-mix(in lab,red,red)){.dark\:border-white\/\[9\%\]{border-color:color-mix(in oklab,var(--color-white) 9%,transparent)}}
.dark\:bg-\[\#0a0a0a\]{background-color:#0a0a0a}
.dark\:bg-\[\#1D0002\]{background-color:#1d0002}
.dark\:bg-\[\#1a1a1a\]{background-color:#1a1a1a}
.dark\:bg-\[\#3E3E3A\]{background-color:#3e3e3a}
.dark\:bg-\[\#161615\]{background-color:#161615}
.dark\:bg-\[\#eeeeec\]{background-color:#eeeeec}
.dark\:bg-amber-600{background-color:var(--color-amber-600)}
.dark\:bg-amber-950{background-color:var(--color-amber-950)}
.dark\:bg-blue-700{background-color:var(--color-blue-700)}
.dark\:bg-blue-950{background-color:var(--color-blue-950)}
.dark\:bg-emerald-600{background-color:var(--color-emerald-600)}
.dark\:bg-emerald-900\/70{background-color:#004e3bb3}
@supports (color:color-mix(in lab,red,red)){.dark\:bg-emerald-900\/70{background-color:color-mix(in oklab,var(--color-emerald-900) 70%,transparent)}}
.dark\:bg-gray-700{background-color:var(--color-gray-700)}
.dark\:bg-gray-800{background-color:var(--color-gray-800)}
.dark\:bg-neutral-400{background-color:var(--color-neutral-400)}
.dark\:bg-neutral-600{background-color:var(--color-neutral-600)}
.dark\:bg-neutral-700{background-color:var(--color-neutral-700)}
.dark\:bg-neutral-800{background-color:var(--color-neutral-800)}
.dark\:bg-neutral-900{background-color:var(--color-neutral-900)}
.dark\:bg-rose-600{background-color:var(--color-rose-600)}
.dark\:bg-rose-900\!{background-color:var(--color-rose-900)!important}
.dark\:bg-rose-950{background-color:var(--color-rose-950)}
.dark\:bg-transparent{background-color:#0000}
.dark\:bg-white{background-color:var(--color-white)}
.dark\:bg-white\/1{background-color:#ffffff03}
@supports (color:color-mix(in lab,red,red)){.dark\:bg-white\/1{background-color:color-mix(in oklab,var(--color-white) 1%,transparent)}}
.dark\:bg-white\/3{background-color:#ffffff08}
@supports (color:color-mix(in lab,red,red)){.dark\:bg-white\/3{background-color:color-mix(in oklab,var(--color-white) 3%,transparent)}}
.dark\:bg-white\/5{background-color:#ffffff0d}
@supports (color:color-mix(in lab,red,red)){.dark\:bg-white\/5{background-color:color-mix(in oklab,var(--color-white) 5%,transparent)}}
.dark\:bg-white\/10{background-color:#ffffff1a}
@supports (color:color-mix(in lab,red,red)){.dark\:bg-white\/10{background-color:color-mix(in oklab,var(--color-white) 10%,transparent)}}
.dark\:bg-white\/\[2\%\]{background-color:#ffffff05}
@supports (color:color-mix(in lab,red,red)){.dark\:bg-white\/\[2\%\]{background-color:color-mix(in oklab,var(--color-white) 2%,transparent)}}
.dark\:bg-white\/\[3\%\]{background-color:#ffffff08}
@supports (color:color-mix(in lab,red,red)){.dark\:bg-white\/\[3\%\]{background-color:color-mix(in oklab,var(--color-white) 3%,transparent)}}
.dark\:text-\[\#1C1C1A\]{color:#1c1c1a}
.dark\:text-\[\#A1A09A\]{color:#a1a09a}
.dark\:text-\[\#EDEDEC\]{color:#ededec}
.dark\:text-\[\#F61500\]{color:#f61500}
.dark\:text-\[\#FF4433\]{color:#f43}
.dark\:text-amber-300{color:var(--color-amber-300)}
.dark\:text-blue-300{color:var(--color-blue-300)}
.dark\:text-emerald-400{color:var(--color-emerald-400)}
.dark\:text-emerald-500{color:var(--color-emerald-500)}
.dark\:text-gray-200{color:var(--color-gray-200)}
.dark\:text-gray-300{color:var(--color-gray-300)}
.dark\:text-gray-400{color:var(--color-gray-400)}
.dark\:text-gray-600{color:var(--color-gray-600)}
.dark\:text-neutral-100{color:var(--color-neutral-100)}
.dark\:text-neutral-200{color:var(--color-neutral-200)}
.dark\:text-neutral-300{color:var(--color-neutral-300)}
.dark\:text-neutral-400{color:var(--color-neutral-400)}
.dark\:text-neutral-500{color:var(--color-neutral-500)}
.dark\:text-neutral-600{color:var(--color-neutral-600)}
.dark\:text-neutral-600\!{color:var(--color-neutral-600)!important}
.dark\:text-neutral-900{color:var(--color-neutral-900)}
.dark\:text-rose-100{color:var(--color-rose-100)}
.dark\:text-white{color:var(--color-white)}
.dark\:text-white\!{color:var(--color-white)!important}
.dark\:shadow-\[inset_0px_0px_0px_1px_\#fffaed2d\]{--tw-shadow:inset 0px 0px 0px 1px var(--tw-shadow-color,#fffaed2d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}
}
@media(hover:hover) {
@media(prefers-color-scheme:dark){.group-hover\:dark\:text-emerald-500:is(:where(.group):hover *){color:var(--color-emerald-500)}}
}
@media(prefers-color-scheme:dark) {
.dark\:before\:border-\[\#3E3E3A\]:before{content:var(--tw-content);border-color:#3e3e3a}
.odd\:dark\:bg-white\/4:nth-child(odd){background-color:#ffffff0a}
@supports (color:color-mix(in lab,red,red)){.odd\:dark\:bg-white\/4:nth-child(odd){background-color:color-mix(in oklab,var(--color-white) 4%,transparent)}}
.even\:dark\:bg-white\/2:nth-child(2n){background-color:#ffffff05}
@supports (color:color-mix(in lab,red,red)){.even\:dark\:bg-white\/2:nth-child(2n){background-color:color-mix(in oklab,var(--color-white) 2%,transparent)}}
@media(hover:hover){.dark\:hover\:border-\[\#3E3E3A\]:hover{border-color:#3e3e3a}.dark\:hover\:border-\[\#62605b\]:hover{border-color:#62605b}.dark\:hover\:border-white:hover{border-color:var(--color-white)}.dark\:hover\:bg-gray-900:hover{background-color:var(--color-gray-900)}.dark\:hover\:bg-white:hover{background-color:var(--color-white)}.dark\:hover\:bg-white\/2:hover{background-color:#ffffff05}@supports (color:color-mix(in lab,red,red)){.dark\:hover\:bg-white\/2:hover{background-color:color-mix(in oklab,var(--color-white) 2%,transparent)}}.dark\:hover\:bg-white\/5:hover{background-color:#ffffff0d}@supports (color:color-mix(in lab,red,red)){.dark\:hover\:bg-white\/5:hover{background-color:color-mix(in oklab,var(--color-white) 5%,transparent)}}.dark\:hover\:bg-white\/10:hover{background-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.dark\:hover\:bg-white\/10:hover{background-color:color-mix(in oklab,var(--color-white) 10%,transparent)}}}
}
@media(hover:hover) {
@media(prefers-color-scheme:dark){.hover\:dark\:bg-white\/5:hover{background-color:#ffffff0d}@supports (color:color-mix(in lab,red,red)){.hover\:dark\:bg-white\/5:hover{background-color:color-mix(in oklab,var(--color-white) 5%,transparent)}}}
}
@media(prefers-color-scheme:dark) {
@media(hover:hover){.dark\:hover\:text-gray-200:hover{color:var(--color-gray-200)}.dark\:hover\:text-gray-300:hover{color:var(--color-gray-300)}}
}
@media(hover:hover) {
@media(prefers-color-scheme:dark){.hover\:dark\:text-white:hover{color:var(--color-white)}}
}
@media(prefers-color-scheme:dark) {
.dark\:focus\:border-blue-700:focus{border-color:var(--color-blue-700)}
.dark\:focus\:border-blue-800:focus{border-color:var(--color-blue-800)}
.dark\:active\:bg-gray-700:active{background-color:var(--color-gray-700)}
.dark\:active\:text-gray-300:active{color:var(--color-gray-300)}
}
@starting-style{.starting\:translate-y-4{--tw-translate-y:calc(var(--spacing) * 4);translate:var(--tw-translate-x) var(--tw-translate-y)}.starting\:translate-y-6{--tw-translate-y:calc(var(--spacing) * 6);translate:var(--tw-translate-x) var(--tw-translate-y)}.starting\:opacity-0{opacity:0}}
.\[\&_svg\]\:size-2\.5 svg{width:calc(var(--spacing) * 2.5);height:calc(var(--spacing) * 2.5)}
.\[\&_svg\]\:\!text-white svg{color:var(--color-white)!important}
@media(hover:hover) {
.hover\:\[\&_svg\]\:stroke-emerald-500:hover svg{stroke:var(--color-emerald-500)}
}
@media(prefers-color-scheme:dark) {
.dark\:\[\&_svg\]\:\!text-white svg{color:var(--color-white)!important}
}

/* Safari renders native selects shorter than text inputs and can ignore their
   horizontal padding. Keep this after all generated rules so the control is
   identical across admin, partner and customer surfaces. */
.admin-page select:not([multiple]):not([size]),
.partner-page select:not([multiple]):not([size]),
.customer-page select:not([multiple]):not([size]) {
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  width: 100%;
  height: 46px;
  min-height: 46px;
  padding: 0 42px 0 14px;
  line-height: normal;
  background-color: #f8fafc;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.25 6 6.25l5-5' fill='none' stroke='%23526771' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 12px 8px;
}

.admin-page select:not([multiple]):not([size]):disabled,
.partner-page select:not([multiple]):not([size]):disabled,
.customer-page select:not([multiple]):not([size]):disabled {
  cursor: not-allowed;
  opacity: 0.68;
}

/* Public rental search/booking selects need the same explicit dimensions in
   Safari. Location fields retain their search marker and add a clear chevron. */
.insideauto-field select:not([multiple]):not([size]) {
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  height: 46px;
  min-height: 46px;
  padding: 0 42px 0 12px;
  line-height: normal;
  background-color: #ffffff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.25 6 6.25l5-5' fill='none' stroke='%23666666' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 12px 8px;
}

.insideauto-field--location select:not([multiple]):not([size]) {
  padding-right: 42px;
  padding-left: 32px;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.25 6 6.25l5-5' fill='none' stroke='%23666666' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat;
  background-position: 10px center, right 14px center;
  background-size: 15px 15px, 12px 8px;
}

/* Technical context is stored only when a reservation is submitted and is
   shown inside that reservation's audit history for fraud review. */
.rental-request-context {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px 16px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid #dfe7eb;
  border-radius: 10px;
  background: #fff;
  color: #526771;
  font-size: 12px;
  overflow-wrap: anywhere;
}

.rental-request-context b {
  color: #17252d;
}

.rental-request-context-wide {
  grid-column: 1 / -1;
}

/* Compact header preference menus: clear current value, generous click target,
   and a calm popover instead of the former segmented language/currency fields. */
.drive-preference-menu {
  position: relative;
  margin-left: 8px;
  color: #fff;
}

.drive-preference-menu summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 78px;
  height: 40px;
  padding: 0 13px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.055);
  color: rgba(255, 255, 255, 0.88);
  cursor: pointer;
  list-style: none;
  transition: border-color .18s, background .18s, transform .18s;
}

.drive-preference-menu summary::-webkit-details-marker {
  display: none;
}

.drive-preference-menu summary:hover,
.drive-preference-menu[open] summary {
  border-color: rgba(237, 50, 55, 0.48);
  background: rgba(255, 255, 255, 0.09);
}

.drive-preference-menu summary > .drive-preference-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 17px;
  height: 17px;
  color: #ed4b50;
}

.drive-preference-icon svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.drive-preference-menu summary strong {
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .08em;
}

.drive-preference-menu summary i {
  width: 6px;
  height: 6px;
  border-right: 1.5px solid rgba(255, 255, 255, .55);
  border-bottom: 1.5px solid rgba(255, 255, 255, .55);
  transform: translateY(-2px) rotate(45deg);
  transition: transform .18s;
}

.drive-preference-menu[open] summary i {
  transform: translateY(2px) rotate(225deg);
}

.drive-preference-popover {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 50;
  min-width: 190px;
  padding: 7px;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 14px;
  background: #17191c;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .42);
}

.drive-preference-popover a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  padding: 0 11px;
  border-radius: 9px;
  color: rgba(255, 255, 255, .72);
  font-size: 12px;
  font-weight: 650;
}

.drive-preference-popover a:hover {
  background: rgba(255, 255, 255, .06);
  color: #fff;
}

.drive-preference-popover a.active {
  background: rgba(237, 50, 55, .13);
  color: #fff;
}

.drive-preference-popover a.active::before {
  content: '✓';
  margin-right: 8px;
  color: #ed4b50;
}

.drive-preference-popover a small {
  margin-left: auto;
  color: rgba(255, 255, 255, .38);
  font-size: 10px;
  letter-spacing: .08em;
}

.drive-drawer-switches {
  display: grid;
  gap: 16px;
}

.drive-drawer-preference > span {
  display: block;
  margin-bottom: 8px;
  color: rgba(255,255,255,.4);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.drive-drawer-preference > div {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.drive-mobile-drawer .drive-drawer-preference a {
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 10px;
  color: rgba(255,255,255,.62);
  font-size: 11px;
}

.drive-mobile-drawer .drive-drawer-preference a.active {
  border-color: rgba(237,50,55,.5);
  background: rgba(237,50,55,.12);
  color: #fff;
}

/* Keep desktop preference popovers above the sticky search stage. The older
   vertical-page rule made the header static, which removed its z-index. */
.rental-vertical-page .topbar.drive-topbar {
  position: relative;
  z-index: 700;
  overflow: visible;
}

.drive-home-page .insideauto-offerlist-hero {
  background: linear-gradient(180deg, #0d0d0d 0%, #141414 100%);
}

.drive-topbar-inner,
.drive-topbar .drive-nav {
  position: relative;
  overflow: visible;
}

.drive-preference-menu[open] {
  z-index: 710;
}

.drive-preference-popover {
  z-index: 720;
}

@media (max-width: 760px) {
  .rental-request-context {
    grid-template-columns: 1fr;
  }

  .rental-request-context-wide {
    grid-column: auto;
  }
}

/* Mobile Safari gives date controls a wide intrinsic size. Keep the invoice
   filter and every nested grid item inside the available admin viewport. */
@media (max-width: 700px) {
  .admin-page .invoice-filter-panel,
  .admin-page .invoice-filter-grid,
  .admin-page .invoice-filter-grid > label,
  .admin-page .invoice-filter-grid > button {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .admin-page .invoice-filter-panel {
    overflow: hidden;
  }

  .admin-page .invoice-date-field input[type="date"] {
    display: block;
    inline-size: 100%;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }
}

/* Compact brand/model management in rent-a-car settings. */
.admin-page .brand-model-add-card {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  align-items: end;
  gap: 12px;
  padding: 14px;
  margin: 0 0 14px;
  border: 1px solid #e6edf3;
  border-radius: 16px;
  background: linear-gradient(180deg, #fbfdff 0%, #f6f9fc 100%);
}

.admin-page .brand-model-add-card label,
.admin-page .brand-model-inline-add label {
  margin: 0;
}

.admin-page .brand-model-accordion {
  display: grid;
  gap: 8px;
}

.admin-page .brand-model-item {
  border: 1px solid #e6edf3;
  border-radius: 16px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 10px 26px rgba(15, 23, 42, .045);
}

.admin-page .brand-model-item summary {
  display: grid;
  grid-template-columns: minmax(145px, .75fr) minmax(0, 1.25fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 58px;
  padding: 10px 14px;
  cursor: pointer;
  list-style: none;
}

.admin-page .brand-model-item summary::-webkit-details-marker {
  display: none;
}

.admin-page .brand-model-item[open] summary {
  border-bottom: 1px solid #edf2f5;
  background: #fbfdff;
}

.admin-page .brand-model-main {
  display: grid;
  gap: 2px;
}

.admin-page .brand-model-main strong {
  color: #17202b;
  font-size: 15px;
}

.admin-page .brand-model-main small,
.admin-page .brand-model-preview em {
  color: #6b7785;
  font-size: 12px;
  font-style: normal;
}

.admin-page .brand-model-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.admin-page .brand-model-preview em {
  max-width: 130px;
  padding: 6px 9px;
  border: 1px solid #d9e3ec;
  border-radius: 8px;
  background: #f8fafc;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-page .brand-model-toggle {
  justify-self: end;
  padding: 7px 11px;
  border-radius: 999px;
  background: #edf8f8;
  color: #07827d;
  font-size: 12px;
  font-weight: 800;
}

.admin-page .brand-model-item[open] .brand-model-toggle {
  background: #07827d;
  color: #fff;
}

.admin-page .brand-model-body {
  display: grid;
  gap: 14px;
  padding: 14px;
}

.admin-page .brand-model-toolbar,
.admin-page .brand-model-inline-add {
  display: flex;
  align-items: end;
  gap: 10px;
}

.admin-page .brand-model-toolbar {
  justify-content: space-between;
}

.admin-page .brand-model-inline-add {
  flex: 1;
}

.admin-page .brand-model-inline-add label {
  flex: 1;
}

.admin-page .brand-model-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-page .brand-model-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  min-height: 36px;
  padding: 6px 8px 6px 12px;
  border: 1px solid #d9e3ec;
  border-radius: 8px;
  background: #f8fafc;
}

.admin-page .brand-model-chip span {
  color: #1f2a37;
  font-size: 13px;
  font-weight: 700;
}

.admin-page .brand-model-chip button {
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 6px;
  background: #fff;
  color: #b4232a;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
}

.admin-page .brand-model-chip button:hover {
  background: #b4232a;
  color: #fff;
}

@media (max-width: 760px) {
  .admin-page .brand-model-add-card,
  .admin-page .brand-model-item summary {
    grid-template-columns: 1fr;
  }

  .admin-page .brand-model-toggle {
    justify-self: start;
  }

  .admin-page .brand-model-toolbar,
  .admin-page .brand-model-inline-add {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-page .brand-model-toolbar > form,
  .admin-page .brand-model-toolbar button,
  .admin-page .brand-model-inline-add button {
    width: 100%;
  }
}

/* ── Google testimonials on the rental home page ───────────────────────────── */
.ia-testimonials {
  background: var(--paper);
  border-top: 1px solid var(--line);
  padding: 56px 20px 64px;
}

.ia-testimonials-inner {
  max-width: var(--max);
  margin: 0 auto;
}

.ia-testimonials-head {
  text-align: center;
  margin-bottom: 34px;
}

.ia-testimonials-kicker {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 8px;
}

.ia-testimonials-head h2 {
  font-size: 28px;
  line-height: 1.2;
  color: var(--ink);
  margin: 0 0 10px;
}

.ia-testimonials-sub {
  margin: 0;
  font-size: 14px;
  color: var(--muted);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
}

.ia-testimonials-sub a {
  color: var(--blue);
  text-decoration: underline;
}

.ia-stars {
  color: #f5a623;
  letter-spacing: 2px;
  font-size: 15px;
  line-height: 1;
}

.ia-testimonials-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(288px, 1fr));
  gap: 18px;
}

.ia-testimonial {
  margin: 0;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 20px 22px 18px;
  box-shadow: var(--shadow);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ia-testimonial blockquote {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--ink);
}

.ia-testimonial figcaption {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-top: auto;
  padding-top: 6px;
  border-top: 1px solid var(--line);
}

.ia-testimonial figcaption strong {
  font-size: 14px;
  color: var(--ink);
}

.ia-testimonial figcaption span {
  font-size: 12px;
  color: var(--muted);
}

.ia-testimonials-cta {
  text-align: center;
  margin-top: 30px;
}

.ia-review-button {
  display: inline-block;
  padding: 12px 26px;
  border-radius: 999px;
  background: var(--night);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: filter 0.15s;
}

.ia-review-button:hover,
.ia-review-button:focus-visible {
  filter: brightness(1.18);
}

@media (max-width: 640px) {
  .ia-testimonials { padding: 40px 16px 48px; }
  .ia-testimonials-head h2 { font-size: 23px; }
  .ia-testimonials-grid { grid-template-columns: 1fr; }
}

.insideauto-addon-required-note {
  display: block;
  margin-top: 2px;
  color: var(--coral);
  font-size: 11px;
  font-weight: 700;
}

/* ── Password generator row (admin users settings) ─────────────────────────── */
.pw-generator-row {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin: 4px 0 10px;
}

.pw-show-toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #354454;
  cursor: pointer;
}

.pw-show-toggle input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: #0a938c;
}

/* ── Dashboard money accordion ─────────────────────────────────────────
   Accordion, not a blur: closed, the card is just a labelled strip; the figure rolls down
   underneath it on click. Scoped to .admin-page so it outranks the generic
   `.admin-page .stat-grid article` / `.dashboard-page .stat-grid article` cards above. */
.admin-page .stat-grid--money article {
  align-self: start;
  padding: 0;
  overflow: hidden;
}

.admin-page .stat-money-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 14px 16px;
  border: 0;
  border-radius: inherit;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background 0.15s ease;
}

.admin-page .stat-money-head:hover,
.admin-page .stat-money-head:focus-visible {
  background: rgba(15, 26, 34, 0.04);
  outline: none;
}

/* Two of the five labels wrap at this width. Reserving both lines on every card keeps the
   closed strips the same height, so the row reads as one bar rather than a ragged edge. */
.admin-page .stat-money-head span {
  display: flex;
  align-items: center;
  min-height: 29px;
  margin-bottom: 0;
}

.admin-page .stat-money-chevron {
  flex: 0 0 auto;
  color: #90a0ac;
  transition: transform 0.22s ease;
}

.admin-page .stat-money.is-open .stat-money-chevron {
  transform: rotate(180deg);
}

/* 0fr -> 1fr animates to the content's own height, so the panel rolls open without a
   hardcoded pixel height that a wrapped figure would break. */
.admin-page .stat-money-body {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.24s ease;
}

.admin-page .stat-money.is-open .stat-money-body {
  grid-template-rows: 1fr;
}

.admin-page .stat-money-body > div {
  overflow: hidden;
}

.admin-page .stat-money-body strong {
  display: block;
  padding: 0 16px 14px;
}

/* ── Damage payment request ────────────────────────────────────────────
   The customer page and its admin preview, laid out as one document: who and
   what, then an itemised table, then the total it adds up to, then the one
   action. The earlier version scattered the same figures across three cards
   and a stack of bordered boxes, so the amount appeared twice and never
   read as a bill. */
.damage-doc {
  max-width: 720px;
  margin: 0 auto;
}

.damage-doc-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid #e4e9ef;
}

.damage-doc-head h1 {
  margin: 4px 0 0;
  font-size: 22px;
  line-height: 1.2;
  letter-spacing: -0.4px;
}

.damage-doc-status {
  flex: 0 0 auto;
  padding: 5px 11px;
  border-radius: 999px;
  background: #eef2f6;
  color: #46545f;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.damage-doc-status.is-paid { background: #e7f6ee; color: #10714a; }
.damage-doc-status.is-open { background: #fff2dd; color: #96590d; }
.damage-doc-status.is-closed { background: #f1f2f4; color: #6a7580; }

/* Context, not headline figures: the amount belongs to the total row below. */
.damage-doc-meta {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 6px 18px;
  margin: 16px 0 22px;
  font-size: 13px;
}

.damage-doc-meta dt {
  color: #77838d;
}

.damage-doc-meta dd {
  margin: 0;
  color: #1a2736;
  font-weight: 600;
}

.damage-doc-table {
  width: 100%;
  border-collapse: collapse;
}

.damage-doc-table caption {
  padding-bottom: 8px;
  color: #77838d;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-align: left;
  text-transform: uppercase;
}

.damage-doc-table th,
.damage-doc-table td {
  padding: 12px 0;
  border-bottom: 1px solid #eceff3;
  text-align: left;
  vertical-align: top;
}

.damage-doc-table td.damage-doc-amount,
.damage-doc-table th.damage-doc-amount {
  width: 130px;
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.damage-doc-table tfoot td {
  padding-top: 14px;
  border-bottom: 0;
  font-size: 16px;
  font-weight: 700;
}

.damage-doc-item-note {
  display: block;
  margin-top: 4px;
  color: #77838d;
  font-size: 12px;
}

/* Evidence sits with the item it belongs to, small enough not to compete
   with the amount. */
.damage-doc-evidence {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.damage-doc-evidence a {
  padding: 4px 9px;
  border: 1px solid #dbe2e9;
  border-radius: 6px;
  background: #fbfcfd;
  color: #35424e;
  font-size: 12px;
  text-decoration: none;
}

.damage-doc-evidence a:hover {
  border-color: #b9c4ce;
  background: #f3f6f9;
}

.damage-doc-action {
  margin-top: 24px;
}

.damage-doc-action .primary-button {
  width: 100%;
  justify-content: center;
  text-align: center;
}

.damage-doc-footnote {
  margin: 12px 0 0;
  color: #77838d;
  font-size: 12px;
  line-height: 1.6;
}

.damage-doc-notice {
  margin: 16px 0 0;
  padding: 12px 14px;
  border: 1px solid #f0d089;
  border-radius: 10px;
  background: #fffbef;
  font-size: 13px;
  line-height: 1.55;
}

.damage-doc-notice strong { display: block; margin-bottom: 2px; }

.damage-doc-state {
  margin-top: 22px;
  padding: 14px 16px;
  border: 1px solid #e4e9ef;
  border-radius: 10px;
  background: #f8fafc;
  font-size: 13px;
  line-height: 1.55;
}

@media (max-width: 560px) {
  .damage-doc-head { flex-direction: column; gap: 10px; }
  .damage-doc-meta { grid-template-columns: 1fr; gap: 2px; }
  .damage-doc-meta dd { margin-bottom: 10px; }
  .damage-doc-table td.damage-doc-amount { width: 96px; }
}

/* ── Damage charge, admin side ─────────────────────────────────────────
   The panel used to print the same figures three times over: a status badge in
   the head, a three-card grid repeating it, then the items read-only, then the
   identical items again inside the edit form. It ran past 1600px and nothing
   said which copy was the editable one. One summary line, one item editor. */
.damage-admin-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 18px;
  margin: 14px 0 20px;
  padding: 12px 14px;
  border: 1px solid #e4e9ef;
  border-radius: 10px;
  background: #f8fafc;
  font-size: 13px;
}

.damage-admin-summary > div {
  display: flex;
  align-items: baseline;
  gap: 7px;
}

.damage-admin-summary span {
  color: #77838d;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.damage-admin-summary strong {
  color: #1a2736;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
}

.damage-admin-items {
  display: grid;
  gap: 10px;
}

/* A charge line is a description and an amount. It does not need a nested
   panel with its own shadow, which is what made three of them fill a screen. */
.damage-admin-item {
  padding: 12px;
  border: 1px solid #e4e9ef;
  border-radius: 10px;
  background: #fbfcfd;
}

.damage-admin-item-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px 34px;
  gap: 10px;
  align-items: start;
}

.damage-admin-item-grid label {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.damage-admin-item-grid textarea {
  min-height: 62px;
  resize: vertical;
}

.damage-admin-item-remove {
  align-self: start;
  width: 34px;
  min-height: 34px;
  height: 34px;
  margin-top: 21px;
  padding: 0;
  border: 1px solid #e6d2d2;
  border-radius: 8px;
  background: #fdf6f6;
  color: #a34141;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}

.damage-admin-item-remove:hover {
  border-color: #d8b3b3;
  background: #f9ebeb;
}

.damage-admin-item-file {
  margin-top: 10px;
}

.damage-admin-item-file > span {
  display: block;
  margin-bottom: 5px;
  color: #77838d;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.damage-admin-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #e4e9ef;
}

.damage-admin-total strong {
  font-size: 16px;
  font-variant-numeric: tabular-nums;
}

.damage-admin-evidence {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.damage-admin-evidence a {
  padding: 3px 8px;
  border: 1px solid #dbe2e9;
  border-radius: 6px;
  background: #fff;
  color: #35424e;
  font-size: 12px;
  text-decoration: none;
}

/* Read-only list, shown only where the editor is not — a paid or waived charge,
   or a viewer without finance.manage. */
.damage-admin-readonly {
  display: grid;
  gap: 0;
  margin: 0 0 18px;
  border: 1px solid #e4e9ef;
  border-radius: 10px;
  overflow: hidden;
}

.damage-admin-readonly-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 11px 14px;
  border-bottom: 1px solid #eceff3;
  background: #fff;
}

.damage-admin-readonly-row:last-child { border-bottom: 0; }

.damage-admin-readonly-row strong { font-variant-numeric: tabular-nums; white-space: nowrap; }

.damage-admin-readonly-total {
  background: #f8fafc;
  font-weight: 700;
}

.damage-admin-sub {
  margin: 22px 0 12px;
  padding-top: 18px;
  border-top: 1px solid #eceff3;
}

.damage-admin-sub h3 {
  margin: 0 0 2px;
  font-size: 14px;
}

.damage-admin-sub p {
  margin: 0;
  color: #77838d;
  font-size: 12px;
  line-height: 1.55;
}

@media (max-width: 700px) {
  .damage-admin-item-grid { grid-template-columns: minmax(0, 1fr) 34px; }
  .damage-admin-item-grid label:nth-child(2) { grid-column: 1 / 2; }
  .damage-admin-item-remove { grid-row: 1; grid-column: 2; margin-top: 21px; }
}

/* ── Electronic agreement signature ───────────────────────────────────────────
   The panel sits above the agreement form, so it has to read as status first and
   controls second: what happened, when, on whose screen. */
.agreement-signature { margin-bottom: 20px; }
.agreement-signature-done,
.agreement-signature-open {
  display: flex; gap: 20px; align-items: center; flex-wrap: wrap;
  border: 1px solid #e2e8f0; border-radius: 12px; padding: 16px 18px; background: #f8fafc;
}
.agreement-signature-done { border-color: #99f6e4; background: #f0fdfa; }
.agreement-signature-done > div:first-child,
.agreement-signature-open > div:first-child { flex: 1 1 260px; }
.agreement-signature-done img { max-height: 72px; max-width: 240px; background: #fff;
  border: 1px solid #e2e8f0; border-radius: 8px; padding: 6px; }
.agreement-signature-qr { text-align: center; flex: 0 0 auto; }
.agreement-signature-qr img { width: 132px; height: 132px; display: block; background: #fff;
  border: 1px solid #e2e8f0; border-radius: 8px; padding: 6px; }
.agreement-signature-qr small { display: block; margin-top: 6px; }
.agreement-signature-qr input { width: 100%; max-width: 220px; margin-top: 8px; font-size: 11px;
  padding: 5px 7px; border: 1px solid #e2e8f0; border-radius: 6px; color: #475569; background: #fff; }
@media (max-width: 640px) {
  .agreement-signature-done, .agreement-signature-open { flex-direction: column; align-items: flex-start; }
}

/* ── Insurance tiers on the rent-a-car settings screen ────────────────────────
   These were a six-column table with a 900px minimum inside a sideways
   scroller, so on any normal screen half of each row sat off-screen. Cards let
   every field of one tier be read at once, at any width. */
.ins-subhead { margin: 22px 0 6px; }
.ins-tiers { display: grid; gap: 14px; margin: 14px 0 10px; }
.ins-tier {
  display: grid; gap: 12px 16px; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  border: 1px solid #e2e8f0; border-radius: 12px; padding: 14px 16px 16px; margin: 0; background: #fff;
}
.ins-tier--new { border-style: dashed; background: #f8fafc; }
.ins-tier > legend {
  padding: 2px 10px; font-size: 12px; font-weight: 700; letter-spacing: .02em;
  color: #0f766e; background: #f0fdfa; border: 1px solid #99f6e4; border-radius: 999px;
}
.ins-tier--new > legend { color: #475569; background: #f1f5f9; border-color: #cbd5e1; }
.ins-tier label { display: flex; flex-direction: column; gap: 5px; margin: 0; }
.ins-tier label > span { font-size: 12px; font-weight: 600; color: #475569; }
.ins-tier label > small { font-size: 11px; color: #94a3b8; line-height: 1.35; }
.ins-tier-name, .ins-tier-includes { grid-column: 1 / -1; }
.ins-tier-visibility { grid-column: 1 / -1; flex-direction: row !important; align-items: center;
  flex-wrap: wrap; gap: 8px !important; }
.ins-tier-visibility small { flex-basis: 100%; }
@media (max-width: 560px) { .ins-tier { grid-template-columns: 1fr; } }

/* ── Protection details on the vehicle page ───────────────────────────────────
   The disclosure used to repeat the one line printed above it. It now carries
   what the excess means, what the tier adds and what nothing covers, so the
   choice can be made where it is offered rather than two steps later. */
/* The generic details body is an absolutely positioned 240px bubble — right for one line of
   text, impossible for a lead sentence plus a list of exclusions. Protection opens in place
   instead, inside the card, so it can be read on a phone without overflowing anything. */
.insideauto-addon-cover {
  margin-top: 10px; padding: 12px 14px; border: 1px solid #e5e5e5; border-radius: 10px;
  background: #fafafa; color: #444; font-size: 13px; line-height: 1.5; font-weight: 400;
}
.insideauto-addon-cover p {
  position: static; width: auto; margin: 0; padding: 0; border: 0; border-radius: 0;
  background: none; box-shadow: none; color: inherit; font-size: inherit; line-height: inherit;
}
.insideauto-addon-details-lead { font-weight: 600; color: #1f2937; }
.insideauto-addon-details-label { display: block; margin: 12px 0 5px; font-size: 11px;
  font-weight: 700; letter-spacing: .04em; text-transform: uppercase; opacity: .65; }
.insideauto-addon-details-list { margin: 0; padding-left: 18px; }
.insideauto-addon-details-list li { margin-bottom: 5px; line-height: 1.45; }

/* The summary is the only control that closes a details panel, so it stays put and changes
   what it says instead of disappearing. */
.insideauto-addon-details [data-details-label-close],
.insideauto-addon-details[open] [data-details-label-open] { display: none; }
.insideauto-addon-details[open] [data-details-label-close] { display: inline; }

/* The protection panel opens in flow, so the details element grows from the width of the word
   "Details" to the width of the panel. In the right-aligned controls row that drags the summary
   634px to the left of where the customer just tapped it, which reads as the label having moved
   rather than the panel having opened. Pin it to the edge the row aligns to. */
.insideauto-addon-details[open] > summary { text-align: right; }
@media (max-width: 760px) {
  /* Below this the row switches to space-between and the details is the left-hand item, so its
     left edge is already the fixed one. */
  .insideauto-addon-details[open] > summary { text-align: left; }
}

/* ── Public terms page ────────────────────────────────────────────────────────
   Reached by scanning a code stuck in a vehicle, so it is read on a phone by
   someone who may not speak either language natively: generous line height, a
   visible language switch, and the text itself left exactly as written. */
.insideauto-terms-page { padding: 32px 0 64px; }
.insideauto-terms-head { margin-bottom: 24px; }
.insideauto-terms-head h1 { margin: 6px 0 8px; }
.insideauto-terms-lead { margin: 0; color: #475569; max-width: 52ch; line-height: 1.55; }
.insideauto-terms-body { display: block; white-space: pre-wrap; line-height: 1.65;
  font-size: 15px; color: #1f2937; background: #fff; border: 1px solid #e2e8f0;
  border-radius: 14px; padding: 22px 24px; overflow-wrap: anywhere; }
.insideauto-terms-foot { margin-top: 20px; color: #475569; }
@media (max-width: 640px) {
  .insideauto-terms-body { padding: 18px 16px; font-size: 14px; }
}

/* An expired charge is money that has quietly stopped being collectable — the customer's link
   refuses it while the admin panel looks entirely normal. Say so where the date is. */
.is-expired-due { color: #b91c1c; }
.damage-charge-expired { display: block; margin-top: 5px; color: #b91c1c; font-size: 12px;
  line-height: 1.45; max-width: 44ch; }