:root {
  --ink: #18181b;
  --muted: #71717a;
  --line: #e4e4e7;
  --surface: #ffffff;
  --surface-subtle: #fafafa;
  --surface-muted: #f4f4f5;
  --control-border: #d4d4d8;
  --canvas: #f6f6f7;
  --primary: #27272a;
  --primary-dark: #09090b;
  --accent-soft: #f1f1f3;
  --success-soft: #dcfce7;
  --success: #166534;
  --warning-soft: #fffbeb;
  --warning: #92400e;
  --danger-soft: #fef2f2;
  --danger: #b42318;
  --sidebar-width: 248px;
  --app-header-height: 80px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--canvas);
  font-synthesis: none;
}

* { box-sizing: border-box; }

body { margin: 0; min-height: 100vh; background: var(--canvas); }
a { color: var(--primary); text-underline-offset: 3px; }

.shell { width: min(1080px, calc(100% - 2rem)); margin-inline: auto; }
.site-header { background: var(--surface); border-bottom: 1px solid var(--line); }
.header-inner { min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.brand { color: var(--ink); font-size: 1.25rem; font-weight: 800; letter-spacing: -0.04em; text-decoration: none; }
.app-shell { display: grid; grid-template: var(--app-header-height) 1fr / var(--sidebar-width) minmax(0, 1fr); grid-template-areas: "header header" "sidebar content"; min-height: 100vh; }
.app-header { position: sticky; z-index: 20; top: 0; display: grid; grid-area: header; grid-template-columns: minmax(0, 1fr) auto; width: 100%; min-width: 0; border-bottom: 1px solid var(--line); background: rgba(255, 255, 255, 0.96); box-shadow: 0 1px 10px rgba(24, 24, 27, 0.035); backdrop-filter: blur(14px); }
.app-organization-context { display: grid; align-content: center; min-width: 0; padding: 0.75rem clamp(1.25rem, 3vw, 2.5rem); }
.app-organization-row { display: flex; min-width: 0; align-items: center; gap: 1rem; }
.app-organization-brand { display: flex; min-width: 0; align-items: center; gap: 0.75rem; color: var(--ink); text-decoration: none; }
.app-organization-logo { display: grid; flex: 0 0 42px; width: 42px; height: 42px; overflow: hidden; place-items: center; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.app-organization-logo-image { width: 100%; height: 100%; object-fit: cover; }
.app-organization-logo-fallback { display: grid; width: 100%; height: 100%; place-items: center; background: var(--accent-soft); color: var(--primary-dark); font-size: 0.9rem; font-weight: 900; }
.app-organization-name { overflow: hidden; color: var(--ink); font-size: 1.3rem; font-weight: 850; letter-spacing: -0.035em; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.organization-switcher { display: flex; min-width: 0; align-items: center; gap: 0.4rem; }
.organization-switcher select { width: auto; max-width: 220px; min-height: 32px; padding: 0.3rem 2rem 0.3rem 0.6rem; border-color: var(--line); background-color: var(--surface-subtle); font-size: 0.78rem; }
.app-user-context { display: flex; align-items: center; gap: 0.75rem; padding: 0 1.5rem; border-left: 1px solid var(--line); }
.user-avatar { display: grid; flex: 0 0 36px; width: 36px; height: 36px; place-items: center; border-radius: 50%; background: var(--accent-soft); color: var(--primary-dark); font-size: 0.82rem; font-weight: 900; }
.user-details { display: grid; min-width: 120px; line-height: 1.25; }
.user-details strong { overflow: hidden; max-width: 180px; font-size: 0.84rem; text-overflow: ellipsis; white-space: nowrap; }
.user-details small { color: var(--muted); font-size: 0.72rem; }
.header-sign-out { appearance: none; border: 0; padding: 0.4rem; background: none; color: var(--muted); font: inherit; font-size: 0.76rem; font-weight: 750; cursor: pointer; }
.header-sign-out:hover { color: var(--danger); }
.app-sidebar { position: sticky; top: var(--app-header-height); grid-area: sidebar; align-self: start; height: calc(100vh - var(--app-header-height)); padding: 1.5rem 1rem; overflow-y: auto; border-right: 1px solid var(--line); background: var(--surface-subtle); }
.sidebar-nav { display: grid; gap: 1.8rem; }
.sidebar-section { display: grid; gap: 0.3rem; }
.sidebar-section h2 { margin: 0 0 0.35rem; padding: 0 0.75rem; color: #a1a1aa; font-size: 0.66rem; font-weight: 850; letter-spacing: 0.11em; text-transform: uppercase; }
.sidebar-link { position: relative; display: flex; min-height: 40px; align-items: center; padding: 0.6rem 0.75rem; border-radius: 9px; color: #52525b; font-size: 0.88rem; font-weight: 700; text-decoration: none; transition: background-color 120ms ease, color 120ms ease; }
.sidebar-link:hover { background: var(--accent-soft); color: var(--ink); }
.sidebar-link.active { background: var(--accent-soft); color: var(--primary-dark); }
.sidebar-link.active::before { position: absolute; top: 50%; left: 0; width: 3px; height: 18px; border-radius: 0 3px 3px 0; background: var(--primary); content: ""; transform: translateY(-50%); }
.app-content { grid-area: content; min-width: 0; padding: clamp(1.75rem, 3vw, 3rem); }
.small-button { min-height: 32px; padding: 0.35rem 0.6rem; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); color: var(--ink); font: inherit; font-size: 0.75rem; font-weight: 750; cursor: pointer; }
.link-button { appearance: none; border: 0; padding: 0; background: none; color: var(--primary); font: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.page-content { padding-block: 3.5rem; }

h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 0.75rem; font-size: clamp(2rem, 4vw, 3.25rem); line-height: 1.05; letter-spacing: -0.045em; }
h2 { margin-bottom: 0.5rem; font-size: 1.15rem; }
.lead { color: var(--muted); font-size: 1.05rem; line-height: 1.6; }
.eyebrow { margin-bottom: 0.7rem; color: var(--primary); font-size: 0.76rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }

.card { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 1px 2px rgba(24, 24, 27, 0.04), 0 8px 24px rgba(24, 24, 27, 0.035); }
.auth-card, .form-card { width: min(100%, 600px); margin-inline: auto; padding: clamp(1.5rem, 4vw, 2.75rem); }
.form-card { width: min(100%, 720px); }
.form-stack { display: grid; gap: 1.25rem; margin-top: 2rem; }
.field { display: grid; gap: 0.45rem; }
.field-row { display: grid; grid-template-columns: 1.25fr 0.75fr; align-items: start; gap: 1rem; }
label, .field-label { font-size: 0.9rem; font-weight: 700; }
.field > label.required::after, .field:has(> input[required], > select[required], > textarea[required]) > label::after { color: var(--danger); content: " *"; }
input, select, textarea { width: 100%; min-height: 46px; padding: 0.75rem 0.9rem; border: 1px solid var(--control-border); border-radius: 9px; background: var(--surface); color: var(--ink); font: inherit; }
select { appearance: none; padding-right: 2.75rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2327272a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.9rem center; background-size: 18px; }
textarea { resize: vertical; line-height: 1.5; }
input:focus, select:focus, textarea:focus { outline: 3px solid rgba(39, 39, 42, 0.14); border-color: var(--primary); }
input[readonly], input:disabled, select:disabled, textarea:disabled { background-color: var(--surface-muted); color: var(--muted); cursor: not-allowed; opacity: 1; }
.field .choices { width: 100%; margin: 0; font-size: inherit; }
.field .choices__inner { min-height: 46px; padding: 0.55rem 0.7rem; border: 1px solid var(--control-border); border-radius: 9px; background: var(--surface); font-size: inherit; }
.field .choices__list--single { padding: 0.2rem 1.5rem 0.2rem 0.2rem; }
.field .choices__placeholder { color: var(--muted); opacity: 1; }
.field .choices.is-disabled { cursor: not-allowed; opacity: 1; }
.field .choices.is-disabled .choices__inner { background: var(--surface-muted); color: var(--muted); cursor: not-allowed; }
.field .choices.is-disabled .choices__item, .field .choices.is-disabled .choices__placeholder { color: var(--muted); }
.field .choices.is-focused .choices__inner, .field .choices.is-open .choices__inner { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(39, 39, 42, 0.14); }
.field .choices__input { min-height: 40px; margin: 0; padding: 0.6rem 0.7rem; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: var(--surface); }
.field .choices__list--dropdown, .field .choices__list[aria-expanded] { z-index: 30; border-color: var(--control-border); border-radius: 0 0 9px 9px; box-shadow: 0 12px 24px rgba(24, 24, 27, 0.12); }
.field .choices__list--dropdown .choices__item--selectable { padding: 0.7rem 0.9rem; }
.field .choices__list--dropdown .choices__item--selectable.is-highlighted { background: var(--accent-soft); color: var(--primary-dark); }
.uppercase { text-transform: uppercase; }
.hint { color: var(--muted); font-size: 0.8rem; line-height: 1.5; }
.field-error { color: var(--danger); }
fieldset { display: grid; gap: 1.25rem; margin: 0; padding: 0 0 1.75rem; border: 0; border-bottom: 1px solid var(--line); }
fieldset:last-of-type { padding-bottom: 0; border: 0; }
legend { display: block; width: 100%; margin: 0; padding: 0 0 0.35rem; font-size: 1.1rem; font-weight: 800; line-height: 1.35; }
.section-help { margin: 0 0 0.25rem; color: var(--muted); font-size: 0.88rem; line-height: 1.5; }
.checkbox-field { display: flex; min-height: 46px; flex-direction: row; align-items: center; gap: 0.65rem; padding-top: 1.75rem; }
.checkbox-field input { width: 18px; min-height: 18px; margin: 0; }
.checkbox-field label { font-weight: 650; }
.complement-toggle { padding-top: 0; }
.roles-fieldset { gap: 1rem; }
.role-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.role-card { display: grid; align-content: start; gap: 1rem; min-height: 174px; padding: 1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-subtle); transition: border-color 120ms ease, background-color 120ms ease, box-shadow 120ms ease; }
.role-card:hover:not(.locked) { border-color: #a1a1aa; }
.role-card.selected { border-color: var(--primary); background: var(--surface); box-shadow: 0 0 0 1px var(--primary); }
.role-card:focus-within { outline: 3px solid rgba(39, 39, 42, 0.12); outline-offset: 2px; }
.role-card.locked { opacity: 0.72; }
.role-card-heading { min-width: 0; }
.role-option { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 0.75rem; cursor: pointer; }
.role-card.locked .role-option { cursor: not-allowed; }
.role-icon { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 10px; background: var(--accent-soft); color: var(--muted); font-size: 0.78rem; font-weight: 900; transition: background-color 120ms ease, color 120ms ease; }
.role-card.selected .role-icon { background: var(--primary); color: var(--surface); }
.role-copy { display: grid; min-width: 0; gap: 0.15rem; }
.role-copy strong { font-size: 0.95rem; }
.role-copy small { color: var(--muted); font-size: 0.76rem; font-weight: 500; line-height: 1.35; }
.role-option input[type="checkbox"] { width: 21px; min-height: 21px; margin: 0; padding: 0; accent-color: var(--primary); cursor: pointer; }
.role-option input[type="checkbox"]:disabled { cursor: not-allowed; }
.role-status-control { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 0.75rem; padding-top: 0.9rem; border-top: 1px solid var(--line); }
.role-status-control[hidden], .role-disabled-copy[hidden] { display: none; }
.role-status-control label { color: var(--muted); font-size: 0.78rem; }
.role-status-control select { min-height: 38px; padding: 0.45rem 2.4rem 0.45rem 0.7rem; font-size: 0.84rem; }
.role-disabled-copy { margin: 0; padding-top: 0.9rem; border-top: 1px solid var(--line); color: var(--muted); font-size: 0.78rem; line-height: 1.4; }
.two-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.three-columns { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.one-column { grid-template-columns: minmax(0, 1fr); }
.form-row-with-action { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
.carta-porte-destination-fields { grid-template-columns: minmax(0, 3fr) minmax(180px, 1fr); }
.concept-pricing-row { grid-template-columns: minmax(110px, 0.65fr) minmax(240px, 1.5fr) minmax(150px, 0.85fr); }
.carta-porte-fields { display: grid; gap: 1.25rem; }
.carta-porte-fields[hidden] { display: none; }
[data-carta-porte-trailers-target="assignment"][hidden] { display: none; }
[data-provider-relationship-target="container"][hidden] { display: none; }
.input-summary { padding: 0.9rem 1rem; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-subtle); color: var(--muted); font-size: 0.88rem; line-height: 1.5; }
.input-summary strong { color: var(--ink); }
.input-summary-details { display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; margin-top: 0.35rem; }
.subsection-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; padding-top: 0.4rem; }
.subsection-heading h3, .nested-item-heading h3 { margin: 0; font-size: 1rem; }
.subsection-heading p { margin: 0.25rem 0 0; color: var(--muted); font-size: 0.82rem; }
.subsection-heading + .nested-items { margin-top: 1rem; }
.nested-items { display: grid; gap: 1rem; }
.nested-item { display: grid; gap: 1rem; padding: 1.25rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-subtle); }
.nested-item[hidden] { display: none; }
.nested-item-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.carta-porte-location-section { display: grid; gap: 0.75rem; }
.carta-porte-location-section > .nested-items { gap: 0.75rem; margin-top: 0; }
.carta-porte-location-item { gap: 0.75rem; padding: 1rem; }
.carta-porte-location-item .nested-item-heading p { margin: 0.1rem 0 0; }
.trip-stop-heading, .trip-stop-actions, .trip-stop-order-actions,
.nested-item-heading-title, .nested-item-actions, .nested-item-order-actions { display: flex; align-items: center; gap: 0.65rem; }
.trip-stop-number, .nested-item-number { display: grid; flex: 0 0 30px; width: 30px; height: 30px; place-items: center; border-radius: 50%; background: var(--accent-soft); color: var(--primary-dark); font-size: 0.78rem; font-weight: 850; }
.trip-stop-order-actions, .nested-item-order-actions { gap: 0.3rem; }
.trip-stop-order-button, .nested-item-order-button { display: grid; width: 30px; min-height: 30px; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); color: var(--muted); font: inherit; font-weight: 850; cursor: pointer; }
.trip-stop-order-button:hover:not(:disabled), .nested-item-order-button:hover:not(:disabled) { border-color: var(--primary); color: var(--primary); }
.trip-stop-order-button:disabled, .nested-item-order-button:disabled { cursor: not-allowed; opacity: 0.35; }
.trip-stop-fields { grid-template-columns: minmax(130px, 0.6fr) minmax(220px, 1.2fr) minmax(210px, 1fr); }
.detail-list dd small { display: block; margin-top: 0.25rem; color: var(--muted); }
.nested-item-details { border-top: 1px solid var(--line); padding-top: 0.9rem; }
.nested-item-details summary { color: var(--primary); font-size: 0.82rem; font-weight: 750; cursor: pointer; }
.nested-item-details-content { display: grid; gap: 1rem; padding-top: 1rem; }
.tax-editor { display: grid; gap: 0.85rem; }
.tax-group { overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.tax-group h4 { margin: 0; padding: 0.75rem 1rem; border-bottom: 1px solid var(--line); background: var(--surface-subtle); color: var(--muted); font-size: 0.76rem; letter-spacing: 0.06em; text-transform: uppercase; }
.tax-row { display: grid; grid-template-columns: minmax(140px, 0.8fr) minmax(180px, 1fr) minmax(130px, 0.7fr); align-items: center; gap: 1rem; min-height: 66px; padding: 0.7rem 1rem; border-bottom: 1px solid var(--line); color: var(--muted); }
.tax-row:last-child { border-bottom: 0; }
.tax-row.active { color: var(--ink); }
.tax-choice { display: flex; align-items: center; gap: 0.7rem; }
.tax-choice input { width: 18px; min-height: 18px; margin: 0; accent-color: var(--primary); }
.tax-choice label { cursor: pointer; }
.tax-row select { grid-column: 2; min-height: 40px; padding-block: 0.55rem; }
.tax-amount { grid-column: 3; text-align: right; font-variant-numeric: tabular-nums; }
.cfdi-totals { display: grid; gap: 0; margin: 0; margin-left: auto; width: min(100%, 340px); }
.cfdi-totals div { display: flex; justify-content: space-between; gap: 1rem; padding: 0.55rem 0; color: var(--muted); }
.cfdi-totals dt, .cfdi-totals dd { margin: 0; }
.cfdi-totals dd { color: var(--ink); font-variant-numeric: tabular-nums; }
.cfdi-totals .total { margin-top: 0.3rem; padding-top: 0.85rem; border-top: 1px solid var(--line); color: var(--ink); font-size: 1.05rem; font-weight: 850; }
.cfdi-cancellation-replacement[hidden] { display: none; }

.button { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; padding: 0.75rem 1.1rem; border: 1px solid transparent; border-radius: 9px; font: inherit; font-weight: 750; text-decoration: none; cursor: pointer; }
.button.primary { background: var(--primary); color: #fff; }
.button.primary:hover { background: var(--primary-dark); }
.button.secondary { border-color: var(--line); background: var(--surface); color: var(--ink); }
.button.danger { background: var(--danger); color: #fff; }
.button:disabled { cursor: not-allowed; opacity: 0.5; }
.form-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.75rem; padding-top: 0.5rem; }
.form-actions .button { flex: 0 0 auto; width: auto; min-width: 140px; }
.card-footer { margin: 1.75rem 0 0; padding-top: 1.25rem; border-top: 1px solid var(--line); color: var(--muted); font-size: 0.9rem; }
.split-links { display: flex; justify-content: space-between; gap: 1rem; }

.flash { margin-bottom: 1.5rem; padding: 0.85rem 1rem; border-radius: 10px; background: var(--accent-soft); color: var(--primary-dark); }
.flash.alert { background: var(--danger-soft); color: var(--danger); }
.payment-complement-guidance { display: grid; gap: 0.55rem; }
.payment-complement-guidance p, .payment-complement-guidance ul { margin: 0; }
.payment-complement-guidance ul { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; padding: 0; list-style: none; }
.form-errors { margin-top: 1.5rem; padding: 1rem; border-radius: 10px; background: var(--danger-soft); color: var(--danger); }
.form-errors p { margin-bottom: 0.5rem; font-weight: 700; }
.form-errors ul { margin: 0; padding-left: 1.25rem; }

.page-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; }
.role-badge, .coming-soon { display: inline-flex; padding: 0.35rem 0.65rem; border-radius: 999px; background: var(--accent-soft); color: var(--primary-dark); font-size: 0.76rem; font-weight: 800; }
.status-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1rem; }
.status-card { display: flex; gap: 1.1rem; min-height: 190px; padding: 1.5rem; }
.status-card p { color: var(--muted); line-height: 1.55; }
.status-icon { display: grid; flex: 0 0 38px; width: 38px; height: 38px; place-items: center; border-radius: 50%; background: var(--warning-soft); color: var(--warning); font-weight: 850; }
.status-icon.complete { background: var(--success-soft); color: var(--success); }
.muted-card { box-shadow: none; }
.text-link { font-weight: 750; }
.account-summary { display: grid; grid-template-columns: 1fr 2fr; gap: 2rem; margin-top: 1rem; padding: 1.5rem; }
.account-summary dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin: 0; }
.account-summary dl div { min-width: 0; }
.account-summary dt { margin-bottom: 0.25rem; color: var(--muted); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; }
.account-summary dd { overflow-wrap: anywhere; margin: 0; }

.wide-form-card { width: min(100%, 820px); }
.heading-actions, .heading-with-status { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.heading-actions form { margin: 0; }
.heading-with-status h1 { margin-bottom: 0; }
.list-card { overflow: hidden; }
.table-scroll { overflow-x: auto; }
.card .table-scroll { margin: 0; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 1rem 1.25rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
th { background: var(--surface-subtle); color: var(--muted); font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: var(--surface-subtle); }
td small { display: block; max-width: 300px; margin-top: 0.25rem; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.trip-description { max-width: none; overflow: visible; text-overflow: clip; white-space: normal; }
.muted-text { color: var(--muted); }
.record-link { color: var(--ink); font-weight: 800; }
.status-pill { display: inline-flex; align-items: center; width: max-content; padding: 0.28rem 0.58rem; border-radius: 999px; font-size: 0.72rem; font-weight: 800; }
.status-pill.success { background: var(--success-soft); color: var(--success); }
.status-pill.warning { background: var(--warning-soft); color: var(--warning); }
.status-pill.danger { background: var(--danger-soft); color: var(--danger); }
.status-pill.neutral { background: var(--accent-soft); color: var(--muted); }
.empty-state { display: grid; justify-items: center; padding: clamp(3rem, 8vw, 6rem) 1.5rem; text-align: center; }
.empty-state p { max-width: 520px; color: var(--muted); line-height: 1.6; }
.empty-icon { display: grid; width: 48px; height: 48px; margin-bottom: 1rem; place-items: center; border-radius: 14px; background: var(--accent-soft); color: var(--primary); font-weight: 900; }
.detail-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.detail-card { --detail-card-padding: 1.5rem; overflow: hidden; padding: var(--detail-card-padding); }
.detail-card > .table-scroll { width: calc(100% + var(--detail-card-padding) + var(--detail-card-padding)); margin-inline: calc(0px - var(--detail-card-padding)); }
.detail-card > .table-scroll:last-child { margin-bottom: calc(0px - var(--detail-card-padding)); }
.detail-card-wide { grid-column: 1 / -1; }
.detail-card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.issuance-checklist { margin-bottom: 1rem; padding: 1.5rem; }
.issuance-checklist h2 { margin-bottom: 0; }
.issuance-ready-copy { margin: 1rem 0 0; color: var(--success); font-weight: 700; }
.issuance-blockers { display: grid; gap: 0; margin: 1rem 0 0; padding: 0; list-style: none; }
.issuance-blockers li { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: center; gap: 0.75rem; padding: 0.85rem 0; border-top: 1px solid var(--line); }
.issuance-blocker-icon { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; background: var(--warning-soft); color: var(--warning); font-weight: 900; }
.detail-list { display: grid; gap: 0; margin: 1.5rem 0 0; }
.detail-list div { display: grid; grid-template-columns: 140px 1fr; gap: 1rem; padding-block: 0.85rem; border-top: 1px solid var(--line); }
.detail-list dt { color: var(--muted); font-size: 0.82rem; font-weight: 700; }
.detail-list dd { overflow-wrap: anywhere; margin: 0; }
.related-list-card { margin-bottom: 1rem; }
.compact-empty-state { padding-block: 2.5rem; }
.financial-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.financial-summary-card { display: grid; gap: 0.4rem; padding: 1.4rem; }
.financial-summary-card span { color: var(--muted); font-size: 0.78rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.financial-summary-card strong { font-size: clamp(1.45rem, 2.5vw, 2rem); font-variant-numeric: tabular-nums; }
.financial-summary-card small { color: var(--muted); }
.financial-section-card { margin-top: 1rem; }
.financial-section-card .section-heading p { margin-top: 0.35rem; }
.money-cell { white-space: nowrap; font-variant-numeric: tabular-nums; }
.payment-complement-summary { display: flex; align-items: center; gap: 0.55rem; white-space: nowrap; }
.financial-subsection-heading { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--line); }
.payment-allocation-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; padding-top: 0.4rem; }
.payment-allocation-heading h3 { margin: 0; font-size: 1rem; }
.payment-allocation-heading p { margin: 0.25rem 0 0; color: var(--muted); font-size: 0.82rem; }
.payment-allocation-summary { display: flex; flex: 0 0 auto; gap: 1.25rem; margin: 0; }
.payment-allocation-summary div { display: grid; gap: 0.15rem; }
.payment-allocation-summary dt { color: var(--muted); font-size: 0.7rem; font-weight: 750; letter-spacing: 0.06em; text-transform: uppercase; }
.payment-allocation-summary dd { margin: 0; font-weight: 850; font-variant-numeric: tabular-nums; text-align: right; }
.payment-allocation-summary dd.overallocated { color: var(--danger); }
.payment-allocation-list { display: grid; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; }
.payment-allocation-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, 0.75fr); align-items: center; gap: 1rem; padding: 1rem; border-bottom: 1px solid var(--line); background: var(--surface-subtle); }
.payment-allocation-row:last-child { border-bottom: 0; }
.payment-allocation-choice { display: flex; align-items: center; gap: 0.75rem; }
.payment-allocation-choice input { flex: 0 0 auto; width: 18px; min-height: 18px; margin: 0; accent-color: var(--primary); }
.payment-allocation-choice label { display: grid; gap: 0.2rem; cursor: pointer; }
.payment-allocation-choice label span { color: var(--muted); font-size: 0.8rem; }
.payment-allocation-amount { display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr) minmax(130px, 150px); align-items: center; gap: 0.75rem; }
.payment-allocation-amount label { font-size: 0.75rem; white-space: nowrap; }
.payment-allocation-amount input { min-width: 0; min-height: 40px; padding-block: 0.5rem; }
.category-order-actions { display: flex; align-items: center; gap: 0.35rem; }
.category-order-actions form { margin: 0; }

.team-layout { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(280px, 0.8fr); gap: 1rem; align-items: start; }
.team-list-card, .pending-card { overflow: hidden; }
.invitation-card { padding: 1.5rem; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.25rem; }
.section-heading h2 { margin: 0; }
.count-badge { display: grid; min-width: 30px; height: 30px; place-items: center; border-radius: 999px; background: var(--accent-soft); color: var(--primary-dark); font-size: 0.78rem; font-weight: 800; }
.compact-form { margin-top: 1.25rem; }
.inline-role-form { display: flex; align-items: center; gap: 0.4rem; }
.inline-role-form select { width: auto; min-width: 145px; min-height: 34px; padding-block: 0.35rem; font-size: 0.8rem; }
.table-actions { text-align: right; }
.table-actions form { display: inline-block; }
.table-actions .text-action + .text-action { margin-left: 0.65rem; }
.danger-link, .text-action { appearance: none; border: 0; padding: 0; background: none; color: var(--danger); font: inherit; font-size: 0.8rem; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.text-action { color: var(--primary); }
.current-user-label { color: var(--muted); font-size: 0.78rem; font-weight: 700; }
.pending-card { margin-top: 1rem; }
.invitation-actions { display: flex; justify-content: flex-end; gap: 0.75rem; }
.invitation-acceptance-card { width: min(100%, 620px); }
.invited-email { display: grid; gap: 0.2rem; margin-block: 1.5rem; padding: 1rem; border-radius: 10px; background: var(--canvas); }
.invited-email span { color: var(--muted); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; }
.acceptance-help { margin-block: 1.5rem; color: var(--muted); line-height: 1.6; }
.full-button { width: 100%; margin-top: 1rem; }
.organization-logo-editor { display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: center; gap: 1.25rem; }
.organization-logo-preview { display: grid; width: 96px; height: 96px; overflow: hidden; place-items: center; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.organization-logo-preview-image { width: 100%; height: 100%; object-fit: cover; }
.organization-logo-preview-fallback { display: grid; width: 100%; height: 100%; place-items: center; background: var(--accent-soft); color: var(--primary-dark); font-size: 1.75rem; font-weight: 900; }

.billing-setup-grid { align-items: start; }
.billing-setup-copy { margin: 1.5rem 0 0; color: var(--muted); line-height: 1.6; }
.billing-setup-action { width: 100%; margin-top: 1.5rem; }
.billing-production-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.75rem; margin-top: 1.5rem; }
.billing-production-steps span { padding: 0.85rem 1rem; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-subtle); color: var(--muted); font-size: 0.8rem; font-weight: 750; text-align: center; }

.map-coordinate-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.map-field-row { grid-template-columns: 1fr; }
.map-dialog { width: min(920px, calc(100% - 2rem)); max-width: none; max-height: calc(100vh - 2rem); margin: auto; padding: 0; overflow: hidden; border: 0; border-radius: 16px; background: var(--surface); color: var(--ink); box-shadow: 0 24px 80px rgba(24, 24, 27, 0.28); }
.map-dialog::backdrop { background: rgba(24, 24, 27, 0.58); backdrop-filter: blur(2px); }
.map-dialog-panel { display: grid; max-height: calc(100vh - 2rem); }
.map-dialog-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1.25rem 1.5rem; border-bottom: 1px solid var(--line); }
.map-dialog-heading h2 { margin: 0 0 0.25rem; }
.map-dialog-heading p, .map-dialog-details p { margin: 0; color: var(--muted); font-size: 0.88rem; line-height: 1.5; }
.map-dialog-close { display: grid; flex: 0 0 36px; width: 36px; min-height: 36px; place-items: center; padding: 0; border: 0; border-radius: 50%; background: var(--canvas); color: var(--muted); font: inherit; font-size: 1.5rem; line-height: 1; cursor: pointer; }
.location-map-canvas { width: 100%; height: min(58vh, 520px); min-height: 360px; background: #e4e4e7; }
.map-dialog-details { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.5rem 1rem; padding: 0.85rem 1.5rem; border-top: 1px solid var(--line); }
.map-coordinate-preview strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.map-dialog-actions { display: flex; justify-content: flex-end; gap: 0.75rem; padding: 1rem 1.5rem; border-top: 1px solid var(--line); }

@media (max-width: 900px) {
  :root { --sidebar-width: 212px; }
  .app-user-context { padding-inline: 1rem; }
  .user-details { min-width: 0; }
  .user-details strong { max-width: 120px; }
}

@media (max-width: 620px) {
  .issuance-blockers li { grid-template-columns: 28px minmax(0, 1fr); }
  .issuance-blockers .text-link { grid-column: 2; }
}

@media (max-width: 720px) {
  .app-shell { display: block; }
  .app-header { position: static; display: grid; grid-template-columns: minmax(0, 1fr) auto; }
  .app-user-context { min-height: 64px; padding-inline: 1rem; border-left: 0; }
  .app-organization-context { min-height: 64px; padding: 0.75rem 1rem; }
  .app-organization-row { flex-wrap: wrap; }
  .app-organization-name { font-size: 1.05rem; }
  .app-sidebar { position: sticky; z-index: 15; top: 0; height: auto; padding: 0.65rem 1rem; overflow-x: auto; overflow-y: hidden; border-right: 0; border-bottom: 1px solid var(--line); }
  .sidebar-nav { display: flex; width: max-content; gap: 0.35rem; }
  .sidebar-section { display: contents; }
  .sidebar-section h2 { display: none; }
  .sidebar-link { min-height: 36px; padding: 0.5rem 0.7rem; white-space: nowrap; }
  .sidebar-link.active::before { top: auto; right: 0.7rem; bottom: 0; left: 0.7rem; width: auto; height: 2px; transform: none; }
  .app-content { padding: 1.5rem 1rem 2.5rem; }
  .header-inner { align-items: flex-start; padding-block: 1rem; }
  .page-content { padding-block: 2rem; }
  .field-row, .field-row.three-columns, .role-grid, .status-grid, .financial-summary-grid, .account-summary, .account-summary dl, .detail-grid, .team-layout, .billing-production-steps { grid-template-columns: 1fr; }
  .tax-row { grid-template-columns: 1fr; gap: 0.65rem; }
  .tax-row select, .tax-amount { grid-column: 1; }
  .tax-amount { text-align: left; }
  .checkbox-field { padding-top: 0; }
  .page-heading { align-items: flex-start; }
  .split-links { flex-direction: column; }
  .heading-actions { width: 100%; }
  .detail-list div { grid-template-columns: 1fr; gap: 0.25rem; }
  .organization-switcher select { max-width: min(220px, 60vw); }
  .organization-logo-editor { grid-template-columns: 72px minmax(0, 1fr); }
  .organization-logo-preview { width: 72px; height: 72px; border-radius: 12px; }
  .location-map-canvas { min-height: 300px; }
  .map-dialog-details { display: grid; }
  .payment-allocation-heading { align-items: stretch; flex-direction: column; }
  .payment-allocation-summary { justify-content: space-between; }
  .payment-allocation-row { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .user-avatar { display: none; }
  .user-details strong { max-width: 110px; }
  .payment-allocation-amount { grid-template-columns: 1fr; }
  .payment-allocation-amount label { white-space: normal; }
}
