:root {
    /* Fix 22 — locked Handy Car Rental design tokens from UI & Implementation Specification */
    --color-primary: #0B6EF6;
    --color-primary-dark: #0854B8;
    --color-primary-soft: #EAF4FF;
    --color-success: #16A34A;
    --color-success-soft: #DEFCE7;
    --color-warning: #F59E0B;
    --color-warning-soft: #FFF7E6;
    --color-danger: #E63946;
    --color-danger-soft: #FEE2E2;
    --color-bg: #F8FAFC;
    --color-surface: #FFFFFF;
    --color-surface-muted: #F8FAFC;
    --color-border: #E2E8F0;
    --color-border-strong: #CBD5E1;
    --color-text: #0F172A;
    --color-text-muted: #64748B;
    --shadow-card: 0 1px 2px rgba(15, 23, 42, 0.06);
    --shadow-modal: 0 4px 16px rgba(15, 23, 42, 0.12);
    --radius-card: 8px;
    --radius-control: 6px;
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;

    /* Backward-compatible aliases used by existing HCR CSS */
    --hcr-primary: var(--color-primary);
    --hcr-primary-dark: var(--color-primary-dark);
    --hcr-primary-soft: var(--color-primary-soft);
    --hcr-accent: #00B894;
    --hcr-success: var(--color-success);
    --hcr-warning: var(--color-warning);
    --hcr-danger: var(--color-danger);
    --hcr-bg: var(--color-bg);
    --hcr-surface: var(--color-surface);
    --hcr-surface-2: var(--color-surface-muted);
    --hcr-border: var(--color-border);
    --hcr-border-strong: var(--color-border-strong);
    --hcr-text: var(--color-text);
    --hcr-muted: var(--color-text-muted);
    --hcr-shadow: var(--shadow-card);
    --hcr-shadow-sm: var(--shadow-card);
    --hcr-radius: var(--radius-card);
    --hcr-radius-sm: var(--radius-card);
}

* { box-sizing: border-box; }

html, body { min-height: 100%; }

body {
    margin: 0;
    font-family: "Segoe UI", Arial, sans-serif;
    font-size: 15px;
    color: var(--hcr-text);
    background:
        radial-gradient(circle at top left, rgba(37, 99, 235, 0.12), transparent 32rem),
        linear-gradient(135deg, #f8fbff 0%, #eef4ff 40%, #f7f8fb 100%);
}

a { color: var(--hcr-primary); text-decoration: none; }
a:hover { color: var(--hcr-primary-dark); text-decoration: underline; }

.hcr-app-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(15, 23, 42, 0.94);
    color: #fff;
    box-shadow: 0 8px 26px rgba(15, 23, 42, 0.20);
    backdrop-filter: blur(10px);
}

.hcr-header-inner {
    max-width: 1480px;
    margin: 0 auto;
    padding: 14px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.hcr-brand {
    color: #fff;
    font-size: 21px;
    font-weight: 800;
    letter-spacing: 0.2px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.hcr-brand::before {
    content: "HCR";
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    background: linear-gradient(135deg, var(--hcr-primary), var(--hcr-accent));
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    box-shadow: 0 10px 22px rgba(37, 99, 235, 0.35);
}

.hcr-brand:hover { color: #fff; text-decoration: none; }

.hcr-nav {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.hcr-nav a {
    color: #dbeafe;
    font-weight: 700;
    padding: 10px 13px;
    border-radius: 999px;
    transition: background .15s ease, color .15s ease, transform .15s ease;
}

.hcr-nav a:hover {
    color: #fff;
    background: rgba(255,255,255,0.12);
    text-decoration: none;
    transform: translateY(-1px);
}

main {
    width: 100%;
    max-width: 1480px;
    margin: 0 auto;
    padding: 26px 24px 48px 24px;
}

/* General app surfaces */
.hcr-window,
.ro-window,
.orders-dashboard-window {
    width: 100%;
    margin: 0 auto 28px auto;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(219, 227, 239, .95);
    border-radius: var(--hcr-radius);
    box-shadow: var(--hcr-shadow);
    overflow: hidden;
}

.hcr-title-bar,
.ro-title-bar {
    background: linear-gradient(135deg, #0f172a 0%, #1e3a8a 52%, #2563eb 100%);
    color: #fff;
    padding: 18px 26px;
    font-size: 24px;
    font-weight: 850;
    letter-spacing: .1px;
}

.hcr-subtitle-bar {
    background: #f8fafc;
    border-bottom: 1px solid var(--hcr-border);
    padding: 12px 26px;
    color: var(--hcr-muted);
    font-weight: 700;
}

.hcr-body,
.ro-body,
.orders-dashboard-body { padding: 24px 28px 30px 28px; }

.hcr-section,
.ro-fieldset,
.ro-row-box,
.ro-options-box,
.ro-payment-box,
.ro-summary-box,
.card-section {
    background: var(--hcr-surface);
    border: 1px solid var(--hcr-border);
    border-radius: var(--hcr-radius-sm);
    padding: 20px;
    margin-bottom: 18px;
    box-shadow: var(--hcr-shadow-sm);
}

.hcr-section-title,
.ro-legend,
.ro-options-title,
.ro-payment-title,
.section-title {
    color: #1e3a8a;
    font-size: 15px;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .06em;
    border: 0;
    padding: 0;
    margin: 0 0 16px 0;
    font-style: normal;
    text-decoration: none;
}

.ro-fieldset,
.ro-options-box,
.ro-payment-box { position: relative; }
.ro-legend,
.ro-options-title,
.ro-payment-title {
    position: static;
    background: transparent;
}

.hcr-form-grid {
    display: grid;
    grid-template-columns: 150px minmax(210px, 1fr) 150px minmax(210px, 1fr);
    gap: 13px 16px;
    align-items: center;
}

.hcr-form-grid-3 {
    display: grid;
    grid-template-columns: 135px minmax(180px, 1fr) 135px minmax(180px, 1fr) 135px minmax(180px, 1fr);
    gap: 13px 16px;
    align-items: center;
}

.hcr-search-grid {
    display: grid;
    grid-template-columns: 90px minmax(280px, 1fr) auto auto;
    gap: 12px;
    align-items: center;
}

.hcr-label,
.ro-label,
.ro-customer-grid > div:nth-child(odd),
.ro-summary-grid label,
.ro-total-box label,
label {
    color: #334155;
    font-size: 14px;
    font-weight: 750;
}

.hcr-input,
.hcr-select,
.hcr-textarea,
.ro-input,
.ro-select,
.ro-textarea,
input[type="text"],
input[type="email"],
input[type="date"],
input[type="time"],
input[type="number"],
select,
textarea {
    width: 100%;
    border: 1px solid var(--hcr-border-strong);
    background: #ffffff;
    min-height: 38px;
    padding: 8px 10px;
    font-size: 15px;
    color: var(--hcr-text);
    border-radius: 10px;
    outline: none;
    font-family: "Segoe UI", Arial, sans-serif;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.hcr-input:focus,
.hcr-select:focus,
.hcr-textarea:focus,
.ro-input:focus,
.ro-select:focus,
.ro-textarea:focus,
input:focus,
select:focus,
textarea:focus {
    border-color: var(--hcr-primary);
    box-shadow: 0 0 0 4px rgba(37, 99, 235, .12);
}

.hcr-textarea,
.ro-textarea,
textarea { min-height: 86px; resize: vertical; }

.hcr-checkbox-row,
.hcr-checkline,
.ro-checkline {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 38px;
    color: #334155;
    font-weight: 700;
}

input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: var(--hcr-primary);
}

.hcr-button-row,
.ro-buttons {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin-top: 22px;
    flex-wrap: wrap;
}

.hcr-button-row-left {
    display: flex;
    justify-content: flex-start;
    gap: 12px;
    margin-top: 16px;
    flex-wrap: wrap;
}

.hcr-button,
.hcr-button-secondary,
.hcr-button-danger,
.hcr-button-dark,
.ro-button,
.orders-add-btn,
.orders-estimate-btn,
.orders-close-btn,
button,
.button {
    border: 0;
    border-radius: 999px;
    padding: 10px 18px;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    line-height: 1.15;
    font-family: "Segoe UI", Arial, sans-serif;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

.hcr-button,
.ro-button,
.orders-add-btn {
    background: linear-gradient(135deg, var(--hcr-primary), var(--hcr-accent));
    color: #fff;
    box-shadow: 0 8px 18px rgba(37, 99, 235, .22);
}

.hcr-button:hover,
.ro-button:hover,
.orders-add-btn:hover {
    color: #fff;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(37, 99, 235, .26);
}

.hcr-button-secondary,
.orders-estimate-btn {
    color: #0f172a;
    background: #e2e8f0;
    border: 1px solid #cbd5e1;
}

.hcr-button-dark { background: #0f172a; color: #fff; }
.hcr-button-danger,
.orders-close-btn { background: #fee2e2; color: #b91c1c; border: 1px solid #fecaca; }
.hcr-button-danger:hover,
.orders-close-btn:hover { background: #fecaca; color: #991b1b; text-decoration: none; }

.hcr-table-wrap,
.orders-dashboard-table-wrap {
    overflow-x: auto;
    margin-top: 18px;
}

.hcr-table,
.orders-dashboard-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid var(--hcr-border);
    border-radius: var(--hcr-radius-sm);
    overflow: hidden;
}

.hcr-table th,
.hcr-table td,
.orders-dashboard-table th,
.orders-dashboard-table td {
    border: 0;
    border-bottom: 1px solid var(--hcr-border);
    padding: 12px 13px;
    text-align: left;
    vertical-align: middle;
}

.hcr-table th,
.orders-dashboard-table th {
    background: #f1f5f9;
    color: #334155;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-size: 12px;
}

.hcr-table tbody tr:hover,
.orders-dashboard-table tbody tr:hover { background: #f8fbff; }
.hcr-table tbody tr:last-child td,
.orders-dashboard-table tbody tr:last-child td { border-bottom: 0; }

.hcr-message,
.hcr-error,
.hcr-warning,
.validation-summary-errors {
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 16px;
    font-weight: 750;
}

.hcr-message { background: #ecfdf5; color: #166534; border: 1px solid #bbf7d0; }
.hcr-error,
.validation-summary-errors { background: #fef2f2; color: #b91c1c; border: 1px solid #fecaca; }
.hcr-warning { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }
.field-validation-error { color: var(--hcr-danger); font-weight: 700; }

.hcr-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(180px, 1fr));
    gap: 16px;
}

.hcr-kpi {
    background: linear-gradient(135deg, #fff, #f8fbff);
    border: 1px solid var(--hcr-border);
    border-radius: var(--hcr-radius);
    padding: 20px;
    box-shadow: var(--hcr-shadow-sm);
}

.hcr-kpi-title { color: var(--hcr-muted); font-weight: 850; text-transform: uppercase; letter-spacing: .06em; font-size: 12px; }
.hcr-kpi-value { font-size: 38px; font-weight: 900; color: var(--hcr-primary); margin-top: 8px; }
.hcr-muted { color: var(--hcr-muted); }
.hcr-danger-text { color: var(--hcr-danger); font-weight: 800; }
.hcr-success-text { color: var(--hcr-success); font-weight: 800; }

/* Modern rental order screen */
.ro-window { max-width: 1380px; }
.ro-body { font-size: 15px; }
.ro-order-number {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 18px 0;
    padding: 9px 14px;
    background: var(--hcr-primary-soft);
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    color: #1e3a8a;
    font-weight: 850;
}
.ro-order-number span { color: var(--hcr-primary-dark); }

.ro-top-grid {
    display: grid;
    grid-template-columns: minmax(420px, 1fr) minmax(580px, 1.35fr);
    gap: 18px;
    align-items: start;
    margin-bottom: 0;
}

.ro-customer-grid {
    display: grid;
    grid-template-columns: 130px 1fr;
    gap: 12px;
    align-items: center;
}

.ro-value,
.ro-link-value {
    min-height: 38px;
    display: flex;
    align-items: center;
    padding: 8px 10px;
    background: var(--hcr-surface-2);
    border: 1px solid var(--hcr-border);
    border-radius: 10px;
    font-weight: 800;
    color: #172033;
}

.ro-vehicle-grid {
    display: grid;
    grid-template-columns: 115px 1fr 90px 110px 90px 110px;
    gap: 12px;
    align-items: center;
}

.ro-row-box { margin-top: 0; }
.ro-date-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(130px, 1fr));
    gap: 13px 16px;
    align-items: center;
}
.ro-date-grid .ro-label { align-self: center; }

.ro-lower-grid {
    display: grid;
    grid-template-columns: minmax(650px, 1.55fr) minmax(360px, .85fr);
    gap: 18px;
    align-items: start;
}

.ro-options-grid {
    display: grid;
    grid-template-columns: minmax(230px, 1.2fr) 120px minmax(160px, .8fr) 80px 120px;
    gap: 12px;
    align-items: center;
}

.ro-divider { display: none; }

.ro-payment-grid {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) 130px minmax(160px, 1fr) 130px;
    gap: 12px;
    align-items: center;
}

.ro-status-grid {
    display: grid;
    grid-template-columns: 140px 220px 1fr;
    gap: 12px 16px;
    align-items: center;
    margin-top: 18px;
}

.ro-summary-box { padding: 20px; }
.ro-summary-grid {
    display: grid;
    grid-template-columns: minmax(170px, 1fr) 150px;
    gap: 11px 12px;
    align-items: center;
}

.ro-total-box {
    margin-top: 16px;
    padding: 18px 20px;
    display: grid;
    grid-template-columns: minmax(170px, 1fr) 150px;
    gap: 12px;
    align-items: center;
    background: linear-gradient(135deg, #0f172a, #1e3a8a);
    color: #fff;
    border: 0;
    border-radius: var(--hcr-radius-sm);
    box-shadow: var(--hcr-shadow-sm);
}
.ro-total-box label { color: #fff; font-size: 17px; }
.ro-total-box input { font-size: 18px; font-weight: 900; color: #0f172a; }

.ro-input-money { text-align: right; }
.ro-readonly,
.ro-input[readonly],
.ro-input-disabled,
.ro-input[readonly].ro-input-disabled {
    background: #eef2f7 !important;
    color: #334155;
    cursor: not-allowed;
    border-color: #d6dee9;
}

.ro-blue-check {
    appearance: none;
    -webkit-appearance: none;
    width: 20px !important;
    height: 20px !important;
    border-radius: 7px;
    background: #fff;
    border: 2px solid var(--hcr-primary);
    display: inline-block;
    position: relative;
    cursor: pointer;
    flex: 0 0 20px;
}
.ro-blue-check:checked { background: var(--hcr-primary); }
.ro-blue-check:checked::after {
    content: "✓";
    position: absolute;
    left: 3px;
    top: -3px;
    color: #fff;
    font-size: 18px;
    font-weight: 900;
}
.ro-blue-check:not(:checked)::after { content: ""; }

.ro-shuttle-row {
    display: none;
    grid-template-columns: 230px minmax(260px, 420px);
    gap: 12px;
    align-items: center;
    margin: 0 0 18px 0;
    padding: 14px;
    background: #f8fafc;
    border: 1px dashed var(--hcr-border-strong);
    border-radius: var(--hcr-radius-sm);
}

/* Modern Orders Dashboard */
.orders-dashboard-window { max-width: 1500px; }
.orders-dashboard-body { font-family: "Segoe UI", Arial, sans-serif; }
.orders-dashboard-toolbar {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}
.orders-help-text {
    flex: 1;
    min-width: 260px;
    color: var(--hcr-muted);
    background: #f8fafc;
    border: 1px solid var(--hcr-border);
    border-radius: var(--hcr-radius-sm);
    padding: 10px 12px;
    font-size: 14px;
}
.orders-cell-order a,
.orders-cell-customer a { font-weight: 850; }
.orders-return-pastdue { color: #b91c1c; font-weight: 900; background: #fef2f2; }
.orders-action-link,
.orders-inspection-link,
.orders-final-link {
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

@media (max-width: 1100px) {
    main { padding: 16px 12px 32px; }
    .hcr-header-inner { flex-direction: column; align-items: flex-start; }
    .hcr-nav { justify-content: flex-start; }
    .hcr-form-grid,
    .hcr-form-grid-3,
    .hcr-search-grid,
    .ro-top-grid,
    .ro-lower-grid,
    .ro-date-grid,
    .ro-options-grid,
    .ro-payment-grid,
    .ro-status-grid,
    .ro-vehicle-grid,
    .ro-summary-grid,
    .ro-total-box,
    .ro-shuttle-row {
        grid-template-columns: 1fr;
    }
    .hcr-kpi-grid { grid-template-columns: repeat(2, minmax(160px, 1fr)); }
    .hcr-body, .ro-body, .orders-dashboard-body { padding: 18px; }
}

@media (max-width: 640px) {
    .hcr-kpi-grid { grid-template-columns: 1fr; }
    .hcr-nav a { padding: 8px 10px; }
}

/* ------------------------------------------------------------------
   Fix 8: Rental order UX redesign
   Implements a strict grid, label-over-input pattern, sticky totals,
   submodule treatment for payments/documents, and bottom page actions.
------------------------------------------------------------------- */
.validation-summary-valid { display: none !important; }

.order-page-shell {
    max-width: 1480px;
    margin: 0 auto 38px auto;
}

.order-page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 18px;
    padding: 20px 24px;
    border-radius: 22px;
    color: #fff;
    background: linear-gradient(135deg, #0f172a 0%, #1d4ed8 62%, #06b6d4 100%);
    box-shadow: 0 20px 42px rgba(15, 23, 42, .20);
}

.order-page-header h1 {
    margin: 4px 0 0 0;
    font-size: 28px;
    line-height: 1.1;
    letter-spacing: -.02em;
}

.eyebrow {
    color: rgba(255,255,255,.75);
    text-transform: uppercase;
    letter-spacing: .11em;
    font-size: 12px;
    font-weight: 850;
}

.order-id-pill {
    padding: 11px 16px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.24);
    font-weight: 800;
    white-space: nowrap;
}

.order-layout-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 20px;
    align-items: start;
}

.order-main-column {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.modern-card,
.total-card,
.submodule-card {
    background: rgba(255,255,255,.98);
    border: 1px solid #dbe3ef;
    border-radius: 20px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .075);
    padding: 20px;
}

.section-heading,
.panel-title {
    margin: 0 0 16px 0;
    color: #1e3a8a;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.dual-info-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr);
    gap: 18px;
}

.info-panel {
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #f8fbff;
    padding: 16px;
}

.field-stack {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.field-stack label,
.readonly-tile span,
.option-line > span,
.summary-line label,
.modern-check span,
.submodule-header span,
.submodule-form-grid label {
    color: #334155;
    font-size: 13px;
    line-height: 1.2;
    font-weight: 850;
}

.field-stack input,
.field-stack select,
.field-stack textarea,
.summary-line input,
.grand-total-line input,
.option-line input[type="number"],
.option-line input[type="text"],
.submodule-form-grid input,
.submodule-form-grid select {
    width: 100%;
    min-height: 40px;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    background: #fff;
    padding: 8px 10px;
    font-size: 14px;
    font-family: "Segoe UI", Arial, sans-serif;
}

.field-stack input[readonly],
.field-stack input:read-only,
.summary-line input:read-only,
.grand-total-line input:read-only,
.option-line input:read-only,
.ro-input-disabled {
    background: #eef2f7 !important;
    color: #334155;
    border-color: #d5dde8;
}

.full-row { margin-bottom: 14px; }

.readonly-grid {
    display: grid;
    gap: 12px;
}

.readonly-grid.three-col { grid-template-columns: repeat(3, minmax(0, 1fr)); }

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

.readonly-tile {
    min-height: 62px;
    border: 1px solid #dbe3ef;
    border-radius: 14px;
    background: #fff;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
}

.readonly-tile strong {
    color: #172033;
    font-size: 15px;
    overflow-wrap: anywhere;
}

.compact-form-grid {
    display: grid;
    gap: 14px;
}
.compact-form-grid.four-col { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.compact-form-grid.two-col { grid-template-columns: minmax(220px, 320px) minmax(0, 1fr); }

.duration-pair {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.modern-check {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    align-self: end;
    padding: 8px 0;
}

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

.option-line {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) 120px;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border-radius: 14px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.option-line > span {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.option-line .qty-box {
    max-width: 70px;
    justify-self: end;
}

.shuttle-details-modern {
    display: none;
    margin: 12px 0 18px 0;
    padding: 16px;
    border-radius: 16px;
    border: 1px dashed #93c5fd;
    background: #eff6ff;
}

.total-sidebar {
    position: relative;
}

.sticky-total-card {
    position: sticky;
    top: 96px;
}

.summary-line,
.grand-total-line {
    display: grid;
    grid-template-columns: minmax(145px, 1fr) 130px;
    gap: 12px;
    align-items: center;
    margin-bottom: 10px;
}

.summary-line input,
.grand-total-line input,
.option-line input[type="number"] {
    text-align: right;
}

.recalc-button {
    width: 100%;
    margin: 8px 0 14px 0;
    min-height: 42px;
    border-radius: 14px;
    border: 0;
    color: #fff;
    font-weight: 900;
    background: linear-gradient(135deg, #2563eb, #06b6d4);
    cursor: pointer;
    box-shadow: 0 10px 22px rgba(37, 99, 235, .22);
}

.grand-total-line {
    margin: 14px -4px 0 -4px;
    padding: 14px;
    background: linear-gradient(135deg, #0f172a, #1e3a8a);
    color: #fff;
    border-radius: 16px;
}
.grand-total-line label { color: #fff; font-size: 15px; font-weight: 900; }
.grand-total-line input { font-size: 18px; font-weight: 900; color: #0f172a; }

.submodule-card {
    margin-top: 22px;
    background: #f8fafc;
}
.submodule-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}
.submodule-header h2 {
    margin: 0;
    font-size: 22px;
    color: #0f172a;
}

.submodule-form-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px 18px;
}
.document-upload-grid { grid-template-columns: 1.1fr 1.2fr 1.1fr auto; }
.upload-button-stack { justify-content: end; }

.submodule-actions {
    margin-top: 14px;
}

.secondary-pill-button,
.primary-action,
.secondary-action {
    min-height: 42px;
    border-radius: 999px;
    padding: 10px 20px;
    font-weight: 900;
    border: 0;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.secondary-pill-button {
    color: #fff;
    background: linear-gradient(135deg, #2563eb, #06b6d4);
}
.submodule-table-wrap { margin-top: 16px; overflow-x: auto; }

.bottom-action-bar {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 24px;
    padding: 18px 4px 0 4px;
}
.primary-action {
    min-width: 160px;
    color: #fff;
    background: linear-gradient(135deg, #2563eb, #06b6d4);
    box-shadow: 0 10px 22px rgba(37, 99, 235, .22);
}
.secondary-action {
    min-width: 120px;
    color: #0f172a;
    background: #e2e8f0;
    border: 1px solid #cbd5e1;
}
.secondary-action:hover,
.primary-action:hover,
.secondary-pill-button:hover {
    text-decoration: none;
    transform: translateY(-1px);
}

@media (max-width: 1160px) {
    .order-layout-grid { grid-template-columns: 1fr; }
    .sticky-total-card { position: static; }
    .dual-info-grid { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
    .order-page-header { flex-direction: column; align-items: flex-start; }
    .compact-form-grid.four-col,
    .compact-form-grid.two-col,
    .options-grid-clean,
    .payment-choice-grid,
    .submodule-form-grid,
    .document-upload-grid { grid-template-columns: 1fr; }
    .readonly-grid.three-col,
    .vehicle-feature-grid { grid-template-columns: 1fr; }
    .summary-line,
    .grand-total-line,
    .option-line { grid-template-columns: 1fr; }
    .bottom-action-bar { justify-content: stretch; flex-direction: column; }
}

/* ------------------------------------------------------------------
   Fix 10: New Customer information UI cleanup
   Label-over-input layout, required markers, proportional address widths,
   conditional DNR reason, and clearer save-button hierarchy.
------------------------------------------------------------------- */
.customer-page-shell {
    max-width: 1120px;
    margin: 0 auto 40px auto;
}

.customer-page-header {
    margin-bottom: 18px;
    padding: 22px 26px;
    border-radius: 22px;
    color: #fff;
    background: linear-gradient(135deg, #0f172a 0%, #1d4ed8 62%, #06b6d4 100%);
    box-shadow: 0 20px 42px rgba(15, 23, 42, .20);
}

.customer-page-header h1 {
    margin: 4px 0 6px 0;
    font-size: 30px;
    line-height: 1.1;
    letter-spacing: -.02em;
}

.customer-page-header p {
    margin: 0;
    max-width: 720px;
    color: rgba(255,255,255,.82);
    font-weight: 650;
}

.customer-entry-form {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.customer-form-card {
    background: rgba(255,255,255,.98);
    border: 1px solid #dbe3ef;
    border-radius: 20px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .075);
    padding: 20px;
}

.customer-card-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e2e8f0;
}

.customer-card-heading h2 {
    margin: 0;
    color: #1e3a8a;
    font-size: 14px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.customer-card-heading > span {
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

.customer-form-grid,
.customer-flags-grid {
    display: grid;
    gap: 14px 16px;
    align-items: start;
}

.customer-form-grid.two-col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.customer-form-grid.license-grid {
    grid-template-columns: minmax(260px, 1.4fr) 120px 170px 170px;
}

.customer-form-grid.address-grid {
    grid-template-columns: minmax(260px, 1fr) 92px 140px;
}

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

.full-span { grid-column: 1 / -1; }
.city-field { grid-column: span 1; }
.state-field { max-width: 120px; }
.zip-field { max-width: 150px; }
.compact-date { max-width: 190px; }
.compact-select { max-width: 240px; }

.required-star {
    color: #dc2626;
    font-weight: 950;
}

.optional-label {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 750;
    margin-left: 4px;
    text-transform: none;
}

.customer-page-shell .field-stack label {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.customer-page-shell .field-validation-error {
    min-height: 16px;
    font-size: 12px;
    line-height: 1.25;
}

.customer-check-card {
    min-height: 76px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px;
    border: 1px solid #dbe3ef;
    border-radius: 16px;
    background: #f8fbff;
    cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.customer-check-card:hover {
    border-color: #bfdbfe;
    background: #eff6ff;
    box-shadow: 0 8px 18px rgba(37, 99, 235, .08);
}

.customer-checkbox-input {
    margin-top: 3px;
    flex: 0 0 auto;
}

.customer-check-card span {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.customer-check-card strong {
    color: #172033;
    font-size: 14px;
    font-weight: 900;
}

.customer-check-card small {
    color: #64748b;
    font-size: 12px;
    line-height: 1.35;
    font-weight: 650;
}

.dnr-block {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.dnr-check-card:has(input:checked) {
    border-color: #fecaca;
    background: #fef2f2;
}

.dnr-reason-panel {
    padding: 14px;
    border: 1px solid #fecaca;
    border-radius: 16px;
    background: #fff7f7;
}

.customer-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 4px 2px 0 2px;
}

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

.customer-button,
.customer-close-link {
    border-radius: 999px;
    padding: 11px 18px;
    min-height: 42px;
    font-size: 14px;
    font-weight: 850;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    border: 1px solid transparent;
    cursor: pointer;
    font-family: "Segoe UI", Arial, sans-serif;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

.customer-button-primary {
    color: #fff;
    background: linear-gradient(135deg, var(--hcr-primary), var(--hcr-accent));
    box-shadow: 0 10px 22px rgba(37, 99, 235, .24);
}

.customer-button-primary:hover {
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 14px 26px rgba(37, 99, 235, .28);
}

.customer-button-secondary {
    color: #1d4ed8;
    background: #fff;
    border-color: #93c5fd;
}

.customer-button-secondary:hover {
    background: #eff6ff;
    color: #1e40af;
    text-decoration: none;
}

.customer-button-tertiary {
    color: #334155;
    background: #e2e8f0;
    border-color: #cbd5e1;
}

.customer-button-tertiary:hover {
    color: #0f172a;
    background: #cbd5e1;
    text-decoration: none;
}

.customer-close-link {
    color: #64748b;
    background: transparent;
    border-color: transparent;
}

.customer-close-link:hover {
    color: #334155;
    background: #e2e8f0;
    text-decoration: none;
}

@media (max-width: 980px) {
    .customer-form-grid.two-col,
    .customer-form-grid.license-grid,
    .customer-form-grid.address-grid,
    .customer-flags-grid {
        grid-template-columns: 1fr;
    }

    .state-field,
    .zip-field,
    .compact-date,
    .compact-select {
        max-width: 100%;
    }

    .customer-actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .customer-save-actions,
    .customer-close-link,
    .customer-button {
        width: 100%;
    }
}

/* ------------------------------------------------------------------
   Fix 11: Shared form UX enhancements
   Adds light gray section headers, reusable form-card layout, inline
   validation messaging, conditional flag panels, and staff-only labels.
------------------------------------------------------------------- */
.hcr-form-page { max-width: 1180px; }

.hcr-form-card {
    background: rgba(255,255,255,.98);
    border: 1px solid #dbe3ef;
    border-radius: 20px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .075);
    padding: 20px;
    margin-bottom: 18px;
}

.hcr-card-heading,
.soft-section-header,
.section-heading,
.panel-title,
.submodule-header {
    border-radius: 14px;
}

.hcr-card-heading,
.customer-card-heading.soft-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: -4px -4px 18px -4px;
    padding: 12px 14px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
}

.hcr-card-heading h2,
.customer-card-heading.soft-section-header h2 {
    margin: 0;
    color: #1e3a8a;
    font-size: 14px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.hcr-card-heading > span,
.customer-card-heading.soft-section-header > span {
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

.section-heading,
.panel-title {
    padding: 10px 12px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
}

.hcr-form-grid-clean {
    display: grid;
    gap: 14px 16px;
    align-items: start;
}

.hcr-form-grid-clean.two-col { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hcr-form-grid-clean.three-col { grid-template-columns: minmax(220px, 1fr) 170px 180px; }
.hcr-form-grid-clean .full-span { grid-column: 1 / -1; }
.hcr-form-grid-clean .small-field { max-width: 190px; }
.hcr-form-grid-clean .money-field { max-width: 180px; }
.hcr-form-grid-clean .mileage-field { max-width: 200px; }

.internal-use-label {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: max-content;
    max-width: 100%;
    padding: 4px 9px;
    border-radius: 999px;
    background: #fef3c7;
    border: 1px solid #fde68a;
    color: #92400e;
    font-size: 11px;
    line-height: 1.2;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.internal-use-label::before { content: "⚠"; font-size: 11px; }

.hcr-inline-message {
    min-height: 16px;
    margin-top: 2px;
    font-size: 12px;
    line-height: 1.25;
    font-weight: 800;
}

.hcr-inline-message.is-warning { color: #b45309; }
.hcr-inline-message.is-error { color: #b91c1c; }
.hcr-input-invalid,
input.hcr-input-invalid,
select.hcr-input-invalid,
textarea.hcr-input-invalid {
    border-color: #dc2626 !important;
    background: #fff7f7 !important;
    box-shadow: 0 0 0 4px rgba(220, 38, 38, .10) !important;
}

.hcr-expired-license,
.hcr-license-expires-today {
    border-color: #f59e0b !important;
    background: #fffbeb !important;
    box-shadow: 0 0 0 4px rgba(245, 158, 11, .12) !important;
}

.customer-mini-toggle {
    width: 100%;
    display: inline-flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 14px;
    margin: 0 0 14px 0;
    border: 1px dashed #cbd5e1;
    border-radius: 16px;
    background: #f8fafc;
    color: #475569;
}

.customer-mini-toggle input { margin-top: 3px; }
.customer-mini-toggle span { display: flex; flex-direction: column; gap: 3px; }
.customer-mini-toggle strong { color: #334155; font-size: 13px; font-weight: 900; }
.customer-mini-toggle small { color: #64748b; font-size: 12px; line-height: 1.35; font-weight: 650; }
.customer-mini-toggle.is-disabled { opacity: .82; cursor: not-allowed; }

.tax-exempt-block {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.tax-certificate-panel {
    padding: 13px 14px;
    border: 1px dashed #93c5fd;
    border-radius: 16px;
    background: #eff6ff;
    color: #1e3a8a;
}

.tax-certificate-panel strong {
    display: block;
    font-size: 13px;
    font-weight: 900;
    margin-bottom: 4px;
}

.tax-certificate-panel span {
    display: block;
    color: #475569;
    font-size: 12px;
    line-height: 1.35;
    font-weight: 700;
}

.dnr-reason-panel.is-expanded {
    animation: hcr-slide-open .18s ease-out;
}

@keyframes hcr-slide-open {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

.customer-edit-shell .submodule-card {
    margin-top: 18px;
}

.hcr-action-hierarchy {
    justify-content: space-between;
}

.hcr-action-hierarchy .hcr-button-secondary {
    order: 1;
}

.hcr-action-hierarchy .hcr-button {
    order: 2;
}

input[type="date"] {
    font-variant-numeric: tabular-nums;
}

@media (max-width: 980px) {
    .hcr-form-grid-clean.two-col,
    .hcr-form-grid-clean.three-col {
        grid-template-columns: 1fr;
    }

    .hcr-form-grid-clean .small-field,
    .hcr-form-grid-clean .money-field,
    .hcr-form-grid-clean .mileage-field {
        max-width: 100%;
    }

    .hcr-card-heading,
    .customer-card-heading.soft-section-header,
    .submodule-header {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* ------------------------------------------------------------------
   Fix 12: Rental Order premium workflow cleanup
   Collapsible sections, tighter grids, sticky charges/payment status,
   readable option rows, additional-driver subform, and inline validation.
------------------------------------------------------------------- */
.ro-premium-shell .order-main-column { gap: 28px; }
.ro-premium-form .modern-card { margin-bottom: 28px; }

.order-status-stack {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 7px 14px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.28);
    color: #0f172a;
    background: #fde68a;
    font-weight: 900;
    letter-spacing: .02em;
}
.status-badge.status-active { background: #bbf7d0; color: #14532d; }
.status-badge.status-closed { background: #e2e8f0; color: #334155; }
.status-badge.status-pending { background: #fde68a; color: #78350f; }

.ro-collapsible-section {
    background: rgba(255,255,255,.98);
    border: 1px solid #dbe3ef;
    border-radius: 20px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .075);
    overflow: hidden;
}

.ro-collapsible-section + .ro-collapsible-section { margin-top: 0; }

.ro-collapsible-section > summary {
    list-style: none;
    cursor: pointer;
    user-select: none;
    padding: 16px 20px;
    background: linear-gradient(180deg, #f8fafc 0%, #eef4ff 100%);
    border-bottom: 1px solid #dbe3ef;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.ro-collapsible-section > summary::-webkit-details-marker { display: none; }
.ro-collapsible-section > summary::after {
    content: "⌄";
    width: 30px;
    height: 30px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #1e3a8a;
    background: #ffffff;
    border: 1px solid #dbe3ef;
    font-weight: 900;
}
.ro-collapsible-section[open] > summary::after { content: "⌃"; }
.ro-collapsible-section > summary span {
    color: #0f172a;
    font-size: 16px;
    font-weight: 950;
    letter-spacing: .01em;
}
.ro-collapsible-section > summary small {
    margin-left: auto;
    color: #64748b;
    font-weight: 700;
}

.ro-section-body { padding: 22px; }

.ro-form-grid {
    display: grid;
    gap: 18px 20px;
    align-items: end;
}
.ro-form-grid.two-col { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ro-form-grid.three-col { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ro-mileage-row { margin-top: 18px; }
.full-row-notes textarea,
.notes-field-stack textarea { min-height: 104px; resize: vertical; }

.clean-info-panel,
.vehicle-card-modern {
    border: 1px solid #dbe3ef;
    border-radius: 18px;
    background: #f8fbff;
    padding: 18px;
}
.vehicle-card-modern { background: #ffffff; }
.vehicle-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid #e2e8f0;
}
.vehicle-title {
    display: block;
    font-size: 18px;
    color: #0f172a;
    margin-top: 4px;
}
.vehicle-price-stack {
    min-width: 132px;
    text-align: right;
    padding: 10px 12px;
    border-radius: 16px;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
}
.vehicle-price-stack span {
    display: block;
    color: #64748b;
    font-size: 12px;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.vehicle-price-stack input {
    border: 0 !important;
    background: transparent !important;
    font-weight: 950;
    text-align: right;
    padding: 0 !important;
    min-height: 24px !important;
}
.vehicle-spec-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px 16px;
}

.option-table-grid {
    border: 1px solid #dbe3ef;
    border-radius: 18px;
    overflow: hidden;
    background: #fff;
}
.option-table-header,
.option-choice-row {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 150px 140px;
    align-items: center;
    gap: 14px;
}
.option-table-header {
    padding: 11px 14px;
    background: #f1f5f9;
    color: #475569;
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .07em;
}
.option-choice-row {
    padding: 12px 14px;
    border-top: 1px solid #e2e8f0;
    transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.option-choice-row input[type="number"],
.option-choice-row input[type="text"] { text-align: right; }
.option-choice-row .qty-box {
    width: 76px;
    justify-self: start;
    text-align: center;
}
.option-title {
    font-weight: 900;
    color: #172033;
}
.option-choice-row.is-selected,
.option-choice-card.is-selected {
    background: #eff6ff;
    border-color: #93c5fd;
    box-shadow: inset 4px 0 0 #2563eb;
}
.option-choice-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 140px;
    gap: 14px;
    align-items: center;
    padding: 14px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #f8fafc;
}
.option-choice-card span {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-weight: 900;
}
.option-choice-card input[type="number"] { text-align: right; }
.compact-payment-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}
.payment-inline-note {
    margin-top: 14px;
    padding: 12px 14px;
    border-radius: 14px;
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    color: #475569;
    font-weight: 750;
}

.nested-entry-panel {
    margin-top: 20px;
    padding: 18px;
    border-radius: 18px;
    border: 1px dashed #93c5fd;
    background: #eff6ff;
}
.nested-panel-header {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 16px;
    color: #1e3a8a;
}
.nested-panel-header strong { font-size: 16px; }
.nested-panel-header span { color: #475569; font-weight: 750; }
.insurance-subpanel {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #bfdbfe;
}
.insurance-subpanel.is-disabled {
    opacity: .55;
    filter: grayscale(.35);
}
.insurance-subpanel.is-disabled input { cursor: not-allowed; }

.premium-total-card { padding: 18px; }
.sidebar-total-focus {
    margin-bottom: 16px;
    padding: 16px;
    border-radius: 18px;
    background: linear-gradient(135deg, #0f172a, #1e3a8a);
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 14px;
}
.sidebar-total-focus span {
    color: rgba(255,255,255,.78);
    font-weight: 850;
}
.sidebar-total-focus strong { font-size: 24px; letter-spacing: -.03em; }
.payment-mini-summary {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 2px;
    color: #334155;
    font-weight: 850;
    border-bottom: 1px solid #e2e8f0;
}
.payment-mini-summary.balance strong { color: #1e3a8a; }
.premium-total-card .summary-line:first-of-type { margin-top: 14px; }

.payment-processing-panel {
    margin-top: 18px;
    padding: 18px;
    border-radius: 18px;
    border: 1px solid #dbe3ef;
    background: #ffffff;
}
.payment-entry-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.add-payment-primary { min-width: 170px; }

.required-star { color: #dc2626; }
.inline-warning,
.inline-field-error {
    margin-top: 10px;
    padding: 9px 12px;
    border-radius: 12px;
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
    font-size: 13px;
    font-weight: 800;
}
.inline-field-error {
    padding: 7px 10px;
    margin-top: 2px;
}
.field-has-error input,
.field-has-error select,
.field-has-error textarea {
    border-color: #dc2626 !important;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, .12) !important;
}

@media (max-width: 1160px) {
    .compact-payment-grid,
    .vehicle-spec-grid,
    .payment-entry-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
    .ro-collapsible-section > summary { align-items: flex-start; flex-direction: column; }
    .ro-collapsible-section > summary small { margin-left: 0; }
    .ro-form-grid.two-col,
    .ro-form-grid.three-col,
    .compact-payment-grid,
    .vehicle-spec-grid,
    .payment-entry-grid,
    .option-table-header,
    .option-choice-row,
    .option-choice-card { grid-template-columns: 1fr; }
    .vehicle-card-header { flex-direction: column; }
    .vehicle-price-stack { width: 100%; text-align: left; }
}

/* -------------------------------------------------------------------
   FIX 13 - Rental Order compact workflow refinements
------------------------------------------------------------------- */
.customer-locked-panel {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.readonly-flow {
    display: grid;
    gap: 10px;
}

.readonly-line {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 18px;
    padding: 11px 12px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #ffffff;
}

.readonly-line span {
    color: #64748b;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.readonly-line strong {
    color: #0f172a;
    font-size: 15px;
    font-weight: 950;
    text-align: right;
}

.feature-line-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 14px 0 16px;
}

.feature-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    padding: 8px 11px;
    border: 1px solid #dbe3ef;
    border-radius: 999px;
    background: #f8fafc;
    color: #0f172a;
    font-weight: 900;
}

.feature-chip span {
    color: #64748b;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.feature-chip strong {
    font-size: 14px;
    font-weight: 950;
}

.duration-summary-line {
    display: flex;
    align-items: end;
    gap: 10px;
    min-height: 66px;
}

.tight-field-grid {
    margin-top: 4px;
}

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

.compact-option-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 120px;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
    transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.compact-option-card input[type="number"] {
    text-align: right;
    min-height: 38px;
}

.compact-option-card .option-control {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #475569;
    font-size: 13px;
    font-weight: 850;
    white-space: nowrap;
}

.compact-option-card .qty-box {
    width: 68px;
    text-align: center;
}

.compact-option-card.is-selected {
    background: #eff6ff;
    border-color: #93c5fd;
    box-shadow: inset 4px 0 0 #2563eb;
}

.multi-driver-panel {
    background: #f8fbff;
}

.additional-driver-rows {
    display: grid;
    gap: 16px;
}

.additional-driver-card {
    padding: 16px;
    border-radius: 18px;
    border: 1px solid #bfdbfe;
    background: #ffffff;
}

.additional-driver-card-title {
    margin-bottom: 12px;
    color: #1e3a8a;
    font-weight: 950;
    letter-spacing: .01em;
}

.additional-driver-insurance-panel {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #dbeafe;
}

.compact-payment-panel {
    border-color: #bfdbfe;
    background: #f8fbff;
}

@media (max-width: 1160px) {
    .compact-options-grid { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
    .readonly-line { align-items: flex-start; flex-direction: column; }
    .readonly-line strong { text-align: left; }
    .duration-summary-line { min-height: auto; }
    .compact-option-card { grid-template-columns: 1fr; }
}

/* -------------------------------------------------------------------
   FIX 14 - Rental Order field/rate/payment workflow refinements
------------------------------------------------------------------- */
.vehicle-rate-pair {
    display: grid;
    grid-template-columns: repeat(2, minmax(112px, 1fr));
    gap: 10px;
    min-width: 270px;
}
.vehicle-rate-box {
    text-align: right;
    padding: 10px 12px;
    border-radius: 16px;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
}
.vehicle-rate-box span {
    display: block;
    color: #64748b;
    font-size: 12px;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.vehicle-rate-box input {
    border: 0 !important;
    background: transparent !important;
    font-weight: 950;
    text-align: right;
    padding: 0 !important;
    min-height: 24px !important;
}
.payment-post-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}
.payment-post-actions .secondary-action {
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #334155;
}
@media (max-width: 900px) {
    .vehicle-rate-pair {
        width: 100%;
        grid-template-columns: 1fr;
    }
    .vehicle-rate-box {
        text-align: left;
    }
    .vehicle-rate-box input {
        text-align: left;
    }
}

/* -------------------------------------------------------------------
   FIX 15 - Rental Order deposits, extension notice, receipts, out-of-state calculator
------------------------------------------------------------------- */
.receipt-button-row {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.compact-receipt-link {
    font-size: 12px;
    padding: 8px 10px;
    border-radius: 999px;
    text-decoration: none;
}
.out-state-summary,
.extension-charge-notice {
    margin-top: 12px;
    padding: 12px 14px;
    border: 1px solid #bfdbfe;
    border-radius: 14px;
    background: #eff6ff;
    color: #1e3a8a;
    font-size: 13px;
}
.extension-charge-notice {
    display: grid;
    gap: 6px;
    background: #fff7ed;
    border-color: #fed7aa;
    color: #9a3412;
}
.extension-charge-notice strong {
    color: #7c2d12;
}
.travel-out-state-trigger {
    align-items: center;
    gap: 6px;
}
.travel-out-state-trigger small {
    color: #64748b;
    font-size: 12px;
    margin-left: 6px;
}
.hcr-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(15, 23, 42, .54);
}
.hcr-modal-backdrop[hidden] {
    display: none !important;
}
.hcr-modal-panel {
    width: min(760px, 96vw);
    max-height: 92vh;
    overflow: auto;
    border-radius: 24px;
    background: #ffffff;
    border: 1px solid #dbeafe;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .28);
    padding: 22px;
}
.hcr-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 16px;
}
.hcr-modal-header h2 {
    margin: 2px 0 0;
    font-size: 22px;
    color: #0f172a;
}
.modal-close-button {
    border: 0;
    background: #f1f5f9;
    color: #334155;
    width: 36px;
    height: 36px;
    border-radius: 999px;
    font-size: 22px;
    cursor: pointer;
}
.modal-section-card {
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #f8fafc;
    padding: 16px;
    margin-bottom: 14px;
}
.compact-modal-action {
    margin-top: 12px;
}
.modal-action-row {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 16px;
}
@media (max-width: 760px) {
    .hcr-modal-panel { padding: 16px; border-radius: 18px; }
    .modal-action-row { flex-direction: column-reverse; }
    .modal-action-row button { width: 100%; }
}

/* -------------------------------------------------------------------
   FIX 16 - Extension charge correction and one-line vehicle title
------------------------------------------------------------------- */
.vehicle-card-header > .vehicle-title-block {
    min-width: 0;
    flex: 1 1 auto;
}
.vehicle-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}
.extension-charge-notice span:last-of-type b {
    font-size: 1.05rem;
}

/* -------------------------------------------------------------------
   FIX 16F - Prevent accidental Rental Order save on Enter
------------------------------------------------------------------- */
.rental-order-save-guard-warning {
    margin: 0 0 18px 0;
    box-shadow: 0 10px 24px rgba(217, 119, 6, 0.12);
}

/* Fix 16I - return odometer excessive mileage summary */
.inline-note.mileage-return-summary {
    margin-top: 8px;
    padding: 10px 12px;
    border: 1px solid #bfdbfe;
    border-radius: 10px;
    background: #eff6ff;
    color: #1e3a8a;
    font-weight: 700;
    font-size: 0.92rem;
}

/* Fix 16I-A - Make extension payment instruction note easier to read */
.extension-charge-notice small {
    display: block;
    margin-top: 6px;
    font-size: 0.95rem;
    line-height: 1.45;
    font-weight: 700;
    color: #7c2d12;
}


/* Fix 16J: Excess mileage settlement options */
.excess-mileage-settlement-panel {
    margin-top: 12px;
    padding: 14px;
    border: 1px solid #c7d7ee;
    border-radius: 16px;
    background: #f8fbff;
}

.settlement-panel-title {
    font-weight: 800;
    color: #12315f;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: 10px;
}

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

.settlement-option-card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 8px 10px;
    align-items: center;
    padding: 12px;
    border: 1px solid #d7e3f3;
    border-radius: 14px;
    background: #fff;
    cursor: pointer;
}

.settlement-option-card:has(input:checked) {
    border-color: #0b7dd3;
    box-shadow: 0 0 0 3px rgba(11,125,211,.12);
}

.settlement-option-card span {
    font-weight: 800;
    color: #12233f;
}

.settlement-option-card strong {
    color: #083e8c;
    font-weight: 900;
}

.settlement-option-card small {
    grid-column: 2 / 4;
    color: #58677b;
}

.settlement-footnote {
    margin-top: 10px;
    color: #4b5d73;
    font-size: .92rem;
    font-weight: 700;
}

@media (max-width: 900px) {
    .settlement-option-grid { grid-template-columns: 1fr; }
}

/* Fix 16K: keep non-extension panels truly hidden and explain taxable mileage settlement */
.extension-charge-notice[hidden],
.out-state-summary[hidden],
.inline-note.mileage-return-summary[hidden],
.excess-mileage-settlement-panel[hidden],
.mileage-tax-summary[hidden] {
    display: none !important;
}

.mileage-tax-summary {
    margin-top: 10px;
    padding: 10px 12px;
    border: 1px solid #bbf7d0;
    border-radius: 12px;
    background: #f0fdf4;
    color: #14532d;
    font-size: 0.92rem;
    font-weight: 700;
    line-height: 1.45;
}

/* -------------------------------------------------------------------
   FIX 17 - Mode-aware rental workflow and closeout/deposit settlement
------------------------------------------------------------------- */
.workflow-mode-panel {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin: 0 0 18px;
}
.workflow-step {
    border: 1px solid #dbe7f5;
    border-radius: 16px;
    background: #ffffff;
    padding: 12px 12px 10px;
    box-shadow: 0 10px 24px rgba(15,23,42,.06);
    color: #536377;
}
.workflow-step strong {
    display: inline-grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: #e8f1fb;
    color: #12315f;
    font-size: .85rem;
    margin-bottom: 6px;
}
.workflow-step span {
    display: block;
    font-weight: 900;
    color: #1e2a3a;
}
.workflow-step small {
    display: block;
    margin-top: 2px;
    font-weight: 700;
    font-size: .76rem;
}
.workflow-step.is-current {
    border-color: #0ea5e9;
    background: linear-gradient(135deg, #ecfeff, #eff6ff);
    box-shadow: 0 15px 32px rgba(14,165,233,.18);
}
.workflow-step.is-current strong {
    background: #0284c7;
    color: #fff;
}
.workflow-step.is-done {
    border-color: #bbf7d0;
    background: #f0fdf4;
}
.workflow-step.is-done strong {
    background: #16a34a;
    color: #fff;
}
.closeout-section summary span {
    color: #073b7a;
}
.closeout-alert {
    margin-bottom: 12px;
    padding: 12px 14px;
    border: 1px solid #fde68a;
    border-radius: 14px;
    background: #fffbeb;
    color: #92400e;
    font-weight: 800;
}
.closeout-alert.is-ready {
    border-color: #bbf7d0;
    background: #f0fdf4;
    color: #166534;
}
.closeout-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 14px;
}
.closeout-card {
    border: 1px solid #dbe7f5;
    border-radius: 16px;
    background: #fbfdff;
    padding: 14px;
}
.closeout-card h3 {
    margin: 0 0 10px;
    font-size: .95rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #12315f;
}
.closeout-line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 7px 0;
    border-bottom: 1px solid #edf2f7;
    font-weight: 700;
    color: #42526a;
}
.closeout-line:last-child { border-bottom: 0; }
.closeout-line strong {
    color: #0f2a52;
    font-weight: 900;
    text-align: right;
}
.closeout-line.emphasized {
    font-size: 1rem;
    color: #0f172a;
}
.deposit-settlement-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 14px;
}
.closeout-action-card {
    min-height: 92px;
}
.closeout-button-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 16px;
}
.previous-settlement-note {
    margin-top: 10px;
    padding: 10px 12px;
    border: 1px solid #dbeafe;
    border-radius: 12px;
    background: #eff6ff;
    color: #1e3a8a;
    font-weight: 700;
}
@media (max-width: 1100px) {
    .workflow-mode-panel { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .closeout-grid { grid-template-columns: 1fr; }
    .deposit-settlement-actions { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
    .workflow-mode-panel { grid-template-columns: 1fr; }
    .closeout-button-row { flex-direction: column; }
    .closeout-button-row button { width: 100%; }
}

/* -------------------------------------------------------------------
   FIX 17A - Cancellation workflow and sticky rental workflow header
------------------------------------------------------------------- */
.rental-workflow-sticky-shell {
    position: sticky;
    top: 74px;
    z-index: 92;
    padding: 0 0 12px 0;
    margin-bottom: 10px;
    background: linear-gradient(135deg, #f8fbff 0%, #eef4ff 55%, rgba(247,248,251,.96) 100%);
    box-shadow: 0 16px 36px rgba(15, 23, 42, .08);
}
.rental-workflow-sticky-shell .order-page-header {
    margin-bottom: 12px;
}
.rental-workflow-sticky-shell .workflow-mode-panel {
    margin-bottom: 0;
}
.danger-action {
    min-height: 42px;
    border-radius: 999px;
    padding: 10px 20px;
    font-weight: 900;
    border: 0;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: linear-gradient(135deg, #dc2626, #f97316);
    box-shadow: 0 10px 22px rgba(220, 38, 38, .20);
}
.danger-action:hover {
    color: #fff;
    text-decoration: none;
    transform: translateY(-1px);
}
.compact-receipt-link.danger-action {
    min-width: auto;
    padding: 9px 15px;
}
.eyebrow-modal {
    color: #2563eb;
    text-transform: uppercase;
    letter-spacing: .10em;
    font-size: 12px;
    font-weight: 900;
}
.cancellation-panel .hcr-modal-header p {
    margin: 8px 0 0;
    color: #64748b;
    font-weight: 700;
    line-height: 1.45;
}
.cancellation-warning-card {
    display: grid;
    gap: 4px;
    color: #7c2d12;
    background: #fff7ed;
    border-color: #fed7aa;
}
.cancellation-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}
.cancellation-summary-grid > div {
    border: 1px solid #dbeafe;
    background: #f8fbff;
    border-radius: 14px;
    padding: 12px;
}
.cancellation-summary-grid span {
    display: block;
    color: #64748b;
    font-weight: 900;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.cancellation-summary-grid strong {
    display: block;
    margin-top: 4px;
    color: #0f172a;
    font-size: 16px;
}
.cancellation-form-grid {
    margin-top: 8px;
}
.cancellation-action-row .danger-action {
    min-width: 190px;
}
@media (max-width: 900px) {
    .rental-workflow-sticky-shell {
        position: static;
        box-shadow: none;
        background: transparent;
    }
    .cancellation-summary-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 620px) {
    .cancellation-summary-grid {
        grid-template-columns: 1fr;
    }
}

/* -------------------------------------------------------------------
   FIX 18 - Edit Rental Order UX / Closeout Safety Redesign
------------------------------------------------------------------- */
.fix18-order-summary-card {
    display: grid;
    grid-template-columns: minmax(260px, 1.2fr) minmax(360px, 2fr) auto;
    gap: 16px;
    align-items: center;
    margin: 0 0 18px;
    padding: 16px 18px;
    border: 1px solid #cfe0f3;
    border-radius: 22px;
    background: linear-gradient(135deg, #ffffff 0%, #f6fbff 100%);
    box-shadow: 0 14px 32px rgba(15, 23, 42, .08);
}
.fix18-summary-title {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    color: #0f172a;
    font-weight: 950;
    font-size: 1rem;
}
.fix18-summary-title strong {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 4px 12px;
    border-radius: 999px;
    background: #e0f2fe;
    color: #075985;
    font-size: .86rem;
}
.fix18-summary-subline {
    margin-top: 5px;
    color: #475569;
    font-weight: 750;
}
.fix18-summary-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.fix18-summary-metrics div {
    min-height: 64px;
    border: 1px solid #dbeafe;
    border-radius: 16px;
    background: #f8fbff;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
}
.fix18-summary-metrics span {
    color: #64748b;
    font-size: .76rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.fix18-summary-metrics strong {
    color: #0f172a;
    font-size: 1.08rem;
    font-weight: 950;
}
.fix18-summary-metrics .balance strong { color: #1e40af; }
.fix18-summary-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    align-items: center;
}
.fix18-primary-complete { white-space: nowrap; }
.fix18-overflow-menu {
    position: relative;
    display: inline-block;
}
.fix18-overflow-menu > summary {
    list-style: none;
    min-height: 42px;
    padding: 10px 18px;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: #ffffff;
    color: #0f172a;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(15,23,42,.06);
}
.fix18-overflow-menu > summary::-webkit-details-marker { display: none; }
.fix18-menu-content {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 140;
    min-width: 220px;
    padding: 8px;
    border: 1px solid #dbe3ef;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 18px 40px rgba(15, 23, 42, .16);
    display: grid;
    gap: 4px;
}
.fix18-menu-content.drop-up {
    top: auto;
    bottom: calc(100% + 8px);
}
.fix18-menu-content a,
.fix18-menu-content button {
    width: 100%;
    min-height: 40px;
    padding: 9px 10px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #0f172a;
    text-align: left;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}
.fix18-menu-content a:hover,
.fix18-menu-content button:hover,
.fix18-menu-content a:focus,
.fix18-menu-content button:focus {
    background: #eff6ff;
    outline: 2px solid #93c5fd;
    outline-offset: 1px;
}
.fix18-charges-card { padding: 18px; }
.fix18-financial-group {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid #e2e8f0;
}
.fix18-financial-group h3,
.fix18-fees-toggle summary span {
    margin: 0 0 10px;
    color: #0f2a52;
    font-size: .84rem;
    font-weight: 950;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.fix18-fees-toggle {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid #e2e8f0;
}
.fix18-fees-toggle summary {
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    cursor: pointer;
    padding: 8px 10px;
    border-radius: 12px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}
.fix18-fees-toggle summary strong {
    color: #1e40af;
    font-weight: 950;
}
.fix18-charges-card .summary-line output,
.readonly-money-line output {
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    border-radius: 12px;
    background: #eef2f7;
    border: 1px solid #d5dde8;
    padding: 8px 10px;
    color: #334155;
    font-weight: 850;
}
.payment-status-badge {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 950;
}
.payment-status-badge.is-posted {
    background: #dcfce7;
    color: #166534;
}
.payment-status-badge.is-voided {
    background: #fee2e2;
    color: #991b1b;
}
.field-helper {
    color: #64748b;
    font-size: .78rem;
    font-weight: 700;
}
.closeout-action-card.is-selected,
.settlement-option-card:has(input:checked) {
    border-color: #2563eb;
    background: #eff6ff;
    box-shadow: 0 10px 24px rgba(37,99,235,.12);
}
.fix18-validation-list {
    margin-bottom: 14px;
    padding: 12px 14px;
    border-radius: 14px;
    background: #fff7ed;
    border: 1px solid #fed7aa;
    color: #9a3412;
    font-weight: 750;
}
.fix18-validation-list ul {
    margin: 8px 0 0 18px;
    padding: 0;
}
.completion-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}
.completion-summary-grid div {
    border: 1px solid #dbe3ef;
    border-radius: 14px;
    background: #f8fbff;
    padding: 10px 12px;
}
.completion-summary-grid span {
    display: block;
    color: #64748b;
    font-weight: 900;
    font-size: .76rem;
    text-transform: uppercase;
}
.completion-summary-grid strong {
    display: block;
    margin-top: 4px;
    color: #0f172a;
    font-size: 1rem;
    font-weight: 950;
}
.completion-ack-check {
    align-items: flex-start;
    margin: 12px 0;
    padding: 12px;
    border: 1px solid #dbeafe;
    border-radius: 14px;
    background: #eff6ff;
}
.completion-action-row button:disabled {
    opacity: .55;
    cursor: not-allowed;
    box-shadow: none;
}
.fix18-bottom-actions,
.fix18-closeout-buttons {
    align-items: center;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
    outline: 3px solid #38bdf8;
    outline-offset: 2px;
}
.primary-action,
.secondary-action,
.danger-action,
.fix18-overflow-menu > summary {
    min-height: 44px;
}
@media (max-width: 1180px) {
    .fix18-order-summary-card {
        grid-template-columns: 1fr;
    }
    .fix18-summary-actions { justify-content: flex-start; }
}
@media (max-width: 760px) {
    .fix18-summary-metrics,
    .completion-summary-grid {
        grid-template-columns: 1fr;
    }
    .fix18-summary-actions,
    .fix18-bottom-actions,
    .fix18-closeout-buttons {
        flex-direction: column;
        align-items: stretch;
    }
    .fix18-overflow-menu,
    .fix18-overflow-menu > summary,
    .fix18-primary-complete,
    .fix18-bottom-actions .primary-action {
        width: 100%;
    }
    .fix18-menu-content {
        position: static;
        margin-top: 8px;
    }
}


/* Fix 18A - customer-first rental workflow */
.hcr-workflow-notice {
    margin: 0 0 18px 0;
    padding: 14px 16px;
    border: 1px solid #bfdbfe;
    border-left: 5px solid #0ea5e9;
    border-radius: 12px;
    background: #eff6ff;
    color: #0f2a44;
    font-weight: 700;
    line-height: 1.45;
}

.customer-rental-search-grid {
    grid-template-columns: 120px minmax(180px, 1fr) 140px minmax(180px, 1fr) auto auto;
    align-items: center;
    gap: 10px 12px;
}

.customer-action-cell {
    white-space: nowrap;
}

.customer-inline-link {
    display: inline-block;
    margin-left: 10px;
    color: #0f62a8;
    font-weight: 700;
}

.customer-dnr-row {
    background: #fff1f2;
}

@media (max-width: 900px) {
    .customer-rental-search-grid {
        grid-template-columns: 1fr;
    }
}

.deposit-source-note {
    margin-top: 6px;
    padding: 7px 9px;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    background: #eff6ff;
    color: #1d4ed8;
    font-size: 0.78rem;
    font-weight: 700;
}

/* -------------------------------------------------------------------
   FIX 19 - Edit Rental Order target closeout layout
   Aligns the form with the approved concept: operational left column,
   sticky financial right column, stronger summary hierarchy, safer closeout.
------------------------------------------------------------------- */
body {
    background: #eef4fb;
}
.order-page-shell.ro-premium-shell {
    max-width: 1500px;
    padding-top: 12px;
}
.rental-workflow-sticky-shell {
    z-index: 95;
}
.rental-workflow-sticky-shell .order-page-header {
    margin-bottom: 10px;
    border-radius: 18px;
    box-shadow: 0 18px 34px rgba(2, 12, 40, .20);
}
.rental-workflow-sticky-shell .workflow-mode-panel {
    grid-template-columns: repeat(6, minmax(120px, 1fr));
    gap: 8px;
    margin-bottom: 14px;
}
.workflow-step {
    min-height: 72px;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .07);
}
.workflow-step.is-current {
    border-color: #0ea5e9;
    background: linear-gradient(135deg, #eff6ff 0%, #ecfeff 100%);
}
.fix18-order-summary-card {
    position: sticky;
    top: 74px;
    z-index: 90;
    grid-template-columns: minmax(230px, 1fr) minmax(430px, 2.1fr) auto;
    margin-bottom: 20px;
    border: 1px solid rgba(148, 163, 184, .35);
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(14px);
    box-shadow: 0 18px 36px rgba(15, 23, 42, .12);
}
.fix18-summary-metrics div {
    background: #ffffff;
    border-color: #dde8f6;
}
.fix18-summary-metrics .balance strong {
    color: #dc2626;
}
.fix18-two-column-layout {
    grid-template-columns: minmax(0, 1fr) 390px;
    gap: 24px;
}
.order-main-column {
    gap: 18px;
}
.ro-collapsible-section {
    border-radius: 16px;
    border-color: #d8e2f0;
    box-shadow: 0 14px 32px rgba(15,23,42,.075);
}
.ro-collapsible-section > summary {
    min-height: 58px;
    background: linear-gradient(180deg, #ffffff 0%, #f2f7ff 100%);
    padding: 16px 20px;
}
.ro-collapsible-section > summary span {
    font-size: 17px;
    letter-spacing: -.01em;
}
.ro-section-body {
    padding: 22px 24px 24px;
}
.dual-info-grid {
    grid-template-columns: minmax(280px, .72fr) minmax(430px, 1.28fr);
    align-items: stretch;
}
.clean-info-panel,
.vehicle-card-modern {
    background: #ffffff;
    border: 1px solid #d8e2f0;
    border-radius: 16px;
    box-shadow: 0 8px 22px rgba(15,23,42,.045);
}
.clean-info-panel .panel-title,
.vehicle-card-modern .panel-title {
    border-radius: 14px;
    background: #f1f5f9;
    padding: 12px 14px;
    margin-bottom: 16px;
    color: #12346b;
}
.customer-summary-flow .readonly-line {
    min-height: 48px;
    border-radius: 12px;
    border: 1px solid #e3ebf5;
    background: #fbfdff;
}
.customer-summary-flow .readonly-line span {
    letter-spacing: .04em;
}
.fix19-contact-actions {
    display: flex;
    gap: 10px;
    margin-top: 14px;
    justify-content: flex-end;
}
.fix19-mini-action {
    min-height: 38px;
    padding: 8px 16px;
    border-radius: 10px;
    border: 1px solid #c8d8ec;
    background: #ffffff;
    color: #0b4ea2;
    font-weight: 900;
    text-decoration: none;
    box-shadow: 0 5px 12px rgba(15, 23, 42, .08);
}
.vehicle-card-header {
    align-items: center;
    margin-bottom: 14px;
}
.vehicle-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 360px;
    color: #0b2e66;
    font-size: 22px;
}
.vehicle-rate-pair {
    display: grid;
    grid-template-columns: repeat(2, minmax(128px, 1fr));
    gap: 10px;
}
.vehicle-rate-box {
    background: #eef6ff;
    border: 1px solid #c7dcf5;
    border-radius: 14px;
    padding: 12px;
    text-align: right;
}
.vehicle-rate-box span {
    display: block;
    color: #64748b;
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.vehicle-rate-box input {
    border: 0 !important;
    background: transparent !important;
    text-align: right;
    padding: 0 !important;
    font-weight: 950;
    color: #0f172a;
}
.feature-line-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 14px 0;
}
.feature-chip {
    background: #f8fafc;
    border-color: #d9e5f3;
}
.ro-form-grid.three-col {
    grid-template-columns: repeat(3, minmax(180px, 1fr));
}
.duration-summary-line {
    display: flex;
    align-items: end;
    gap: 10px;
}
.compact-options-grid,
.payment-choice-grid {
    gap: 12px;
}
.compact-option-card,
.option-choice-card {
    min-height: 62px;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(15,23,42,.035);
}
.payment-processing-panel,
.nested-entry-panel,
.closeout-card {
    border-radius: 16px;
    border-color: #d8e2f0;
    background: #fbfdff;
}
.payment-processing-panel {
    padding: 18px;
}
.total-sidebar {
    align-self: stretch;
}
.sticky-total-card {
    top: 160px;
}
.fix18-charges-card {
    border-radius: 18px;
    border-color: #d8e2f0;
    background: #ffffff;
    box-shadow: 0 18px 36px rgba(15,23,42,.10);
}
.fix18-charges-card .section-heading {
    background: #f1f5f9;
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 14px;
}
.sidebar-total-focus {
    min-height: 78px;
    border-radius: 14px;
    background: linear-gradient(135deg, #0f2a52, #174bb8);
}
.sidebar-total-focus strong {
    font-size: 26px;
}
.payment-mini-summary {
    padding: 10px 0;
    border-bottom: 1px solid #e2e8f0;
}
.payment-mini-summary strong {
    font-size: 18px;
}
.payment-mini-summary.balance strong {
    color: #dc2626;
}
.fix18-financial-group,
.fix18-fees-toggle {
    margin-top: 16px;
    padding-top: 14px;
}
.fix18-fees-toggle summary {
    background: #ffffff;
    border-color: #dbeafe;
    box-shadow: 0 5px 14px rgba(15,23,42,.045);
}
.summary-line,
.grand-total-line {
    grid-template-columns: minmax(160px, 1fr) 132px;
}
.summary-line label,
.grand-total-line label {
    font-weight: 900;
    color: #163054;
}
.summary-line input,
.grand-total-line input,
.summary-line output {
    font-variant-numeric: tabular-nums;
}
.grand-total-line {
    border-radius: 14px;
}
.closeout-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.deposit-settlement-actions {
    gap: 14px;
}
.closeout-action-card {
    border-radius: 16px;
    padding: 16px;
}
.closeout-action-card strong {
    font-size: 1.05rem;
    color: #0b4ea2;
}
.fix18-closeout-buttons,
.fix18-bottom-actions {
    justify-content: flex-end;
    gap: 14px;
}
.fix18-complete-modal .completion-panel {
    max-width: 720px;
}
.fix19-completion-head {
    margin: 0 0 14px;
    padding: 14px 16px;
    border-radius: 14px;
    border: 1px solid #dbeafe;
    background: #f8fbff;
    text-align: center;
}
.fix19-completion-head span,
.fix19-completion-head small {
    display: block;
    color: #475569;
    font-weight: 800;
}
.fix19-completion-head strong {
    display: block;
    margin-top: 4px;
    color: #0b4ea2;
    font-size: 1.25rem;
}
.completion-summary-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.completion-action-row {
    border-top: 1px solid #e2e8f0;
    padding-top: 16px;
}
@media (max-width: 1240px) {
    .fix18-two-column-layout,
    .dual-info-grid,
    .closeout-grid {
        grid-template-columns: 1fr;
    }
    .sticky-total-card,
    .fix18-order-summary-card {
        position: static;
    }
}
@media (max-width: 760px) {
    .rental-workflow-sticky-shell .workflow-mode-panel,
    .ro-form-grid.three-col,
    .vehicle-rate-pair,
    .payment-entry-grid,
    .completion-summary-grid {
        grid-template-columns: 1fr;
    }
    .vehicle-title { max-width: 100%; }
}

/* Fix 19A: move Edit Rental Order closer to the approved mockup: shorter, clearer, and safer. */
.fix19a-mock-inspired .order-page-header {
    padding: 14px 20px;
    min-height: 74px;
}
.fix19a-mock-inspired .order-page-header h1 {
    font-size: 1.65rem;
    line-height: 1.1;
}
.fix19a-mock-inspired .workflow-mode-panel {
    display: grid;
    grid-template-columns: repeat(6, minmax(110px, 1fr));
    gap: 8px;
    padding: 10px 0 8px;
}
.fix19a-mock-inspired .workflow-step {
    min-height: 54px;
    padding: 9px 11px;
    border-radius: 13px;
}
.fix19a-mock-inspired .workflow-step strong {
    width: 22px;
    height: 22px;
    font-size: .75rem;
}
.fix19a-mock-inspired .workflow-step span {
    font-size: .82rem;
}
.fix19a-mock-inspired .workflow-step small {
    font-size: .68rem;
    line-height: 1.15;
}
.fix19a-mock-inspired .fix18-order-summary-card {
    padding: 10px 12px;
    gap: 10px;
    margin-bottom: 14px;
}
.fix19a-mock-inspired .fix18-summary-metrics > div {
    min-width: 118px;
    padding: 9px 11px;
}
.fix19a-mock-inspired .ro-collapsible-section summary {
    min-height: 48px;
    padding: 12px 16px;
}
.fix19a-mock-inspired .ro-section-body {
    padding: 14px 16px;
}
.fix19a-mock-inspired .dual-info-grid,
.fix19a-mock-inspired .ro-form-grid,
.fix19a-mock-inspired .payment-entry-grid,
.fix19a-mock-inspired .closeout-grid {
    gap: 12px;
}
.fix19a-mock-inspired .clean-info-panel,
.fix19a-mock-inspired .vehicle-card-modern,
.fix19a-mock-inspired .payment-processing-panel,
.fix19a-mock-inspired .closeout-card {
    box-shadow: 0 8px 18px rgba(15,23,42,.045);
}
.fix19a-mock-inspired .field-stack label,
.fix19a-mock-inspired .summary-line label,
.fix19a-mock-inspired .grand-total-line label {
    font-size: .82rem;
}
.fix19a-mock-inspired input,
.fix19a-mock-inspired select,
.fix19a-mock-inspired textarea {
    min-height: 40px;
}
.fix19a-mock-inspired .total-sidebar {
    width: min(360px, 100%);
}
.fix19a-mock-inspired .sticky-total-card {
    top: 132px;
}
.fix19a-mock-inspired .fix18-financial-group,
.fix19a-mock-inspired .fix18-fees-toggle {
    margin-top: 10px;
    padding-top: 10px;
}
.fix19a-mock-inspired .summary-line,
.fix19a-mock-inspired .grand-total-line {
    grid-template-columns: minmax(150px, 1fr) 120px;
    margin-bottom: 8px;
}
.travel-out-state-card {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(210px, auto) minmax(190px, max-content);
    align-items: center;
    justify-content: start;
    gap: 12px;
    padding: 10px 12px;
    border: 1px solid #d7e4f5;
    border-radius: 14px;
    background: #f8fbff;
}
.compact-select-check {
    min-height: 36px;
    margin: 0;
    gap: 8px;
    font-weight: 900;
}
.compact-select-check .ro-blue-check,
.compact-select-check input[type="checkbox"] {
    width: 22px;
    height: 22px;
}
.mini-outline-action {
    min-height: 38px;
    padding: 8px 12px;
    border-radius: 10px;
    border: 1px solid #8fc0ff;
    background: #ffffff;
    color: #0b4ea2;
    font-weight: 900;
    cursor: pointer;
}
.mini-outline-action:hover,
.mini-outline-action:focus {
    background: #eaf4ff;
    outline: 3px solid rgba(14, 165, 233, .18);
}
.extension-charge-breakdown {
    padding: 14px 16px;
    border-color: #f5c26b;
    background: #fff9ee;
}
.extension-notice-title,
.extension-total-line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.extension-notice-title strong {
    font-size: 1rem;
    color: #8a4b00;
}
#ExtensionDurationBadge {
    padding: 5px 10px;
    border-radius: 999px;
    background: #ffffff;
    border: 1px solid #f3cf91;
    color: #7c3e00;
    font-weight: 900;
}
.extension-breakdown-grid {
    display: grid;
    grid-template-columns: minmax(150px, 1fr) 110px;
    gap: 6px 16px;
    margin: 10px 0;
}
.extension-breakdown-grid span {
    color: #7c3e00;
    font-weight: 800;
}
.extension-breakdown-grid b {
    text-align: right;
    color: #111827;
    font-variant-numeric: tabular-nums;
}
.extension-total-line {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #f0c46f;
}
.extension-total-line span {
    color: #7c3e00;
    font-weight: 950;
}
.extension-total-line strong {
    color: #b45309;
    font-size: 1.1rem;
}
.extension-action-note {
    display: block;
    margin-top: 10px;
    font-size: .92rem;
    line-height: 1.35;
    color: #7c2d12;
    font-weight: 900;
}
.fix19a-mock-inspired .closeout-section .ro-section-body {
    padding-bottom: 16px;
}
.fix19a-mock-inspired .bottom-action-bar {
    position: sticky;
    bottom: 18px;
    margin-top: 16px;
    z-index: 30;
}
@media (max-width: 900px) {
    .travel-out-state-card {
        grid-template-columns: 1fr;
    }
}


/* Fix 19B: apply uploaded critique + target mock direction: clearer hierarchy, shorter page, stronger action/summary layout. */
.fix19b-modern-closeout {
    --hcr-primary: #0B6EF6;
    --hcr-success: #00B894;
    --hcr-warning: #FF7A59;
    --hcr-text: #0F1724;
    --hcr-muted: #475569;
    max-width: 1360px;
}
.fix19b-modern-closeout .rental-workflow-sticky-shell {
    position: sticky;
    top: 58px;
    z-index: 85;
    padding-bottom: 10px;
    backdrop-filter: blur(12px);
}
.fix19b-modern-closeout .order-page-header {
    border-radius: 14px;
    min-height: 64px;
    padding: 12px 18px;
    box-shadow: 0 12px 26px rgba(15,23,42,.14);
}
.fix19b-modern-closeout .order-status-stack {
    gap: 8px;
}
.fix19b-modern-closeout .workflow-mode-panel {
    display: flex;
    gap: 0;
    padding: 8px 10px;
    background: rgba(255,255,255,.78);
    border: 1px solid rgba(148,163,184,.25);
    border-radius: 15px;
    box-shadow: 0 10px 24px rgba(15,23,42,.08);
    overflow-x: auto;
}
.fix19b-modern-closeout .workflow-step {
    min-height: 38px;
    flex: 1 0 135px;
    border-radius: 999px;
    padding: 7px 12px;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 4px 8px;
    align-items: center;
    box-shadow: none;
    border: 1px solid #dce7f5;
    background: #fff;
}
.fix19b-modern-closeout .workflow-step:not(:last-child) { margin-right: 6px; }
.fix19b-modern-closeout .workflow-step strong {
    width: 20px;
    height: 20px;
    font-size: .72rem;
    grid-row: span 2;
}
.fix19b-modern-closeout .workflow-step span { font-size: .78rem; }
.fix19b-modern-closeout .workflow-step small { font-size: .62rem; line-height: 1.05; }
.fix19b-modern-closeout .fix18-order-summary-card {
    top: 142px;
    grid-template-columns: minmax(220px, 1fr) minmax(360px, 1.9fr) auto;
    border-radius: 14px;
}
.fix19b-modern-closeout .fix18-summary-metrics > div {
    border-radius: 10px;
    min-height: 48px;
}
.fix19b-modern-closeout .fix18-summary-metrics span,
.fix19b-modern-closeout .summary-line label,
.fix19b-modern-closeout .grand-total-line label,
.fix19b-modern-closeout .closeout-line span {
    color: var(--hcr-muted);
}
.fix19b-modern-closeout .order-layout-grid {
    grid-template-columns: minmax(0, 1.45fr) minmax(340px, .55fr);
    gap: 18px;
}
.fix19b-modern-closeout .order-main-column { gap: 14px; }
.fix19b-modern-closeout .ro-collapsible-section {
    border-radius: 14px;
    overflow: clip;
}
.fix19b-modern-closeout .ro-collapsible-section > summary {
    min-height: 44px;
    padding: 10px 14px;
}
.fix19b-modern-closeout .ro-collapsible-section > summary span { font-size: .95rem; }
.fix19b-modern-closeout .ro-collapsible-section > summary small { font-size: .72rem; }
.fix19b-modern-closeout .ro-section-body { padding: 12px 14px; }
.fix19b-modern-closeout .field-stack label { margin-bottom: 4px; }
.fix19b-modern-closeout input,
.fix19b-modern-closeout select,
.fix19b-modern-closeout textarea {
    min-height: 36px;
    border-radius: 10px;
}
.fix19b-modern-closeout .vehicle-title { font-size: 1.05rem; max-width: 430px; }
.fix19b-modern-closeout .vehicle-rate-box { padding: 8px 10px; border-radius: 12px; }
.fix19b-modern-closeout .vehicle-rate-box span { font-size: .65rem; }
.fix19b-modern-closeout .feature-chip { padding: 7px 10px; }
.fix19b-modern-closeout .travel-out-state-card {
    grid-template-columns: minmax(210px, 1fr) auto;
    border: 1px solid #c9d9ee;
    background: #fff;
    box-shadow: 0 4px 12px rgba(15,23,42,.035);
}
.fix19b-modern-closeout .travel-out-state-card.is-selected,
.fix19b-modern-closeout .travel-out-state-card:has(#TravelOutOfState:checked) {
    border-color: #0B6EF6;
    background: #eef6ff;
    box-shadow: 0 0 0 3px rgba(11,110,246,.10);
}
.travel-helper-text {
    grid-column: 1 / -1;
    color: #64748b;
    font-size: .72rem;
    font-weight: 800;
    margin-top: -4px;
}
.fix19b-modern-closeout .extension-charge-breakdown {
    margin-top: 10px;
    padding: 12px 14px;
    border-left: 4px solid #f59e0b;
}
.fix19b-modern-closeout .extension-breakdown-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}
.fix19b-modern-closeout .extension-breakdown-grid span,
.fix19b-modern-closeout .extension-breakdown-grid b {
    display: block;
    text-align: left;
}
.fix19b-modern-closeout .extension-breakdown-grid span { font-size: .72rem; }
.fix19b-modern-closeout .extension-breakdown-grid b { font-size: .9rem; }
.calculation-microcopy {
    margin-top: 8px;
    padding: 8px 10px;
    border-radius: 10px;
    background: #fff7ed;
    border: 1px dashed #fdba74;
    color: #7c2d12;
    font-size: .82rem;
    line-height: 1.35;
    font-weight: 850;
}
.fix19b-modern-closeout .extension-action-note {
    font-size: .95rem;
}
.fix19b-modern-closeout .payment-processing-panel,
.fix19b-modern-closeout .closeout-section .ro-section-body {
    background: #fbfdff;
}
.fix19b-modern-closeout .payment-entry-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fix19b-modern-closeout .payment-audit-table th,
.fix19b-modern-closeout .payment-audit-table td { font-size: .78rem; }
.fix19b-modern-closeout .closeout-grid {
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 10px;
}
.fix19b-modern-closeout .closeout-card { padding: 12px; }
.fix19b-modern-closeout .closeout-card h3 { font-size: .8rem; }
.fix19b-modern-closeout .deposit-settlement-actions {
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 10px;
}
.fix19b-modern-closeout .closeout-action-card { padding: 12px; min-height: 72px; }
.fix19b-modern-closeout .total-sidebar { width: 100%; }
.fix19b-modern-closeout .sticky-total-card { top: 164px; }
.fix19b-modern-closeout .sidebar-total-focus { min-height: 64px; }
.fix19b-modern-closeout .sidebar-total-focus strong { font-size: 1.35rem; }
.fix19b-modern-closeout .summary-line,
.fix19b-modern-closeout .grand-total-line {
    grid-template-columns: minmax(135px, 1fr) 108px;
    margin-bottom: 6px;
}
.fix19b-modern-closeout .summary-line input,
.fix19b-modern-closeout .grand-total-line input {
    text-align: right;
    min-height: 34px;
}
.fix19b-modern-closeout .fix18-financial-group h3,
.fix19b-modern-closeout .fix18-fees-toggle summary span {
    font-size: .78rem;
}
.fix19b-modern-closeout .bottom-action-bar { display: none; }
.fix19b-modern-closeout .completion-panel {
    max-width: 660px;
}
.fix19b-modern-closeout .completion-summary-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
}
@media (max-width: 1240px) {
    .fix19b-modern-closeout .rental-workflow-sticky-shell,
    .fix19b-modern-closeout .fix18-order-summary-card,
    .fix19b-modern-closeout .sticky-total-card { position: static; }
    .fix19b-modern-closeout .order-layout-grid,
    .fix19b-modern-closeout .closeout-grid,
    .fix19b-modern-closeout .deposit-settlement-actions { grid-template-columns: 1fr; }
    .fix19b-modern-closeout .bottom-action-bar { display: flex; }
}
@media (max-width: 760px) {
    .fix19b-modern-closeout .payment-entry-grid,
    .fix19b-modern-closeout .extension-breakdown-grid { grid-template-columns: 1fr; }
}

/* Fix 19C: full target mock layout for Edit Rental Order.
   This intentionally changes the form from a long stacked editor into a compact
   three-zone operations screen: top financial strip, left/middle workflow cards,
   and right financial/action cards. */
.fix19c-target-mock {
    --mock-bg: #eaf2fb;
    --mock-card: #ffffff;
    --mock-card-head: #f1f6fd;
    --mock-border: #cfdced;
    --mock-blue: #0B6EF6;
    --mock-navy: #102b67;
    --mock-text: #0F1724;
    --mock-muted: #64748b;
    --mock-danger: #ef4444;
    --mock-success: #16a34a;
    max-width: 1600px;
    padding: 12px 18px 40px;
    background: radial-gradient(circle at 20% 0%, rgba(77, 148, 255, .10), transparent 32%), var(--mock-bg);
}

/* Use one top header + compact workflow strip, not the old tall page header. */
.fix19c-target-mock .rental-workflow-sticky-shell {
    position: sticky;
    top: 56px;
    z-index: 90;
    padding: 0 0 12px;
    background: linear-gradient(180deg, rgba(234,242,251,.98), rgba(234,242,251,.84));
    backdrop-filter: blur(14px);
}
.fix19c-target-mock .order-page-header {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    align-items: center;
    gap: 18px;
    min-height: 78px;
    padding: 16px 28px;
    border-radius: 12px;
    color: #fff;
    background: linear-gradient(100deg, #14265b 0%, #1952c6 58%, #10b9dc 100%);
    box-shadow: 0 18px 42px rgba(11, 71, 170, .26);
}
.fix19c-target-mock .order-page-header .eyebrow {
    color: rgba(255,255,255,.72);
    letter-spacing: .16em;
    font-size: .72rem;
}
.fix19c-target-mock .order-page-header h1 {
    margin: 2px 0 0;
    font-size: 1.55rem;
    color: #fff;
}
.fix19c-target-mock .order-status-stack {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}
.fix19c-target-mock .status-badge,
.fix19c-target-mock .order-id-pill,
.fix19c-target-mock .compact-receipt-link {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    font-weight: 900;
}
.fix19c-target-mock .status-badge {
    padding: 7px 14px;
    background: #bbf7d0;
    color: #14532d;
}
.fix19c-target-mock .order-id-pill,
.fix19c-target-mock .compact-receipt-link {
    padding: 7px 14px;
    background: rgba(255,255,255,.92);
    color: #0b2e66;
    border: 0;
}
.fix19c-target-mock .receipt-button-row {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.fix19c-target-mock .workflow-mode-panel {
    display: grid;
    grid-template-columns: repeat(6, minmax(130px, 1fr));
    gap: 10px;
    margin-top: 12px;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}
.fix19c-target-mock .workflow-step {
    min-height: 72px;
    border-radius: 14px;
    padding: 12px 14px;
    background: #fff;
    border: 1px solid #d7e3f3;
    box-shadow: 0 10px 24px rgba(15,23,42,.07);
    display: grid;
    grid-template-columns: 26px 1fr;
    gap: 3px 9px;
}
.fix19c-target-mock .workflow-step strong {
    grid-row: span 2;
    width: 24px;
    height: 24px;
    background: #e8f1ff;
    color: #0b6ef6;
}
.fix19c-target-mock .workflow-step.is-current,
.fix19c-target-mock .workflow-step:hover {
    border-color: #0b6ef6;
    background: #edf8ff;
    box-shadow: 0 0 0 3px rgba(11,110,246,.08), 0 12px 26px rgba(15,23,42,.08);
}
.fix19c-target-mock .workflow-step.is-done {
    background: #eefdf3;
    border-color: #bbf7d0;
}
.fix19c-target-mock .workflow-step span {
    color: #0f172a;
    font-size: .88rem;
}
.fix19c-target-mock .workflow-step small {
    color: #475569;
    font-size: .72rem;
}

/* Top summary strip - visual equivalent of the mock's main financial banner. */
.fix19c-target-mock .fix18-order-summary-card {
    position: sticky;
    top: 214px;
    z-index: 60;
    display: grid;
    grid-template-columns: minmax(220px, 1.3fr) minmax(420px, 2fr) auto;
    gap: 12px;
    align-items: center;
    margin: 0 0 18px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(148,163,184,.35);
    background: rgba(255,255,255,.94);
    box-shadow: 0 12px 34px rgba(15,23,42,.10);
    backdrop-filter: blur(14px);
}
.fix19c-target-mock .fix18-summary-title span,
.fix19c-target-mock .fix18-summary-metrics span {
    text-transform: uppercase;
    letter-spacing: .07em;
    color: #64748b;
    font-weight: 950;
    font-size: .62rem;
}
.fix19c-target-mock .fix18-summary-title strong {
    color: #0f172a;
    font-size: 1.15rem;
}
.fix19c-target-mock .fix18-summary-subline {
    color: #475569;
    font-weight: 800;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fix19c-target-mock .fix18-summary-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(105px, 1fr));
    gap: 8px;
}
.fix19c-target-mock .fix18-summary-metrics > div {
    min-height: 54px;
    padding: 8px 12px;
    border-radius: 10px;
    border: 1px solid #dbe7f6;
    background: #fff;
}
.fix19c-target-mock .fix18-summary-metrics strong {
    display: block;
    margin-top: 3px;
    color: #102b67;
    font-size: .98rem;
}
.fix19c-target-mock .fix18-summary-metrics .balance strong { color: #dc2626; }
.fix19c-target-mock .fix18-summary-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}
.fix19c-target-mock .fix18-primary-complete,
.fix19c-target-mock .primary-action {
    min-height: 46px;
    border-radius: 12px;
    background: #0b6ef6;
    box-shadow: 0 12px 26px rgba(11,110,246,.28);
}
.fix19c-target-mock .fix18-overflow-menu > summary {
    min-height: 46px;
    border-radius: 12px;
    padding: 12px 16px;
    background: #fff;
    border: 1px solid #cfdced;
    box-shadow: 0 8px 18px rgba(15,23,42,.08);
}

/* Three-column mock layout. */
.fix19c-target-mock .order-layout-grid {
    display: grid;
    grid-template-columns: minmax(310px, .92fr) minmax(420px, 1.15fr) minmax(360px, .93fr);
    gap: 22px;
    align-items: start;
}
.fix19c-target-mock .order-main-column {
    display: contents;
}
.fix19c-target-mock .order-main-column > details,
.fix19c-target-mock .total-sidebar,
.fix19c-target-mock .fix18-charges-card {
    min-width: 0;
}
.fix19c-target-mock .order-main-column > details:nth-of-type(1) { grid-column: 1 / span 2; grid-row: 1; }
.fix19c-target-mock .order-main-column > details:nth-of-type(2) { grid-column: 1; grid-row: 2; }
.fix19c-target-mock .order-main-column > details:nth-of-type(3) { grid-column: 2; grid-row: 2; }
.fix19c-target-mock .order-main-column > details:nth-of-type(4) { grid-column: 3; grid-row: 2; }
.fix19c-target-mock .order-main-column > details:nth-of-type(5) { grid-column: 3; grid-row: 3; }
.fix19c-target-mock .order-main-column > details:nth-of-type(6) { grid-column: 1; grid-row: 3; }
.fix19c-target-mock .order-main-column > details:nth-of-type(7) { grid-column: 2; grid-row: 3; }
.fix19c-target-mock .total-sidebar { grid-column: 3; grid-row: 1; }

/* Card visual system matching the mock. */
.fix19c-target-mock .ro-collapsible-section {
    border: 1px solid var(--mock-border);
    border-radius: 12px;
    overflow: hidden;
    background: var(--mock-card);
    box-shadow: 0 12px 28px rgba(15, 23, 42, .10);
}
.fix19c-target-mock .ro-collapsible-section > summary {
    min-height: 58px;
    padding: 14px 20px;
    background: linear-gradient(180deg, #f7fbff 0%, #eaf2fb 100%);
    border-bottom: 1px solid #d5e0ee;
}
.fix19c-target-mock .ro-collapsible-section > summary::marker { color: #94a3b8; }
.fix19c-target-mock .ro-collapsible-section > summary span {
    font-size: 1.18rem;
    color: #142852;
    letter-spacing: 0;
}
.fix19c-target-mock .ro-collapsible-section > summary small {
    color: #64748b;
    font-size: .74rem;
    font-weight: 900;
}
.fix19c-target-mock .ro-section-body {
    padding: 18px 20px 20px;
}

/* Customer/vehicle card as two large panels. */
.fix19c-target-mock .dual-info-grid {
    grid-template-columns: minmax(270px, .85fr) minmax(400px, 1.15fr);
    gap: 22px;
}
.fix19c-target-mock .clean-info-panel,
.fix19c-target-mock .vehicle-card-modern,
.fix19c-target-mock .payment-processing-panel,
.fix19c-target-mock .closeout-card,
.fix19c-target-mock .nested-entry-panel {
    border: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
}
.fix19c-target-mock .panel-title {
    display: none;
}
.fix19c-target-mock .customer-summary-flow .readonly-line {
    display: grid;
    grid-template-columns: 150px 1fr;
    min-height: 44px;
    padding: 10px 0;
    border-radius: 0;
    border: 0;
    border-bottom: 1px solid #e2e8f0;
    background: transparent;
}
.fix19c-target-mock .customer-summary-flow .readonly-line span {
    color: #475569;
    text-transform: none;
    letter-spacing: 0;
    font-size: .9rem;
}
.fix19c-target-mock .customer-summary-flow .readonly-line strong {
    text-align: right;
    color: #111827;
    font-size: .95rem;
}
.fix19c-target-mock .fix19-contact-actions {
    justify-content: flex-start;
    margin-top: 14px;
}
.fix19c-target-mock .fix19-mini-action {
    min-width: 84px;
    justify-content: center;
    border-radius: 10px;
    font-size: .9rem;
}
.fix19c-target-mock .vehicle-card-header {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) 250px;
    gap: 16px;
    align-items: start;
    margin-bottom: 12px;
}
.fix19c-target-mock .vehicle-title {
    font-size: 1.25rem;
    max-width: 100%;
    color: #142852;
}
.fix19c-target-mock .vehicle-rate-pair {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}
.fix19c-target-mock .vehicle-rate-box {
    min-height: 62px;
    background: #edf5ff;
    border: 1px solid #c8daf2;
    box-shadow: none;
}
.fix19c-target-mock .feature-line-grid {
    margin: 12px 0;
    gap: 8px;
}
.fix19c-target-mock .feature-chip {
    border-radius: 999px;
    background: #f8fafc;
    border: 1px solid #d7e4f5;
    padding: 8px 12px;
}

/* Compact field/input system. */
.fix19c-target-mock .ro-form-grid.three-col,
.fix19c-target-mock .ro-form-grid.two-col,
.fix19c-target-mock .payment-entry-grid {
    gap: 12px 16px;
}
.fix19c-target-mock .ro-form-grid.three-col,
.fix19c-target-mock .payment-entry-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.fix19c-target-mock .field-stack label {
    color: #0f172a;
    font-size: .86rem;
    font-weight: 900;
}
.fix19c-target-mock input,
.fix19c-target-mock select,
.fix19c-target-mock textarea {
    min-height: 42px;
    border: 1px solid #cfdae8;
    border-radius: 9px;
    background: #fff;
}
.fix19c-target-mock input[readonly],
.fix19c-target-mock .summary-line input,
.fix19c-target-mock .grand-total-line input {
    background: #eef3f9;
}
.fix19c-target-mock .duration-summary-line {
    align-items: center;
}
.fix19c-target-mock .duration-summary-line .feature-chip {
    min-width: 82px;
    justify-content: center;
}

/* Travel out-of-state now appears as a real selectable action card. */
.fix19c-target-mock .travel-out-state-card {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(170px, 1fr) auto;
    gap: 10px 14px;
    padding: 12px 14px;
    border: 1px solid #d5e3f5;
    border-radius: 12px;
    background: #fff;
}
.fix19c-target-mock .travel-out-state-card:has(#TravelOutOfState:checked) {
    border-color: #0b6ef6;
    background: #eef7ff;
    box-shadow: 0 0 0 3px rgba(11,110,246,.10);
}
.fix19c-target-mock .mini-outline-action {
    border-radius: 10px;
    background: #fff;
    border-color: #9ecaff;
    color: #0b4ea2;
}

/* Extension box: tighter, formula-like, not a full-width page block. */
.fix19c-target-mock .extension-charge-breakdown,
.fix19c-target-mock .mileage-tax-summary,
.fix19c-target-mock .out-state-summary,
.fix19c-target-mock .mileage-return-summary {
    margin-top: 12px;
    border-radius: 12px;
}
.fix19c-target-mock .extension-breakdown-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.fix19c-target-mock .extension-total-line {
    background: #fff;
    padding: 10px 12px;
    border-radius: 10px;
}

/* Rental options as list-like charges. */
.fix19c-target-mock .compact-options-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}
.fix19c-target-mock .compact-option-card {
    min-height: 52px;
    display: grid;
    grid-template-columns: 1fr auto 110px;
    gap: 12px;
    align-items: center;
    border-radius: 10px;
    border: 1px solid #d5e3f5;
    box-shadow: none;
}
.fix19c-target-mock .compact-option-card:has(.ro-blue-check:checked),
.fix19c-target-mock .compact-option-card.is-selected {
    border-color: #0b6ef6;
    background: #eef7ff;
}
.fix19c-target-mock .option-title { font-size: .93rem; }
.fix19c-target-mock .option-control { justify-content: flex-end; }

/* Right column: order summary + payments/deposit behavior. */
.fix19c-target-mock .total-sidebar { align-self: start; }
.fix19c-target-mock .sticky-total-card {
    position: sticky;
    top: 214px;
    border-radius: 12px;
    border: 1px solid var(--mock-border);
    background: #fff;
    box-shadow: 0 12px 28px rgba(15,23,42,.10);
    padding: 0;
    overflow: hidden;
}
.fix19c-target-mock .sticky-total-card .section-heading {
    padding: 16px 20px;
    margin: 0;
    background: linear-gradient(180deg, #f7fbff, #eaf2fb);
    border-bottom: 1px solid #d5e0ee;
    border-radius: 0;
    color: #142852;
    font-size: 1.12rem;
}
.fix19c-target-mock .sidebar-total-focus {
    margin: 16px 16px 12px;
    min-height: 72px;
    border-radius: 0;
    background: #0d4aa2;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px;
}
.fix19c-target-mock .sidebar-total-focus span,
.fix19c-target-mock .sidebar-total-focus strong { color: #fff; }
.fix19c-target-mock .payment-mini-summary {
    margin: 0 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.fix19c-target-mock .payment-mini-summary span { color: #0f172a; font-weight: 900; }
.fix19c-target-mock .payment-mini-summary strong { color: #142852; }
.fix19c-target-mock .payment-mini-summary.balance strong { color: #dc2626; }
.fix19c-target-mock .fix18-financial-group,
.fix19c-target-mock .fix18-fees-toggle {
    margin: 18px 16px 0;
    padding: 0;
    border: 1px solid #d7e4f5;
    border-radius: 12px;
    overflow: hidden;
}
.fix19c-target-mock .fix18-financial-group h3,
.fix19c-target-mock .fix18-fees-toggle summary {
    margin: 0;
    padding: 12px 14px;
    background: #f7fbff;
    border-bottom: 1px solid #d7e4f5;
    color: #142852;
    font-size: .98rem;
}
.fix19c-target-mock .summary-line,
.fix19c-target-mock .grand-total-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 120px;
    gap: 12px;
    padding: 8px 12px;
    margin: 0;
    border-bottom: 1px solid #edf2f7;
    align-items: center;
}
.fix19c-target-mock .summary-line label,
.fix19c-target-mock .grand-total-line label {
    color: #0f172a;
    font-size: .84rem;
    font-weight: 900;
}
.fix19c-target-mock .summary-line input,
.fix19c-target-mock .grand-total-line input,
.fix19c-target-mock .summary-line output {
    min-height: 34px;
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 900;
}
.fix19c-target-mock .grand-total-line {
    margin: 16px;
    border: 0;
    border-radius: 10px;
    background: #0d4aa2;
}
.fix19c-target-mock .grand-total-line label { color: #fff; }
.fix19c-target-mock .grand-total-line input {
    color: #142852;
    background: #fff !important;
}

/* Payment and deposit cards are now right-column panels like the mock. */
.fix19c-target-mock .order-main-column > details:nth-of-type(4),
.fix19c-target-mock .order-main-column > details:nth-of-type(5) {
    box-shadow: 0 12px 28px rgba(15,23,42,.10);
}
.fix19c-target-mock .payment-choice-grid,
.fix19c-target-mock .deposit-settlement-actions {
    display: grid;
    grid-template-columns: 1fr;
}
.fix19c-target-mock .option-choice-card,
.fix19c-target-mock .closeout-action-card {
    min-height: 48px;
    border: 0;
    border-bottom: 1px solid #e2e8f0;
    border-radius: 0;
    box-shadow: none;
    background: #fff;
}
.fix19c-target-mock .option-choice-card:has(input:checked),
.fix19c-target-mock .closeout-action-card:has(input:checked) {
    background: #eef8f1;
    border-left: 4px solid #22c55e;
}
.fix19c-target-mock .payment-processing-panel {
    margin-top: 12px;
    padding: 14px;
    border: 1px solid #d7e4f5;
    border-radius: 12px;
    background: #fff;
}
.fix19c-target-mock .payment-audit-table {
    font-size: .78rem;
}

/* Closeout resembles Deposit Actions mock: compact options + clear confirmation note. */
.fix19c-target-mock .closeout-grid {
    grid-template-columns: 1fr;
}
.fix19c-target-mock .closeout-card {
    padding: 10px 0;
    border-bottom: 1px solid #e2e8f0;
}
.fix19c-target-mock .closeout-card h3 {
    color: #142852;
    font-size: .94rem;
}
.fix19c-target-mock .closeout-line {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}
.fix19c-target-mock .closeout-button-row {
    margin-top: 14px;
    justify-content: flex-end;
}
.fix19c-target-mock .full-row-notes textarea { min-height: 120px; }

/* Modal aligned to target mock. */
.fix19c-target-mock .completion-panel {
    max-width: 640px;
    border-radius: 14px;
}
.fix19c-target-mock .hcr-modal-header h2 {
    color: #14376d;
}
.fix19c-target-mock .fix19-completion-head {
    border: 0;
    background: transparent;
    padding: 6px 0 14px;
}
.fix19c-target-mock .fix19-completion-head strong {
    color: #0b4ea2;
    font-size: 1.45rem;
}
.fix19c-target-mock .completion-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.fix19c-target-mock .completion-ack-check {
    min-height: 48px;
    font-size: 1rem;
}

/* Hide the old duplicate sticky bottom bar on desktop. */
.fix19c-target-mock .bottom-action-bar { display: none !important; }

@media (max-width: 1320px) {
    .fix19c-target-mock .order-layout-grid {
        grid-template-columns: 1fr 1fr;
    }
    .fix19c-target-mock .order-main-column > details:nth-of-type(1),
    .fix19c-target-mock .total-sidebar,
    .fix19c-target-mock .order-main-column > details:nth-of-type(4),
    .fix19c-target-mock .order-main-column > details:nth-of-type(5) {
        grid-column: 1 / -1;
        grid-row: auto;
    }
    .fix19c-target-mock .order-main-column > details:nth-of-type(2),
    .fix19c-target-mock .order-main-column > details:nth-of-type(6) { grid-column: 1; grid-row: auto; }
    .fix19c-target-mock .order-main-column > details:nth-of-type(3),
    .fix19c-target-mock .order-main-column > details:nth-of-type(7) { grid-column: 2; grid-row: auto; }
    .fix19c-target-mock .sticky-total-card,
    .fix19c-target-mock .fix18-order-summary-card,
    .fix19c-target-mock .rental-workflow-sticky-shell { position: static; }
}
@media (max-width: 860px) {
    .fix19c-target-mock .order-layout-grid,
    .fix19c-target-mock .dual-info-grid,
    .fix19c-target-mock .vehicle-card-header,
    .fix19c-target-mock .ro-form-grid.three-col,
    .fix19c-target-mock .payment-entry-grid,
    .fix19c-target-mock .workflow-mode-panel,
    .fix19c-target-mock .fix18-order-summary-card,
    .fix19c-target-mock .fix18-summary-metrics {
        grid-template-columns: 1fr;
    }
    .fix19c-target-mock .order-main-column > details,
    .fix19c-target-mock .total-sidebar {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
    }
    .fix19c-target-mock .order-page-header { grid-template-columns: 1fr; }
    .fix19c-target-mock .order-status-stack { justify-content: flex-start; }
}

/* Fix 19D: correct the target mock layout so it does not create grid-row gaps.
   The previous version placed left cards and the right summary in the same CSS grid rows;
   the tall right summary forced large blank areas in the left workflow. This version uses
   independent stacked columns: operational content on the left and sticky financial summary
   on the right, closer to the supplied mock screen. */
.fix19d-mock-layout {
    max-width: 1540px;
    padding: 12px 18px 46px;
}

.fix19d-mock-layout .rental-workflow-sticky-shell {
    position: sticky;
    top: 52px;
    z-index: 95;
    padding-bottom: 10px;
    background: linear-gradient(180deg, rgba(234,242,251,.98) 0%, rgba(234,242,251,.88) 72%, rgba(234,242,251,.72) 100%);
}

.fix19d-mock-layout .order-page-header {
    min-height: 70px;
    padding: 14px 22px;
}

.fix19d-mock-layout .workflow-mode-panel {
    grid-template-columns: repeat(6, minmax(110px, 1fr));
    gap: 8px;
    margin-top: 8px;
}

.fix19d-mock-layout .workflow-step {
    min-height: 58px;
    padding: 9px 10px;
    border-radius: 10px;
    grid-template-columns: 22px 1fr;
}

.fix19d-mock-layout .workflow-step strong {
    width: 20px;
    height: 20px;
    font-size: .72rem;
}

.fix19d-mock-layout .workflow-step span { font-size: .8rem; }
.fix19d-mock-layout .workflow-step small { font-size: .64rem; }

/* Blue financial strip directly under workflow header, matching the mock direction. */
.fix19d-mock-layout .fix18-order-summary-card {
    position: static;
    z-index: auto;
    grid-template-columns: minmax(260px, 1.25fr) minmax(420px, 2fr) auto;
    margin: 14px 0 18px;
    padding: 12px 16px;
    border: 0;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(100deg, #13265b 0%, #1e56c8 58%, #11b7d9 100%);
    box-shadow: 0 14px 34px rgba(15, 67, 155, .24);
}

.fix19d-mock-layout .fix18-order-summary-card .fix18-summary-title span,
.fix19d-mock-layout .fix18-order-summary-card .fix18-summary-metrics span {
    color: rgba(255,255,255,.72);
}

.fix19d-mock-layout .fix18-order-summary-card .fix18-summary-title strong,
.fix19d-mock-layout .fix18-order-summary-card .fix18-summary-subline,
.fix19d-mock-layout .fix18-order-summary-card .fix18-summary-metrics strong {
    color: #fff;
}

.fix19d-mock-layout .fix18-order-summary-card .fix18-summary-metrics > div {
    min-height: 50px;
    background: rgba(255,255,255,.12);
    border-color: rgba(255,255,255,.20);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
}

.fix19d-mock-layout .fix18-order-summary-card .fix18-summary-metrics .balance strong {
    color: #fff;
}

.fix19d-mock-layout .fix18-order-summary-card .fix18-primary-complete,
.fix19d-mock-layout .fix18-order-summary-card .primary-action {
    background: #0ea5e9;
    color: #fff;
    box-shadow: 0 10px 26px rgba(14,165,233,.28);
}

.fix19d-mock-layout .fix18-overflow-menu > summary {
    min-height: 42px;
}

/* Independent two-column operational stack + sticky right summary.
   This removes the large empty space seen under Customer & Vehicle in Fix 19C. */
.fix19d-mock-layout .order-layout-grid {
    display: grid;
    grid-template-columns: minmax(720px, 1fr) 360px;
    gap: 22px;
    align-items: start;
}

.fix19d-mock-layout .order-main-column {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 22px;
    align-items: start;
}

.fix19d-mock-layout .order-main-column > details,
.fix19d-mock-layout .total-sidebar {
    grid-column: auto !important;
    grid-row: auto !important;
}

.fix19d-mock-layout .order-main-column > details:nth-of-type(1) {
    grid-column: 1 / -1 !important;
}

.fix19d-mock-layout .order-main-column > details:nth-of-type(2),
.fix19d-mock-layout .order-main-column > details:nth-of-type(6) {
    grid-column: 1 !important;
}

.fix19d-mock-layout .order-main-column > details:nth-of-type(3),
.fix19d-mock-layout .order-main-column > details:nth-of-type(7) {
    grid-column: 2 !important;
}

/* Payment and closeout remain in the operational workflow but no longer force blank rows. */
.fix19d-mock-layout .order-main-column > details:nth-of-type(4),
.fix19d-mock-layout .order-main-column > details:nth-of-type(5) {
    grid-column: 1 / -1 !important;
}

.fix19d-mock-layout .total-sidebar {
    grid-column: 2 !important;
    align-self: start;
}

.fix19d-mock-layout .sticky-total-card {
    position: sticky;
    top: 216px;
    border-radius: 12px;
}

/* Customer and vehicle should sit in one compact, readable row. */
.fix19d-mock-layout .dual-info-grid {
    grid-template-columns: minmax(260px, .8fr) minmax(420px, 1.2fr);
    gap: 18px;
}

.fix19d-mock-layout .ro-section-body {
    padding: 15px 18px 17px;
}

.fix19d-mock-layout .ro-collapsible-section > summary {
    min-height: 48px;
    padding: 12px 16px;
}

.fix19d-mock-layout .ro-collapsible-section > summary span {
    font-size: 1.02rem;
}

.fix19d-mock-layout .ro-collapsible-section > summary small {
    font-size: .66rem;
}

.fix19d-mock-layout .customer-summary-flow .readonly-line {
    min-height: 36px;
    grid-template-columns: 130px 1fr;
    padding: 8px 0;
}

.fix19d-mock-layout .vehicle-card-header {
    grid-template-columns: minmax(210px, 1fr) 210px;
    margin-bottom: 10px;
}

.fix19d-mock-layout .vehicle-title {
    font-size: 1.08rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fix19d-mock-layout .vehicle-rate-box {
    min-height: 52px;
    padding: 9px 11px;
}

.fix19d-mock-layout .vehicle-rate-box span,
.fix19d-mock-layout .feature-chip span {
    font-size: .66rem;
}

.fix19d-mock-layout .feature-chip {
    padding: 6px 10px;
}

.fix19d-mock-layout input,
.fix19d-mock-layout select,
.fix19d-mock-layout textarea {
    min-height: 38px;
}

.fix19d-mock-layout .field-stack label {
    font-size: .78rem;
}

.fix19d-mock-layout .ro-form-grid.three-col,
.fix19d-mock-layout .payment-entry-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.fix19d-mock-layout .travel-out-state-card {
    grid-template-columns: minmax(150px, 1fr) auto;
    padding: 10px 12px;
}

.fix19d-mock-layout .compact-option-card {
    min-height: 48px;
    grid-template-columns: 1fr auto 96px;
    padding: 9px 11px;
}

.fix19d-mock-layout .summary-line,
.fix19d-mock-layout .grand-total-line {
    grid-template-columns: minmax(0, 1fr) 112px;
    padding: 7px 11px;
}

.fix19d-mock-layout .summary-line input,
.fix19d-mock-layout .grand-total-line input,
.fix19d-mock-layout .summary-line output {
    min-height: 32px;
}

.fix19d-mock-layout .sidebar-total-focus {
    min-height: 62px;
    margin: 14px 14px 10px;
    padding: 14px 16px;
}

.fix19d-mock-layout .fix18-financial-group,
.fix19d-mock-layout .fix18-fees-toggle {
    margin: 14px 14px 0;
}

.fix19d-mock-layout .grand-total-line {
    margin: 14px;
}

/* Use a compact full-width payment area that still scans like a right-side transaction card. */
.fix19d-mock-layout .payment-choice-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.fix19d-mock-layout .deposit-settlement-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.fix19d-mock-layout .closeout-action-card,
.fix19d-mock-layout .option-choice-card {
    border: 1px solid #d7e4f5;
    border-radius: 10px;
}

@media (max-width: 1280px) {
    .fix19d-mock-layout .order-layout-grid {
        grid-template-columns: 1fr;
    }
    .fix19d-mock-layout .sticky-total-card,
    .fix19d-mock-layout .rental-workflow-sticky-shell {
        position: static;
    }
    .fix19d-mock-layout .total-sidebar {
        grid-column: 1 !important;
        order: -1;
    }
}

@media (max-width: 900px) {
    .fix19d-mock-layout .order-main-column,
    .fix19d-mock-layout .dual-info-grid,
    .fix19d-mock-layout .vehicle-card-header,
    .fix19d-mock-layout .payment-choice-grid,
    .fix19d-mock-layout .deposit-settlement-actions,
    .fix19d-mock-layout .fix18-order-summary-card,
    .fix19d-mock-layout .fix18-summary-metrics,
    .fix19d-mock-layout .workflow-mode-panel {
        grid-template-columns: 1fr;
    }
    .fix19d-mock-layout .order-main-column > details {
        grid-column: 1 !important;
    }
}

/* =========================================================
   Fix 20 - Compact Smart Edit Rental Order Workspace
   Purpose: replace the long single-scroll edit screen with a
   sticky order context bar, task tabs, and independent summary rail.
   ========================================================= */
.fix20-compact-workspace {
    --fix20-blue:#0b63ce;
    --fix20-blue-dark:#09265f;
    --fix20-sky:#13b8db;
    --fix20-green:#d7f8d8;
    --fix20-green-text:#0f6b2a;
    --fix20-card:#ffffff;
    --fix20-muted:#64748b;
    --fix20-border:#d8e2f1;
    --fix20-bg:#eef6ff;
    max-width: 1320px;
    margin-inline: auto;
    padding-bottom: 40px;
}

.fix20-compact-workspace .rental-workflow-sticky-shell {
    position: sticky;
    top: 54px;
    z-index: 35;
    background: linear-gradient(180deg, rgba(238,246,255,.98), rgba(238,246,255,.88));
    backdrop-filter: blur(10px);
    padding: 10px 0 8px;
}

.fix20-command-header {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    min-height:66px;
    padding:14px 18px;
    border-radius:16px;
    background:linear-gradient(105deg, #10245f 0%, #0b63ce 65%, #12b9d8 100%);
    box-shadow:0 14px 34px rgba(10,55,120,.22);
}

.fix20-order-identity h1 {
    margin:0;
    font-size:24px;
    line-height:1.05;
    color:#fff;
}

.fix20-order-identity p {
    margin:5px 0 0;
    color:rgba(255,255,255,.85);
    font-size:13px;
    max-width:480px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.fix20-command-actions {
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:nowrap;
}

.fix20-status-badge,
.fix20-command-actions .status-badge {
    background: var(--fix20-green) !important;
    color: var(--fix20-green-text) !important;
    border:1px solid rgba(15,107,42,.18);
    box-shadow:none;
    font-weight:800;
    padding:8px 14px;
    border-radius:999px;
}

.fix20-command-actions .order-id-pill {
    background: rgba(255,255,255,.16);
    color:#fff;
    border:1px solid rgba(255,255,255,.22);
    border-radius:999px;
    padding:8px 13px;
    white-space:nowrap;
}

.fix20-top-primary {
    border-radius:999px;
    min-height:40px;
    padding:0 18px;
    white-space:nowrap;
    box-shadow:0 8px 20px rgba(0,0,0,.15);
}

.fix20-actions-menu > summary {
    min-height:40px;
    padding:0 16px;
    display:flex;
    align-items:center;
    border-radius:999px;
    background:#fff;
    color:#12305d;
    font-weight:800;
    cursor:pointer;
    box-shadow:0 6px 14px rgba(15,23,42,.14);
}

.fix20-compact-workspace .workflow-mode-panel {
    display:flex;
    gap:8px;
    padding:8px 4px 0;
    overflow-x:auto;
}

.fix20-compact-workspace .workflow-step {
    min-width:150px;
    flex:1 1 0;
    padding:9px 10px;
    border-radius:12px;
    background:#fff;
    border:1px solid var(--fix20-border);
    box-shadow:0 4px 12px rgba(15,42,80,.07);
}

.fix20-compact-workspace .workflow-step strong {
    width:22px;
    height:22px;
    font-size:12px;
}

.fix20-compact-workspace .workflow-step span {
    font-size:13px;
}

.fix20-compact-workspace .workflow-step small {
    font-size:11px;
    line-height:1.2;
}

.fix20-compact-workspace .fix18-order-summary-card {
    position: sticky;
    top: 178px;
    z-index: 32;
    display:flex;
    align-items:center;
    gap:12px;
    margin:12px 0;
    padding:10px 12px;
    border-radius:14px;
    border:1px solid var(--fix20-border);
    background:rgba(255,255,255,.95);
    box-shadow:0 10px 22px rgba(15,42,80,.10);
    backdrop-filter: blur(8px);
}

.fix20-compact-workspace .fix18-summary-main {
    min-width: 270px;
}

.fix20-compact-workspace .fix18-summary-title span,
.fix20-compact-workspace .fix18-summary-title strong {
    font-size:13px;
}

.fix20-compact-workspace .fix18-summary-subline {
    font-size:12px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width: 300px;
}

.fix20-compact-workspace .fix18-summary-metrics {
    display:grid;
    grid-template-columns: repeat(4, minmax(105px, 1fr));
    gap:8px;
    flex:1;
}

.fix20-compact-workspace .fix18-summary-metrics > div {
    padding:8px 10px;
    border-radius:12px;
    background:#f8fbff;
    border:1px solid var(--fix20-border);
}

.fix20-compact-workspace .fix18-summary-metrics span {
    display:block;
    font-size:10px;
    text-transform:uppercase;
    letter-spacing:.06em;
    color:var(--fix20-muted);
    margin-bottom:2px;
}

.fix20-compact-workspace .fix18-summary-metrics strong {
    font-size:15px;
    color:#0f1724;
}

.fix20-compact-workspace .fix18-summary-actions {
    display:none;
}

.fix20-task-tabs {
    position: sticky;
    top: 260px;
    z-index: 31;
    display:flex;
    gap:8px;
    margin: 0 0 12px;
    padding:8px;
    border-radius:16px;
    border:1px solid var(--fix20-border);
    background:rgba(255,255,255,.96);
    box-shadow:0 8px 18px rgba(15,42,80,.08);
    overflow-x:auto;
}

.fix20-task-tab {
    border:1px solid var(--fix20-border);
    background:#f8fbff;
    color:#12305d;
    font-weight:800;
    border-radius:999px;
    padding:10px 14px;
    min-height:42px;
    cursor:pointer;
    white-space:nowrap;
}

.fix20-task-tab.is-active {
    color:#fff;
    background:linear-gradient(105deg, var(--fix20-blue), var(--fix20-sky));
    border-color:transparent;
    box-shadow:0 8px 16px rgba(11,99,206,.20);
}

.fix20-compact-workspace .order-layout-grid,
.fix20-compact-workspace .order-layout-grid.fix18-two-column-layout {
    display:grid;
    grid-template-columns:minmax(0, 1fr) 360px;
    gap:18px;
    align-items:start;
}

.fix20-compact-workspace .order-main-column {
    display:block;
    min-width:0;
}

.fix20-compact-workspace .order-main-column [data-task-panel] {
    display:none !important;
}

.fix20-compact-workspace .order-main-column[data-active-task="overview"] [data-task-panel="overview"],
.fix20-compact-workspace .order-main-column[data-active-task="return"] [data-task-panel="return"],
.fix20-compact-workspace .order-main-column[data-active-task="options"] [data-task-panel="options"],
.fix20-compact-workspace .order-main-column[data-active-task="payment"] [data-task-panel="payment"],
.fix20-compact-workspace .order-main-column[data-active-task="deposit"] [data-task-panel="deposit"],
.fix20-compact-workspace .order-main-column[data-active-task="notes"] [data-task-panel="notes"] {
    display:block !important;
}

.fix20-compact-workspace .ro-collapsible-section {
    margin:0;
    border-radius:16px;
    overflow:hidden;
    box-shadow:0 10px 24px rgba(15,42,80,.10);
}

.fix20-compact-workspace .ro-collapsible-section > summary {
    min-height:54px;
    padding:14px 18px;
    cursor:default;
}

.fix20-compact-workspace .ro-collapsible-section > summary::-webkit-details-marker {
    display:none;
}

.fix20-compact-workspace .ro-section-body {
    padding:16px 18px 18px;
}

.fix20-compact-workspace .dual-info-grid {
    display:grid;
    grid-template-columns: 0.95fr 1.25fr;
    gap:16px;
    align-items:stretch;
}

.fix20-readonly-value {
    border:1px solid var(--fix20-border);
    border-radius:12px;
    padding:11px 12px;
    background:#f8fbff;
    color:#0f1724;
    min-height:42px;
    display:flex;
    align-items:center;
}

.fix20-readonly-value.strong {
    font-weight:800;
}

.fix20-readonly-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-top:10px;
}

.fix20-readonly-grid > div {
    border:1px solid var(--fix20-border);
    border-radius:12px;
    padding:10px 12px;
    background:#f8fbff;
}

.fix20-readonly-grid span {
    display:block;
    font-size:10px;
    text-transform:uppercase;
    color:var(--fix20-muted);
    letter-spacing:.05em;
    margin-bottom:3px;
}

.fix20-readonly-grid strong {
    color:#0f1724;
    font-size:14px;
}

.fix20-compact-workspace .total-sidebar {
    align-self:start;
}

.fix20-compact-workspace .sticky-total-card {
    position:sticky;
    top: 322px;
    border-radius:16px;
    box-shadow:0 14px 28px rgba(15,42,80,.14);
}

.fix20-compact-workspace .bottom-action-bar,
.fix20-compact-workspace .fix18-bottom-actions {
    display:none !important;
}

.fix20-compact-workspace .closeout-button-row {
    justify-content:flex-end;
}

.fix20-compact-workspace .summary-line input,
.fix20-compact-workspace .grand-total-line input,
.fix20-compact-workspace .vehicle-rate-box input,
.fix20-compact-workspace input[type="number"] {
    text-align:right;
}

.fix20-compact-workspace .hcr-table {
    font-size:12px;
}

.fix20-compact-workspace .payment-entry-grid,
.fix20-compact-workspace .submodule-form-grid.payment-entry-grid {
    grid-template-columns:repeat(3, minmax(0, 1fr));
}

.fix20-compact-workspace .document-upload-grid {
    grid-template-columns: 180px 1fr 1fr auto;
}

@media (max-width: 1100px) {
    .fix20-compact-workspace .rental-workflow-sticky-shell,
    .fix20-compact-workspace .fix18-order-summary-card,
    .fix20-task-tabs,
    .fix20-compact-workspace .sticky-total-card {
        position:static;
        top:auto;
    }
    .fix20-compact-workspace .order-layout-grid,
    .fix20-compact-workspace .order-layout-grid.fix18-two-column-layout {
        grid-template-columns:1fr;
    }
    .fix20-compact-workspace .fix18-summary-metrics {
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
    .fix20-command-header,
    .fix20-compact-workspace .fix18-order-summary-card {
        flex-wrap:wrap;
    }
    .fix20-command-actions {
        width:100%;
        justify-content:flex-start;
        flex-wrap:wrap;
    }
    .fix20-compact-workspace .dual-info-grid {
        grid-template-columns:1fr;
    }
}

/* ==========================================================
   Fix 21 - Smart Edit Rental Order UI System
   Goal: trust + scanability + short task workspace.
   Based on GuideLine.txt implementation spec.
   ========================================================== */
.fix21-smart-ui {
    --hcr-primary: #0B6EF6;
    --hcr-success: #00B894;
    --hcr-warning: #FF7A59;
    --hcr-text: #0F1724;
    --hcr-muted: #475569;
    --hcr-bg: #F8FAFC;
    --hcr-card: #FFFFFF;
    --hcr-border: #E2E8F0;
    --hcr-shadow: 0 2px 4px rgba(0,0,0,.08);
    --hcr-shadow-lg: 0 12px 30px rgba(15, 23, 36, .10);
    background: var(--hcr-bg);
    color: var(--hcr-text);
    font-family: Inter, Roboto, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    max-width: 1440px;
    margin: 0 auto;
    padding: 24px 32px 56px;
}

.fix21-smart-ui .rental-workflow-sticky-shell {
    position: sticky;
    top: 60px;
    z-index: 60;
    margin-bottom: 16px;
}

.fix21-smart-ui .order-page-header.fix20-command-header {
    min-height: 88px;
    padding: 16px 20px;
    border-radius: 14px;
    background: linear-gradient(105deg, #0F2A5B 0%, #0B6EF6 72%, #13BBD6 100%);
    box-shadow: var(--hcr-shadow-lg);
    display: grid;
    grid-template-columns: minmax(280px, 1fr) auto;
    align-items: center;
    gap: 18px;
}

.fix21-smart-ui .fix20-order-identity .eyebrow,
.fix21-smart-ui .fix20-order-identity p {
    color: rgba(255,255,255,.78);
}

.fix21-smart-ui .fix20-order-identity h1 {
    font-size: 24px;
    line-height: 32px;
    font-weight: 700;
    color: #fff;
    margin: 2px 0 4px;
}

.fix21-smart-ui .fix20-command-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.fix21-smart-ui .status-badge.fix20-status-badge {
    background: #DFFBEF;
    color: #065F46;
    border: 1px solid rgba(0,184,148,.28);
    min-height: 34px;
    padding: 8px 14px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 800;
}

.fix21-smart-ui .order-id-pill {
    min-height: 34px;
    padding: 8px 14px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.24);
    color: #fff;
}

.fix21-smart-ui .fix20-top-primary,
.fix21-smart-ui .primary-action {
    min-height: 44px;
    border-radius: 10px;
    background: var(--hcr-primary);
    box-shadow: 0 10px 22px rgba(11,110,246,.22);
    font-weight: 800;
}

.fix21-smart-ui .fix18-overflow-menu > summary {
    min-height: 44px;
    border-radius: 10px;
    border: 1px solid var(--hcr-border);
    background: #fff;
    color: var(--hcr-text);
    font-weight: 800;
    padding: 11px 16px;
}

/* Compact segmented workflow indicator */
.fix21-smart-ui .workflow-mode-panel {
    margin: 10px 0 0;
    padding: 8px;
    border-radius: 14px;
    background: rgba(255,255,255,.96);
    border: 1px solid var(--hcr-border);
    box-shadow: var(--hcr-shadow);
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
}

.fix21-smart-ui .workflow-step {
    min-height: 58px;
    padding: 8px 10px;
    border-radius: 12px;
    border: 1px solid var(--hcr-border);
    background: #fff;
    display: grid;
    grid-template-columns: 22px 1fr;
    column-gap: 8px;
    align-items: center;
}

.fix21-smart-ui .workflow-step strong {
    width: 22px;
    height: 22px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: #EDF2F7;
    color: var(--hcr-muted);
    font-size: 12px;
}

.fix21-smart-ui .workflow-step span {
    font-size: 13px;
    font-weight: 800;
    color: var(--hcr-text);
}

.fix21-smart-ui .workflow-step small {
    grid-column: 2;
    font-size: 11px;
    color: var(--hcr-muted);
    line-height: 14px;
}

.fix21-smart-ui .workflow-step.is-active,
.fix21-smart-ui .workflow-step[data-active="true"] {
    border-color: rgba(11,110,246,.45);
    background: #EFF6FF;
}

.fix21-smart-ui .workflow-step.is-active strong,
.fix21-smart-ui .workflow-step[data-active="true"] strong {
    background: var(--hcr-primary);
    color: #fff;
}

/* Persistent summary bar: centralizes key money/status info. */
.fix21-smart-ui .fix18-order-summary-card {
    position: sticky;
    top: 178px;
    z-index: 50;
    min-height: 88px;
    padding: 14px 16px;
    border-radius: 14px;
    border: 1px solid var(--hcr-border);
    background: rgba(255,255,255,.98);
    box-shadow: var(--hcr-shadow-lg);
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(500px, 1.8fr) auto;
    gap: 16px;
    align-items: center;
    margin-bottom: 12px;
}

.fix21-smart-ui .fix18-summary-title span {
    display: block;
    font-size: 12px;
    color: var(--hcr-muted);
    text-transform: uppercase;
    letter-spacing: .06em;
}

.fix21-smart-ui .fix18-summary-title strong {
    display: inline-flex;
    margin-top: 4px;
    font-size: 18px;
    color: var(--hcr-text);
}

.fix21-smart-ui .fix18-summary-subline {
    max-width: 420px;
    color: var(--hcr-muted);
    font-size: 13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fix21-smart-ui .fix18-summary-metrics {
    display: grid;
    grid-template-columns: repeat(5, minmax(100px, 1fr));
    gap: 8px;
}

.fix21-smart-ui .fix18-summary-metrics > div,
.fix21-smart-ui .fix21-summary-status-row {
    min-height: 54px;
    padding: 8px 10px;
    border-radius: 12px;
    background: #F8FAFC;
    border: 1px solid var(--hcr-border);
}

.fix21-smart-ui .fix18-summary-metrics span,
.fix21-smart-ui .fix21-summary-status-row span {
    display: block;
    color: var(--hcr-muted);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .05em;
    margin-bottom: 3px;
}

.fix21-smart-ui .fix18-summary-metrics strong,
.fix21-smart-ui .fix21-summary-status-row strong {
    font-size: 16px;
    color: var(--hcr-text);
}

.fix21-smart-ui .fix18-summary-metrics .balance strong,
.fix21-smart-ui #BalanceDueDisplay,
.fix21-smart-ui #Fix18BalanceDue {
    color: var(--hcr-warning);
}

.fix21-smart-ui .fix18-summary-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Segmented task control */
.fix21-smart-ui .fix20-task-tabs.fix21-segmented-control {
    position: sticky;
    top: 282px;
    z-index: 45;
    padding: 6px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--hcr-border);
    box-shadow: var(--hcr-shadow);
    margin: 0 0 16px;
}

.fix21-smart-ui .fix20-task-tab {
    min-height: 40px;
    padding: 10px 14px;
    border-radius: 999px;
    border: 0;
    background: transparent;
    color: var(--hcr-muted);
    font-size: 14px;
    font-weight: 700;
}

.fix21-smart-ui .fix20-task-tab.is-active {
    background: var(--hcr-primary);
    color: #fff;
    box-shadow: none;
}

/* Correct two-column structure: left 60%, right 40%, no blank-space coupling. */
.fix21-smart-ui .order-layout-grid.fix18-two-column-layout {
    display: grid;
    grid-template-columns: minmax(0, 60%) minmax(360px, 40%);
    gap: 32px;
    align-items: start;
}

.fix21-smart-ui .order-main-column,
.fix21-smart-ui .total-sidebar {
    min-width: 0;
}

.fix21-smart-ui .total-sidebar {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.fix21-smart-ui .ro-collapsible-section,
.fix21-smart-ui .total-card,
.fix21-smart-ui .fix21-side-card {
    border: 1px solid var(--hcr-border);
    background: var(--hcr-card);
    border-radius: 14px;
    box-shadow: var(--hcr-shadow);
    overflow: hidden;
}

.fix21-smart-ui .ro-collapsible-section > summary {
    min-height: 60px;
    padding: 16px 24px;
    background: linear-gradient(180deg, #fff, #F8FAFC);
    border-bottom: 1px solid var(--hcr-border);
}

.fix21-smart-ui .ro-collapsible-section > summary span {
    font-size: 18px;
    font-weight: 800;
    color: var(--hcr-text);
}

.fix21-smart-ui .ro-collapsible-section > summary small {
    color: var(--hcr-muted);
    font-size: 12px;
}

.fix21-smart-ui .ro-section-body {
    padding: 24px;
}

.fix21-smart-ui .field-stack label,
.fix21-smart-ui .summary-line label,
.fix21-smart-ui .readonly-line span {
    color: var(--hcr-muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.fix21-smart-ui input,
.fix21-smart-ui select,
.fix21-smart-ui textarea {
    min-height: 40px;
    border-radius: 8px;
    border: 1px solid var(--hcr-border);
    color: var(--hcr-text);
    font-size: 14px;
}

.fix21-smart-ui input:focus,
.fix21-smart-ui select:focus,
.fix21-smart-ui textarea:focus,
.fix21-smart-ui button:focus-visible,
.fix21-smart-ui a:focus-visible {
    outline: 3px solid rgba(11,110,246,.25);
    outline-offset: 2px;
}

/* Sticky right cards */
.fix21-smart-ui .sticky-total-card {
    position: sticky;
    top: 282px;
    z-index: 25;
    border-radius: 14px;
    box-shadow: var(--hcr-shadow-lg);
}

.fix21-smart-ui .section-heading,
.fix21-smart-ui .fix21-side-card-title {
    padding: 16px 20px;
    background: #F8FAFC;
    border-bottom: 1px solid var(--hcr-border);
    color: var(--hcr-text);
    font-size: 18px;
    font-weight: 800;
}

.fix21-smart-ui .fix21-side-card-title {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: baseline;
}

.fix21-smart-ui .fix21-side-card-title small {
    font-size: 11px;
    color: var(--hcr-muted);
    font-weight: 500;
}

.fix21-smart-ui .sidebar-total-focus {
    margin: 16px;
    padding: 16px;
    border-radius: 12px;
    background: var(--hcr-primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fix21-smart-ui .sidebar-total-focus span,
.fix21-smart-ui .sidebar-total-focus strong {
    color: #fff;
}

.fix21-smart-ui .payment-mini-summary,
.fix21-smart-ui .summary-line,
.fix21-smart-ui .grand-total-line,
.fix21-smart-ui .fix21-side-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 140px;
    align-items: center;
    gap: 12px;
    padding: 8px 16px;
}

.fix21-smart-ui .summary-line input,
.fix21-smart-ui .grand-total-line input {
    width: 100%;
    max-width: 140px;
    justify-self: end;
    text-align: right;
    background: #F8FAFC;
}

.fix21-smart-ui .fix18-financial-group {
    padding: 10px 0 12px;
    border-top: 1px solid var(--hcr-border);
}

.fix21-smart-ui .fix18-financial-group h3 {
    padding: 0 16px 6px;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--hcr-text);
}

.fix21-smart-ui .fix18-fees-toggle {
    margin: 12px 16px;
    border: 1px solid var(--hcr-border);
    border-radius: 12px;
    background: #fff;
}

.fix21-smart-ui .fix18-fees-toggle > summary {
    padding: 12px 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 800;
}

.fix21-smart-ui .fix18-fees-toggle > summary strong {
    color: var(--hcr-primary);
}

.fix21-smart-ui .grand-total-line {
    margin: 16px;
    border-radius: 12px;
    background: #0F2A5B;
    color: #fff;
}

.fix21-smart-ui .grand-total-line label {
    color: #fff;
}

.fix21-smart-ui .grand-total-line input {
    background: #fff;
    color: var(--hcr-text);
    font-weight: 800;
}

/* Side summary cards: Payments / Deposit / Audit */
.fix21-smart-ui .fix21-side-card {
    padding-bottom: 12px;
}

.fix21-smart-ui .fix21-side-row span,
.fix21-smart-ui .fix21-side-subrow,
.fix21-smart-ui .fix21-empty-state,
.fix21-smart-ui .fix21-inline-help,
.fix21-smart-ui .fix21-audit-item small {
    color: var(--hcr-muted);
    font-size: 13px;
}

.fix21-smart-ui .fix21-side-row strong {
    justify-self: end;
    color: var(--hcr-text);
    font-weight: 800;
}

.fix21-smart-ui .fix21-side-subrow {
    padding: 0 16px 10px;
    border-bottom: 1px solid #EEF2F7;
}

.fix21-smart-ui .fix21-inline-help {
    margin: 10px 16px 0;
    padding: 10px 12px;
    border-radius: 10px;
    background: #F8FAFC;
    border: 1px dashed var(--hcr-border);
}

.fix21-smart-ui .fix21-audit-item {
    margin: 12px 16px;
    padding: 12px;
    border: 1px solid var(--hcr-border);
    border-radius: 12px;
    background: #fff;
}

.fix21-smart-ui .fix21-audit-item b,
.fix21-smart-ui .fix21-audit-item span,
.fix21-smart-ui .fix21-audit-item small {
    display: block;
}

.fix21-smart-ui .fix21-audit-item span {
    color: var(--hcr-muted);
    font-size: 12px;
    margin: 2px 0 4px;
}

/* Formula microcopy */
.fix21-smart-ui .fix21-formula-toggle {
    margin: 0 16px 10px;
    border: 0;
    background: transparent;
    color: var(--hcr-primary);
    font-weight: 800;
    cursor: pointer;
    padding: 0;
}

.fix21-smart-ui .fix21-formula-box {
    margin: 0 16px 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: #FFF7ED;
    border: 1px solid rgba(255,122,89,.26);
    color: #7C2D12;
    font-size: 13px;
    line-height: 18px;
}

.fix21-smart-ui .fix21-formula-box.always-visible {
    margin: 0 12px 8px;
}

/* Deposit cards / action affordance */
.fix21-smart-ui .deposit-settlement-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.fix21-smart-ui .settlement-option-card {
    border: 1px solid var(--hcr-border);
    border-radius: 12px;
    padding: 14px;
    background: #fff;
}

.fix21-smart-ui .settlement-option-card:has(input:checked) {
    border-color: var(--hcr-primary);
    box-shadow: 0 0 0 3px rgba(11,110,246,.10);
}

/* Mobile/tablet behavior */
@media (max-width: 1279px) {
    .fix21-smart-ui {
        padding: 16px;
    }
    .fix21-smart-ui .rental-workflow-sticky-shell,
    .fix21-smart-ui .fix18-order-summary-card,
    .fix21-smart-ui .fix20-task-tabs.fix21-segmented-control,
    .fix21-smart-ui .sticky-total-card {
        position: static;
        top: auto;
    }
    .fix21-smart-ui .order-layout-grid.fix18-two-column-layout {
        grid-template-columns: 1fr;
    }
    .fix21-smart-ui .fix18-order-summary-card {
        grid-template-columns: 1fr;
    }
    .fix21-smart-ui .fix18-summary-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .fix21-smart-ui .workflow-mode-panel {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .fix21-smart-ui .order-page-header.fix20-command-header {
        grid-template-columns: 1fr;
    }
    .fix21-smart-ui .fix20-command-actions {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
    .fix21-smart-ui .workflow-mode-panel {
        grid-template-columns: 1fr 1fr;
    }
    .fix21-smart-ui .fix18-summary-metrics {
        grid-template-columns: 1fr;
    }
    .fix21-smart-ui .payment-mini-summary,
    .fix21-smart-ui .summary-line,
    .fix21-smart-ui .grand-total-line,
    .fix21-smart-ui .fix21-side-row {
        grid-template-columns: 1fr;
    }
    .fix21-smart-ui .summary-line input,
    .fix21-smart-ui .grand-total-line input {
        max-width: none;
    }
    .fix21-smart-ui .deposit-settlement-actions {
        grid-template-columns: 1fr;
    }
}


/* ==========================================================
   Fix 21A - Smart UI cleanup requested in Issues need to be fixed.pdf
   Removes duplicate summary strip, compresses summary/cards, fixes duplicated
   vehicle display, uniform travel/payment/deposit controls.
   ========================================================== */
.fix21a-cleanup .fix18-order-summary-card {
    display: none !important;
}

.fix21a-cleanup .rental-workflow-sticky-shell {
    margin-bottom: 10px;
}

.fix21a-cleanup .order-page-header.fix20-command-header {
    min-height: 72px;
    padding: 12px 18px;
}

.fix21a-cleanup .workflow-mode-panel {
    margin-top: 8px;
    padding: 6px;
    gap: 6px;
}

.fix21a-cleanup .workflow-step {
    min-height: 46px;
    padding: 6px 8px;
    grid-template-columns: 18px 1fr;
}

.fix21a-cleanup .workflow-step strong {
    width: 18px;
    height: 18px;
    font-size: 10px;
}

.fix21a-cleanup .workflow-step span {
    font-size: 12px;
}

.fix21a-cleanup .workflow-step small {
    font-size: 10px;
    line-height: 12px;
}

.fix21a-cleanup .fix20-task-tabs.fix21-segmented-control {
    top: 168px;
    margin-bottom: 12px;
}

.fix21a-cleanup .order-layout-grid.fix18-two-column-layout {
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 18px;
}

.fix21a-cleanup .sticky-total-card {
    top: 226px;
}

/* Shorter right summary card */
.fix21a-cleanup .total-card,
.fix21a-cleanup .fix21-side-card {
    border-radius: 12px;
}

.fix21a-cleanup .section-heading,
.fix21a-cleanup .fix21-side-card-title {
    padding: 10px 14px;
    font-size: 15px;
}

.fix21a-cleanup .sidebar-total-focus {
    margin: 10px 12px;
    padding: 11px 12px;
    border-radius: 10px;
}

.fix21a-cleanup .sidebar-total-focus strong {
    font-size: 20px;
}

.fix21a-cleanup .payment-mini-summary,
.fix21a-cleanup .summary-line,
.fix21a-cleanup .grand-total-line,
.fix21a-cleanup .fix21-side-row {
    grid-template-columns: minmax(0, 1fr) 104px;
    gap: 8px;
    padding: 5px 12px;
}

.fix21a-cleanup .summary-line input,
.fix21a-cleanup .grand-total-line input {
    max-width: 104px;
    min-height: 32px;
    font-size: 13px;
}

.fix21a-cleanup .fix18-financial-group {
    padding: 7px 0;
}

.fix21a-cleanup .fix18-financial-group h3 {
    padding: 0 12px 4px;
    font-size: 11px;
}

.fix21a-cleanup .fix18-fees-toggle {
    margin: 8px 12px;
}

.fix21a-cleanup .fix18-fees-toggle > summary {
    padding: 9px 10px;
}

.fix21a-cleanup .grand-total-line {
    margin: 10px 12px 12px;
    padding-top: 7px;
    padding-bottom: 7px;
}

/* Vehicle: remove duplicate look and make all display boxes uniform. */
.fix21a-cleanup .vehicle-card-modern.compact-vehicle-card {
    display: grid;
    gap: 10px;
}

.fix21a-cleanup .vehicle-card-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
}

.fix21a-cleanup .vehicle-title {
    display: block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 17px;
}

.fix21a-cleanup .vehicle-rate-pair {
    display: grid;
    grid-template-columns: 92px 92px;
    gap: 8px;
    align-items: stretch;
}

.fix21a-cleanup .vehicle-rate-box {
    min-width: 0;
    width: 92px;
    height: 56px;
    padding: 8px 9px;
    border-radius: 10px;
    display: grid;
    align-content: center;
    text-align: right;
    overflow: visible;
}

.fix21a-cleanup .vehicle-rate-box span {
    font-size: 9px;
    line-height: 11px;
    white-space: normal;
}

.fix21a-cleanup .vehicle-rate-box strong {
    display: block;
    font-size: 15px;
    line-height: 18px;
    white-space: nowrap;
    color: #0f1724;
}

.fix21a-cleanup .fix21a-locked-helper {
    margin-top: -4px;
    padding: 7px 9px;
    border-radius: 9px;
    background: #f8fafc;
    color: #64748b;
    font-size: 12px;
    border: 1px dashed #cbd5e1;
}

.fix21a-cleanup .feature-line-grid.vehicle-feature-line,
.fix21a-cleanup .fix20-readonly-grid {
    gap: 8px;
}

.fix21a-cleanup .feature-chip,
.fix21a-cleanup .fix20-readonly-grid > div {
    min-height: 34px;
    border-radius: 10px;
    padding: 7px 9px;
}

/* Return tab: make Travel Out of State and calculator button one uniform control. */
.fix21a-cleanup .travel-out-state-card {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border-radius: 12px;
    border: 1px solid #dbeafe;
    background: #fff;
}

.fix21a-cleanup .travel-out-state-card .modern-check,
.fix21a-cleanup .travel-out-state-card .mini-outline-action {
    min-height: 38px;
    font-size: 13px;
    font-weight: 800;
    color: #12305d;
}

.fix21a-cleanup .travel-out-state-card .mini-outline-action {
    border-radius: 10px;
    padding: 0 12px;
    border: 1px solid #93c5fd;
    background: #f8fbff;
}

.fix21a-cleanup .travel-helper-text {
    grid-column: 1 / -1;
    font-size: 12px;
    color: #64748b;
    line-height: 16px;
    margin: 0;
}

/* Payment deposit choices: prevent cut-off text. */
.fix21a-cleanup .payment-choice-grid.compact-payment-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(175px, 1fr));
    gap: 10px;
}

.fix21a-cleanup .payment-choice-grid .option-choice-card {
    grid-template-columns: minmax(0, 1fr) 92px;
    gap: 8px;
    padding: 11px 12px;
    border-radius: 12px;
    min-height: 62px;
}

.fix21a-cleanup .payment-choice-grid .option-choice-card span {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    font-size: 12px;
    line-height: 14px;
    align-items: flex-start;
}

.fix21a-cleanup .payment-choice-grid .option-choice-card input[type="number"] {
    width: 92px;
    min-height: 32px;
    font-size: 12px;
}

/* Deposit tab: compact radio rows instead of oversized boxes. */
.fix21a-cleanup .deposit-settlement-actions {
    grid-template-columns: 1fr;
    gap: 8px;
}

.fix21a-cleanup .settlement-option-card.closeout-action-card {
    min-height: 0;
    padding: 10px 12px;
    border-radius: 11px;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px 10px;
}

.fix21a-cleanup .settlement-option-card.closeout-action-card input[type="radio"] {
    grid-row: 1 / span 2;
    width: 18px;
    height: 18px;
}

.fix21a-cleanup .settlement-option-card.closeout-action-card span {
    font-size: 13px;
    font-weight: 800;
    color: #0f1724;
}

.fix21a-cleanup .settlement-option-card.closeout-action-card strong {
    font-size: 13px;
    color: #0b63ce;
}

.fix21a-cleanup .settlement-option-card.closeout-action-card small {
    grid-column: 2 / 4;
    font-size: 11px;
    line-height: 14px;
    color: #64748b;
    margin: 0;
}

@media (max-width: 1279px) {
    .fix21a-cleanup .fix20-task-tabs.fix21-segmented-control,
    .fix21a-cleanup .sticky-total-card {
        top: auto;
    }
    .fix21a-cleanup .order-layout-grid.fix18-two-column-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .fix21a-cleanup .payment-choice-grid.compact-payment-grid {
        grid-template-columns: 1fr;
    }
    .fix21a-cleanup .vehicle-card-header {
        grid-template-columns: 1fr;
    }
    .fix21a-cleanup .vehicle-rate-pair {
        grid-template-columns: repeat(2, minmax(92px, 1fr));
        width: 100%;
    }
    .fix21a-cleanup .vehicle-rate-box {
        width: auto;
    }
}


/* Fix 21B: keep rental date/time fields in the correct scan order and make travel controls uniform. */
.fix21b-date-order .date-pair-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 18px;
    align-items: end;
}

.fix21b-date-order .date-pair-grid .discount-date-row {
    grid-column: 1 / 2;
}

.fix21b-date-order .date-pair-grid .duration-date-row {
    grid-column: 2 / 3;
    align-self: end;
    min-height: 46px;
}

.fix21b-date-order .travel-out-state-card {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 12px;
    border-radius: 12px;
    border: 1px solid #bfdbfe;
    background: #ffffff;
}

.fix21b-date-order .travel-out-state-card .modern-check,
.fix21b-date-order .travel-out-state-card .mini-outline-action {
    min-height: 44px;
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border-radius: 10px;
    border: 1px solid #93c5fd;
    background: #f8fbff;
    color: #073b77;
    font-size: 14px;
    font-weight: 800;
    line-height: 16px;
    padding: 0 14px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    text-align: center;
    cursor: pointer;
}

.fix21b-date-order .travel-out-state-card .modern-check:hover,
.fix21b-date-order .travel-out-state-card .modern-check:focus-within,
.fix21b-date-order .travel-out-state-card .mini-outline-action:hover,
.fix21b-date-order .travel-out-state-card .mini-outline-action:focus {
    border-color: #0b6ef6;
    background: #eff6ff;
    box-shadow: 0 0 0 3px rgba(11, 110, 246, 0.12);
}

.fix21b-date-order .travel-out-state-card.is-selected .modern-check,
.fix21b-date-order .travel-out-state-card:has(#TravelOutOfState:checked) .modern-check {
    border-color: #0b6ef6;
    background: #eaf4ff;
    color: #062f68;
}

.fix21b-date-order .travel-out-state-card .ro-blue-check {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    margin: 0;
}

.fix21b-date-order .travel-out-state-card .travel-helper-text {
    grid-column: 1 / -1;
    font-size: 12px;
    line-height: 16px;
    color: #64748b;
    margin: 0;
}

@media (max-width: 900px) {
    .fix21b-date-order .date-pair-grid,
    .fix21b-date-order .travel-out-state-card {
        grid-template-columns: 1fr;
    }

    .fix21b-date-order .date-pair-grid .discount-date-row,
    .fix21b-date-order .date-pair-grid .duration-date-row {
        grid-column: 1 / -1;
    }
}


/* ==========================================================
   Fix 22 - UI Foundation / Design Tokens
   Implements the Handy Car Rental UI & Implementation Specification
   as a Razor/CSS design foundation instead of a React rewrite.
   ========================================================== */
body {
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.42;
    color: var(--color-text);
    background: var(--color-bg);
}

main {
    max-width: 1440px;
    padding: var(--space-6) var(--space-8) 56px;
}

/* Top navigation aligned with token system. */
.hcr-app-header {
    background: #0F172A;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.10);
}
.hcr-header-inner {
    max-width: 1440px;
    min-height: 56px;
    padding: 8px 32px;
}
.hcr-brand {
    font-size: 16px;
    font-weight: 700;
}
.hcr-brand::before {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    font-size: 10px;
    box-shadow: none;
    background: var(--color-primary);
}
.hcr-nav a {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    color: #E2E8F0;
    font-size: 13px;
    font-weight: 600;
    padding: 8px 10px;
    border-radius: 8px;
}
.hcr-nav a:hover,
.hcr-nav a:focus-visible {
    background: rgba(255,255,255,0.10);
    color: #FFFFFF;
}

/* Standard buttons.  These rules intentionally cover old class names too. */
.btn,
.primary-action,
.fix20-top-primary,
button.primary-action,
button[type="submit"].primary-action,
.ro-button,
.hcr-button,
button.btn-primary,
a.btn-primary,
.btn-primary {
    min-height: 44px;
    border-radius: var(--radius-control);
    border: 1px solid var(--color-primary);
    background: var(--color-primary);
    color: #FFFFFF !important;
    padding: 0 20px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    box-shadow: none;
    cursor: pointer;
    text-decoration: none;
    transition: background-color .14s ease, border-color .14s ease, box-shadow .14s ease, transform .14s ease;
}
.btn:hover,
.primary-action:hover,
.fix20-top-primary:hover,
.ro-button:hover,
.hcr-button:hover,
.btn-primary:hover {
    background: var(--color-primary-dark);
    border-color: var(--color-primary-dark);
    color: #FFFFFF !important;
    text-decoration: none;
}
button:disabled,
.btn:disabled,
.primary-action:disabled,
.btn-primary:disabled {
    background: #A0AEC0 !important;
    border-color: #A0AEC0 !important;
    color: #E2E8F0 !important;
    cursor: not-allowed;
    opacity: 1;
}

.secondary-action,
.btn-secondary,
a.btn-secondary,
.mini-outline-action,
.fix18-overflow-menu > summary,
.fix18-menu-content a,
.fix18-menu-content button:not(.danger-action) {
    min-height: 44px;
    border-radius: var(--radius-control);
    border: 1px solid var(--color-border-strong);
    background: #FFFFFF;
    color: var(--color-primary) !important;
    padding: 0 16px;
    font-size: 14px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-decoration: none;
    cursor: pointer;
}
.secondary-action:hover,
.btn-secondary:hover,
.mini-outline-action:hover,
.fix18-overflow-menu > summary:hover,
.fix18-menu-content a:hover,
.fix18-menu-content button:not(.danger-action):hover {
    border-color: var(--color-primary);
    background: var(--color-primary-soft);
    color: var(--color-primary-dark) !important;
    text-decoration: none;
}
.tertiary-action,
.btn-link,
.action-link {
    border: 0;
    background: transparent;
    color: var(--color-primary);
    font-weight: 600;
    text-decoration: none;
}
.tertiary-action:hover,
.btn-link:hover,
.action-link:hover {
    text-decoration: underline;
}
.danger-action,
.btn-danger {
    color: var(--color-danger) !important;
}

/* Card system. */
.hcr-section,
.ro-fieldset,
.ro-row-box,
.ro-options-box,
.ro-payment-box,
.ro-summary-box,
.card-section,
.ro-collapsible-section,
.total-card,
.fix21-side-card,
.workflow-card,
.data-card,
.option-choice-card,
.settlement-option-card,
.fix18-financial-group,
.fix18-order-summary-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
}
.ro-collapsible-section,
.total-card,
.fix21-side-card,
.hcr-section,
.card-section {
    padding: 0;
    overflow: hidden;
}
.ro-section-body,
.hcr-section-body,
.card-body,
.fix21-side-card-body {
    padding: var(--space-4) var(--space-6);
}
.hcr-section-title,
.ro-legend,
.ro-options-title,
.ro-payment-title,
.section-title,
.section-heading,
.fix21-side-card-title,
.ro-collapsible-section > summary {
    color: var(--color-text);
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
}
.section-heading,
.fix21-side-card-title,
.ro-collapsible-section > summary {
    padding: 14px var(--space-6);
    background: var(--color-surface-muted);
    border-bottom: 1px solid var(--color-border);
}

/* Inputs and form fields. */
input[type="text"],
input[type="email"],
input[type="date"],
input[type="time"],
input[type="number"],
select,
textarea,
.hcr-input,
.hcr-select,
.hcr-textarea,
.ro-input,
.ro-select,
.ro-textarea {
    min-height: 40px;
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-control);
    background: #FFFFFF;
    color: var(--color-text);
    font-size: 14px;
    font-weight: 400;
    padding: 8px 10px;
    box-shadow: none;
}
textarea,
.hcr-textarea,
.ro-textarea { min-height: 88px; }
input::placeholder,
textarea::placeholder { color: #94A3B8; }
input:focus,
select:focus,
textarea:focus,
button:focus-visible,
a:focus-visible,
summary:focus-visible {
    outline: none;
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 3px rgba(11, 110, 246, 0.18) !important;
}
label,
.hcr-label,
.ro-label,
.field-stack label,
.summary-line label,
.readonly-line span {
    color: var(--color-text-muted);
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
}
.required-marker,
.field-required,
.req { color: var(--color-danger); }

/* Tables, including payments/history. */
table,
.hcr-table,
.data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}
thead tr,
.hcr-table thead tr,
.data-table thead tr {
    height: 40px;
    background: var(--color-surface-muted);
}
th,
.hcr-table th,
.data-table th {
    color: var(--color-text-muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    padding: 10px 12px;
    border-bottom: 1px solid var(--color-border);
}
td,
.hcr-table td,
.data-table td {
    height: 44px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--color-border);
    color: var(--color-text);
}
tbody tr:hover { background: #F9FAFB; }
.amount,
.money,
td:nth-child(4),
.payment-history-table td:nth-child(4) { text-align: right; font-variant-numeric: tabular-nums; }

/* Status pills. */
.status-badge,
.status-pill,
.payment-status,
.fix20-status-badge {
    display: inline-flex;
    min-height: 26px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    border: 1px solid transparent;
}
.status-badge.status-active {
    background: var(--color-success-soft);
    color: #15803D;
}
.status-pending,
.status-badge.status-pending {
    background: var(--color-warning-soft);
    color: #B45309;
}
.status-posted,
.payment-status.posted,
.status-approved,
.status-success {
    background: var(--color-success-soft);
    color: #15803D;
}
.status-failed,
.status-danger {
    background: var(--color-danger-soft);
    color: #B91C1C;
}

/* Fix 22 two-column smart-workspace rhythm. */
.fix21-smart-ui .order-page-shell,
.order-page-shell {
    color: var(--color-text);
}
.fix21-smart-ui .order-layout-grid.fix18-two-column-layout {
    grid-template-columns: minmax(0, 3fr) minmax(360px, 2fr);
    gap: var(--space-6);
    align-items: start;
}
.fix21-smart-ui .total-sidebar,
.total-sidebar {
    min-width: 0;
}
.fix21-smart-ui .sticky-total-card {
    position: sticky;
    top: 180px;
}
.fix21-smart-ui .sidebar-total-focus {
    background: var(--color-primary);
    color: #FFFFFF;
    border-radius: var(--radius-card);
    box-shadow: none;
}
.fix21-smart-ui .sidebar-total-focus span,
.fix21-smart-ui .sidebar-total-focus strong { color: #FFFFFF; }
.fix21-smart-ui .summary-line,
.fix21-smart-ui .grand-total-line,
.fix21-smart-ui .fix21-side-row,
.payment-mini-summary {
    min-height: 40px;
    align-items: center;
}
.fix21-smart-ui .summary-line strong,
.fix21-smart-ui .grand-total-line strong,
.fix21-smart-ui .fix21-side-row strong {
    font-variant-numeric: tabular-nums;
}
.fix21-smart-ui #BalanceDueDisplay,
.fix21-smart-ui #Fix18BalanceDue,
.balance-due {
    color: var(--color-danger) !important;
}
.fix21-smart-ui .balance-settled,
.fix21-smart-ui .balance-zero {
    color: var(--color-success) !important;
}

/* Formula/help microcopy. */
.fix21-formula-toggle,
.formula-toggle,
.inline-help-toggle {
    color: var(--color-primary);
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}
.fix21-formula-box,
.formula-box,
.inline-help-box {
    background: #F8FAFC;
    border: 1px dashed var(--color-border-strong);
    border-radius: var(--radius-card);
    color: var(--color-text-muted);
    font-size: 12px;
    line-height: 1.45;
    padding: var(--space-3);
}

/* Deposit/payment choice cards standardized. */
.option-choice-card,
.settlement-option-card {
    min-height: 52px;
    padding: 12px;
    border-radius: var(--radius-card);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-card);
}
.option-choice-card:has(input:checked),
.settlement-option-card:has(input:checked) {
    border-color: var(--color-primary);
    background: var(--color-primary-soft);
    box-shadow: 0 0 0 3px rgba(11, 110, 246, 0.12);
}

/* Modal pattern foundation. */
.modal-card,
.confirm-modal,
.fix18-complete-modal {
    background: #FFFFFF;
    border: 1px solid var(--color-border);
    border-radius: 12px;
    box-shadow: var(--shadow-modal);
}

/* Responsive behavior from the spec. */
@media (max-width: 1279px) {
    main { padding: var(--space-5) var(--space-4) 48px; }
    .fix21-smart-ui .order-layout-grid.fix18-two-column-layout {
        grid-template-columns: 1fr;
    }
    .fix21-smart-ui .sticky-total-card {
        position: static;
        top: auto;
    }
}
@media (max-width: 767px) {
    .hcr-header-inner {
        padding: 8px var(--space-4);
        align-items: flex-start;
        flex-direction: column;
        gap: var(--space-2);
    }
    .hcr-nav { justify-content: flex-start; }
    .btn,
    .primary-action,
    .fix20-top-primary,
    .btn-primary,
    .secondary-action,
    .btn-secondary,
    .mini-outline-action {
        min-height: 44px;
        width: 100%;
    }
    .fix20-command-actions {
        width: 100%;
        display: grid !important;
        grid-template-columns: 1fr;
    }
}

/* ==========================================================
   Fix 22A - Rental Order Smart UI polish
   Focus: sticky task tabs, shorter Return/Payment/Deposit/Docs areas,
   read-only active-rental metrics, consistent travel controls.
   ========================================================== */
.fix22a-polish .workflow-step small {
    font-size: 12.5px !important;
    line-height: 16px !important;
    font-weight: 700 !important;
    color: #334155 !important;
}

.fix22a-polish .workflow-step span {
    font-size: 14px !important;
}

/* Keep task menu visible so agent always knows the active work area. */
.fix22a-polish .fix20-task-tabs.fix21-segmented-control {
    position: sticky !important;
    top: 64px !important;
    z-index: 120 !important;
    margin: 0 0 14px !important;
    padding: 6px !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12) !important;
}

.fix22a-polish .fix20-task-tab {
    min-height: 38px !important;
    padding: 8px 14px !important;
    font-size: 14px !important;
}

/* Section helper text should be readable. */
.fix22a-polish .ro-collapsible-section > summary small {
    font-size: 13px !important;
    line-height: 18px !important;
    font-weight: 600 !important;
    color: #475569 !important;
}

.fix22a-polish .ro-collapsible-section > summary {
    min-height: 52px !important;
    padding: 13px 18px !important;
}

.fix22a-polish .ro-section-body {
    padding: 18px !important;
}

/* Return tab: read-only values shown inline with labels to shorten the screen. */
.fix22a-polish .fix22a-return-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px 14px;
    align-items: end;
}

.fix22a-polish .readonly-inline-metric {
    min-height: 40px;
    border: 1px solid #D8E3F2;
    border-radius: 9px;
    background: #F8FAFC;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.fix22a-polish .readonly-inline-metric span {
    color: #475569;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.fix22a-polish .readonly-inline-metric strong {
    color: #0F172A;
    font-size: 14px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

/* Travel controls: both controls look like matching selectable buttons. */
.fix22a-polish .travel-out-state-card.fix22a-travel-actions {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
    padding: 10px;
    border: 1px solid #BBD7FF;
    border-radius: 12px;
    background: #F8FBFF;
}

.fix22a-polish .travel-out-state-card .travel-toggle-button,
.fix22a-polish .travel-out-state-card .mini-outline-action {
    min-height: 42px !important;
    width: 100%;
    border: 1px solid #93C5FD !important;
    border-radius: 10px !important;
    background: #FFFFFF !important;
    color: #073B77 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 0 12px !important;
    box-shadow: none !important;
}

.fix22a-polish .travel-out-state-card .travel-toggle-button:hover,
.fix22a-polish .travel-out-state-card .travel-toggle-button:focus-within,
.fix22a-polish .travel-out-state-card .mini-outline-action:hover,
.fix22a-polish .travel-out-state-card .mini-outline-action:focus {
    border-color: #0B6EF6 !important;
    background: #EFF6FF !important;
    box-shadow: 0 0 0 3px rgba(11,110,246,0.12) !important;
}

.fix22a-polish .travel-out-state-card:has(#TravelOutOfState:checked) .travel-toggle-button {
    border-color: #0B6EF6 !important;
    background: #EAF4FF !important;
}

.fix22a-polish .travel-out-state-card .travel-helper-text {
    grid-column: 1 / -1;
    font-size: 13px !important;
    line-height: 17px !important;
    color: #475569 !important;
}

/* Payment tab: reduce width pressure and eliminate horizontal scrolling where possible. */
.fix22a-polish .payment-choice-grid.compact-payment-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
}

.fix22a-polish .payment-choice-grid .option-choice-card {
    min-height: 54px !important;
    grid-template-columns: minmax(0, 1fr) 86px !important;
    padding: 9px 10px !important;
    gap: 7px !important;
}

.fix22a-polish .payment-choice-grid .option-choice-card span {
    font-size: 12.5px !important;
    line-height: 15px !important;
    font-weight: 800 !important;
}

.fix22a-polish .payment-choice-grid .option-choice-card input[type="number"] {
    width: 86px !important;
    min-height: 30px !important;
    padding: 5px 8px !important;
}

.fix22a-polish .compact-payment-panel {
    padding: 14px !important;
    border-radius: 12px;
}

.fix22a-polish .submodule-header {
    margin-bottom: 10px !important;
}

.fix22a-polish .submodule-header h2 {
    font-size: 18px !important;
}

.fix22a-polish .submodule-form-grid.payment-entry-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px 12px !important;
}

.fix22a-polish .payment-post-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.fix22a-polish .payment-post-actions .primary-action,
.fix22a-polish .payment-post-actions .secondary-action {
    min-width: 0 !important;
    width: 100% !important;
    min-height: 40px !important;
    padding: 0 10px !important;
    font-size: 12.5px !important;
    white-space: normal;
    line-height: 15px;
}

.fix22a-polish .submodule-table-wrap {
    overflow-x: hidden !important;
}

.fix22a-polish .payment-audit-table {
    table-layout: fixed;
    font-size: 12px !important;
}

.fix22a-polish .payment-audit-table th,
.fix22a-polish .payment-audit-table td {
    padding: 7px 6px !important;
    height: 34px !important;
    white-space: normal;
    word-break: break-word;
}

.fix22a-polish .payment-audit-table th:nth-child(1),
.fix22a-polish .payment-audit-table td:nth-child(1) { width: 19%; }
.fix22a-polish .payment-audit-table th:nth-child(2),
.fix22a-polish .payment-audit-table td:nth-child(2) { width: 15%; }
.fix22a-polish .payment-audit-table th:nth-child(3),
.fix22a-polish .payment-audit-table td:nth-child(3) { width: 14%; }
.fix22a-polish .payment-audit-table th:nth-child(4),
.fix22a-polish .payment-audit-table td:nth-child(4) { width: 13%; text-align: right; }
.fix22a-polish .payment-audit-table th:nth-child(5),
.fix22a-polish .payment-audit-table td:nth-child(5) { width: 15%; }
.fix22a-polish .payment-audit-table th:nth-child(6),
.fix22a-polish .payment-audit-table td:nth-child(6) { width: 12%; }
.fix22a-polish .payment-audit-table th:nth-child(7),
.fix22a-polish .payment-audit-table td:nth-child(7) { width: 12%; }

/* Deposit tab: same compact rhythm as payments; avoid oversized controls. */
.fix22a-polish .closeout-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.fix22a-polish .closeout-card {
    padding: 12px !important;
    border-radius: 12px !important;
}

.fix22a-polish .closeout-card h3 {
    font-size: 13px !important;
    margin-bottom: 8px !important;
}

.fix22a-polish .closeout-line {
    min-height: 26px !important;
    gap: 8px !important;
}

.fix22a-polish .deposit-settlement-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
}

.fix22a-polish .settlement-option-card.closeout-action-card {
    min-height: 0 !important;
    padding: 9px 10px !important;
    grid-template-columns: 20px minmax(0, 1fr) auto !important;
    gap: 6px 8px !important;
}

.fix22a-polish .settlement-option-card.closeout-action-card span,
.fix22a-polish .settlement-option-card.closeout-action-card strong {
    font-size: 12.5px !important;
}

.fix22a-polish .settlement-option-card.closeout-action-card small {
    font-size: 11px !important;
    line-height: 14px !important;
}

.fix22a-polish #SettlementNotes {
    min-height: 70px !important;
}

/* Docs/Service tab: stronger shuttle border, larger helper text, shorter sections. */
.fix22a-polish .ro-collapsible-section[data-task-panel="notes"] .ro-section-body {
    padding: 14px 18px !important;
}

.fix22a-polish .ro-collapsible-section[data-task-panel="notes"] .modern-check {
    min-height: 42px;
    border: 1px solid #93C5FD !important;
    background: #F8FBFF !important;
    border-radius: 10px !important;
    padding: 9px 12px !important;
    color: #073B77 !important;
    font-weight: 800 !important;
}

.fix22a-polish .ro-collapsible-section[data-task-panel="notes"] summary small {
    font-size: 13px !important;
    line-height: 18px !important;
    font-weight: 700 !important;
}

.fix22a-polish .shuttle-details-modern {
    margin-top: 10px !important;
}

.fix22a-polish .notes-field-stack textarea {
    min-height: 74px !important;
}

.fix22a-polish .document-upload-grid {
    grid-template-columns: 150px minmax(180px, 1fr) minmax(180px, 1fr) 150px !important;
    gap: 10px !important;
    align-items: end;
}

.fix22a-polish .document-upload-grid input,
.fix22a-polish .document-upload-grid select {
    min-height: 36px !important;
}

.fix22a-polish .document-upload-grid .secondary-pill-button {
    min-height: 38px !important;
    padding: 0 12px !important;
}

.fix22a-polish .ro-collapsible-section[data-task-panel="notes"] + .ro-collapsible-section[data-task-panel="notes"] {
    margin-top: 10px !important;
}

@media (max-width: 1100px) {
    .fix22a-polish .fix20-task-tabs.fix21-segmented-control {
        position: sticky !important;
        top: 0 !important;
    }
    .fix22a-polish .fix22a-return-grid,
    .fix22a-polish .submodule-form-grid.payment-entry-grid,
    .fix22a-polish .payment-post-actions,
    .fix22a-polish .closeout-grid,
    .fix22a-polish .deposit-settlement-actions,
    .fix22a-polish .document-upload-grid {
        grid-template-columns: 1fr !important;
    }
    .fix22a-polish .travel-out-state-card.fix22a-travel-actions {
        grid-template-columns: 1fr;
    }
    .fix22a-polish .payment-choice-grid.compact-payment-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Fix 22B — Customer & Vehicle smart summary redesign */
.fix22b-customer-vehicle-body {
    padding: 14px 16px !important;
}

.fix22b-cv-card {
    display: grid;
    grid-template-columns: minmax(240px, 0.88fr) minmax(360px, 1.5fr);
    gap: 18px;
    align-items: stretch;
}

.fix22b-cv-column {
    background: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #E2E8F0);
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
    padding: 16px 18px;
    min-width: 0;
}

.fix22b-customer-column {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fix22b-vehicle-column {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.fix22b-cv-heading {
    color: var(--color-text-muted, #64748B);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.fix22b-cv-name,
.fix22b-vehicle-title {
    color: var(--color-text, #0F172A);
    font-size: 19px;
    line-height: 1.25;
    font-weight: 800;
    letter-spacing: -0.01em;
    overflow-wrap: anywhere;
}

.fix22b-info-row {
    display: flex;
    align-items: baseline;
    gap: 8px;
    min-width: 0;
    padding: 2px 0;
}

.fix22b-info-row span {
    color: var(--color-text-muted, #64748B);
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.fix22b-info-row strong {
    color: var(--color-text, #0F172A);
    font-size: 14px;
    font-weight: 800;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fix22b-contact-actions {
    display: flex;
    gap: 8px;
    margin-top: 8px;
}

.fix22b-action-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 14px;
    border: 1px solid var(--color-border, #E2E8F0);
    border-radius: 8px;
    background: #fff;
    color: var(--color-primary, #0B6EF6);
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
}

.fix22b-action-chip:hover,
.fix22b-action-chip:focus {
    border-color: var(--color-primary, #0B6EF6);
    box-shadow: 0 0 0 3px rgba(11, 110, 246, .12);
}

.fix22b-vehicle-meta-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 18px;
    padding-top: 2px;
}

.fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(2),
.fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(5),
.fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(6) {
    grid-column: 1 / -1;
}

.fix22b-out-status-row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding-top: 8px;
    border-top: 1px solid var(--color-border, #E2E8F0);
    flex-wrap: wrap;
}

.fix22b-out-status-row div {
    display: inline-flex;
    gap: 6px;
    align-items: baseline;
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 999px;
    padding: 7px 11px;
}

.fix22b-out-status-row span {
    color: var(--color-text-muted, #64748B);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.fix22b-out-status-row strong {
    color: var(--color-text, #0F172A);
    font-size: 14px;
    font-weight: 800;
}

.fix22b-setup-select-row {
    display: grid;
    grid-template-columns: 80px 1fr;
    gap: 8px 10px;
    align-items: center;
    margin: 2px 0 4px;
}

.fix22b-setup-select-row label {
    font-size: 12px;
    font-weight: 800;
    color: var(--color-text-muted, #64748B);
    text-transform: uppercase;
}

.fix22b-setup-select-row select {
    min-height: 38px;
}

.fix22b-setup-select-row span[data-valmsg-for] {
    grid-column: 2;
}

.fix22b-setup-dropdown-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    padding-top: 8px;
    border-top: 1px solid var(--color-border, #E2E8F0);
}

.fix22b-cv-card .vehicle-rate-box,
.fix22b-cv-card .fix21a-locked-helper,
.fix22b-cv-card .field-stack.full-row.required-field > .fix21a-locked-helper {
    display: none !important;
}

@media (max-width: 1100px) {
    .fix22b-cv-card {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .fix22b-vehicle-meta-grid,
    .fix22b-setup-dropdown-grid,
    .fix22b-setup-select-row {
        grid-template-columns: 1fr;
    }

    .fix22b-setup-select-row label,
    .fix22b-setup-select-row span[data-valmsg-for] {
        grid-column: auto;
    }
}

/* =========================================================
   FIX 22C - More Actions dropdown layering above sticky tabs
   The sticky task tabs must remain visible while scrolling, but
   any open More Actions menu must render above those tabs.
   ========================================================= */
.rental-workflow-sticky-shell,
.fix20-command-header,
.fix20-command-actions,
.fix18-overflow-menu,
.fix20-actions-menu {
    overflow: visible !important;
}

.fix18-overflow-menu,
.fix20-actions-menu {
    position: relative !important;
    z-index: 9000 !important;
}

.fix18-overflow-menu[open],
.fix20-actions-menu[open] {
    z-index: 10000 !important;
}

.fix18-overflow-menu[open] > .fix18-menu-content,
.fix20-actions-menu[open] > .fix18-menu-content {
    z-index: 10001 !important;
    position: absolute !important;
}

/* Keep sticky task tabs below open dropdowns. */
.fix22a-polish .fix20-task-tabs.fix21-segmented-control,
.fix21-smart-ui .fix20-task-tabs.fix21-segmented-control,
.fix20-task-tabs.fix21-segmented-control {
    z-index: 700 !important;
}

/* Header shell still needs to sit above page content, but below open menus. */
.fix21-smart-ui .rental-workflow-sticky-shell,
.fix20-compact-workspace .rental-workflow-sticky-shell,
.rental-workflow-sticky-shell {
    z-index: 800 !important;
    overflow: visible !important;
}

/* When a top menu is open, explicitly raise the header stacking context. */
.rental-workflow-sticky-shell:has(.fix18-overflow-menu[open]),
.rental-workflow-sticky-shell:has(.fix20-actions-menu[open]) {
    z-index: 9500 !important;
}

/* =========================================================
   FIX 22D - Workflow tabs integrated with sticky workflow shell
   + extension payment/default copy cleanup.
   ========================================================= */
.fix22d-workflow-payment .rental-workflow-sticky-shell {
    position: sticky !important;
    top: 54px !important;
    z-index: 850 !important;
    overflow: visible !important;
    padding-bottom: 8px !important;
}

.fix22d-workflow-payment .rental-workflow-sticky-shell .fix20-task-tabs.fix21-segmented-control {
    position: static !important;
    top: auto !important;
    z-index: auto !important;
    margin: 8px 0 0 !important;
    border-radius: 14px !important;
    border: 1px solid #D8E3F2 !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.10) !important;
    background: rgba(255, 255, 255, 0.98) !important;
}

.fix22d-workflow-payment .workflow-mode-panel {
    margin-bottom: 0 !important;
}

.fix22d-workflow-payment .workflow-step small {
    font-size: 13px !important;
    line-height: 18px !important;
    font-weight: 700 !important;
    color: #334155 !important;
}

.fix22d-workflow-payment .fix20-task-tab {
    font-size: 14px !important;
    min-height: 38px !important;
}

.fix22d-workflow-payment .fix18-overflow-menu[open],
.fix22d-workflow-payment .fix20-actions-menu[open] {
    z-index: 10000 !important;
}

.fix22d-workflow-payment .fix18-overflow-menu[open] > .fix18-menu-content,
.fix22d-workflow-payment .fix20-actions-menu[open] > .fix18-menu-content {
    z-index: 10001 !important;
}

/* Payment type should visually signal extension mode when auto-selected by JS. */
.fix22d-workflow-payment #PaymentTypeId option:checked {
    font-weight: 700;
}

/* FIX 22F - Rental Orders filtering / archive behavior */
.hcr-kpi-muted { opacity: .88; }
.dashboard-section-title-row {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: space-between;
    flex-wrap: wrap;
}
.dashboard-section-title-row h3 { margin-right: auto; }
.orders-history-link {
    color: var(--hcr-primary, #0B6EF6);
    font-weight: 700;
    text-decoration: none;
    padding: 6px 10px;
    border: 1px solid var(--hcr-border, #E2E8F0);
    border-radius: 999px;
    background: #fff;
}
.rental-order-filter-panel {
    display: grid;
    gap: 12px;
    margin: 12px 0 16px;
    padding: 12px;
    border: 1px solid var(--hcr-border, #E2E8F0);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(15,23,42,.05);
}
.rental-order-view-tabs {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.rental-order-view-tabs a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 14px;
    border: 1px solid var(--hcr-border, #E2E8F0);
    border-radius: 999px;
    background: #F8FAFC;
    color: #0F172A;
    text-decoration: none;
    font-weight: 800;
}
.rental-order-view-tabs a.active {
    background: #0B6EF6;
    color: #fff;
    border-color: #0B6EF6;
}
.rental-order-view-tabs span {
    min-width: 22px;
    padding: 1px 7px;
    border-radius: 999px;
    background: rgba(15,23,42,.08);
    text-align: center;
    font-weight: 900;
}
.rental-order-view-tabs a.active span { background: rgba(255,255,255,.22); }
.rental-order-search-form {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(180px, 260px) auto auto;
    gap: 10px;
    align-items: center;
}
.rental-order-search-form input,
.rental-order-search-form select {
    height: 40px;
    border: 1px solid var(--hcr-border, #CBD5E1);
    border-radius: 8px;
    padding: 8px 10px;
    background: #fff;
}
.orders-status-badge,
.status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
    border: 1px solid transparent;
    white-space: nowrap;
}
.orders-status-badge.open,
.status-pill-pending { background: #FFF7E6; color: #B45309; border-color: #FDE68A; }
.orders-status-badge.active,
.status-pill-active { background: #DCFCE7; color: #15803D; border-color: #BBF7D0; }
.orders-status-badge.extended,
.status-pill-extended { background: #E0F2FE; color: #0369A1; border-color: #BAE6FD; }
.orders-status-badge.completed { background: #F1F5F9; color: #334155; border-color: #CBD5E1; }
.orders-status-badge.cancelled { background: #FEE2E2; color: #B91C1C; border-color: #FECACA; }
.orders-history-row { background: #FAFAFA; }
.orders-history-row td { color: #475569; }
@media (max-width: 900px) {
    .rental-order-search-form { grid-template-columns: 1fr; }
}

/* Fix 22G — dashboard KPI compression so active/open orders have more vertical space */
.hcr-kpi-grid {
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}
.hcr-kpi {
    padding: 10px 12px;
    min-height: 72px;
}
.hcr-kpi-title {
    font-size: 10.5px;
    letter-spacing: .045em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.hcr-kpi-value {
    font-size: 24px;
    line-height: 1;
    margin-top: 6px;
}
@media (max-width: 1100px) {
    .hcr-kpi-grid { grid-template-columns: repeat(3, minmax(120px, 1fr)); }
}
@media (max-width: 720px) {
    .hcr-kpi-grid { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
}

/* Fix 22G — compact one-page receipt print support */
@media print {
    .receipt-shell { max-width: none !important; }
}

/* Fix 22H: density, alignment, payment-type defaults, and accounting grid polish */
.fix22d-workflow-payment .workflow-step {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.fix22d-workflow-payment .workflow-step strong {
    grid-row: 1 / span 2;
    align-self: center;
    justify-self: center;
}

.fix22d-workflow-payment .workflow-step span,
.fix22d-workflow-payment .workflow-step small {
    text-align: center;
    justify-self: center;
}

.fix22d-workflow-payment .workflow-step small {
    font-size: .76rem;
    font-weight: 650;
    line-height: 1.15;
}

.fix22d-workflow-payment .fix20-command-actions .status-badge,
.fix22d-workflow-payment .fix20-status-badge,
.fix22d-workflow-payment .status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-width: 82px;
    height: 34px;
    padding: 0 14px;
}

/* Customer & vehicle: reduce choking/wrapping and make rate/vehicle data read as one summary block. */
.fix22d-workflow-payment .fix22b-cv-card {
    grid-template-columns: minmax(260px, .85fr) minmax(420px, 1.25fr);
    align-items: stretch;
    gap: 18px;
}

.fix22d-workflow-payment .fix22b-vehicle-column {
    min-width: 0;
}

.fix22d-workflow-payment .fix22b-vehicle-title {
    max-width: 100%;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    line-height: 1.25;
    word-break: normal;
}

.fix22d-workflow-payment .fix22b-vehicle-meta-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 12px;
}

.fix22d-workflow-payment .fix22b-info-row {
    min-width: 0;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

.fix22d-workflow-payment .fix22b-info-row strong {
    min-width: 0;
    text-align: right;
    white-space: normal;
    overflow-wrap: anywhere;
}

.fix22d-workflow-payment .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(3),
.fix22d-workflow-payment .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(4) {
    max-width: 150px;
    justify-self: start;
    border-color: var(--color-border, #e2e8f0);
    background: #f8fafc;
}

.fix22d-workflow-payment .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(3) strong,
.fix22d-workflow-payment .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(4) strong {
    text-align: left;
}

/* Dates: keep pickup/return pairs inline and keep discount from interrupting the date/time workflow. */
.fix22d-workflow-payment .date-pair-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(145px, 1fr));
    gap: 12px 14px;
    align-items: end;
}

.fix22d-workflow-payment .date-pair-grid .discount-date-row {
    grid-column: 1 / span 2;
    max-width: 420px;
}

.fix22d-workflow-payment .date-pair-grid .duration-date-row {
    grid-column: 3 / span 2;
    align-self: end;
    justify-content: flex-start;
    gap: 8px;
}

.fix22d-workflow-payment .field-stack input,
.fix22d-workflow-payment .field-stack select,
.fix22d-workflow-payment .summary-line input,
.fix22d-workflow-payment .grand-total-line input,
.fix22d-workflow-payment .summary-line output {
    min-height: 36px;
    height: 36px;
    padding-block: 6px;
}

.fix22d-workflow-payment .field-stack label,
.fix22d-workflow-payment .summary-line label {
    margin-bottom: 4px;
}

.fix22d-workflow-payment .ro-mileage-row {
    grid-template-columns: repeat(3, minmax(145px, 1fr));
    gap: 10px 12px;
    align-items: end;
}

.fix22d-workflow-payment .readonly-inline-metric {
    min-height: 36px;
    padding: 7px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.fix22d-workflow-payment .readonly-inline-metric strong {
    text-align: right;
}

.fix22d-workflow-payment #EndMileage,
.fix22d-workflow-payment #PaymentAmount,
.fix22d-workflow-payment #PaymentAuthCode,
.fix22d-workflow-payment input[name="cardLast4"],
.fix22d-workflow-payment input[name="transactionReference"] {
    max-width: 220px;
}

/* Travel/toll controls: make checkbox and calculator visually equal-width peer actions. */
.fix22d-workflow-payment .travel-out-state-card.fix22a-travel-actions {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr);
    gap: 10px;
    align-items: stretch;
}

.fix22d-workflow-payment .travel-out-state-card .mini-outline-action,
.fix22d-workflow-payment .travel-out-state-trigger.mini-outline-action {
    width: 100%;
    min-height: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    border: 1px solid #bfdbfe;
    background: #ffffff;
    color: #0f3d75;
    font-size: .9rem;
    font-weight: 700;
    text-align: center;
}

.fix22d-workflow-payment .travel-out-state-trigger input {
    margin-right: 8px;
}

.fix22d-workflow-payment .travel-helper-text {
    grid-column: 1 / -1;
    font-size: .82rem;
    line-height: 1.25;
}

/* Rental options: keep all secondary add-ons inside the same inline card rhythm. */
.fix22d-workflow-payment .compact-options-grid {
    grid-template-columns: repeat(2, minmax(260px, 1fr));
    gap: 10px;
}

.fix22d-workflow-payment .compact-option-card {
    display: grid;
    grid-template-columns: minmax(120px, 1fr) auto minmax(92px, 118px);
    align-items: center;
    gap: 10px;
    min-height: 46px;
    padding: 9px 10px;
}

.fix22d-workflow-payment .compact-option-card .option-title,
.fix22d-workflow-payment .compact-option-card .option-control {
    white-space: nowrap;
}

.fix22d-workflow-payment .compact-option-card input[type="number"] {
    width: 100%;
    min-width: 92px;
    height: 34px;
    text-align: right;
}

.fix22d-workflow-payment .compact-option-card .qty-box {
    max-width: 58px;
    text-align: center;
}

/* Payments: reduce bloat, prevent clipping, and avoid horizontal scrolling. */
.fix22d-workflow-payment .payment-choice-grid.compact-payment-grid {
    grid-template-columns: repeat(3, minmax(165px, 1fr));
    gap: 10px;
}

.fix22d-workflow-payment .payment-choice-grid .option-choice-card {
    min-height: 48px;
    padding: 8px 10px;
    grid-template-columns: minmax(0, 1fr) minmax(82px, 112px);
    gap: 8px;
}

.fix22d-workflow-payment .payment-choice-grid .option-choice-card span {
    min-width: 0;
    white-space: normal;
    overflow: visible;
    line-height: 1.15;
}

.fix22d-workflow-payment .payment-choice-grid .option-choice-card input[type="number"] {
    width: 100%;
    height: 34px;
    text-align: right;
}

.fix22d-workflow-payment .payment-entry-grid {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
    gap: 10px 12px;
}

.fix22d-workflow-payment .payment-post-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.fix22d-workflow-payment .payment-post-actions button {
    min-height: 38px;
    padding: 0 14px;
    white-space: nowrap;
}

.fix22d-workflow-payment .payment-audit-table {
    table-layout: fixed;
    width: 100%;
}

.fix22d-workflow-payment .payment-audit-table th,
.fix22d-workflow-payment .payment-audit-table td {
    white-space: normal;
    overflow-wrap: anywhere;
    padding: 8px 6px;
}

/* Right summary/accounting: right-align every money value and shrink bloated controls. */
.fix22d-workflow-payment .total-sidebar,
.fix22d-workflow-payment .total-sidebar * {
    box-sizing: border-box;
}

.fix22d-workflow-payment .total-sidebar .summary-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(94px, 120px);
    align-items: center;
    gap: 8px;
}

.fix22d-workflow-payment .total-sidebar .summary-line input,
.fix22d-workflow-payment .total-sidebar .summary-line output,
.fix22d-workflow-payment .grand-total-line input,
.fix22d-workflow-payment .sidebar-total-focus strong,
.fix22d-workflow-payment .payment-mini-summary strong,
.fix22d-workflow-payment .fix21-summary-status-row strong,
.fix22d-workflow-payment .fix21-side-money,
.fix22d-workflow-payment .fix21-side-payment-amount,
.fix22d-workflow-payment .fix21-deposit-preview strong {
    text-align: right;
    justify-self: end;
    font-variant-numeric: tabular-nums;
}

.fix22d-workflow-payment .total-sidebar .summary-line input,
.fix22d-workflow-payment .grand-total-line input {
    max-width: 120px;
}

.fix22d-workflow-payment .total-sidebar label,
.fix22d-workflow-payment .total-sidebar span {
    min-width: 0;
}

@media (max-width: 1100px) {
    .fix22d-workflow-payment .date-pair-grid,
    .fix22d-workflow-payment .payment-entry-grid,
    .fix22d-workflow-payment .compact-options-grid,
    .fix22d-workflow-payment .payment-choice-grid.compact-payment-grid {
        grid-template-columns: 1fr 1fr;
    }
    .fix22d-workflow-payment .date-pair-grid .discount-date-row,
    .fix22d-workflow-payment .date-pair-grid .duration-date-row {
        grid-column: auto;
    }
    .fix22d-workflow-payment .fix22b-cv-card {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .fix22d-workflow-payment .date-pair-grid,
    .fix22d-workflow-payment .payment-entry-grid,
    .fix22d-workflow-payment .compact-options-grid,
    .fix22d-workflow-payment .payment-choice-grid.compact-payment-grid,
    .fix22d-workflow-payment .travel-out-state-card.fix22a-travel-actions {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   FIX 22I - Rental Details smart summary polish + status alignment
   Scope: Edit Rental Order > Rental Details and rental-order status columns.
   ========================================================= */
.fix22i-rental-details .fix22b-customer-vehicle-body {
    padding: 10px 12px !important;
}

.fix22i-rental-details .fix22b-cv-card {
    display: grid;
    grid-template-columns: minmax(250px, .78fr) minmax(360px, 1.22fr);
    gap: 18px;
    align-items: start;
    background: #fff;
    border: 1px solid var(--color-border, #E2E8F0);
    border-radius: 14px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .06);
    padding: 14px 16px;
}

.fix22i-rental-details .fix22b-cv-column {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    min-width: 0;
}

.fix22i-rental-details .fix22b-vehicle-column {
    border-left: 1px solid var(--color-border, #E2E8F0) !important;
    padding-left: 18px !important;
}

.fix22i-rental-details .fix22b-cv-heading {
    color: #475569 !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    letter-spacing: .07em !important;
    margin-bottom: 6px !important;
}

.fix22i-rental-details .fix22b-cv-name,
.fix22i-rental-details .fix22b-vehicle-title {
    color: #0F172A !important;
    font-size: 18px !important;
    line-height: 1.25 !important;
    font-weight: 850 !important;
    letter-spacing: -0.015em !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
}

.fix22i-rental-details .fix22b-customer-column .fix22b-cv-name {
    margin-bottom: 6px;
}

.fix22i-rental-details .fix22b-info-row {
    display: grid !important;
    grid-template-columns: minmax(94px, auto) minmax(0, 1fr);
    align-items: baseline;
    gap: 8px;
    padding: 4px 0 !important;
    min-width: 0;
    border-bottom: 1px solid rgba(226, 232, 240, .72);
}

.fix22i-rental-details .fix22b-info-row:last-child {
    border-bottom: 0;
}

.fix22i-rental-details .fix22b-info-row span {
    color: #555555 !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    white-space: nowrap;
}

.fix22i-rental-details .fix22b-info-row strong {
    color: #0F172A !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    min-width: 0;
    text-align: left !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    overflow-wrap: anywhere !important;
}

.fix22i-rental-details .fix22b-vehicle-meta-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 16px !important;
    padding-top: 8px;
}

.fix22i-rental-details .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(1),
.fix22i-rental-details .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(2),
.fix22i-rental-details .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(5),
.fix22i-rental-details .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(6) {
    grid-column: 1 / -1;
}

.fix22i-rental-details .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(3),
.fix22i-rental-details .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(4) {
    display: inline-flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 7px !important;
    width: fit-content;
    min-width: 136px;
    max-width: 160px;
    padding: 7px 10px !important;
    margin: 6px 0;
    border: 1px solid #D8E3F2 !important;
    border-radius: 999px;
    background: #F8FAFC;
}

.fix22i-rental-details .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(3) span,
.fix22i-rental-details .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(4) span {
    font-size: 11px !important;
    letter-spacing: .045em;
    text-transform: uppercase;
    color: #475569 !important;
}

.fix22i-rental-details .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(3) strong,
.fix22i-rental-details .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(4) strong {
    font-size: 13px !important;
    white-space: nowrap !important;
}

.fix22i-rental-details .fix22b-out-status-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 10px;
    padding-top: 10px !important;
    border-top: 1px solid var(--color-border, #E2E8F0);
}

.fix22i-rental-details .fix22b-out-status-row div {
    display: grid !important;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 8px;
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    padding: 9px 10px;
}

.fix22i-rental-details .fix22b-out-status-row span {
    color: #555555 !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    text-transform: uppercase;
}

.fix22i-rental-details .fix22b-out-status-row strong {
    color: #0F172A !important;
    font-size: 14px !important;
    font-weight: 850 !important;
}

.fix22i-rental-details .fix22b-contact-actions {
    gap: 8px;
    margin-top: 10px;
}

.fix22i-rental-details .fix22b-action-chip {
    min-height: 32px;
    padding: 0 13px;
    font-size: 12.5px;
}

/* Rental Orders and Dashboard status column: center the header, cell, and badge together. */
.orders-dashboard-table th.orders-status-cell,
.orders-dashboard-table td.orders-status-cell,
.hcr-table th.orders-status-cell,
.hcr-table td.orders-status-cell {
    width: 126px;
    min-width: 126px;
    max-width: 126px;
    text-align: center !important;
    vertical-align: middle !important;
}

.orders-dashboard-table td.orders-status-cell,
.hcr-table td.orders-status-cell {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.orders-status-cell .orders-status-badge,
.orders-status-cell .status-pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    min-width: 78px;
    text-align: center !important;
}

@media (max-width: 1120px) {
    .fix22i-rental-details .fix22b-cv-card {
        grid-template-columns: 1fr;
    }

    .fix22i-rental-details .fix22b-vehicle-column {
        border-left: 0 !important;
        border-top: 1px solid var(--color-border, #E2E8F0) !important;
        padding-left: 0 !important;
        padding-top: 14px !important;
    }
}

@media (max-width: 720px) {
    .fix22i-rental-details .fix22b-vehicle-meta-grid,
    .fix22i-rental-details .fix22b-out-status-row {
        grid-template-columns: 1fr;
    }

    .fix22i-rental-details .fix22b-info-row {
        grid-template-columns: 1fr;
        gap: 2px;
    }
}


/* Fix 22J - Right sidebar unified boundary/alignment
   Keep the main order-summary card, payments, deposit, and audit cards on the same rigid
   right-column grid so the blue total header does not look wider than the cards below. */
.fix22j-sidebar-boundaries .total-sidebar {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    box-sizing: border-box;
}

.fix22j-sidebar-boundaries .total-sidebar > .total-card,
.fix22j-sidebar-boundaries .total-sidebar > .fix21-side-card,
.fix22j-sidebar-boundaries .total-sidebar > .sticky-total-card,
.fix22j-sidebar-boundaries .total-sidebar > .premium-total-card,
.fix22j-sidebar-boundaries .total-sidebar > .fix18-charges-card {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
    align-self: stretch;
}

.fix22j-sidebar-boundaries .sticky-total-card {
    overflow: hidden;
}

.fix22j-sidebar-boundaries .section-heading,
.fix22j-sidebar-boundaries .fix21-side-card-title,
.fix22j-sidebar-boundaries .sidebar-total-focus,
.fix22j-sidebar-boundaries .payment-mini-summary,
.fix22j-sidebar-boundaries .fix21-summary-status-row,
.fix22j-sidebar-boundaries .fix18-financial-group,
.fix22j-sidebar-boundaries .fix18-fees-toggle,
.fix22j-sidebar-boundaries .grand-total-line,
.fix22j-sidebar-boundaries .fix21-side-row,
.fix22j-sidebar-boundaries .fix21-side-subrow,
.fix22j-sidebar-boundaries .fix21-inline-help,
.fix22j-sidebar-boundaries .fix21-audit-item,
.fix22j-sidebar-boundaries .fix21-empty-state {
    box-sizing: border-box;
    max-width: 100%;
}

.fix22j-sidebar-boundaries .sidebar-total-focus,
.fix22j-sidebar-boundaries .fix18-fees-toggle,
.fix22j-sidebar-boundaries .grand-total-line,
.fix22j-sidebar-boundaries .fix21-inline-help,
.fix22j-sidebar-boundaries .fix21-audit-item,
.fix22j-sidebar-boundaries .fix21-empty-state {
    margin-left: 12px;
    margin-right: 12px;
}

.fix22j-sidebar-boundaries .fix18-financial-group,
.fix22j-sidebar-boundaries .fix21-side-card {
    overflow: hidden;
}

.fix22j-sidebar-boundaries .summary-line,
.fix22j-sidebar-boundaries .payment-mini-summary,
.fix22j-sidebar-boundaries .fix21-summary-status-row,
.fix22j-sidebar-boundaries .fix21-side-row {
    grid-template-columns: minmax(0, 1fr) minmax(92px, 118px);
    padding-left: 12px;
    padding-right: 12px;
}

.fix22j-sidebar-boundaries .summary-line input,
.fix22j-sidebar-boundaries .summary-line output,
.fix22j-sidebar-boundaries .grand-total-line input,
.fix22j-sidebar-boundaries .fix21-side-row strong,
.fix22j-sidebar-boundaries .payment-mini-summary strong,
.fix22j-sidebar-boundaries .fix21-summary-status-row strong {
    max-width: 118px;
    width: 100%;
    justify-self: end;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.fix22j-sidebar-boundaries .fix21-side-card-title {
    padding-left: 12px;
    padding-right: 12px;
}

.fix22j-sidebar-boundaries .section-heading {
    padding-left: 12px;
    padding-right: 12px;
}

@media (max-width: 1100px) {
    .fix22j-sidebar-boundaries .total-sidebar {
        width: 100%;
    }
}

/* =========================================================
   Fix 22K - Consolidated Edit Rental Order UI/UX backlog
   - Options rows, summary hierarchy, right sidebar boundaries,
     deposit decision flow, docs status, payment history tools,
     compact controls, workflow/tab affordance polish.
   ========================================================= */
.fix22k-consolidated-ui {
    --hcr-control-height-compact: 36px;
    --hcr-money-width: 112px;
}

/* Make financial summary authoritative and aligned */
.fix22k-consolidated-ui .total-sidebar,
.fix22k-consolidated-ui .total-sidebar > * {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
}
.fix22k-consolidated-ui .total-sidebar {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: stretch;
}
.fix22k-consolidated-ui .total-card,
.fix22k-consolidated-ui .fix21-side-card {
    margin-left: 0 !important;
    margin-right: 0 !important;
    border-radius: 10px;
}
.fix22k-consolidated-ui .sidebar-total-focus {
    min-height: 58px;
    border-radius: 10px;
    padding: 12px 14px;
}
.fix22k-consolidated-ui .sidebar-total-focus strong {
    font-size: 1.45rem;
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
}
.fix22k-consolidated-ui .payment-mini-summary,
.fix22k-consolidated-ui .fix21-summary-status-row,
.fix22k-consolidated-ui .fix21-side-row,
.fix22k-consolidated-ui .summary-line,
.fix22k-consolidated-ui .grand-total-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 12px;
    border-bottom: 1px solid #E2E8F0;
    padding: 7px 0;
}
.fix22k-consolidated-ui .payment-mini-summary strong,
.fix22k-consolidated-ui .fix21-side-row strong,
.fix22k-consolidated-ui .summary-line input,
.fix22k-consolidated-ui .grand-total-line input,
.fix22k-consolidated-ui .readonly-money-line output {
    justify-self: end;
    text-align: right !important;
    font-variant-numeric: tabular-nums;
}
.fix22k-consolidated-ui .summary-line input,
.fix22k-consolidated-ui .grand-total-line input {
    width: var(--hcr-money-width) !important;
    min-width: var(--hcr-money-width) !important;
    height: var(--hcr-control-height-compact) !important;
    padding: 6px 10px !important;
}
.fix22k-consolidated-ui .fix18-financial-group h3,
.fix22k-consolidated-ui .fix18-fees-toggle summary {
    font-size: .84rem;
    letter-spacing: .035em;
}
.fix22k-consolidated-ui .fix21-audit-card {
    background: #F8FAFC;
}
.fix22k-consolidated-ui .fix21-audit-card .fix21-audit-item {
    background: #FFFFFF;
    font-size: .82rem;
}

/* Header action contrast: primary CTA stands out; More Actions becomes neutral */
.fix22k-consolidated-ui .fix20-top-primary,
.fix22k-consolidated-ui .primary-action[data-open-complete-modal] {
    background: #00B894 !important;
    border-color: #00B894 !important;
    color: #06281f !important;
    font-weight: 800;
    box-shadow: 0 8px 16px rgba(0,184,148,.22);
}
.fix22k-consolidated-ui .fix20-actions-menu > summary,
.fix22k-consolidated-ui .inline-menu > summary {
    background: #FFFFFF !important;
    border: 1px solid #CBD5E1 !important;
    color: #0F172A !important;
    box-shadow: none !important;
}

/* Workflow navigation state clarity */
.fix22k-consolidated-ui .workflow-step {
    cursor: default;
    opacity: .72;
}
.fix22k-consolidated-ui .workflow-step.is-current {
    opacity: 1;
    border-color: #0B6EF6 !important;
    box-shadow: inset 0 0 0 1px #0B6EF6;
}
.fix22k-consolidated-ui .workflow-step:not(.is-current):not(.is-done) {
    background: #F8FAFC;
    color: #64748B;
}
.fix22k-consolidated-ui .workflow-step small {
    font-size: .8rem !important;
    color: #475569;
}

/* Sticky task nav should remain readable and not create dropdown layering issues */
.fix22k-consolidated-ui .fix20-task-tabs.fix21-segmented-control {
    position: sticky;
    top: var(--rental-sticky-tabs-top, 150px);
    z-index: 850;
    overflow: visible;
}
.fix22k-consolidated-ui .fix18-overflow-menu[open] .fix18-menu-content {
    z-index: 2500;
}

/* Options tab: one compact, uniform row system */
.fix22k-consolidated-ui .fix22k-option-list {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
}
.fix22k-consolidated-ui .fix22k-option-row,
.fix22k-consolidated-ui .compact-option-card {
    display: grid !important;
    grid-template-columns: minmax(230px, 1fr) 140px var(--hcr-money-width) !important;
    align-items: center;
    gap: 12px;
    min-height: 46px;
    padding: 8px 12px !important;
    border-radius: 10px;
}
.fix22k-consolidated-ui .compact-option-card .option-title {
    min-width: 0;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    line-height: 1.25;
    font-weight: 700;
    color: #0F172A;
}
.fix22k-consolidated-ui .compact-option-card .option-control {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 128px;
    white-space: nowrap;
    font-weight: 700;
    color: #334155;
}
.fix22k-consolidated-ui .compact-option-card input[type="number"],
.fix22k-consolidated-ui .compact-option-card .money-compact {
    width: var(--hcr-money-width) !important;
    min-width: var(--hcr-money-width) !important;
    height: var(--hcr-control-height-compact) !important;
    text-align: right !important;
    padding: 6px 10px !important;
}
.fix22k-consolidated-ui .compact-option-card .qty-box {
    width: 62px !important;
    min-width: 62px !important;
    text-align: center !important;
}
.fix22k-consolidated-ui .compact-option-card:has(.ro-blue-check:checked),
.fix22k-consolidated-ui .compact-option-card.is-selected {
    border-color: #0B6EF6;
    background: #EFF6FF;
}

/* Compact payments and deposit controls */
.fix22k-consolidated-ui .payment-entry-grid {
    grid-template-columns: repeat(3, minmax(145px, 1fr));
    gap: 10px 12px;
}
.fix22k-consolidated-ui .payment-entry-grid input,
.fix22k-consolidated-ui .payment-entry-grid select,
.fix22k-consolidated-ui .field-stack input,
.fix22k-consolidated-ui .field-stack select {
    min-height: var(--hcr-control-height-compact) !important;
    height: var(--hcr-control-height-compact) !important;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
}
.fix22k-consolidated-ui .payment-history-toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin: 12px 0 8px;
    flex-wrap: wrap;
}
.fix22k-consolidated-ui .payment-history-toolbar span {
    margin-right: auto;
    font-weight: 800;
    color: #0F172A;
}
.fix22k-consolidated-ui .payment-history-toolbar .mini-outline-action,
.fix22k-consolidated-ui .payment-history-toolbar select {
    height: 32px;
    font-size: .78rem;
    padding: 0 10px;
}
.fix22k-consolidated-ui .payment-audit-table td:nth-child(4),
.fix22k-consolidated-ui .payment-audit-table th:nth-child(4) {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Deposit actions: guided flow + compact rows instead of huge cards */
.fix22k-consolidated-ui .deposit-decision-flow {
    margin: 0 0 12px;
    padding: 12px;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    background: #F8FAFC;
}
.fix22k-consolidated-ui .deposit-action-select-wrap {
    max-width: 360px;
}
.fix22k-consolidated-ui .fix22k-deposit-action-list,
.fix22k-consolidated-ui .deposit-settlement-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
}
.fix22k-consolidated-ui .closeout-action-card {
    display: grid !important;
    grid-template-columns: 30px minmax(0, 1fr) auto !important;
    gap: 10px 12px;
    min-height: 44px;
    padding: 10px 12px !important;
    align-items: center;
}
.fix22k-consolidated-ui .closeout-action-card small {
    grid-column: 2 / 4;
    margin: -4px 0 0;
    font-size: .78rem;
    color: #64748B;
}
.fix22k-consolidated-ui .closeout-action-card strong {
    justify-self: end;
    font-variant-numeric: tabular-nums;
}

/* Documents: status tiles and shorter upload area */
.fix22k-consolidated-ui .document-status-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 8px;
    margin-bottom: 12px;
}
.fix22k-consolidated-ui .document-status-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 9px 10px;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    background: #FFFFFF;
}
.fix22k-consolidated-ui .document-status-card span {
    font-weight: 700;
    color: #0F172A;
    font-size: .85rem;
}
.fix22k-consolidated-ui .document-status-card strong {
    font-size: .76rem;
    border-radius: 999px;
    padding: 4px 8px;
}
.fix22k-consolidated-ui .document-status-card.is-uploaded strong {
    background: #DCFCE7;
    color: #15803D;
}
.fix22k-consolidated-ui .document-status-card.is-missing strong {
    background: #FFF7E6;
    color: #B45309;
}
.fix22k-consolidated-ui .document-upload-grid {
    grid-template-columns: minmax(150px, 1fr) minmax(180px, 1.2fr) minmax(210px, 1.4fr) auto;
    gap: 10px;
    align-items: end;
}
.fix22k-consolidated-ui .document-upload-grid input[type="file"] {
    padding: 6px 8px !important;
    min-height: var(--hcr-control-height-compact) !important;
}

/* Return ODO required warning should be visible only until return ODO is present */
.fix22k-consolidated-ui .fix22k-return-odo-warning {
    display: block;
    margin-top: 10px;
}
.fix22k-consolidated-ui.has-return-odo .fix22k-return-odo-warning {
    display: none;
}

/* Status columns: enforce all levels */
.hcr-table th.status-column,
.hcr-table td.status-column,
.hcr-table th[data-column="status"],
.hcr-table td[data-column="status"],
.hcr-table th:nth-child(3):has(+ th),
.rental-orders-table th.status-column,
.rental-orders-table td.status-column {
    text-align: center !important;
    vertical-align: middle !important;
}
.hcr-table td.status-column .status-badge,
.rental-orders-table td.status-column .status-badge,
td .status-badge,
td .status-pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    min-width: 78px;
}

@media (max-width: 980px) {
    .fix22k-consolidated-ui .fix22k-option-row,
    .fix22k-consolidated-ui .compact-option-card,
    .fix22k-consolidated-ui .closeout-action-card {
        grid-template-columns: 1fr !important;
    }
    .fix22k-consolidated-ui .payment-entry-grid,
    .fix22k-consolidated-ui .document-upload-grid {
        grid-template-columns: 1fr !important;
    }
}

/* =========================================================
   Fix 22L - Smart workflow implementation from backlog mock
   ========================================================= */
.fix22l-smart-implementation {
    --fix22l-sidebar-width: minmax(340px, 400px);
}

.fix22l-smart-implementation .rental-workflow-sticky-shell {
    position: sticky;
    top: 68px;
    z-index: 920;
    border-radius: 14px;
    overflow: visible;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .12);
}

.fix22l-smart-implementation .fix22l-summary-bar {
    display: grid;
    grid-template-columns: minmax(260px, 1.4fr) repeat(3, minmax(160px, .55fr));
    gap: 10px;
    padding: 10px 12px;
    background: #fff;
    border-left: 1px solid var(--hcr-border);
    border-right: 1px solid var(--hcr-border);
    border-bottom: 1px solid var(--hcr-border);
    align-items: stretch;
}

.fix22l-summary-id,
.fix22l-summary-metric {
    border-radius: 12px;
    padding: 10px 14px;
    min-height: 58px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
}

.fix22l-summary-id {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    color: #0f172a;
}
.fix22l-summary-id span {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 800;
    color: #64748b;
}
.fix22l-summary-id strong {
    font-size: 14px;
    color: #0f172a;
}
.fix22l-summary-id small {
    color: #475569;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fix22l-summary-metric {
    border: 1px solid transparent;
    text-align: right;
    font-variant-numeric: tabular-nums;
}
.fix22l-summary-metric span {
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    font-weight: 900;
}
.fix22l-summary-metric strong {
    font-size: 20px;
    line-height: 1.1;
    font-weight: 900;
}
.fix22l-summary-metric.is-paid {
    background: #defce7;
    color: #166534;
    border-color: #bbf7d0;
}
.fix22l-summary-metric.is-due {
    background: #fee2e2;
    color: #991b1b;
    border-color: #fecaca;
}
.fix22l-summary-metric.is-deposit {
    background: #eaf4ff;
    color: #075985;
    border-color: #bfdbfe;
}

.fix22l-smart-implementation .workflow-step.is-disabled {
    opacity: .48;
    filter: grayscale(.25);
    cursor: not-allowed;
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
}
.fix22l-smart-implementation .workflow-step.is-disabled span,
.fix22l-smart-implementation .workflow-step.is-disabled small {
    color: #94a3b8 !important;
}

.fix22l-smart-implementation .order-layout-grid.fix18-two-column-layout,
.fix22l-smart-implementation .order-layout-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) var(--fix22l-sidebar-width) !important;
    gap: 24px !important;
    align-items: start;
}
.fix22l-smart-implementation .order-summary-column.fix18-side-panel,
.fix22l-smart-implementation .order-summary-column {
    width: 100% !important;
    min-width: 0 !important;
}
.fix22l-smart-implementation .order-summary-column > * {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.fix22l-smart-implementation .fix21-side-card,
.fix22l-smart-implementation .fix18-sticky-summary {
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 2px rgba(15,23,42,.06);
}

.fix22l-smart-implementation .fix18-financial-group .summary-line,
.fix22l-smart-implementation .fix18-fees-toggle .summary-line,
.fix22l-smart-implementation .fix21-side-row,
.fix22l-smart-implementation .closeout-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(96px, auto);
    align-items: center;
    gap: 12px;
}
.fix22l-smart-implementation .summary-line input,
.fix22l-smart-implementation .grand-total-line input,
.fix22l-smart-implementation .readonly-money-line output,
.fix22l-smart-implementation .fix21-side-row strong,
.fix22l-smart-implementation .closeout-line strong {
    text-align: right !important;
    font-variant-numeric: tabular-nums;
}

.fix22l-smart-implementation input,
.fix22l-smart-implementation select {
    min-height: 36px;
}

.fix22l-smart-implementation .return-odo-inline-warning {
    display: block;
    margin-top: 5px;
    color: #b91c1c;
    font-weight: 800;
}
.fix22l-smart-implementation.has-return-odo .return-odo-inline-warning,
.fix22l-smart-implementation #ReturnOdoRequiredWarning[hidden] {
    display: none !important;
}
.fix22l-smart-implementation .return-odo-required-field input:placeholder-shown,
.fix22l-smart-implementation:not(.has-return-odo) #EndMileage {
    border-color: #ef4444 !important;
    box-shadow: 0 0 0 1px rgba(239,68,68,.12);
}
.fix22l-smart-implementation [data-open-complete-modal].is-disabled,
.fix22l-smart-implementation [data-open-complete-modal]:disabled {
    opacity: .55;
    cursor: not-allowed;
    filter: grayscale(.2);
}

.fix22l-smart-implementation .fix22k-option-row,
.fix22l-smart-implementation .compact-option-card {
    grid-template-columns: minmax(240px, 1fr) minmax(120px, 140px) minmax(84px, 104px) !important;
}
.fix22l-smart-implementation .option-title {
    font-weight: 850;
    color: #0f172a;
}
.fix22l-smart-implementation .option-control {
    justify-self: end;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
    font-weight: 800;
    color: #334155;
}
.fix22l-smart-implementation .money-compact,
.fix22l-smart-implementation .qty-box {
    max-width: 104px;
}

.fix22l-smart-implementation .payment-history-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.fix22l-smart-implementation .payment-history-toolbar select,
.fix22l-smart-implementation .payment-history-toolbar .mini-outline-action {
    height: 34px;
    min-height: 34px;
    font-size: 12px;
    padding: 0 10px;
}

.fix22l-smart-implementation .deposit-decision-flow {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 12px;
    margin: 14px 0;
}
.fix22l-smart-implementation .fix22k-deposit-action-list {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
}
.fix22l-smart-implementation .settlement-option-card {
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    gap: 8px 10px;
    align-items: center;
    padding: 10px 12px !important;
    min-height: 54px;
}
.fix22l-smart-implementation .settlement-option-card small {
    grid-column: 2 / -1;
    margin-top: -4px;
}
.fix22l-smart-implementation .settlement-option-card strong {
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.fix22l-smart-implementation .document-status-grid {
    grid-template-columns: repeat(auto-fit, minmax(165px, 1fr)) !important;
    gap: 10px !important;
}
.fix22l-smart-implementation .document-status-card {
    min-height: 74px;
    display: grid !important;
    grid-template-columns: 28px 1fr auto;
    grid-template-rows: auto auto;
    align-items: center;
    gap: 3px 8px;
    padding: 10px !important;
}
.fix22l-smart-implementation .document-status-card .doc-thumb {
    grid-row: 1 / span 2;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    background: #e2e8f0;
    color: #475569;
}
.fix22l-smart-implementation .document-status-card.is-uploaded .doc-thumb {
    background: #dcfce7;
    color: #15803d;
}
.fix22l-smart-implementation .document-status-card.is-missing .doc-thumb {
    background: #fee2e2;
    color: #b91c1c;
}
.fix22l-smart-implementation .document-status-card strong {
    justify-self: end;
}
.fix22l-smart-implementation .document-status-card small {
    grid-column: 2 / -1;
    color: #64748b;
    font-weight: 700;
}

.fix22l-smart-implementation .fix21-audit-card {
    background: #f8f9fa !important;
}
.fix22l-smart-implementation .fix21-audit-card .fix21-audit-item {
    background: #ffffff;
    font-size: 12px;
}

@media (max-width: 1120px) {
    .fix22l-smart-implementation .fix22l-summary-bar,
    .fix22l-smart-implementation .order-layout-grid.fix18-two-column-layout,
    .fix22l-smart-implementation .order-layout-grid {
        grid-template-columns: 1fr !important;
    }
    .fix22l-summary-metric { text-align: left; }
}


/* Fix 22M — Right Sidebar Financial UI Polish
   - Uniform boundaries across right-column cards
   - 0.00 placeholder/default geometry for blank money boxes
   - Remove duplicate primary total wording by making bottom row a compact Net Due line
   - Standardize card headings and read-only money output styling
*/
.fix22m-sidebar-polish .total-sidebar {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    align-items: stretch !important;
    min-width: 0 !important;
}
.fix22m-sidebar-polish .total-sidebar > .total-card,
.fix22m-sidebar-polish .total-sidebar > .fix21-side-card {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow: hidden !important;
}
.fix22m-sidebar-polish .sticky-total-card,
.fix22m-sidebar-polish .premium-total-card,
.fix22m-sidebar-polish .fix21-side-card {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.fix22m-sidebar-polish .sidebar-total-focus {
    margin: 14px 14px 12px !important;
    min-height: 56px !important;
    box-sizing: border-box !important;
}
.fix22m-sidebar-polish .payment-mini-summary,
.fix22m-sidebar-polish .fix21-summary-status-row,
.fix22m-sidebar-polish .summary-line,
.fix22m-sidebar-polish .grand-total-line,
.fix22m-sidebar-polish .fix21-side-row {
    width: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}
.fix22m-sidebar-polish .fix18-financial-group,
.fix22m-sidebar-polish .fix18-fees-toggle,
.fix22m-sidebar-polish .fix21-side-card {
    border-radius: 12px !important;
}
.fix22m-sidebar-polish .section-heading,
.fix22m-sidebar-polish .fix18-financial-group h3,
.fix22m-sidebar-polish .fix21-side-card-title,
.fix22m-sidebar-polish .fix18-fees-toggle > summary {
    font-family: var(--hcr-font, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif) !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: var(--hcr-text, #0F172A) !important;
}
.fix22m-sidebar-polish .fix18-financial-group h3 {
    padding: 12px 14px 8px !important;
    margin: 0 !important;
    border-bottom: 1px solid #E2E8F0 !important;
    background: #F8FAFC !important;
}
.fix22m-sidebar-polish .summary-line,
.fix22m-sidebar-polish .fix18-fees-toggle .summary-line {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 118px !important;
    gap: 10px !important;
    min-height: 42px !important;
    padding: 7px 14px !important;
    border-bottom: 1px solid #EEF2F7 !important;
}
.fix22m-sidebar-polish .summary-line:last-child,
.fix22m-sidebar-polish .fix18-fees-toggle .summary-line:last-child { border-bottom: 0 !important; }
.fix22m-sidebar-polish .summary-line input,
.fix22m-sidebar-polish .summary-line output,
.fix22m-sidebar-polish .grand-total-line input,
.fix22m-sidebar-polish .readonly-money-line output {
    width: 118px !important;
    max-width: 118px !important;
    min-height: 36px !important;
    height: 36px !important;
    padding: 6px 10px !important;
    box-sizing: border-box !important;
    justify-self: end !important;
    text-align: right !important;
    font-variant-numeric: tabular-nums !important;
}
.fix22m-sidebar-polish .summary-line input::placeholder { color: #64748B !important; opacity: 1 !important; }
.fix22m-sidebar-polish .summary-line input[readonly],
.fix22m-sidebar-polish .grand-total-line input[readonly],
.fix22m-sidebar-polish .readonly-money-line output {
    background: #F8FAFC !important;
    border-color: transparent !important;
    box-shadow: none !important;
    color: #0F172A !important;
    font-weight: 800 !important;
    pointer-events: none !important;
}
.fix22m-sidebar-polish .summary-line input:not([readonly]) {
    background: #FFFFFF !important;
    border: 1px solid #CBD5E1 !important;
    box-shadow: inset 0 1px 1px rgba(15,23,42,.04) !important;
}
.fix22m-sidebar-polish .grand-total-line.compact-net-due {
    margin: 12px 14px 14px !important;
    min-height: 48px !important;
    padding: 8px 12px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 118px !important;
    align-items: center !important;
    background: #0F2A5B !important;
    border-radius: 10px !important;
}
.fix22m-sidebar-polish .grand-total-line.compact-net-due label {
    color: #FFFFFF !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}
.fix22m-sidebar-polish .fix21-deposit-card .fix21-side-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    min-height: 38px !important;
    padding: 8px 14px !important;
    border-bottom: 1px solid #EEF2F7 !important;
}
.fix22m-sidebar-polish .fix21-deposit-card .fix21-side-row:last-of-type { border-bottom: 0 !important; }
.fix22m-sidebar-polish .fix21-deposit-card .fix21-side-row span {
    color: #334155 !important;
    font-weight: 700 !important;
}
.fix22m-sidebar-polish .fix21-deposit-card .fix21-side-row strong {
    min-width: 96px !important;
    text-align: right !important;
    font-variant-numeric: tabular-nums !important;
}
.fix22m-sidebar-polish .fix21-audit-card {
    background: #F8FAFC !important;
}
.fix22m-sidebar-polish .fix21-audit-card .fix21-side-card-title,
.fix22m-sidebar-polish .fix21-audit-card .fix21-audit-item {
    background: #F8FAFC !important;
}
.fix22m-sidebar-polish .fix21-audit-card .fix21-audit-item {
    font-size: 12px !important;
    padding: 10px !important;
}
.fix22m-sidebar-polish .fix21-audit-card .fix21-audit-item small {
    font-size: 12px !important;
    line-height: 1.35 !important;
}

/* =========================================================
   Fix 22N - Total Charges / Financial Sidebar ticket pack
   ========================================================= */
.fix22n-financial-sidebar {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
}

.fix22n-financial-sidebar .fix22n-card,
.fix22n-financial-sidebar .total-card,
.fix22n-financial-sidebar .fix21-side-card,
.fix22n-financial-sidebar .fix18-financial-group,
.fix22n-financial-sidebar .fix18-fees-toggle {
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
}

.fix22n-card-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid #E2E8F0;
    background: #F8FAFC;
    color: #0F172A;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.2;
}

.fix22n-card-title small,
.fix22n-card-title a {
    font-size: 12px;
    font-weight: 700;
}

.fix22n-copy-button,
.fix22n-manage-link {
    border: 1px solid #CBD5E1;
    background: #fff;
    color: #0B6EF6;
    border-radius: 999px;
    padding: 7px 10px;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}

.fix22n-copy-button:hover,
.fix22n-manage-link:hover {
    background: #EFF6FF;
    border-color: #0B6EF6;
}

.fix22n-copy-status {
    margin: 8px 16px 0;
    color: #15803D;
    font-size: 12px;
    font-weight: 800;
}

.fix22n-primary-total {
    border-radius: 0;
    margin: 0;
    min-height: 72px;
}

.fix22n-financial-sidebar .payment-mini-summary,
.fix22n-financial-sidebar .fix21-summary-status-row,
.fix22n-financial-sidebar .summary-line,
.fix22n-financial-sidebar .fix21-side-row {
    padding-left: 16px;
    padding-right: 16px;
}

.fix22n-financial-sidebar .summary-line,
.fix22n-financial-sidebar .payment-mini-summary,
.fix22n-financial-sidebar .fix21-summary-status-row,
.fix22n-financial-sidebar .fix21-side-row {
    border-bottom: 1px solid #EEF2F7;
}

.fix22n-financial-sidebar .summary-line:hover,
.fix22n-financial-sidebar .payment-mini-summary:hover,
.fix22n-financial-sidebar .fix21-side-row:hover {
    background: #F8FAFC;
}

.fix22n-financial-sidebar input[type="number"],
.fix22n-financial-sidebar output,
.fix22n-financial-sidebar strong,
.fix22n-calc-panel strong,
.fix22n-deposit-preview strong {
    font-variant-numeric: tabular-nums;
}

.fix22n-financial-sidebar input[type="number"] {
    height: 36px;
    min-height: 36px;
    padding: 6px 10px;
    text-align: right;
    max-width: 132px;
    margin-left: auto;
}

.fix22n-financial-sidebar .readonly-money,
.fix22n-financial-sidebar input[readonly],
.fix22n-financial-sidebar output {
    background: #F8FAFC !important;
    border-color: transparent !important;
    color: #0F172A;
    box-shadow: none !important;
    cursor: default;
    font-weight: 800;
}

.fix22n-financial-sidebar .summary-line label,
.fix22n-financial-sidebar .payment-mini-summary span,
.fix22n-financial-sidebar .fix21-side-row span,
.fix22n-financial-sidebar .fix21-summary-status-row span {
    color: #334155;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.fix22n-financial-sidebar .summary-line output,
.fix22n-financial-sidebar .readonly-money-line output {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    height: 36px;
    min-width: 132px;
    margin-left: auto;
    color: #0F172A;
    font-weight: 800;
}

.fix22n-calc-panel {
    margin: 12px 16px;
    border-style: solid;
    border-color: #DBEAFE;
    background: #EFF6FF;
}

.fix22n-calc-panel > div,
.fix22n-deposit-preview > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 0;
    border-bottom: 1px solid rgba(148, 163, 184, .35);
}

.fix22n-calc-panel > div:last-of-type,
.fix22n-deposit-preview > div:last-of-type { border-bottom: 0; }
.fix22n-calc-panel .is-total,
.fix22n-deposit-preview .is-refund {
    color: #0F172A;
    font-size: 14px;
    font-weight: 900;
}
.fix22n-calc-panel small {
    display: block;
    margin-top: 8px;
    color: #475569;
    font-weight: 700;
}

.fix22n-tax-card summary {
    min-height: 48px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: #0F172A;
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
}
.fix22n-tax-card summary em {
    color: #0B6EF6;
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
}
.fix22n-tooltip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    margin-left: 6px;
    border: 1px solid #CBD5E1;
    border-radius: 50%;
    background: #fff;
    color: #0B6EF6;
    font-size: 11px;
    font-weight: 900;
    cursor: help;
}
.fix22n-tax-detail-grid .summary-line label {
    font-size: 12px;
    text-transform: none;
}
.fix22n-tax-detail-grid .summary-line input {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12px;
}

.fix22n-net-due-card {
    padding: 18px 16px;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 4px 16px;
    border-left-width: 5px !important;
}
.fix22n-net-due-card span {
    color: #334155;
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .03em;
}
.fix22n-net-due-card strong {
    font-size: 24px;
    line-height: 1;
    font-weight: 900;
    text-align: right;
}
.fix22n-net-due-card small {
    grid-column: 1 / -1;
    color: #475569;
    font-size: 12px;
    font-weight: 700;
}
.fix22n-net-due-card.is-zero {
    border-left-color: #16A34A !important;
    background: #F0FDF4;
}
.fix22n-net-due-card.is-zero strong,
.fix22n-financial-sidebar .is-zero { color: #15803D !important; }
.fix22n-net-due-card.is-due {
    border-left-color: #E63946 !important;
    background: #FEF2F2;
}
.fix22n-net-due-card.is-due strong,
.fix22n-financial-sidebar .is-due { color: #B91C1C !important; }
.deposit-blue { color: #0B6EF6 !important; }

.fix22n-payment-row .payment-method-badge,
.payment-method-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    border-radius: 999px;
    background: #EFF6FF;
    color: #0B6EF6;
    font-size: 11px;
    font-weight: 900;
    margin-right: 6px;
}

.fix22n-deposit-preview {
    margin: 14px 16px 16px;
    padding: 12px 14px;
    border-radius: 10px;
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.fix22n-deposit-preview span { color: #334155; }
.fix22n-deposit-preview strong { color: #0F172A; }
.fix22n-deposit-preview .is-refund strong { color: #15803D; }

.fix22n-audit-collapsed {
    background: #F8FAFC !important;
}
.fix22n-audit-collapsed summary {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    cursor: pointer;
}
.fix22n-audit-collapsed summary::-webkit-details-marker { display: none; }
.fix22n-audit-collapsed summary span {
    color: #0F172A;
    font-size: 16px;
    font-weight: 800;
}
.fix22n-audit-collapsed summary small {
    color: #64748B;
    font-size: 12px;
    font-weight: 700;
}
.fix22n-audit-collapsed .fix21-audit-item {
    margin: 10px 16px;
    font-size: 12px;
}

@media (max-width: 900px) {
    .fix22n-net-due-card strong { font-size: 20px; }
}

/* =========================================================
   Fix 22O - Remaining Total Charges polish / production finish
   ========================================================= */
.fix22o-total-polish .fix22n-financial-sidebar {
    gap: 24px;
}

.fix22o-total-polish .fix22n-financial-sidebar .fix22n-card,
.fix22o-total-polish .fix22n-financial-sidebar .total-card,
.fix22o-total-polish .fix22n-financial-sidebar .fix21-side-card,
.fix22o-total-polish .fix22n-financial-sidebar .fix18-financial-group,
.fix22o-total-polish .fix22n-financial-sidebar .fix18-fees-toggle,
.fix22o-total-polish .fix22n-financial-sidebar .fix22n-net-due-card {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .06);
}

.fix22o-total-polish .fix22n-card-title {
    min-height: 48px;
}

.fix22o-total-polish .fix22n-primary-total {
    border-radius: 0;
    background: linear-gradient(135deg, #0B6EF6, #0854B8);
}

.fix22o-total-polish .fix22n-primary-total strong,
.fix22o-total-polish .fix22n-primary-total span {
    color: #fff !important;
}

.fix22o-total-polish .is-paid-value,
.fix22o-total-polish #PaidAmountDisplay,
.fix22o-total-polish .payment-status-badge.is-posted {
    color: #15803D !important;
}

.fix22o-total-polish .payment-status-badge.is-posted {
    background: #DCFCE7;
    border: 1px solid #BBF7D0;
    border-radius: 999px;
    padding: 2px 7px;
    font-size: 11px;
    font-weight: 900;
}

.fix22o-total-polish .payment-status-badge.is-voided {
    color: #991B1B !important;
    background: #FEE2E2;
    border: 1px solid #FECACA;
    border-radius: 999px;
    padding: 2px 7px;
    font-size: 11px;
    font-weight: 900;
}

.fix22o-total-polish .fix22n-net-due-card {
    order: 3;
    min-height: 92px;
    padding: 22px 18px;
    margin-top: 0;
    margin-bottom: 0;
}

.fix22o-total-polish .fix22n-net-due-card strong {
    font-size: clamp(22px, 2.2vw, 28px);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.fix22o-total-polish .fix22n-tax-card[open] summary em::after,
.fix22o-total-polish .fix22o-toggle[aria-expanded="true"] span {
    transform: rotate(180deg);
}

.fix22o-total-polish .fix22n-tax-card summary em,
.fix22o-total-polish .fix22o-toggle span {
    display: inline-flex;
    transition: transform .18s ease;
}

.fix22o-total-polish .fix22n-tax-detail-grid,
.fix22o-total-polish .fix22n-calc-panel {
    animation: fix22o-panel-in .18s ease-out;
}

@keyframes fix22o-panel-in {
    from { opacity: 0; transform: translateY(-3px); }
    to { opacity: 1; transform: translateY(0); }
}

.fix22o-total-polish .fix22n-calc-panel {
    background: #F8FAFC;
    border: 1px solid #DBEAFE;
    color: #0F172A;
}

.fix22o-total-polish .fix22n-calc-panel .is-total {
    display: none !important;
}

.fix22o-total-polish .fix22n-calc-panel > div,
.fix22o-total-polish .fix22n-deposit-preview > div {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.fix22o-total-polish .fix22n-deposit-preview {
    background: #F0FDF4;
    border-color: #BBF7D0;
}

.fix22o-total-polish .fix22n-deposit-preview .is-refund {
    color: #15803D;
    font-weight: 900;
}

.fix22o-total-polish .fix22n-deposit-preview .is-refund strong {
    color: #15803D !important;
    font-size: 15px;
}

.fix22o-total-polish .fix22o-payment-tools {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 12px 16px;
    border-bottom: 1px solid #EEF2F7;
    background: #F8FAFC;
}

.fix22o-total-polish .fix22o-payment-tools select {
    min-height: 34px;
    height: 34px;
    padding: 5px 8px;
    border: 1px solid #CBD5E1;
    border-radius: 8px;
    background: #fff;
    font-size: 12px;
    font-weight: 800;
    color: #0F172A;
}

.fix22o-total-polish .fix22o-payment-item {
    border-bottom: 1px solid #EEF2F7;
    padding: 2px 0;
}

.fix22o-total-polish .fix22o-payment-item:last-child {
    border-bottom: 0;
}

.fix22o-total-polish .fix21-side-subrow {
    padding: 0 16px 10px;
    font-size: 11px;
    color: #64748B;
}

.fix22o-total-polish .fix22n-financial-sidebar .summary-line,
.fix22o-total-polish .fix22n-financial-sidebar .payment-mini-summary,
.fix22o-total-polish .fix22n-financial-sidebar .fix21-summary-status-row,
.fix22o-total-polish .fix22n-financial-sidebar .fix21-side-row {
    min-height: 44px;
    gap: 12px;
}

.fix22o-total-polish .fix22n-financial-sidebar input[type="number"]::placeholder {
    color: #94A3B8;
    opacity: 1;
}

.fix22o-total-polish .fix22n-financial-sidebar input[type="number"]:not([readonly]) {
    background: #FFFFFF;
    border: 1px solid #CBD5E1;
    color: #0F172A;
}

.fix22o-total-polish .fix22n-financial-sidebar input[type="number"][readonly],
.fix22o-total-polish .fix22n-financial-sidebar .readonly-money,
.fix22o-total-polish .fix22n-financial-sidebar output {
    background: #F1F5F9 !important;
    border: 1px solid transparent !important;
}

.fix22o-total-polish .fix22n-financial-sidebar .summary-line:hover,
.fix22o-total-polish .fix22n-financial-sidebar .payment-mini-summary:hover,
.fix22o-total-polish .fix22n-financial-sidebar .fix21-side-row:hover,
.fix22o-total-polish .fix22n-deposit-preview > div:hover {
    background: #F8FAFC;
}

/* =========================================================
   Fix 22P - Compact Edit Rental Order workspace
   - Compress header/summary/tab stack
   - Move workflow stages to a slim right-side rail on desktop
   - Maximize vertical workspace for task content
   - Keep financial sidebar fixed/sticky
   - Correct taxable subtotal display rule: VLF excluded from taxable subtotal
   ========================================================= */
.fix22p-compact-header {
    --fix22p-header-height: 56px;
    --fix22p-summary-height: 46px;
    --fix22p-tabs-height: 42px;
    --fix22p-rail-width: 196px;
}

.fix22p-compact-header .rental-workflow-sticky-shell {
    top: 60px !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .10) !important;
    overflow: visible !important;
}

.fix22p-compact-header .order-page-header.fix20-command-header {
    min-height: var(--fix22p-header-height) !important;
    padding: 8px 16px !important;
    border-radius: 12px 12px 0 0 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
}

.fix22p-compact-header .order-page-header .eyebrow {
    font-size: 10px !important;
    letter-spacing: .12em !important;
    margin-bottom: 2px !important;
}

.fix22p-compact-header .order-page-header h1 {
    font-size: 21px !important;
    line-height: 1.05 !important;
    margin: 0 !important;
}

.fix22p-compact-header .order-page-header p {
    margin: 4px 0 0 !important;
    font-size: 13px !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 720px !important;
}

.fix22p-compact-header .fix20-command-actions {
    gap: 8px !important;
}

.fix22p-compact-header .fix20-top-primary,
.fix22p-compact-header .fix20-actions-menu > summary,
.fix22p-compact-header .order-id-pill,
.fix22p-compact-header .fix20-status-badge {
    min-height: 36px !important;
    height: 36px !important;
    padding: 0 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
}

/* Compact one-line summary row. The title/status identity already lives in the header. */
.fix22p-compact-header .fix22l-summary-bar {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    padding: 6px 10px !important;
    min-height: var(--fix22p-summary-height) !important;
    align-items: center !important;
    background: #ffffff !important;
}

.fix22p-compact-header .fix22l-summary-id {
    display: none !important;
}

.fix22p-compact-header .fix22l-summary-metric {
    min-height: 34px !important;
    height: 34px !important;
    padding: 5px 10px !important;
    border-radius: 9px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    text-align: left !important;
}

.fix22p-compact-header .fix22l-summary-metric span {
    font-size: 10px !important;
    line-height: 1 !important;
    letter-spacing: .07em !important;
}

.fix22p-compact-header .fix22l-summary-metric strong {
    font-size: 16px !important;
    line-height: 1 !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
}

/* Move the wide workflow stage row out of the header stack on desktop. */
.fix22p-compact-header .workflow-horizontal-panel {
    display: none !important;
}

.fix22p-compact-header .fix20-task-tabs.fix21-segmented-control {
    position: sticky !important;
    top: calc(60px + var(--fix22p-header-height) + var(--fix22p-summary-height)) !important;
    z-index: 930 !important;
    min-height: var(--fix22p-tabs-height) !important;
    height: var(--fix22p-tabs-height) !important;
    padding: 5px 8px !important;
    border-radius: 0 0 12px 12px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: #ffffff !important;
    border-top: 1px solid #e2e8f0 !important;
}

.fix22p-compact-header .fix20-task-tab {
    min-height: 30px !important;
    height: 30px !important;
    padding: 0 12px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
}

/* Desktop workflow rail. Hidden on narrower screens to avoid covering the financial column. */
.fix22p-compact-header .workflow-vertical-rail {
    position: fixed;
    top: 170px;
    right: max(14px, calc((100vw - 1700px) / 2));
    width: var(--fix22p-rail-width);
    z-index: 650;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px;
    border: 1px solid #dbeafe;
    border-radius: 14px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 10px 24px rgba(15, 23, 42, .10);
    backdrop-filter: blur(8px);
}

.fix22p-compact-header .workflow-rail-title {
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .10em;
    text-transform: uppercase;
    color: #64748b;
    padding: 0 4px 2px;
}

.fix22p-compact-header .workflow-vertical-rail .workflow-step {
    display: grid !important;
    grid-template-columns: 24px minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 0 8px;
    align-items: center;
    min-height: 48px !important;
    padding: 7px 9px !important;
    border-radius: 10px !important;
    border: 1px solid #e2e8f0 !important;
    background: #fff !important;
    box-shadow: none !important;
}

.fix22p-compact-header .workflow-vertical-rail .workflow-step strong {
    grid-row: 1 / span 2;
    width: 22px;
    height: 22px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #eff6ff;
    color: #0b6ef6;
    font-size: 11px;
    font-weight: 900;
}

.fix22p-compact-header .workflow-vertical-rail .workflow-step span {
    font-size: 13px !important;
    font-weight: 900 !important;
    color: #0f172a !important;
    line-height: 1.05 !important;
}

.fix22p-compact-header .workflow-vertical-rail .workflow-step small {
    font-size: 11px !important;
    color: #64748b !important;
    line-height: 1.05 !important;
    font-weight: 750 !important;
}

.fix22p-compact-header .workflow-vertical-rail .workflow-step.is-current {
    border-color: #0b6ef6 !important;
    background: #eff6ff !important;
    box-shadow: inset 3px 0 0 #0b6ef6 !important;
}

.fix22p-compact-header .workflow-vertical-rail .workflow-step.is-done {
    border-color: #bbf7d0 !important;
    background: #f0fdf4 !important;
}

.fix22p-compact-header .workflow-vertical-rail .workflow-step.is-disabled {
    opacity: .42 !important;
    background: #f8fafc !important;
    cursor: not-allowed;
}

/* More usable work area: tighten gaps and let the financial sidebar stay visible. */
.fix22p-compact-header .order-layout-grid.fix18-two-column-layout,
.fix22p-compact-header .order-layout-grid {
    gap: 18px !important;
    margin-top: 14px !important;
}

.fix22p-compact-header .total-sidebar {
    position: sticky !important;
    top: calc(60px + var(--fix22p-header-height) + var(--fix22p-summary-height) + var(--fix22p-tabs-height) + 18px) !important;
    max-height: calc(100vh - 190px) !important;
    overflow-y: auto !important;
    scrollbar-gutter: stable;
}

.fix22p-compact-header .ro-collapsible-section > summary {
    min-height: 42px !important;
    padding-top: 9px !important;
    padding-bottom: 9px !important;
}

.fix22p-compact-header .ro-section-body {
    padding-top: 14px !important;
    padding-bottom: 14px !important;
}

/* Keep all secondary detail panels collapsed visually compact unless opened. */
.fix22p-compact-header .fix22n-tax-card:not([open]) {
    min-height: 48px;
}

/* Correct color visibility on the persistent summary. */
.fix22p-compact-header .fix22l-summary-metric.is-paid {
    background: #dcfce7 !important;
    color: #166534 !important;
}
.fix22p-compact-header .fix22l-summary-metric.is-due {
    background: #fee2e2 !important;
    color: #991b1b !important;
}
.fix22p-compact-header .fix22l-summary-metric.is-deposit {
    background: #e0f2fe !important;
    color: #075985 !important;
}

/* Extra clarity for Taxable Subtotal after VLF exclusion rule. */
.fix22p-compact-header #TaxableSubtotalDisplay,
.fix22p-compact-header #CalcTaxableSubtotal {
    color: #0f172a !important;
}

@media (max-width: 1520px) {
    .fix22p-compact-header .workflow-vertical-rail {
        display: none !important;
    }
    .fix22p-compact-header .workflow-horizontal-panel {
        display: grid !important;
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
        gap: 6px !important;
        padding: 6px 8px !important;
        background: #fff !important;
        border-left: 1px solid #e2e8f0 !important;
        border-right: 1px solid #e2e8f0 !important;
    }
    .fix22p-compact-header .workflow-horizontal-panel .workflow-step {
        min-height: 38px !important;
        padding: 5px 8px !important;
    }
    .fix22p-compact-header .workflow-horizontal-panel .workflow-step small {
        font-size: 10.5px !important;
    }
}

@media (max-width: 1120px) {
    .fix22p-compact-header .fix22l-summary-bar {
        grid-template-columns: 1fr !important;
        min-height: auto !important;
    }
    .fix22p-compact-header .fix22l-summary-metric {
        height: 36px !important;
    }
    .fix22p-compact-header .fix20-task-tabs.fix21-segmented-control,
    .fix22p-compact-header .total-sidebar {
        position: static !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

/* =========================================================
   Fix 22Q - Enterprise workspace finalization
   - Compress top workspace stack and make content the priority
   - Make right financial column and Net Due consistently visible
   - Finish color hierarchy, spacing, card boundaries, and payment readability
   ========================================================= */
.fix22q-workspace-final {
    --fix22q-header-height: 48px;
    --fix22q-summary-height: 36px;
    --fix22q-tabs-height: 38px;
    --fix22q-rail-width: 180px;
    --fix22q-nav-offset: 58px;
}

.fix22q-workspace-final .rental-workflow-sticky-shell {
    top: var(--fix22q-nav-offset) !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .10) !important;
}

.fix22q-workspace-final .order-page-header.fix20-command-header {
    min-height: var(--fix22q-header-height) !important;
    padding: 6px 14px !important;
    border-radius: 10px 10px 0 0 !important;
}

.fix22q-workspace-final .order-page-header .eyebrow {
    font-size: 9px !important;
    margin-bottom: 1px !important;
}

.fix22q-workspace-final .order-page-header h1 {
    font-size: 19px !important;
    line-height: 1 !important;
}

.fix22q-workspace-final .order-page-header p {
    margin-top: 3px !important;
    font-size: 12px !important;
}

.fix22q-workspace-final .fix20-top-primary,
.fix22q-workspace-final .fix20-actions-menu > summary,
.fix22q-workspace-final .order-id-pill,
.fix22q-workspace-final .fix20-status-badge {
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 12px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
}

.fix22q-workspace-final .fix20-top-primary {
    background: #00B894 !important;
    color: #073B2D !important;
    font-weight: 900 !important;
}

.fix22q-workspace-final .fix20-top-primary[disabled],
.fix22q-workspace-final .fix20-top-primary.is-disabled {
    opacity: .65;
}

.fix22q-workspace-final .fix22l-summary-bar {
    min-height: var(--fix22q-summary-height) !important;
    height: var(--fix22q-summary-height) !important;
    padding: 4px 8px !important;
    gap: 8px !important;
}

.fix22q-workspace-final .fix22l-summary-metric {
    min-height: 28px !important;
    height: 28px !important;
    padding: 3px 10px !important;
    border-radius: 8px !important;
}

.fix22q-workspace-final .fix22l-summary-metric span {
    font-size: 9.5px !important;
}

.fix22q-workspace-final .fix22l-summary-metric strong {
    font-size: 14px !important;
    font-variant-numeric: tabular-nums !important;
}

.fix22q-workspace-final .workflow-horizontal-panel {
    display: none !important;
}

.fix22q-workspace-final .fix20-task-tabs.fix21-segmented-control {
    top: calc(var(--fix22q-nav-offset) + var(--fix22q-header-height) + var(--fix22q-summary-height)) !important;
    height: var(--fix22q-tabs-height) !important;
    min-height: var(--fix22q-tabs-height) !important;
    padding: 4px 8px !important;
    gap: 6px !important;
}

.fix22q-workspace-final .fix20-task-tab {
    height: 28px !important;
    min-height: 28px !important;
    padding: 0 12px !important;
    font-size: 11.5px !important;
}

.fix22q-workspace-final .workflow-vertical-rail {
    display: flex !important;
    width: var(--fix22q-rail-width) !important;
    top: calc(var(--fix22q-nav-offset) + var(--fix22q-header-height) + 8px) !important;
    right: max(10px, calc((100vw - 1720px) / 2)) !important;
    padding: 8px !important;
    gap: 6px !important;
}

.fix22q-workspace-final .workflow-vertical-rail .workflow-step {
    min-height: 42px !important;
    padding: 6px 8px !important;
}

.fix22q-workspace-final .workflow-vertical-rail .workflow-step span {
    font-size: 12px !important;
}

.fix22q-workspace-final .workflow-vertical-rail .workflow-step small {
    font-size: 10px !important;
}

.fix22q-workspace-final .order-layout-grid,
.fix22q-workspace-final .order-layout-grid.fix18-two-column-layout {
    margin-top: 12px !important;
    gap: 16px !important;
}

.fix22q-workspace-final .order-main-column {
    min-width: 0;
}

.fix22q-workspace-final .ro-collapsible-section {
    margin-bottom: 12px !important;
}

.fix22q-workspace-final .ro-collapsible-section > summary {
    min-height: 38px !important;
    padding: 7px 12px !important;
}

.fix22q-workspace-final .ro-collapsible-section > summary small,
.fix22q-workspace-final .ro-section-helper,
.fix22q-workspace-final .docs-helper-text {
    font-size: 12px !important;
    color: #475569 !important;
    font-weight: 750 !important;
}

.fix22q-workspace-final .ro-section-body {
    padding: 12px !important;
}

.fix22q-workspace-final .total-sidebar.fix22n-financial-sidebar {
    position: sticky !important;
    top: calc(var(--fix22q-nav-offset) + var(--fix22q-header-height) + var(--fix22q-summary-height) + var(--fix22q-tabs-height) + 12px) !important;
    align-self: start !important;
    max-height: calc(100vh - 170px) !important;
    overflow-y: auto !important;
    padding-right: 2px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

.fix22q-workspace-final .total-sidebar .fix22n-card,
.fix22q-workspace-final .total-sidebar .total-card,
.fix22q-workspace-final .total-sidebar .fix18-financial-group,
.fix22q-workspace-final .total-sidebar .fix18-fees-toggle,
.fix22q-workspace-final .total-sidebar .fix21-side-card,
.fix22q-workspace-final .total-sidebar .fix22n-net-due-card {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 10px !important;
    margin: 0 !important;
}

.fix22q-workspace-final .fix22n-card-title {
    min-height: 38px !important;
    padding: 10px 12px !important;
    font-size: 14px !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

.fix22q-workspace-final .fix22n-primary-total {
    margin: 0 !important;
    min-height: 54px !important;
    padding: 12px 14px !important;
    border-radius: 10px !important;
}

.fix22q-workspace-final .fix22n-primary-total strong {
    font-size: 24px !important;
    font-variant-numeric: tabular-nums !important;
}

.fix22q-workspace-final .fix18-financial-group.fix21-rental-charge-group .summary-line,
.fix22q-workspace-final .fix18-financial-group .summary-line,
.fix22q-workspace-final .fix22n-tax-detail-grid .summary-line,
.fix22q-workspace-final .payment-mini-summary,
.fix22q-workspace-final .fix21-summary-status-row,
.fix22q-workspace-final .fix21-side-row {
    min-height: 36px !important;
    padding: 6px 12px !important;
    border-bottom: 1px solid #EEF2F7 !important;
    align-items: center !important;
}

.fix22q-workspace-final .summary-line:hover,
.fix22q-workspace-final .payment-mini-summary:hover,
.fix22q-workspace-final .fix21-summary-status-row:hover,
.fix22q-workspace-final .fix21-side-row:hover {
    background: #F8FAFC !important;
}

.fix22q-workspace-final .summary-line input[type="number"],
.fix22q-workspace-final .summary-line output,
.fix22q-workspace-final .payment-mini-summary strong,
.fix22q-workspace-final .fix21-summary-status-row strong,
.fix22q-workspace-final .fix22n-deposit-preview strong,
.fix22q-workspace-final #NetDuePrimary,
.fix22q-workspace-final #TotalChargesDisplay,
.fix22q-workspace-final #PaidAmountDisplay,
.fix22q-workspace-final #BalanceDueDisplay,
.fix22q-workspace-final #Fix21DepositHeld {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-variant-numeric: tabular-nums !important;
    text-align: right !important;
}

.fix22q-workspace-final .summary-line input[type="number"],
.fix22q-workspace-final .summary-line output {
    width: 108px !important;
    max-width: 108px !important;
    min-height: 32px !important;
    height: 32px !important;
    padding: 4px 8px !important;
}

.fix22q-workspace-final .readonly-money,
.fix22q-workspace-final input[readonly],
.fix22q-workspace-final output {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    color: #0F172A !important;
}

.fix22q-workspace-final input:not([readonly]):not([type="hidden"]),
.fix22q-workspace-final select,
.fix22q-workspace-final textarea {
    min-height: 36px;
}

.fix22q-workspace-final #PaidAmountDisplay,
.fix22q-workspace-final .is-paid-value,
.fix22q-workspace-final .fix22l-summary-metric.is-paid strong,
.fix22q-workspace-final .payment-status-badge.is-posted,
.fix22q-workspace-final .fix22n-deposit-preview .is-refund strong {
    color: #15803D !important;
}

.fix22q-workspace-final #BalanceDueDisplay.is-due,
.fix22q-workspace-final .fix22n-net-due-card.is-due strong,
.fix22q-workspace-final .fix22l-summary-metric.is-due strong {
    color: #B91C1C !important;
}

.fix22q-workspace-final #BalanceDueDisplay.is-zero,
.fix22q-workspace-final .fix22n-net-due-card.is-zero strong,
.fix22q-workspace-final .fix22l-summary-metric.is-paid:first-of-type strong {
    color: #15803D !important;
}

.fix22q-workspace-final #Fix21DepositHeld,
.fix22q-workspace-final .deposit-blue,
.fix22q-workspace-final .fix22l-summary-metric.is-deposit strong {
    color: #075985 !important;
}

.fix22q-workspace-final .fix22n-net-due-card {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 20 !important;
    padding: 14px 16px !important;
    min-height: 76px !important;
    border-left: 5px solid #16A34A !important;
    background: #F0FDF4 !important;
}

.fix22q-workspace-final .fix22n-net-due-card.is-due {
    border-left-color: #DC2626 !important;
    background: #FEF2F2 !important;
}

.fix22q-workspace-final .fix22n-net-due-card strong {
    font-size: 28px !important;
}

.fix22q-workspace-final .fix22o-payment-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding: 10px 12px !important;
}

.fix22q-workspace-final .fix22o-payment-item {
    border: 1px solid #E2E8F0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    background: #FFFFFF !important;
    padding: 0 !important;
}

.fix22q-workspace-final .payment-method-badge,
.fix22q-workspace-final .payment-status-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
    padding: 2px 8px !important;
    font-size: 11px !important;
    font-weight: 900 !important;
}

.fix22q-workspace-final .payment-method-badge {
    background: #EFF6FF !important;
    color: #1D4ED8 !important;
    border: 1px solid #BFDBFE !important;
}

.fix22q-workspace-final .fix22n-tax-card:not([open]) .fix22n-tax-detail-grid,
.fix22q-workspace-final .fix22n-audit-collapsed:not([open]) .fix21-audit-item {
    display: none !important;
}

.fix22q-workspace-final .fix22n-audit-collapsed {
    background: #F8FAFC !important;
}

.fix22q-workspace-final .fix22n-audit-collapsed summary {
    min-height: 40px !important;
}

.fix22q-workspace-final .fix22n-deposit-preview {
    margin: 10px 12px 12px !important;
    padding: 12px !important;
    border-radius: 10px !important;
    display: grid !important;
    gap: 8px !important;
}

.fix22q-workspace-final .fix22n-deposit-preview > div {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    gap: 10px !important;
    padding: 3px 0 !important;
    border-bottom: 1px dashed #BBF7D0 !important;
}

.fix22q-workspace-final .fix22n-deposit-preview > div:last-child {
    border-bottom: 0 !important;
}

.fix22q-workspace-final .document-status-grid,
.fix22q-workspace-final .fix22k-doc-status-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
    gap: 10px !important;
}

.fix22q-workspace-final .document-status-card,
.fix22q-workspace-final .fix22k-doc-card {
    min-height: 54px !important;
    padding: 10px !important;
}

.fix22q-workspace-final .workflow-step.is-disabled {
    pointer-events: auto;
    cursor: not-allowed;
}

@media (max-width: 1280px) {
    .fix22q-workspace-final .workflow-vertical-rail {
        display: none !important;
    }
    .fix22q-workspace-final .workflow-horizontal-panel {
        display: none !important;
    }
}

@media (max-width: 980px) {
    .fix22q-workspace-final .fix22l-summary-bar {
        height: auto !important;
        grid-template-columns: 1fr !important;
    }
    .fix22q-workspace-final .fix20-task-tabs.fix21-segmented-control,
    .fix22q-workspace-final .total-sidebar.fix22n-financial-sidebar {
        position: static !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

/* =========================================================
   Fix 22R - Screen-by-screen workspace correction audit
   - Remove overlapping workflow rail on standard desktop widths
   - Reduce sticky header stack and prevent tab content from hiding under it
   - Keep right financial panel fixed without colliding with the workflow rail
   - Tighten Docs/Deposit/Payments/Options/Return tabs to maximize working area
   - Finish visual hierarchy/color states and financial row spacing
   ========================================================= */
.fix22r-final-audit {
    --fix22r-nav-offset: 58px;
    --fix22r-header-height: 42px;
    --fix22r-summary-height: 30px;
    --fix22r-tabs-height: 32px;
    --fix22r-sticky-total: calc(var(--fix22r-nav-offset) + var(--fix22r-header-height) + var(--fix22r-summary-height) + var(--fix22r-tabs-height));
}

/* Sticky shell: compact and no longer a large workspace blocker. */
.fix22r-final-audit .rental-workflow-sticky-shell {
    top: var(--fix22r-nav-offset) !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .12) !important;
    overflow: visible !important;
    z-index: 920 !important;
}

.fix22r-final-audit .order-page-header.fix20-command-header {
    min-height: var(--fix22r-header-height) !important;
    height: var(--fix22r-header-height) !important;
    padding: 6px 14px !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    border-radius: 10px 10px 0 0 !important;
}

.fix22r-final-audit .order-page-header .eyebrow {
    display: none !important;
}

.fix22r-final-audit .order-page-header h1 {
    font-size: 17px !important;
    line-height: 1 !important;
    margin: 0 !important;
}

.fix22r-final-audit .order-page-header p {
    font-size: 11.5px !important;
    line-height: 1 !important;
    margin: 3px 0 0 !important;
    max-width: 760px !important;
}

.fix22r-final-audit .fix20-command-actions {
    gap: 6px !important;
}

.fix22r-final-audit .fix20-top-primary,
.fix22r-final-audit .fix20-actions-menu > summary,
.fix22r-final-audit .order-id-pill,
.fix22r-final-audit .fix20-status-badge {
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 12px !important;
    font-size: 12px !important;
    border-radius: 999px !important;
}

/* Summary bar: one true compact row. */
.fix22r-final-audit .fix22l-summary-bar {
    height: var(--fix22r-summary-height) !important;
    min-height: var(--fix22r-summary-height) !important;
    padding: 4px 8px !important;
    gap: 6px !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    border-top: 1px solid rgba(226, 232, 240, .7) !important;
}

.fix22r-final-audit .fix22l-summary-id {
    display: none !important;
}

.fix22r-final-audit .fix22l-summary-metric {
    height: 22px !important;
    min-height: 22px !important;
    padding: 2px 8px !important;
    border-radius: 7px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
}

.fix22r-final-audit .fix22l-summary-metric span {
    font-size: 9.5px !important;
    letter-spacing: .06em !important;
}

.fix22r-final-audit .fix22l-summary-metric strong {
    font-size: 13px !important;
    line-height: 1 !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
}

/* Tabs: directly under summary, compact, sticky, no excess height. */
.fix22r-final-audit .fix20-task-tabs.fix21-segmented-control {
    position: sticky !important;
    top: calc(var(--fix22r-nav-offset) + var(--fix22r-header-height) + var(--fix22r-summary-height)) !important;
    height: var(--fix22r-tabs-height) !important;
    min-height: var(--fix22r-tabs-height) !important;
    padding: 3px 8px !important;
    gap: 5px !important;
    border-radius: 0 0 10px 10px !important;
    z-index: 918 !important;
}

.fix22r-final-audit .fix20-task-tab {
    height: 24px !important;
    min-height: 24px !important;
    padding: 0 11px !important;
    font-size: 11px !important;
    font-weight: 850 !important;
}

/* The fixed workflow rail caused overlap on real desktop widths. Keep it hidden until there is truly spare space. */
.fix22r-final-audit .workflow-horizontal-panel,
.fix22r-final-audit .workflow-vertical-rail {
    display: none !important;
}

@media (min-width: 2100px) {
    .fix22r-final-audit .workflow-vertical-rail {
        display: flex !important;
        position: fixed !important;
        top: calc(var(--fix22r-nav-offset) + 8px) !important;
        right: max(16px, calc((100vw - 1900px) / 2)) !important;
        width: 170px !important;
        z-index: 560 !important;
    }
}

/* Content should not land underneath sticky header when switching tabs. */
.fix22r-final-audit .order-layout-grid,
.fix22r-final-audit .order-layout-grid.fix18-two-column-layout {
    margin-top: 10px !important;
    gap: 16px !important;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px) !important;
}

.fix22r-final-audit .order-main-column [data-task-panel] {
    scroll-margin-top: calc(var(--fix22r-sticky-total) + 24px) !important;
}

.fix22r-final-audit .total-sidebar.fix22n-financial-sidebar {
    top: calc(var(--fix22r-sticky-total) + 10px) !important;
    max-height: calc(100vh - var(--fix22r-sticky-total) - 18px) !important;
    overflow-y: auto !important;
    padding-right: 2px !important;
    gap: 10px !important;
}

/* Keep the global Net Due card visible but not enormous. */
.fix22r-final-audit .fix22n-net-due-card {
    order: -1 !important;
    min-height: 58px !important;
    padding: 10px 14px !important;
    position: sticky !important;
    top: 0 !important;
}
.fix22r-final-audit .fix22n-net-due-card strong {
    font-size: 22px !important;
}

/* Uniform card boundaries and card spacing across the right column. */
.fix22r-final-audit .total-sidebar > * {
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}
.fix22r-final-audit .total-sidebar .fix22n-card,
.fix22r-final-audit .total-sidebar .total-card,
.fix22r-final-audit .total-sidebar .fix18-financial-group,
.fix22r-final-audit .total-sidebar .fix18-fees-toggle,
.fix22r-final-audit .total-sidebar .fix21-side-card {
    border-radius: 10px !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, .055) !important;
}

/* Section-specific compaction: do not make each active tab feel like a long page. */
.fix22r-final-audit .ro-collapsible-section {
    margin-bottom: 10px !important;
}
.fix22r-final-audit .ro-collapsible-section > summary {
    min-height: 34px !important;
    padding: 6px 11px !important;
    font-size: 14px !important;
}
.fix22r-final-audit .ro-collapsible-section > summary small {
    font-size: 11.5px !important;
    font-weight: 700 !important;
}
.fix22r-final-audit .ro-section-body {
    padding: 10px 12px !important;
}

/* Return screen: compact and clean. */
.fix22r-final-audit .date-pair-grid {
    grid-template-columns: repeat(4, minmax(140px, 1fr)) !important;
    gap: 10px !important;
}
.fix22r-final-audit .discount-date-row {
    grid-column: span 2 !important;
}
.fix22r-final-audit .duration-date-row {
    align-self: end !important;
}
.fix22r-final-audit .readonly-inline-metric {
    min-height: 34px !important;
    padding: 7px 10px !important;
}
.fix22r-final-audit #EndMileage {
    max-width: 220px !important;
}
.fix22r-final-audit .travel-out-state-card {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 280px) !important;
    gap: 8px !important;
    padding: 8px !important;
}
.fix22r-final-audit .travel-toggle-button,
.fix22r-final-audit #OutOfStateOpenButton {
    width: 100% !important;
    min-height: 36px !important;
    height: 36px !important;
    justify-content: center !important;
    border: 1px solid #BFDBFE !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
    color: #0B3B74 !important;
    font-weight: 900 !important;
}
.fix22r-final-audit .travel-helper-text {
    grid-column: 1 / -1 !important;
}

/* Options: compact rows, full labels, consistent columns. */
.fix22r-final-audit .compact-options-grid.fix22k-option-list {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
}
.fix22r-final-audit .fix22k-option-row,
.fix22r-final-audit .compact-option-card {
    display: grid !important;
    grid-template-columns: minmax(240px, 1fr) 140px 110px !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 42px !important;
    padding: 7px 10px !important;
}
.fix22r-final-audit .fix22k-option-row .option-title {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.15 !important;
    font-weight: 850 !important;
}
.fix22r-final-audit .fix22k-option-row .option-control {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 7px !important;
    white-space: nowrap !important;
    min-width: 0 !important;
}
.fix22r-final-audit .fix22k-option-row .money-compact,
.fix22r-final-audit .fix22k-option-row .qty-box {
    height: 34px !important;
    min-height: 34px !important;
}
.fix22r-final-audit .fix22k-option-row .money-compact {
    width: 100% !important;
    max-width: 110px !important;
    text-align: right !important;
}
.fix22r-final-audit .fix22k-option-row .qty-box {
    width: 88px !important;
    max-width: 88px !important;
}

/* Payments: narrower form, less scrolling, clearer rows. */
.fix22r-final-audit .payment-choice-grid.compact-payment-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
}
.fix22r-final-audit .payment-choice-grid .option-choice-card {
    min-height: 44px !important;
    padding: 7px 9px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 100px !important;
    gap: 8px !important;
}
.fix22r-final-audit .payment-choice-grid .option-choice-card span {
    white-space: normal !important;
    line-height: 1.15 !important;
}
.fix22r-final-audit .compact-payment-panel {
    padding: 12px !important;
}
.fix22r-final-audit .payment-entry-grid,
.fix22r-final-audit .submodule-form-grid {
    gap: 10px !important;
}
.fix22r-final-audit .payment-audit-table tbody tr,
.fix22r-final-audit .fix22o-payment-item {
    border-bottom: 1px solid #E2E8F0 !important;
}

/* Deposit: keep guided flow compact and connected. */
.fix22r-final-audit .closeout-summary-grid {
    gap: 10px !important;
}
.fix22r-final-audit .closeout-action-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
}
.fix22r-final-audit .closeout-action-card {
    min-height: 42px !important;
    padding: 9px 10px !important;
    grid-template-columns: 24px minmax(0, 1fr) auto !important;
}
.fix22r-final-audit .settlement-notes-area textarea {
    min-height: 70px !important;
}

/* Documents: compact statuses and upload layout. */
.fix22r-final-audit .document-status-grid {
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) !important;
    gap: 8px !important;
}
.fix22r-final-audit .document-status-card {
    min-height: 46px !important;
    padding: 8px 10px !important;
    grid-template-columns: 24px 1fr auto !important;
}
.fix22r-final-audit .document-status-card small {
    display: none !important;
}
.fix22r-final-audit .document-upload-grid {
    grid-template-columns: minmax(170px, .7fr) minmax(200px, 1fr) minmax(220px, 1fr) auto !important;
    gap: 10px !important;
    align-items: end !important;
}

/* Financial hierarchy & states. */
.fix22r-final-audit .is-paid-value,
.fix22r-final-audit #PaidAmountDisplay,
.fix22r-final-audit .payment-status-badge.is-posted {
    color: #15803D !important;
}
.fix22r-final-audit #BalanceDueDisplay.is-due,
.fix22r-final-audit .fix22n-net-due-card.is-due strong,
.fix22r-final-audit #NetDuePrimary.is-due {
    color: #B91C1C !important;
}
.fix22r-final-audit #BalanceDueDisplay.is-zero,
.fix22r-final-audit .fix22n-net-due-card.is-zero strong,
.fix22r-final-audit #NetDuePrimary.is-zero {
    color: #15803D !important;
}
.fix22r-final-audit #Fix21DepositHeld,
.fix22r-final-audit .deposit-blue,
.fix22r-final-audit #Fix22LSummaryDeposit {
    color: #075985 !important;
}
.fix22r-final-audit #Fix22NDepositPreviewRefund {
    color: #15803D !important;
}

/* Remove redundant visual noise; title style stays consistent. */
.fix22r-final-audit .fix22n-primary-total span,
.fix22r-final-audit .fix22n-card-title span,
.fix22r-final-audit .fix21-side-card .fix22n-card-title span {
    text-transform: none !important;
    letter-spacing: 0 !important;
}

/* Status column alignment on Rental Orders table. */
.hcr-table th.status-column,
.hcr-table td.status-column,
.rental-orders-table th.status-column,
.rental-orders-table td.status-column,
.orders-table th.status-column,
.orders-table td.status-column,
td[data-label="Status"],
th[data-label="Status"] {
    text-align: center !important;
    vertical-align: middle !important;
}
.hcr-table td.status-column .status-badge,
.rental-orders-table td.status-column .status-badge,
.orders-table td.status-column .status-badge,
td[data-label="Status"] .status-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

@media (max-width: 1180px) {
    .fix22r-final-audit .order-layout-grid,
    .fix22r-final-audit .order-layout-grid.fix18-two-column-layout {
        grid-template-columns: 1fr !important;
    }
    .fix22r-final-audit .total-sidebar.fix22n-financial-sidebar,
    .fix22r-final-audit .fix20-task-tabs.fix21-segmented-control {
        position: static !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

@media (max-width: 760px) {
    .fix22r-final-audit .fix20-command-actions {
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
    }
    .fix22r-final-audit .fix22l-summary-bar,
    .fix22r-final-audit .date-pair-grid,
    .fix22r-final-audit .payment-choice-grid.compact-payment-grid,
    .fix22r-final-audit .document-upload-grid {
        grid-template-columns: 1fr !important;
        height: auto !important;
    }
    .fix22r-final-audit .fix22k-option-row,
    .fix22r-final-audit .compact-option-card {
        grid-template-columns: 1fr !important;
    }
}

/* ==========================================================
   Fix 22S - Right Sidebar Usability Repair
   The previous sidebar compaction made the financial cards visually broken:
   headers clipped, buttons overflowed, fees/taxes summary crowded, and
   payment/deposit cards looked like disconnected fragments. This pass
   rebuilds the right column as a stable, readable stack.
   ========================================================== */
.fix22s-sidebar-repair {
    --fix22s-right-width: 420px;
    --fix22s-card-radius: 12px;
    --fix22s-card-pad-x: 14px;
    --fix22s-row-height: 34px;
}

.fix22s-sidebar-repair .order-layout-grid,
.fix22s-sidebar-repair .order-layout-grid.fix18-two-column-layout {
    grid-template-columns: minmax(0, 1fr) minmax(390px, var(--fix22s-right-width)) !important;
    align-items: start !important;
    column-gap: 18px !important;
}

.fix22s-sidebar-repair .total-sidebar.fix22n-financial-sidebar {
    width: 100% !important;
    min-width: 390px !important;
    max-width: var(--fix22s-right-width) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 0 4px 14px 0 !important;
    overflow-y: auto !important;
    overflow-x: visible !important;
    scrollbar-gutter: stable !important;
}

.fix22s-sidebar-repair .total-sidebar > *,
.fix22s-sidebar-repair .total-sidebar .fix22n-card,
.fix22s-sidebar-repair .total-sidebar .total-card,
.fix22s-sidebar-repair .total-sidebar .fix18-financial-group,
.fix22s-sidebar-repair .total-sidebar .fix18-fees-toggle,
.fix22s-sidebar-repair .total-sidebar .fix21-side-card {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow: hidden !important;
    border-radius: var(--fix22s-card-radius) !important;
    border: 1px solid #D7E2EF !important;
    background: #fff !important;
}

/* Card headers: one consistent row. No clipped buttons or overlapping text. */
.fix22s-sidebar-repair .fix22n-card-title,
.fix22s-sidebar-repair .fix21-side-card-title,
.fix22s-sidebar-repair .fix18-financial-group .fix22n-card-title {
    min-height: 42px !important;
    padding: 9px var(--fix22s-card-pad-x) !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
    background: #F8FAFC !important;
    border-bottom: 1px solid #E2E8F0 !important;
}

.fix22s-sidebar-repair .fix22n-card-title span,
.fix22s-sidebar-repair .fix21-side-card-title span {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 14px !important;
    line-height: 18px !important;
    font-weight: 800 !important;
    color: #0F172A !important;
}

.fix22s-sidebar-repair .fix22n-card-title small,
.fix22s-sidebar-repair .fix21-side-card-title small {
    font-size: 11px !important;
    white-space: nowrap !important;
    color: #64748B !important;
}

.fix22s-sidebar-repair .fix22n-card-title button,
.fix22s-sidebar-repair .fix22n-card-title a,
.fix22s-sidebar-repair .fix22n-copy-button,
.fix22s-sidebar-repair .fix22n-manage-link,
.fix22s-sidebar-repair .fix21-formula-toggle {
    margin: 0 !important;
    min-height: 30px !important;
    height: 30px !important;
    max-width: 168px !important;
    padding: 0 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
}

.fix22s-sidebar-repair .fix21-formula-toggle,
.fix22s-sidebar-repair .fix22n-copy-button,
.fix22s-sidebar-repair .fix22n-manage-link {
    border: 1px solid #CFE0F5 !important;
    background: #FFFFFF !important;
    color: #0B5EB8 !important;
    text-decoration: none !important;
}

/* Order summary: remove border drift and keep Total/Paid/Balance/Deposit readable. */
.fix22s-sidebar-repair .premium-total-card.fix22n-card {
    padding: 0 !important;
}

.fix22s-sidebar-repair .sidebar-total-focus.fix22n-primary-total {
    margin: 12px var(--fix22s-card-pad-x) 8px !important;
    min-height: 56px !important;
    padding: 10px 14px !important;
    border-radius: 10px !important;
}

.fix22s-sidebar-repair .sidebar-total-focus.fix22n-primary-total strong {
    font-size: 22px !important;
    line-height: 1 !important;
}

.fix22s-sidebar-repair .payment-mini-summary,
.fix22s-sidebar-repair .fix21-summary-status-row,
.fix22s-sidebar-repair .summary-line,
.fix22s-sidebar-repair .fix21-side-row,
.fix22s-sidebar-repair .grand-total-line {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(96px, 118px) !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: var(--fix22s-row-height) !important;
    padding: 7px var(--fix22s-card-pad-x) !important;
    border-bottom: 1px solid #EEF2F7 !important;
}

.fix22s-sidebar-repair .summary-line:last-child,
.fix22s-sidebar-repair .payment-mini-summary:last-child,
.fix22s-sidebar-repair .fix21-side-row:last-child {
    border-bottom: 0 !important;
}

.fix22s-sidebar-repair .summary-line label,
.fix22s-sidebar-repair .payment-mini-summary span,
.fix22s-sidebar-repair .fix21-summary-status-row span,
.fix22s-sidebar-repair .fix21-side-row span,
.fix22s-sidebar-repair .readonly-money-line label {
    min-width: 0 !important;
    color: #475569 !important;
    font-size: 11px !important;
    line-height: 15px !important;
    font-weight: 800 !important;
    letter-spacing: .025em !important;
    text-transform: uppercase !important;
    overflow-wrap: anywhere !important;
}

.fix22s-sidebar-repair .summary-line input,
.fix22s-sidebar-repair .summary-line output,
.fix22s-sidebar-repair .readonly-money-line output,
.fix22s-sidebar-repair .payment-mini-summary strong,
.fix22s-sidebar-repair .fix21-summary-status-row strong,
.fix22s-sidebar-repair .fix21-side-row strong {
    justify-self: end !important;
    width: 112px !important;
    max-width: 112px !important;
    min-height: 30px !important;
    height: 30px !important;
    padding: 5px 9px !important;
    border-radius: 8px !important;
    text-align: right !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-variant-numeric: tabular-nums !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    box-sizing: border-box !important;
}

.fix22s-sidebar-repair .summary-line input,
.fix22s-sidebar-repair .readonly-money-line output {
    border: 1px solid #D9E3EF !important;
    background: #F8FAFC !important;
    color: #0F172A !important;
}

.fix22s-sidebar-repair .readonly-money {
    background: #F1F5F9 !important;
    color: #334155 !important;
    cursor: default !important;
}

/* Fees & Taxes: usable compact accordion row. */
.fix22s-sidebar-repair .fix18-fees-toggle.fix22n-tax-card {
    margin: 0 !important;
    padding: 0 !important;
}

.fix22s-sidebar-repair .fix18-fees-toggle.fix22n-tax-card > summary {
    min-height: 42px !important;
    padding: 8px var(--fix22s-card-pad-x) !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    align-items: center !important;
    gap: 9px !important;
    background: #F8FAFC !important;
    border-bottom: 1px solid #E2E8F0 !important;
    cursor: pointer !important;
}

.fix22s-sidebar-repair .fix18-fees-toggle > summary span {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #0F172A !important;
}

.fix22s-sidebar-repair .fix18-fees-toggle > summary strong {
    color: #0B6EF6 !important;
    font-size: 14px !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-variant-numeric: tabular-nums !important;
    white-space: nowrap !important;
}

.fix22s-sidebar-repair .fix18-fees-toggle > summary em {
    color: #0B5EB8 !important;
    font-size: 12px !important;
    font-style: normal !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

.fix22s-sidebar-repair .fix22n-tooltip {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #BFD4EF !important;
    background: #fff !important;
    color: #0B5EB8 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
}

.fix22s-sidebar-repair .fix22n-tax-detail-grid {
    padding: 6px 0 !important;
    background: #fff !important;
}

/* Payments: prevent filters from turning into bulky blocks. */
.fix22s-sidebar-repair .fix22o-payment-tools {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    padding: 10px var(--fix22s-card-pad-x) !important;
    border-bottom: 1px solid #EEF2F7 !important;
}

.fix22s-sidebar-repair .fix22o-payment-tools select {
    height: 34px !important;
    min-height: 34px !important;
    width: 100% !important;
    font-size: 12px !important;
    padding: 5px 30px 5px 10px !important;
    border-radius: 8px !important;
}

.fix22s-sidebar-repair .fix22o-payment-list {
    padding: 0 !important;
}

.fix22s-sidebar-repair .fix22o-payment-item {
    padding: 8px var(--fix22s-card-pad-x) !important;
    border-bottom: 1px solid #EEF2F7 !important;
    background: #fff !important;
}

.fix22s-sidebar-repair .fix22o-payment-item:last-child {
    border-bottom: 0 !important;
}

.fix22s-sidebar-repair .fix22o-payment-item .fix21-side-row {
    padding: 0 !important;
    min-height: 24px !important;
    border-bottom: 0 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
}

.fix22s-sidebar-repair .fix21-side-subrow {
    padding: 3px 0 0 !important;
    border-bottom: 0 !important;
    color: #64748B !important;
    font-size: 11px !important;
}

.fix22s-sidebar-repair .payment-method-badge,
.fix22s-sidebar-repair .payment-status-badge {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 20px !important;
    padding: 2px 7px !important;
    border-radius: 999px !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

/* Deposit summary: compact preview, no massive whitespace. */
.fix22s-sidebar-repair .fix22n-deposit-preview {
    padding: 8px var(--fix22s-card-pad-x) 10px !important;
    display: grid !important;
    gap: 6px !important;
}

.fix22s-sidebar-repair .fix22n-deposit-preview > div {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 10px !important;
    align-items: center !important;
    min-height: 26px !important;
    padding: 3px 0 !important;
    border-bottom: 1px solid #EEF2F7 !important;
}

.fix22s-sidebar-repair .fix22n-deposit-preview > div:last-child {
    border-bottom: 0 !important;
}

.fix22s-sidebar-repair .fix22n-deposit-preview span {
    color: #475569 !important;
    font-size: 12px !important;
    font-weight: 750 !important;
}

.fix22s-sidebar-repair .fix22n-deposit-preview strong {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-variant-numeric: tabular-nums !important;
    font-weight: 900 !important;
}

/* Audit Log should look passive and compact. */
.fix22s-sidebar-repair .fix21-audit-card,
.fix22s-sidebar-repair .fix22n-audit-collapsed {
    background: #F8FAFC !important;
}

.fix22s-sidebar-repair .fix22n-audit-collapsed > summary {
    min-height: 40px !important;
    padding: 8px var(--fix22s-card-pad-x) !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 8px !important;
}

.fix22s-sidebar-repair .fix21-audit-item {
    margin: 8px var(--fix22s-card-pad-x) !important;
    padding: 9px 10px !important;
    background: #FFFFFF !important;
    border-radius: 10px !important;
}

/* Avoid clipping from any previous fixes. */
.fix22s-sidebar-repair .total-sidebar .fix22n-card-title,
.fix22s-sidebar-repair .total-sidebar summary,
.fix22s-sidebar-repair .total-sidebar .fix22o-payment-tools,
.fix22s-sidebar-repair .total-sidebar .fix22n-deposit-preview {
    overflow: visible !important;
}

@media (max-width: 1180px) {
    .fix22s-sidebar-repair .order-layout-grid,
    .fix22s-sidebar-repair .order-layout-grid.fix18-two-column-layout {
        grid-template-columns: 1fr !important;
    }
    .fix22s-sidebar-repair .total-sidebar.fix22n-financial-sidebar {
        min-width: 0 !important;
        max-width: none !important;
    }
}

/* =========================================================
   Fix 22T - Mock-design implementation pass
   - Match the user-provided desktop mock more closely
   - Use a compact top header + compact summary + compact tabs
   - Use a left vertical workflow rail
   - Restore a simple right summary card instead of the overloaded sidebar
   - Keep the active task content as the primary workspace
   ========================================================= */
.fix22t-mock-implementation {
    --fix22t-nav-offset: 58px;
    --fix22t-rail-width: 128px;
    --fix22t-form-shift: 146px;
    --fix22t-sidebar-width: 224px;
    --fix22t-header-h: 64px;
    --fix22t-summary-h: 34px;
    --fix22t-tabs-h: 40px;
}

.fix22t-mock-implementation .rental-workflow-sticky-shell {
    top: var(--fix22t-nav-offset) !important;
    z-index: 920 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .14) !important;
}

.fix22t-mock-implementation .order-page-header.fix20-command-header {
    min-height: var(--fix22t-header-h) !important;
    padding: 10px 18px !important;
    border-radius: 12px 12px 0 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) auto !important;
    align-items: center !important;
    gap: 12px !important;
}

.fix22t-mock-implementation .order-page-header .eyebrow {
    display: block !important;
    font-size: 9px !important;
    letter-spacing: .14em !important;
    margin-bottom: 2px !important;
}

.fix22t-mock-implementation .order-page-header h1 {
    margin: 0 !important;
    font-size: 20px !important;
    line-height: 1.05 !important;
}

.fix22t-mock-implementation .order-page-header p {
    margin: 4px 0 0 !important;
    font-size: 12px !important;
    line-height: 1.1 !important;
    opacity: .98 !important;
}

.fix22t-mock-implementation .fix20-command-actions {
    gap: 8px !important;
    flex-wrap: nowrap !important;
}

.fix22t-mock-implementation .fix20-top-primary,
.fix22t-mock-implementation .fix20-actions-menu > summary,
.fix22t-mock-implementation .order-id-pill,
.fix22t-mock-implementation .fix20-status-badge,
.fix22t-mock-implementation .status-badge {
    min-height: 34px !important;
    height: 34px !important;
    padding: 0 14px !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 850 !important;
}

.fix22t-mock-implementation .fix20-top-primary {
    background: linear-gradient(135deg, #0ea5b7 0%, #10b981 100%) !important;
    color: #083344 !important;
}

.fix22t-mock-implementation .fix22l-summary-bar {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    min-height: var(--fix22t-summary-h) !important;
    height: var(--fix22t-summary-h) !important;
    padding: 5px 10px !important;
    background: #f8fbff !important;
    border-top: 1px solid rgba(255,255,255,.08) !important;
}

.fix22t-mock-implementation .fix22l-summary-id {
    display: none !important;
}

.fix22t-mock-implementation .fix22l-summary-metric {
    min-height: 24px !important;
    height: 24px !important;
    padding: 2px 10px !important;
    border-radius: 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    border: 0 !important;
}

.fix22t-mock-implementation .fix22l-summary-metric span {
    font-size: 10px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

.fix22t-mock-implementation .fix22l-summary-metric strong {
    font-size: 13px !important;
    line-height: 1 !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-variant-numeric: tabular-nums !important;
}

.fix22t-mock-implementation .fix22l-summary-metric.is-due {
    background: #fce7ec !important;
    color: #d90445 !important;
}
.fix22t-mock-implementation .fix22l-summary-metric.is-paid {
    background: #dff4e8 !important;
    color: #0f7a34 !important;
}
.fix22t-mock-implementation .fix22l-summary-metric.is-deposit {
    background: #dfeff2 !important;
    color: #0b3b74 !important;
}

.fix22t-mock-implementation .workflow-horizontal-panel {
    display: none !important;
}

.fix22t-mock-implementation .fix20-task-tabs.fix21-segmented-control {
    position: sticky !important;
    top: calc(var(--fix22t-nav-offset) + var(--fix22t-header-h) + var(--fix22t-summary-h)) !important;
    min-height: var(--fix22t-tabs-h) !important;
    height: var(--fix22t-tabs-h) !important;
    padding: 4px 10px !important;
    gap: 8px !important;
    background: #ffffff !important;
    border-top: 1px solid #e5edf7 !important;
    border-radius: 0 0 12px 12px !important;
    z-index: 918 !important;
}

.fix22t-mock-implementation .fix20-task-tab {
    min-height: 28px !important;
    height: 28px !important;
    padding: 0 14px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    font-weight: 850 !important;
}

/* Left workflow rail like the mock */
.fix22t-mock-implementation .workflow-vertical-rail {
    display: flex !important;
    position: fixed !important;
    left: max(16px, calc((100vw - 1480px) / 2 + 8px)) !important;
    top: calc(var(--fix22t-nav-offset) + var(--fix22t-header-h) + var(--fix22t-summary-h) + var(--fix22t-tabs-h) + 22px) !important;
    width: var(--fix22t-rail-width) !important;
    z-index: 650 !important;
    padding: 0 !important;
    gap: 8px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

.fix22t-mock-implementation .workflow-rail-title {
    display: none !important;
}

.fix22t-mock-implementation .workflow-vertical-rail .workflow-step {
    display: grid !important;
    grid-template-columns: 26px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    gap: 1px 10px !important;
    align-items: center !important;
    min-height: 54px !important;
    padding: 8px 10px !important;
    border-radius: 10px !important;
    border: 0 !important;
    background: #17356f !important;
    box-shadow: 0 8px 18px rgba(15,23,42,.18) !important;
}

.fix22t-mock-implementation .workflow-vertical-rail .workflow-step strong {
    grid-row: 1 / span 2 !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #8aa4f8 !important;
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 900 !important;
}

.fix22t-mock-implementation .workflow-vertical-rail .workflow-step span,
.fix22t-mock-implementation .workflow-vertical-rail .workflow-step small {
    color: #ffffff !important;
}
.fix22t-mock-implementation .workflow-vertical-rail .workflow-step span {
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1.02 !important;
}
.fix22t-mock-implementation .workflow-vertical-rail .workflow-step small {
    font-size: 10px !important;
    opacity: .84 !important;
    line-height: 1.05 !important;
}
.fix22t-mock-implementation .workflow-vertical-rail .workflow-step.is-current {
    background: #1f66ff !important;
}
.fix22t-mock-implementation .workflow-vertical-rail .workflow-step.is-current strong {
    background: #ffffff !important;
    color: #1f66ff !important;
}
.fix22t-mock-implementation .workflow-vertical-rail .workflow-step.is-done {
    background: #274383 !important;
}
.fix22t-mock-implementation .workflow-vertical-rail .workflow-step.is-disabled {
    opacity: .88 !important;
}

/* Shift the form right so the left rail has real space and keep the content area as the primary workspace. */
.fix22t-mock-implementation #rentalOrderForm {
    margin-left: var(--fix22t-form-shift) !important;
    width: calc(100% - var(--fix22t-form-shift)) !important;
    box-sizing: border-box !important;
}

.fix22t-mock-implementation .order-layout-grid,
.fix22t-mock-implementation .order-layout-grid.fix18-two-column-layout {
    grid-template-columns: minmax(0, 1fr) var(--fix22t-sidebar-width) !important;
    gap: 16px !important;
    margin-top: 14px !important;
    align-items: start !important;
}

.fix22t-mock-implementation .order-main-column {
    min-width: 0 !important;
}

.fix22t-mock-implementation .ro-collapsible-section {
    margin-bottom: 12px !important;
}

.fix22t-mock-implementation .ro-collapsible-section > summary {
    min-height: 38px !important;
    padding: 8px 12px !important;
    background: #ffffff !important;
}

.fix22t-mock-implementation .ro-collapsible-section > summary span {
    font-size: 14px !important;
    font-weight: 900 !important;
}

.fix22t-mock-implementation .ro-collapsible-section > summary small {
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #64748b !important;
}

.fix22t-mock-implementation .ro-section-body {
    padding: 12px 14px !important;
}

/* Simpler right summary: mirror the mock by showing only Order Summary + Net Due. */
.fix22t-mock-implementation .total-sidebar.fix22n-financial-sidebar {
    position: sticky !important;
    top: calc(var(--fix22t-nav-offset) + var(--fix22t-header-h) + var(--fix22t-summary-h) + var(--fix22t-tabs-h) + 14px) !important;
    align-self: start !important;
    max-height: calc(100vh - 180px) !important;
    overflow: visible !important;
    min-width: var(--fix22t-sidebar-width) !important;
    width: var(--fix22t-sidebar-width) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

.fix22t-mock-implementation .total-sidebar.fix22n-financial-sidebar > :not(.sticky-total-card):not(.fix22n-net-due-card) {
    display: none !important;
}

.fix22t-mock-implementation .sticky-total-card.premium-total-card.fix22n-card {
    border-radius: 10px !important;
    border: 1px solid #dbe3ef !important;
    background: #ffffff !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .08) !important;
    overflow: hidden !important;
}

.fix22t-mock-implementation .sticky-total-card .fix22n-card-title {
    min-height: 40px !important;
    padding: 10px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    border-bottom: 1px solid #e8eef6 !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

.fix22t-mock-implementation #CopyBreakdownButton,
.fix22t-mock-implementation .fix22n-copy-status {
    display: none !important;
}

.fix22t-mock-implementation .sidebar-total-focus.fix22n-primary-total {
    margin: 0 !important;
    min-height: 42px !important;
    padding: 10px 12px !important;
    border-radius: 0 !important;
    background: linear-gradient(135deg, #0c63ff 0%, #0058d9 100%) !important;
    color: #ffffff !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
}

.fix22t-mock-implementation .sidebar-total-focus.fix22n-primary-total span,
.fix22t-mock-implementation .sidebar-total-focus.fix22n-primary-total strong {
    color: #ffffff !important;
}

.fix22t-mock-implementation .sidebar-total-focus.fix22n-primary-total span {
    font-size: 12px !important;
    font-weight: 900 !important;
}

.fix22t-mock-implementation .sidebar-total-focus.fix22n-primary-total strong {
    font-size: 18px !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-variant-numeric: tabular-nums !important;
}

.fix22t-mock-implementation .payment-mini-summary,
.fix22t-mock-implementation .fix21-summary-status-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 40px !important;
    padding: 8px 12px !important;
    border-bottom: 1px solid #edf2f7 !important;
}

.fix22t-mock-implementation .payment-mini-summary span,
.fix22t-mock-implementation .fix21-summary-status-row span {
    color: #334155 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

.fix22t-mock-implementation .payment-mini-summary strong,
.fix22t-mock-implementation .fix21-summary-status-row strong {
    color: #0f172a !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
}

.fix22t-mock-implementation .fix22o-paid-row strong {
    color: #0f7a34 !important;
}
.fix22t-mock-implementation #BalanceDueDisplay.is-due {
    color: #d90445 !important;
}
.fix22t-mock-implementation #BalanceDueDisplay.is-zero {
    color: #0f7a34 !important;
}
.fix22t-mock-implementation #Fix21DepositHeld {
    color: #0b3b74 !important;
}

.fix22t-mock-implementation .fix22n-net-due-card {
    min-height: 84px !important;
    padding: 12px !important;
    border-radius: 10px !important;
    border-left: 0 !important;
    background: #dff4e8 !important;
    border: 1px solid #b8e6c6 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 4px 10px !important;
    align-items: center !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .06) !important;
}

.fix22t-mock-implementation .fix22n-net-due-card span {
    grid-column: 1 !important;
    color: #334155 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
}

.fix22t-mock-implementation .fix22n-net-due-card strong {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    color: #0f7a34 !important;
    font-size: 18px !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
}

.fix22t-mock-implementation .fix22n-net-due-card small {
    grid-column: 1 !important;
    color: #4b5563 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
}

.fix22t-mock-implementation .fix22n-net-due-card.is-due {
    background: #fce7ec !important;
    border-color: #f4bfd0 !important;
}
.fix22t-mock-implementation .fix22n-net-due-card.is-due strong {
    color: #d90445 !important;
}

/* Make the main active panels feel like the mock: lighter, tighter, easier to scan. */
.fix22t-mock-implementation .fix22b-cv-card,
.fix22t-mock-implementation .compact-options-grid.fix22k-option-list,
.fix22t-mock-implementation .fix22k-doc-status-grid,
.fix22t-mock-implementation .fix22g-receipt-print-card,
.fix22t-mock-implementation .fix22k-documents-block,
.fix22t-mock-implementation .fix21-closeout-grid,
.fix22t-mock-implementation .post-payment-card {
    min-width: 0 !important;
}

.fix22t-mock-implementation .fix22k-option-row,
.fix22t-mock-implementation .compact-option-card {
    grid-template-columns: minmax(220px, 1fr) 120px 96px !important;
    min-height: 44px !important;
    padding: 8px 10px !important;
}

.fix22t-mock-implementation .fix22k-option-row .option-title {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    font-weight: 850 !important;
    line-height: 1.15 !important;
}

.fix22t-mock-implementation .document-status-grid,
.fix22t-mock-implementation .fix22k-doc-status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

.fix22t-mock-implementation .document-status-card,
.fix22t-mock-implementation .fix22k-doc-card {
    min-height: 62px !important;
    padding: 10px !important;
}

.fix22t-mock-implementation .payment-choice-grid.compact-payment-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

.fix22t-mock-implementation .payment-history-table tbody tr td,
.fix22t-mock-implementation .compact-history-table tbody tr td {
    padding-top: 9px !important;
    padding-bottom: 9px !important;
}

/* Responsive fallback */
@media (max-width: 1380px) {
    .fix22t-mock-implementation .workflow-vertical-rail {
        display: none !important;
    }
    .fix22t-mock-implementation #rentalOrderForm {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

@media (max-width: 1080px) {
    .fix22t-mock-implementation .order-layout-grid,
    .fix22t-mock-implementation .order-layout-grid.fix18-two-column-layout {
        grid-template-columns: 1fr !important;
    }
    .fix22t-mock-implementation .total-sidebar.fix22n-financial-sidebar {
        position: static !important;
        width: auto !important;
        min-width: 0 !important;
        max-height: none !important;
    }
}

/* =========================================================
   Fix 22U - Mock screen fidelity pass
   - Fix left workflow rail overlap/clipping
   - Add taxes expandable inside Order Summary
   - Make Payments tab match the mock with two primary actions only
   - Make Documents tab match the mock checklist/table pattern
   ========================================================= */
.fix22u-mock-tabs {
    --fix22u-rail-top-buffer: 86px;
}

/* Issue 1: the rail was starting behind the sticky header. Push it below the tabs and make it opaque. */
.fix22u-mock-tabs .workflow-vertical-rail {
    top: calc(var(--fix22t-nav-offset) + var(--fix22t-header-h) + var(--fix22t-summary-h) + var(--fix22t-tabs-h) + var(--fix22u-rail-top-buffer)) !important;
    z-index: 610 !important;
    filter: none !important;
    backdrop-filter: none !important;
    opacity: 1 !important;
}

.fix22u-mock-tabs .workflow-vertical-rail .workflow-step {
    overflow: visible !important;
    isolation: isolate !important;
}

.fix22u-mock-tabs .workflow-vertical-rail .workflow-step * {
    filter: none !important;
    text-shadow: none !important;
}

/* Order Summary tax calculation expander, inside the visible summary card. */
.fix22u-mock-tabs .mock-order-tax-details {
    border-top: 1px solid #e8eef6 !important;
    background: #fff !important;
}

.fix22u-mock-tabs .mock-order-tax-details > summary {
    min-height: 38px !important;
    padding: 8px 12px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
    align-items: center !important;
    cursor: pointer !important;
    list-style: none !important;
}

.fix22u-mock-tabs .mock-order-tax-details > summary::-webkit-details-marker { display: none !important; }

.fix22u-mock-tabs .mock-order-tax-details > summary span {
    font-size: 12px !important;
    color: #0f172a !important;
    font-weight: 900 !important;
}

.fix22u-mock-tabs .mock-order-tax-details > summary span::after {
    content: ' ▾';
    color: #0b6ef6;
    font-weight: 900;
}

.fix22u-mock-tabs .mock-order-tax-details[open] > summary span::after {
    content: ' ▴';
}

.fix22u-mock-tabs .mock-order-tax-details > summary strong,
.fix22u-mock-tabs .mock-tax-detail-grid strong {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-variant-numeric: tabular-nums !important;
    font-weight: 900 !important;
    text-align: right !important;
}

.fix22u-mock-tabs .mock-tax-detail-grid {
    padding: 4px 12px 10px !important;
    display: grid !important;
    gap: 0 !important;
}

.fix22u-mock-tabs .mock-tax-detail-grid > div {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 10px !important;
    min-height: 28px !important;
    align-items: center !important;
    border-top: 1px solid #eef2f7 !important;
}

.fix22u-mock-tabs .mock-tax-detail-grid span {
    color: #475569 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
}

.fix22u-mock-tabs .mock-tax-total {
    margin-top: 4px !important;
    padding-top: 4px !important;
    border-top: 2px solid #dbeafe !important;
}

/* Payment tab: mock-style white card, compact fields, only Post Payment + Refund Deposit. */
.fix22u-mock-tabs [data-task-panel="payment"] .payment-choice-grid {
    margin-bottom: 10px !important;
}

.fix22u-mock-tabs .payment-processing-panel.compact-payment-panel {
    border: 1px solid #dbe3ef !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    padding: 22px 24px 20px !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .08) !important;
}

.fix22u-mock-tabs .payment-processing-panel .submodule-header {
    display: block !important;
    border-bottom: 1px solid #cfd8e3 !important;
    margin: 0 0 16px !important;
    padding: 0 0 12px !important;
}

.fix22u-mock-tabs .payment-processing-panel .submodule-header h2 {
    margin: 0 !important;
    font-size: 20px !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
    color: #0f172a !important;
}

.fix22u-mock-tabs .payment-processing-panel .submodule-header span {
    display: none !important;
}

.fix22u-mock-tabs .payment-processing-panel .payment-inline-note {
    display: none !important;
}

.fix22u-mock-tabs .payment-entry-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px 18px !important;
}

.fix22u-mock-tabs .payment-entry-grid .field-stack label {
    font-size: 12px !important;
    color: #0f172a !important;
    font-weight: 900 !important;
    letter-spacing: .01em !important;
    text-transform: none !important;
}

.fix22u-mock-tabs .payment-entry-grid input,
.fix22u-mock-tabs .payment-entry-grid select {
    height: 38px !important;
    min-height: 38px !important;
    border-radius: 6px !important;
    border: 1px solid #cfd8e3 !important;
    background: #ffffff !important;
    font-size: 14px !important;
    color: #0f172a !important;
}

.fix22u-mock-tabs .mock-payment-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 12px !important;
    justify-content: end !important;
    margin-top: 18px !important;
    max-width: 420px !important;
    margin-left: auto !important;
}

.fix22u-mock-tabs .mock-payment-actions .mock-post-payment,
.fix22u-mock-tabs .mock-payment-actions .mock-refund-deposit {
    min-height: 42px !important;
    height: 42px !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 900 !important;
}

.fix22u-mock-tabs .mock-payment-actions .mock-post-payment {
    background: #0b6ef6 !important;
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(11, 110, 246, .24) !important;
}

.fix22u-mock-tabs .mock-payment-actions .mock-refund-deposit {
    background: #0aa65b !important;
    color: #ffffff !important;
    border: 0 !important;
    box-shadow: 0 8px 18px rgba(10, 166, 91, .22) !important;
}

.fix22u-mock-tabs .payment-history-toolbar {
    margin-top: 16px !important;
    padding-top: 12px !important;
    border-top: 1px solid #edf2f7 !important;
}

/* Documents tab: mock checklist rows with status badges and one upload action row. */
.fix22u-mock-tabs .mock-documents-panel {
    border: 1px solid #dbe3ef !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    padding: 14px 16px !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .08) !important;
}

.fix22u-mock-tabs .mock-documents-list {
    display: grid !important;
    gap: 0 !important;
    border-top: 1px solid #e2e8f0 !important;
}

.fix22u-mock-tabs .mock-document-row {
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr) 122px 26px !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 42px !important;
    padding: 7px 4px !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

.fix22u-mock-tabs .mock-doc-check input {
    width: 16px !important;
    height: 16px !important;
    accent-color: #0b6ef6 !important;
}

.fix22u-mock-tabs .mock-doc-name {
    color: #0f172a !important;
    font-size: 13px !important;
    font-weight: 850 !important;
}

.fix22u-mock-tabs .mock-doc-badge {
    justify-self: end !important;
    min-width: 96px !important;
    padding: 4px 10px !important;
    border-radius: 6px !important;
    text-align: center !important;
    font-size: 12px !important;
    font-weight: 900 !important;
}

.fix22u-mock-tabs .mock-document-row.is-uploaded .mock-doc-badge {
    background: #dcfce7 !important;
    color: #166534 !important;
}

.fix22u-mock-tabs .mock-document-row.is-missing .mock-doc-badge {
    background: #fef3c7 !important;
    color: #b45309 !important;
}

.fix22u-mock-tabs .mock-doc-mark {
    justify-self: center !important;
    color: #166534 !important;
    font-weight: 900 !important;
}

.fix22u-mock-tabs .mock-document-row.is-missing .mock-doc-mark {
    color: #b45309 !important;
}

.fix22u-mock-tabs .mock-upload-strip {
    display: grid !important;
    grid-template-columns: 180px minmax(160px, 1fr) minmax(180px, 1fr) 190px !important;
    gap: 10px !important;
    align-items: end !important;
    margin-top: 12px !important;
    padding-top: 12px !important;
}

.fix22u-mock-tabs .mock-upload-strip label {
    font-size: 11px !important;
    font-weight: 900 !important;
    color: #475569 !important;
}

.fix22u-mock-tabs .mock-upload-strip input,
.fix22u-mock-tabs .mock-upload-strip select {
    height: 36px !important;
    min-height: 36px !important;
    border-radius: 6px !important;
}

.fix22u-mock-tabs .mock-upload-button {
    height: 38px !important;
    min-height: 38px !important;
    border-radius: 7px !important;
    background: #0b6ef6 !important;
    color: #ffffff !important;
    font-weight: 900 !important;
}

.fix22u-mock-tabs .mock-document-history {
    margin-top: 10px !important;
    border: 1px solid #e8eef6 !important;
    border-radius: 8px !important;
    background: #f8fafc !important;
}

.fix22u-mock-tabs .mock-document-history > summary {
    cursor: pointer !important;
    padding: 8px 10px !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    color: #334155 !important;
}

@media (max-width: 1260px) {
    .fix22u-mock-tabs .payment-entry-grid,
    .fix22u-mock-tabs .mock-upload-strip {
        grid-template-columns: 1fr 1fr !important;
    }
    .fix22u-mock-tabs .mock-payment-actions {
        max-width: none !important;
    }
}

/* =========================================================
   Fix 22V - New Rental Order Mock Visual Formatting
   Applies the Edit Rental Order mock visual language to Create/New Rental Order.
   ========================================================= */
.fix22v-new-rental-mock {
    --fix22v-nav-offset: 58px;
    --fix22v-header-h: 66px;
    --fix22v-summary-h: 36px;
    --fix22v-tabs-h: 42px;
    --fix22v-sidebar-width: 260px;
}

.fix22v-new-rental-mock .new-rental-sticky-shell {
    position: sticky;
    top: var(--fix22v-nav-offset);
    z-index: 910;
    border-radius: 14px;
    overflow: visible;
    box-shadow: 0 14px 30px rgba(15, 23, 42, .14);
    margin-bottom: 16px;
}

.fix22v-new-rental-mock .order-page-header {
    min-height: var(--fix22v-header-h) !important;
    margin: 0 !important;
    padding: 12px 18px !important;
    border-radius: 14px 14px 0 0 !important;
    background: linear-gradient(135deg, #0f2b6f 0%, #0b63f6 78%, #05b6d6 100%) !important;
    box-shadow: none !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) auto !important;
    align-items: center !important;
}

.fix22v-new-rental-mock .order-page-header h1 {
    margin: 2px 0 0 !important;
    font-size: 22px !important;
    line-height: 1.05 !important;
}

.fix22v-new-rental-mock .order-page-header .eyebrow {
    font-size: 9px !important;
    letter-spacing: .14em !important;
    margin: 0 !important;
}

.fix22v-new-rental-mock .order-status-stack {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.fix22v-new-rental-mock .order-status-stack .status-badge,
.fix22v-new-rental-mock .order-id-pill {
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 14px !important;
    border-radius: 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 12px !important;
}

.fix22v-new-summary-bar {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    height: var(--fix22v-summary-h);
    min-height: var(--fix22v-summary-h);
    padding: 5px 10px;
    background: #f8fbff;
    border-left: 1px solid #e5edf7;
    border-right: 1px solid #e5edf7;
}

.fix22v-new-summary-metric {
    border-radius: 8px;
    padding: 3px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-weight: 900;
}

.fix22v-new-summary-metric span {
    font-size: 10px;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.fix22v-new-summary-metric strong {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

.fix22v-new-summary-metric.is-total { background: #dff4e8; color: #0f7a34; }
.fix22v-new-summary-metric.is-deposit { background: #dfeff2; color: #0b3b74; }
.fix22v-new-summary-metric.is-status { background: #eef2ff; color: #1d4ed8; }

.fix22v-new-tabs {
    height: var(--fix22v-tabs-h);
    min-height: var(--fix22v-tabs-h);
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 10px;
    background: #fff;
    border: 1px solid #e5edf7;
    border-top: 0;
    border-radius: 0 0 14px 14px;
}

.fix22v-new-tab {
    border: 0;
    background: transparent;
    color: #334155;
    min-height: 30px;
    height: 30px;
    padding: 0 14px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
}

.fix22v-new-tab:hover { background: #eff6ff; color: #0b63f6; }
.fix22v-new-tab.is-active { background: #0b6ef6; color: #fff; box-shadow: 0 8px 16px rgba(11,110,246,.24); }

.fix22v-new-rental-mock #NewRentalTaskPanels[data-active-task="details"] [data-new-task-panel]:not([data-new-task-panel="details"]),
.fix22v-new-rental-mock #NewRentalTaskPanels[data-active-task="return"] [data-new-task-panel]:not([data-new-task-panel="return"]),
.fix22v-new-rental-mock #NewRentalTaskPanels[data-active-task="options"] [data-new-task-panel]:not([data-new-task-panel="options"]),
.fix22v-new-rental-mock #NewRentalTaskPanels[data-active-task="payment"] [data-new-task-panel]:not([data-new-task-panel="payment"]),
.fix22v-new-rental-mock #NewRentalTaskPanels[data-active-task="notes"] [data-new-task-panel]:not([data-new-task-panel="notes"]) {
    display: none !important;
}

.fix22v-new-rental-mock .order-layout-grid {
    grid-template-columns: minmax(0, 1fr) var(--fix22v-sidebar-width) !important;
    gap: 18px !important;
    align-items: start !important;
    margin-top: 14px !important;
}

.fix22v-new-rental-mock .ro-collapsible-section {
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: 0 10px 22px rgba(15,23,42,.08) !important;
}

.fix22v-new-rental-mock .ro-collapsible-section > summary {
    min-height: 42px !important;
    padding: 10px 14px !important;
    background: #fff !important;
    border-bottom: 1px solid #e5edf7 !important;
}

.fix22v-new-rental-mock .ro-collapsible-section > summary span {
    font-size: 16px !important;
    font-weight: 950 !important;
    color: #0f172a !important;
}

.fix22v-new-rental-mock .ro-collapsible-section > summary small {
    color: #64748b !important;
    font-size: 12px !important;
    font-weight: 750 !important;
}

.fix22v-new-rental-mock .ro-section-body {
    padding: 14px !important;
}

/* New order: Customer & Vehicle should read like the Edit mock, not a stretched form. */
.fix22v-new-rental-mock .dual-info-grid {
    display: grid !important;
    grid-template-columns: minmax(240px, .8fr) minmax(0, 1.2fr) !important;
    gap: 14px !important;
}

.fix22v-new-rental-mock .info-panel,
.fix22v-new-rental-mock .vehicle-card-modern {
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    background: #ffffff !important;
    padding: 14px !important;
}

.fix22v-new-rental-mock .panel-title {
    font-size: 11px !important;
    font-weight: 950 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: #475569 !important;
    margin-bottom: 10px !important;
}

.fix22v-new-rental-mock .readonly-line {
    display: grid !important;
    grid-template-columns: minmax(90px, .8fr) minmax(0, 1fr) !important;
    gap: 8px !important;
    min-height: 34px !important;
    align-items: center !important;
    border-bottom: 1px solid #eef2f7 !important;
}

.fix22v-new-rental-mock .readonly-line span {
    color: #475569 !important;
    font-weight: 800 !important;
    font-size: 12px !important;
}

.fix22v-new-rental-mock .readonly-line strong {
    color: #0f172a !important;
    font-weight: 900 !important;
    text-align: right !important;
}

.fix22v-new-rental-mock .vehicle-card-header {
    align-items: start !important;
    gap: 12px !important;
}

.fix22v-new-rental-mock .vehicle-title {
    color: #0f172a !important;
    font-size: 17px !important;
    line-height: 1.15 !important;
    white-space: normal !important;
}

.fix22v-new-rental-mock .vehicle-rate-pair {
    display: flex !important;
    gap: 8px !important;
    flex: 0 0 auto !important;
}

.fix22v-new-rental-mock .vehicle-rate-box {
    width: 112px !important;
    min-width: 112px !important;
    padding: 8px 10px !important;
    min-height: 48px !important;
    border-radius: 10px !important;
}

.fix22v-new-rental-mock .vehicle-rate-box span {
    font-size: 10px !important;
    font-weight: 900 !important;
}

.fix22v-new-rental-mock .vehicle-rate-box input {
    font-size: 14px !important;
    font-weight: 950 !important;
    text-align: right !important;
}

.fix22v-new-rental-mock .feature-chip {
    min-height: 30px !important;
    border-radius: 999px !important;
    padding: 5px 10px !important;
    background: #f8fafc !important;
    border: 1px solid #dbeafe !important;
}

.fix22v-new-rental-mock .field-stack input,
.fix22v-new-rental-mock .field-stack select,
.fix22v-new-rental-mock .summary-line input,
.fix22v-new-rental-mock .grand-total-line input {
    min-height: 36px !important;
    height: 36px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
}

.fix22v-new-rental-mock .date-pair-grid {
    grid-template-columns: repeat(4, minmax(130px, 1fr)) !important;
    gap: 10px !important;
}
.fix22v-new-rental-mock .discount-date-row { grid-column: span 2 !important; }
.fix22v-new-rental-mock .duration-date-row { align-self: end !important; }

.fix22v-new-rental-mock .compact-options-grid,
.fix22v-new-rental-mock .fix22k-option-list {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
}

.fix22v-new-rental-mock .compact-option-card,
.fix22v-new-rental-mock .fix22k-option-row {
    display: grid !important;
    grid-template-columns: minmax(230px, 1fr) 130px 100px !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 44px !important;
    padding: 8px 10px !important;
    border-radius: 10px !important;
}

.fix22v-new-rental-mock .payment-choice-grid.compact-payment-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

.fix22v-new-rental-mock .option-choice-card {
    min-height: 54px !important;
    padding: 9px 10px !important;
    border-radius: 10px !important;
}

.fix22v-new-rental-mock .payment-inline-note {
    margin-top: 12px !important;
    border-radius: 10px !important;
    font-size: 12px !important;
}

/* Mock-style compact right summary for new orders. */
.fix22v-new-rental-mock .total-sidebar {
    position: sticky !important;
    top: calc(var(--fix22v-nav-offset) + var(--fix22v-header-h) + var(--fix22v-summary-h) + var(--fix22v-tabs-h) + 18px) !important;
    width: var(--fix22v-sidebar-width) !important;
    min-width: var(--fix22v-sidebar-width) !important;
}

.fix22v-new-rental-mock .total-card {
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 10px 22px rgba(15,23,42,.10) !important;
    border: 1px solid #dbe3ef !important;
}

.fix22v-new-rental-mock .section-heading {
    min-height: 40px !important;
    padding: 10px 12px !important;
    background: #ffffff !important;
    border-bottom: 1px solid #e5edf7 !important;
    color: #0f172a !important;
    font-weight: 950 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

.fix22v-new-rental-mock .sidebar-total-focus {
    margin: 0 !important;
    padding: 10px 12px !important;
    min-height: 44px !important;
    border-radius: 0 !important;
    background: linear-gradient(135deg, #0c63ff 0%, #0058d9 100%) !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    align-items: center !important;
}

.fix22v-new-rental-mock .sidebar-total-focus span,
.fix22v-new-rental-mock .sidebar-total-focus strong {
    color: #ffffff !important;
}

.fix22v-new-rental-mock .sidebar-total-focus strong {
    font-size: 18px !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
}

.fix22v-new-rental-mock .summary-line,
.fix22v-new-rental-mock .grand-total-line {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 96px !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 36px !important;
    padding: 7px 12px !important;
    border-bottom: 1px solid #eef2f7 !important;
}

.fix22v-new-rental-mock .summary-line label,
.fix22v-new-rental-mock .grand-total-line label {
    font-size: 11px !important;
    font-weight: 850 !important;
    color: #334155 !important;
}

.fix22v-new-rental-mock .summary-line input,
.fix22v-new-rental-mock .grand-total-line input {
    width: 96px !important;
    max-width: 96px !important;
    text-align: right !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-weight: 850 !important;
}

.fix22v-new-rental-mock .bottom-action-bar {
    margin-top: 18px !important;
    justify-content: flex-end !important;
    gap: 10px !important;
}

@media (max-width: 1100px) {
    .fix22v-new-rental-mock .order-layout-grid {
        grid-template-columns: 1fr !important;
    }
    .fix22v-new-rental-mock .total-sidebar {
        position: static !important;
        width: auto !important;
        min-width: 0 !important;
    }
    .fix22v-new-rental-mock .dual-info-grid,
    .fix22v-new-rental-mock .date-pair-grid,
    .fix22v-new-rental-mock .payment-choice-grid.compact-payment-grid {
        grid-template-columns: 1fr !important;
    }
}

/* =========================================================
   Fix 22W - Clean workspace visual repair
   - Reduce visual clutter and screen length on New Rental Order
   - Fix Edit Rental Order rail/message overlap
   - Keep active work content readable and avoid oversized right sidebar
   ========================================================= */
.fix22w-clean-workspace {
    max-width: 1420px !important;
}

/* Message bars should not sit under the left rail on Edit screens. */
.fix22w-clean-workspace.fix22t-mock-implementation .hcr-message,
.fix22w-clean-workspace.fix22u-mock-tabs .hcr-message,
.fix22w-clean-workspace.fix22t-mock-implementation .hcr-error,
.fix22w-clean-workspace.fix22u-mock-tabs .hcr-error {
    margin-left: var(--fix22t-form-shift, 146px) !important;
    width: calc(100% - var(--fix22t-form-shift, 146px)) !important;
    box-sizing: border-box !important;
}

/* The left rail was covering the green message and first content card. Move it into the working zone. */
.fix22w-clean-workspace.fix22t-mock-implementation .workflow-vertical-rail,
.fix22w-clean-workspace.fix22u-mock-tabs .workflow-vertical-rail {
    top: calc(var(--fix22t-nav-offset, 58px) + var(--fix22t-header-h, 64px) + var(--fix22t-summary-h, 34px) + var(--fix22t-tabs-h, 40px) + 64px) !important;
    z-index: 540 !important;
}

/* Make disabled workflow items readable, not washed out white-on-white. */
.fix22w-clean-workspace.fix22t-mock-implementation .workflow-vertical-rail .workflow-step.is-disabled,
.fix22w-clean-workspace.fix22u-mock-tabs .workflow-vertical-rail .workflow-step.is-disabled {
    opacity: 1 !important;
    background: #eef2f7 !important;
    box-shadow: 0 6px 14px rgba(15,23,42,.08) !important;
}
.fix22w-clean-workspace.fix22t-mock-implementation .workflow-vertical-rail .workflow-step.is-disabled span,
.fix22w-clean-workspace.fix22t-mock-implementation .workflow-vertical-rail .workflow-step.is-disabled small,
.fix22w-clean-workspace.fix22u-mock-tabs .workflow-vertical-rail .workflow-step.is-disabled span,
.fix22w-clean-workspace.fix22u-mock-tabs .workflow-vertical-rail .workflow-step.is-disabled small {
    color: #475569 !important;
    opacity: 1 !important;
}
.fix22w-clean-workspace.fix22t-mock-implementation .workflow-vertical-rail .workflow-step.is-disabled strong,
.fix22w-clean-workspace.fix22u-mock-tabs .workflow-vertical-rail .workflow-step.is-disabled strong {
    background: #c7d2fe !important;
    color: #334155 !important;
}

/* New Rental Order: compact enterprise workspace, not a long form. */
.fix22w-clean-workspace.fix22v-new-rental-mock {
    --fix22w-new-header-h: 58px;
    --fix22w-new-summary-h: 32px;
    --fix22w-new-tabs-h: 38px;
    --fix22w-new-sidebar-width: 230px;
}

.fix22w-clean-workspace.fix22v-new-rental-mock .new-rental-sticky-shell {
    margin-bottom: 10px !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 20px rgba(15,23,42,.12) !important;
    overflow: hidden !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock .order-page-header {
    min-height: var(--fix22w-new-header-h) !important;
    height: var(--fix22w-new-header-h) !important;
    padding: 8px 16px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .order-page-header h1 {
    font-size: 19px !important;
    line-height: 1 !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .order-page-header .eyebrow {
    font-size: 8.5px !important;
    line-height: 1 !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .order-status-stack .status-badge,
.fix22w-clean-workspace.fix22v-new-rental-mock .order-id-pill {
    height: 28px !important;
    min-height: 28px !important;
    padding: 0 11px !important;
    font-size: 11px !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock .fix22v-new-summary-bar {
    height: var(--fix22w-new-summary-h) !important;
    min-height: var(--fix22w-new-summary-h) !important;
    padding: 4px 8px !important;
    gap: 6px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .fix22v-new-summary-metric {
    min-height: 22px !important;
    height: 22px !important;
    padding: 2px 8px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .fix22v-new-summary-metric span {
    font-size: 9px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .fix22v-new-summary-metric strong {
    font-size: 12px !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock .fix22v-new-tabs {
    height: var(--fix22w-new-tabs-h) !important;
    min-height: var(--fix22w-new-tabs-h) !important;
    padding: 4px 8px !important;
    gap: 6px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .fix22v-new-tab {
    min-height: 26px !important;
    height: 26px !important;
    padding: 0 12px !important;
    font-size: 11px !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock .hcr-message,
.fix22w-clean-workspace.fix22v-new-rental-mock .hcr-error {
    margin: 8px 0 10px !important;
    min-height: 34px !important;
    padding: 8px 12px !important;
    border-radius: 10px !important;
    font-size: 13px !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock .order-layout-grid {
    grid-template-columns: minmax(0, 1fr) var(--fix22w-new-sidebar-width) !important;
    gap: 14px !important;
    margin-top: 10px !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock .ro-collapsible-section {
    border-radius: 12px !important;
    box-shadow: 0 6px 16px rgba(15,23,42,.07) !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .ro-collapsible-section > summary {
    min-height: 36px !important;
    height: 36px !important;
    padding: 7px 12px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .ro-collapsible-section > summary span {
    font-size: 14px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .ro-collapsible-section > summary small {
    font-size: 11px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .ro-section-body {
    padding: 12px !important;
}

/* New Rental Details: make the Customer/Vehicle card shorter. */
.fix22w-clean-workspace.fix22v-new-rental-mock .dual-info-grid {
    grid-template-columns: minmax(220px, .75fr) minmax(0, 1.25fr) !important;
    gap: 12px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .info-panel,
.fix22w-clean-workspace.fix22v-new-rental-mock .vehicle-card-modern {
    padding: 12px !important;
    border-radius: 10px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .readonly-line {
    min-height: 29px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .panel-title {
    margin-bottom: 8px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .vehicle-card-header {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .vehicle-rate-box {
    width: 96px !important;
    min-width: 96px !important;
    min-height: 42px !important;
    padding: 6px 8px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .vehicle-title {
    font-size: 15px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .feature-chip {
    min-height: 26px !important;
    padding: 4px 8px !important;
}

/* Dates should be one compact grid, not vertical. */
.fix22w-clean-workspace.fix22v-new-rental-mock .date-pair-grid {
    grid-template-columns: repeat(4, minmax(120px, 1fr)) !important;
    gap: 9px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .field-stack input,
.fix22w-clean-workspace.fix22v-new-rental-mock .field-stack select,
.fix22w-clean-workspace.fix22v-new-rental-mock .summary-line input,
.fix22w-clean-workspace.fix22v-new-rental-mock .grand-total-line input {
    min-height: 32px !important;
    height: 32px !important;
    font-size: 12px !important;
}

/* New options/payment cards: shorter and consistent. */
.fix22w-clean-workspace.fix22v-new-rental-mock .compact-option-card,
.fix22w-clean-workspace.fix22v-new-rental-mock .fix22k-option-row {
    min-height: 38px !important;
    padding: 6px 9px !important;
    grid-template-columns: minmax(190px, 1fr) 112px 86px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .payment-choice-grid.compact-payment-grid {
    gap: 8px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .option-choice-card {
    min-height: 44px !important;
    padding: 7px 9px !important;
}

/* New right sidebar: stop it from becoming a tall accounting form. Keep it as a compact summary. */
.fix22w-clean-workspace.fix22v-new-rental-mock .total-sidebar {
    top: calc(var(--fix22v-nav-offset) + var(--fix22w-new-header-h) + var(--fix22w-new-summary-h) + var(--fix22w-new-tabs-h) + 12px) !important;
    width: var(--fix22w-new-sidebar-width) !important;
    min-width: var(--fix22w-new-sidebar-width) !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .total-card {
    border-radius: 10px !important;
    box-shadow: 0 7px 16px rgba(15,23,42,.08) !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .section-heading {
    min-height: 36px !important;
    padding: 9px 11px !important;
    font-size: 13px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .sidebar-total-focus {
    min-height: 42px !important;
    padding: 9px 11px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .sidebar-total-focus strong {
    font-size: 17px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .total-card .summary-line {
    min-height: 30px !important;
    padding: 5px 11px !important;
    grid-template-columns: minmax(0, 1fr) 82px !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .total-card .summary-line input {
    width: 82px !important;
    max-width: 82px !important;
}
/* Hide lower accounting noise; values stay in hidden inputs and are still submitted/calculated. */
.fix22w-clean-workspace.fix22v-new-rental-mock .total-card .summary-line:nth-of-type(n+6) {
    display: none !important;
}
.fix22w-clean-workspace.fix22v-new-rental-mock .total-card .grand-total-line {
    display: none !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock .bottom-action-bar {
    margin-top: 12px !important;
    padding: 10px 0 !important;
}

@media (max-width: 1380px) {
    .fix22w-clean-workspace.fix22t-mock-implementation .workflow-vertical-rail,
    .fix22w-clean-workspace.fix22u-mock-tabs .workflow-vertical-rail {
        display: none !important;
    }
    .fix22w-clean-workspace.fix22t-mock-implementation #rentalOrderForm,
    .fix22w-clean-workspace.fix22u-mock-tabs #rentalOrderForm,
    .fix22w-clean-workspace.fix22t-mock-implementation .hcr-message,
    .fix22w-clean-workspace.fix22u-mock-tabs .hcr-message,
    .fix22w-clean-workspace.fix22t-mock-implementation .hcr-error,
    .fix22w-clean-workspace.fix22u-mock-tabs .hcr-error {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

@media (max-width: 1120px) {
    .fix22w-clean-workspace.fix22v-new-rental-mock .order-layout-grid,
    .fix22w-clean-workspace.fix22v-new-rental-mock .dual-info-grid,
    .fix22w-clean-workspace.fix22v-new-rental-mock .date-pair-grid,
    .fix22w-clean-workspace.fix22v-new-rental-mock .payment-choice-grid.compact-payment-grid {
        grid-template-columns: 1fr !important;
    }
    .fix22w-clean-workspace.fix22v-new-rental-mock .total-sidebar {
        position: static !important;
        width: auto !important;
        min-width: 0 !important;
    }
}


/* =========================================================
   FIX 23 - Stable Edit Rental Order layout recovery
   Scope: Edit Rental Order only. This override intentionally avoids
   older experimental width/positioning rules by targeting the new
   hcr-edit-stable-v1 class added to Views/RentalOrders/Edit.cshtml.
   ========================================================= */
.order-page-shell.hcr-edit-stable-v1 {
    width: min(100% - 48px, 1500px) !important;
    max-width: 1500px !important;
    margin: 60px auto 48px !important;
    padding: 18px 24px 28px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.order-page-shell.hcr-edit-stable-v1 #rentalOrderForm {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.order-page-shell.hcr-edit-stable-v1 .workflow-horizontal-panel,
.order-page-shell.hcr-edit-stable-v1 .workflow-vertical-rail {
    display: none !important;
}

.order-page-shell.hcr-edit-stable-v1 .rental-workflow-sticky-shell {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    margin: 0 0 22px !important;
    position: static !important;
    top: auto !important;
    z-index: 20 !important;
}

.order-page-shell.hcr-edit-stable-v1 .order-layout-grid.fix18-two-column-layout {
    display: grid !important;
    grid-template-columns: minmax(780px, 1fr) 300px !important;
    column-gap: 24px !important;
    row-gap: 18px !important;
    align-items: start !important;
    justify-content: center !important;
    width: min(100%, 1260px) !important;
    max-width: 1260px !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.order-page-shell.hcr-edit-stable-v1 .order-layout-grid.fix18-two-column-layout > .order-main-column#Fix20TaskPanels {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.order-page-shell.hcr-edit-stable-v1 .order-layout-grid.fix18-two-column-layout > aside.total-sidebar.fix22n-financial-sidebar {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 300px !important;
    min-width: 300px !important;
    max-width: 300px !important;
    position: sticky !important;
    top: 18px !important;
    align-self: start !important;
    transform: none !important;
    margin: 0 !important;
    left: auto !important;
    right: auto !important;
    z-index: 5 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.order-page-shell.hcr-edit-stable-v1 .total-sidebar.fix22n-financial-sidebar > :not(.sticky-total-card):not(.fix22n-net-due-card) {
    display: none !important;
}

.order-page-shell.hcr-edit-stable-v1 .total-sidebar.fix22n-financial-sidebar > .fix22n-net-due-card {
    order: -1 !important;
}

.order-page-shell.hcr-edit-stable-v1 .total-sidebar.fix22n-financial-sidebar > .sticky-total-card,
.order-page-shell.hcr-edit-stable-v1 .total-sidebar.fix22n-financial-sidebar > .fix22n-net-due-card,
.order-page-shell.hcr-edit-stable-v1 .total-sidebar.fix22n-financial-sidebar > .fix22n-card,
.order-page-shell.hcr-edit-stable-v1 .total-sidebar.fix22n-financial-sidebar > .total-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

.order-page-shell.hcr-edit-stable-v1 .order-main-column [data-task-panel] {
    display: none !important;
}
.order-page-shell.hcr-edit-stable-v1 .order-main-column[data-active-task="overview"] [data-task-panel="overview"],
.order-page-shell.hcr-edit-stable-v1 .order-main-column[data-active-task="return"] [data-task-panel="return"],
.order-page-shell.hcr-edit-stable-v1 .order-main-column[data-active-task="options"] [data-task-panel="options"],
.order-page-shell.hcr-edit-stable-v1 .order-main-column[data-active-task="payment"] [data-task-panel="payment"],
.order-page-shell.hcr-edit-stable-v1 .order-main-column[data-active-task="deposit"] [data-task-panel="deposit"],
.order-page-shell.hcr-edit-stable-v1 .order-main-column[data-active-task="notes"] [data-task-panel="notes"] {
    display: block !important;
}

.order-page-shell.hcr-edit-stable-v1 .ro-collapsible-section {
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 16px !important;
    border: 1px solid #D7E2EF !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .08) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

.order-page-shell.hcr-edit-stable-v1 .ro-collapsible-section > summary {
    min-height: 50px !important;
    padding: 13px 18px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 16px !important;
    align-items: center !important;
    background: #fff !important;
    cursor: default !important;
    border-bottom: 1px solid #E5EDF6 !important;
}
.order-page-shell.hcr-edit-stable-v1 .ro-collapsible-section > summary::-webkit-details-marker { display: none !important; }
.order-page-shell.hcr-edit-stable-v1 .ro-collapsible-section > summary::marker { content: "" !important; }
.order-page-shell.hcr-edit-stable-v1 .ro-collapsible-section > summary span {
    font-size: 18px !important;
    font-weight: 900 !important;
    color: #0F172A !important;
    line-height: 1.15 !important;
}
.order-page-shell.hcr-edit-stable-v1 .ro-collapsible-section > summary small {
    color: #64748B !important;
    font-size: 12.5px !important;
    font-weight: 750 !important;
    text-align: right !important;
    line-height: 1.25 !important;
}
.order-page-shell.hcr-edit-stable-v1 .ro-section-body {
    padding: 16px 18px 18px !important;
}

/* Customer & Vehicle card: stable, two real columns, no overlapping text. */
.order-page-shell.hcr-edit-stable-v1 .fix22b-customer-vehicle-body {
    padding: 16px 18px 18px !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-cv-card {
    display: grid !important;
    grid-template-columns: minmax(260px, 300px) minmax(0, 1fr) !important;
    gap: 24px !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    align-items: start !important;
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-cv-column {
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-vehicle-column {
    border-left: 1px solid #E2E8F0 !important;
    padding-left: 24px !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-cv-heading {
    color: #64748B !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
    margin: 0 0 10px !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-cv-name,
.order-page-shell.hcr-edit-stable-v1 .fix22b-vehicle-title {
    color: #0F172A !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1.22 !important;
    margin: 0 0 14px !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    overflow: visible !important;
    text-overflow: clip !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-customer-column .fix22b-info-row {
    display: grid !important;
    grid-template-columns: 88px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 34px !important;
    padding: 4px 0 !important;
    border-bottom: 1px solid #EEF3F8 !important;
    box-sizing: border-box !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-info-row span {
    color: #64748B !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-info-row strong {
    color: #0F172A !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    min-width: 0 !important;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-align: left !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-contact-actions {
    display: flex !important;
    gap: 10px !important;
    margin-top: 14px !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-action-chip {
    min-height: 34px !important;
    padding: 0 14px !important;
    border-radius: 9px !important;
    font-size: 13px !important;
    font-weight: 850 !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix22b-vehicle-meta-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px 12px !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-vehicle-meta-grid .fix22b-info-row {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 34px !important;
    padding: 4px 0 !important;
    border-bottom: 1px solid #EEF3F8 !important;
    box-sizing: border-box !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-vehicle-meta-grid .hcr-meta-plate,
.order-page-shell.hcr-edit-stable-v1 .fix22b-vehicle-meta-grid .hcr-meta-vin,
.order-page-shell.hcr-edit-stable-v1 .fix22b-vehicle-meta-grid .hcr-meta-mileage,
.order-page-shell.hcr-edit-stable-v1 .fix22b-vehicle-meta-grid .hcr-meta-specs {
    grid-column: 1 / -1 !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-vehicle-meta-grid .hcr-meta-rate,
.order-page-shell.hcr-edit-stable-v1 .fix22b-vehicle-meta-grid .hcr-meta-hourly {
    display: inline-flex !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    justify-self: stretch !important;
    gap: 7px !important;
    padding: 8px 12px !important;
    border: 1px solid #DCE7F3 !important;
    border-radius: 12px !important;
    background: #F8FAFC !important;
    white-space: nowrap !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-vehicle-meta-grid .hcr-meta-rate strong,
.order-page-shell.hcr-edit-stable-v1 .fix22b-vehicle-meta-grid .hcr-meta-hourly strong {
    overflow: visible !important;
    text-overflow: clip !important;
}
.order-page-shell.hcr-edit-stable-v1 .hcr-meta-mileage {
    width: fit-content !important;
    max-width: 100% !important;
    padding: 8px 12px !important;
    border: 1px solid #DCE7F3 !important;
    border-radius: 12px !important;
    background: #F8FAFC !important;
}
.order-page-shell.hcr-edit-stable-v1 .hcr-meta-specs strong {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px 14px !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
}
.order-page-shell.hcr-edit-stable-v1 .hcr-meta-specs strong > span {
    display: inline-flex !important;
    align-items: center !important;
    padding: 7px 12px !important;
    border: 1px solid #DCE7F3 !important;
    border-radius: 12px !important;
    background: #F8FAFC !important;
    color: #0F172A !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    white-space: nowrap !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-out-status-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin-top: 12px !important;
    padding-top: 12px !important;
    border-top: 1px solid #E2E8F0 !important;
}
.order-page-shell.hcr-edit-stable-v1 .fix22b-out-status-row div {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 8px 12px !important;
    border-radius: 12px !important;
    background: #F8FAFC !important;
    border: 1px solid #DCE7F3 !important;
}

/* Return/options/payment tab stability: enough horizontal space but no overflow. */
.order-page-shell.hcr-edit-stable-v1 .date-pair-grid {
    grid-template-columns: repeat(4, minmax(130px, 1fr)) !important;
    gap: 12px !important;
}
.order-page-shell.hcr-edit-stable-v1 .travel-out-state-card.fix22a-travel-actions {
    display: grid !important;
    grid-template-columns: minmax(220px, 1fr) minmax(260px, 1fr) !important;
    gap: 12px !important;
    align-items: center !important;
}
.order-page-shell.hcr-edit-stable-v1 .compact-options-grid,
.order-page-shell.hcr-edit-stable-v1 .payment-choice-grid,
.order-page-shell.hcr-edit-stable-v1 .submodule-form-grid,
.order-page-shell.hcr-edit-stable-v1 .document-upload-grid {
    min-width: 0 !important;
}

@media (max-width: 1320px) {
    .order-page-shell.hcr-edit-stable-v1 {
        width: min(100% - 28px, 1280px) !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    .order-page-shell.hcr-edit-stable-v1 .order-layout-grid.fix18-two-column-layout {
        grid-template-columns: minmax(0, 1fr) 300px !important;
        width: 100% !important;
    }
    .order-page-shell.hcr-edit-stable-v1 .fix22b-cv-card {
        grid-template-columns: minmax(240px, 285px) minmax(0, 1fr) !important;
        gap: 20px !important;
    }
}

@media (max-width: 1120px) {
    .order-page-shell.hcr-edit-stable-v1 .order-layout-grid.fix18-two-column-layout {
        grid-template-columns: 1fr !important;
        width: 100% !important;
    }
    .order-page-shell.hcr-edit-stable-v1 .order-layout-grid.fix18-two-column-layout > aside.total-sidebar.fix22n-financial-sidebar {
        grid-column: 1 !important;
        grid-row: auto !important;
        position: static !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }
    .order-page-shell.hcr-edit-stable-v1 .fix22b-cv-card,
    .order-page-shell.hcr-edit-stable-v1 .date-pair-grid,
    .order-page-shell.hcr-edit-stable-v1 .travel-out-state-card.fix22a-travel-actions {
        grid-template-columns: 1fr !important;
    }
    .order-page-shell.hcr-edit-stable-v1 .fix22b-vehicle-column {
        border-left: 0 !important;
        border-top: 1px solid #E2E8F0 !important;
        padding-left: 0 !important;
        padding-top: 16px !important;
    }
}

/* Phase 2 Dashboard Layout — approved dashboard shell and work-queue usability */
body {
    background: #08111F;
}

.hcr-app-shell {
    min-height: 100vh;
    display: flex;
    background: #08111F;
}

.hcr-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: 166px;
    min-height: 100vh;
    padding: 28px 14px 24px 14px;
    background: linear-gradient(180deg, #111B2F 0%, #101A2D 78%, #0E1728 100%);
    color: #FFFFFF;
    box-shadow: inset -1px 0 0 rgba(255,255,255,0.035);
    z-index: 220;
}

.hcr-sidebar-brand {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #FFFFFF;
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: .01em;
    margin: 0 0 32px 6px;
}
.hcr-sidebar-brand:hover,
.hcr-sidebar-brand:focus-visible {
    color: #FFFFFF;
    text-decoration: none;
}
.hcr-sidebar-logo {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 32px;
    border-radius: 999px;
    background: #FFFFFF;
    color: #182338;
    font-size: 10px;
    font-weight: 950;
    letter-spacing: -.06em;
}
.hcr-sidebar-brand-text {
    display: inline-block;
    font-size: 14px;
}

.hcr-sidebar-menu-button {
    width: 28px;
    height: 28px;
    margin: 0 0 24px 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: transparent;
    color: #FFFFFF;
    font-size: 17px;
    font-weight: 900;
    cursor: default;
}

.hcr-sidebar-nav {
    display: grid;
    gap: 13px;
    padding: 4px 0 0 20px;
}
.hcr-sidebar-nav a {
    color: #F1F5F9;
    font-size: 14px;
    font-weight: 850;
    line-height: 1;
    padding: 5px 0;
    border-radius: 8px;
}
.hcr-sidebar-nav a:hover,
.hcr-sidebar-nav a:focus-visible,
.hcr-sidebar-nav a.is-active {
    color: #FFFFFF;
    text-decoration: none;
}

.hcr-main-shell {
    min-height: 100vh;
    width: calc(100% - 166px);
    margin-left: 166px;
    background: #08111F;
}

.hcr-app-header {
    position: sticky;
    top: 0;
    z-index: 200;
    min-height: 60px;
    background: linear-gradient(90deg, #0B6EF6 0%, #0896F2 100%);
    color: #FFFFFF;
    box-shadow: 0 1px 0 rgba(255,255,255,0.10), 0 8px 26px rgba(0,0,0,0.20);
}
.hcr-header-inner {
    max-width: none;
    min-height: 60px;
    margin: 0;
    padding: 0 18px 0 42px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
}
.hcr-header-inner .hcr-brand,
.hcr-header-inner .hcr-brand::before {
    display: none;
}
.hcr-nav {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    flex-wrap: nowrap;
}
.hcr-nav a {
    color: #EAF6FF;
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    padding: 8px 10px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 750;
    white-space: nowrap;
}
.hcr-nav a:hover,
.hcr-nav a:focus-visible,
.hcr-nav a.is-active {
    color: #FFFFFF;
    background: rgba(255,255,255,0.10);
    text-decoration: none;
}
.hcr-user-area {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 800;
}
.hcr-user-avatar {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    background: rgba(255,255,255,0.18);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.16);
    font-size: 11px;
}
.hcr-user-name {
    white-space: nowrap;
}

.hcr-main-content,
main.hcr-main-content {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 50px 64px 56px 64px;
}

.hcr-dashboard-page {
    width: 100%;
}
.hcr-dashboard-window {
    max-width: 1236px;
    margin: 0 auto;
    padding: 20px;
    border-radius: 10px;
    border: 1px solid rgba(226,232,240,0.95);
    background: #FFFFFF;
    box-shadow: 0 20px 46px rgba(0,0,0,0.24);
    overflow: visible;
}
.hcr-dashboard-window .hcr-title-bar {
    border-radius: 9px 9px 0 0;
    padding: 21px 25px;
    background: linear-gradient(105deg, #101A34 0%, #173C92 56%, #126DF2 100%);
    font-size: 24px;
    font-weight: 900;
    letter-spacing: -.02em;
}
.hcr-dashboard-body {
    padding: 22px 26px 24px 26px;
}

.hcr-dashboard-kpi-grid,
.hcr-dashboard-window .hcr-kpi-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin: 0 0 12px 0;
}
.hcr-dashboard-window .hcr-kpi {
    min-height: 67px;
    padding: 13px 10px 10px 10px;
    border-radius: 7px;
    border: 1px solid #E7EEF8;
    background: #FFFFFF;
    box-shadow: 0 4px 12px rgba(15,23,42,0.06);
    text-align: center;
}
.hcr-dashboard-window .hcr-kpi-title {
    margin: 0;
    color: #697386;
    font-size: 12px;
    font-weight: 950;
    line-height: 1.15;
    text-transform: uppercase;
    letter-spacing: .035em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.hcr-dashboard-window .hcr-kpi-value {
    margin-top: 7px;
    color: #0B6EF6;
    font-size: 23px;
    line-height: 1;
    font-weight: 950;
}
.hcr-dashboard-window .hcr-kpi-due {
    background: #FFFBEA;
    border-left: 3px solid #F59E0B;
}
.hcr-dashboard-window .hcr-kpi-due .hcr-kpi-value { color: #F59E0B; }
.hcr-dashboard-window .hcr-kpi-overdue {
    background: #FFF1F2;
    border-left: 3px solid #F43F5E;
}
.hcr-dashboard-window .hcr-kpi-overdue .hcr-kpi-value { color: #E11D48; }
.hcr-dashboard-window .hcr-kpi-muted .hcr-kpi-value { color: #0B6EF6; }

.hcr-dashboard-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 10px 0 8px 0;
}
.hcr-dashboard-primary-actions,
.hcr-dashboard-filter-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.hcr-dashboard-primary-actions .hcr-button {
    min-height: 41px;
    min-width: 126px;
    padding: 10px 18px;
    border-radius: 5px;
    background: #0B7BF3;
    border: 1px solid #0B7BF3;
    color: #FFFFFF;
    box-shadow: 0 7px 14px rgba(11,111,246,0.18);
    font-size: 13px;
    font-weight: 850;
    justify-content: center;
}
.hcr-dashboard-primary-actions .hcr-button:hover,
.hcr-dashboard-primary-actions .hcr-button:focus-visible {
    background: #075FCB;
    border-color: #075FCB;
    color: #FFFFFF;
    text-decoration: none;
}

.hcr-dashboard-filter,
.hcr-dashboard-history-menu > summary {
    min-height: 41px;
    min-width: 91px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    border-radius: 5px;
    border: 1px solid #0B7BF3;
    background: #0B7BF3;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 850;
    line-height: 1;
    box-shadow: 0 7px 14px rgba(11,111,246,0.14);
    cursor: pointer;
    list-style: none;
    text-decoration: none;
}
.hcr-dashboard-filter:hover,
.hcr-dashboard-filter:focus-visible,
.hcr-dashboard-filter.is-active,
.hcr-dashboard-history-menu > summary:hover,
.hcr-dashboard-history-menu > summary:focus-visible {
    background: #075FCB;
    border-color: #075FCB;
    color: #FFFFFF;
    text-decoration: none;
}
.hcr-dashboard-history-menu {
    position: relative;
}
.hcr-dashboard-history-menu > summary::-webkit-details-marker { display: none; }
.hcr-dashboard-history-menu > summary::after {
    content: "▾";
    margin-left: 8px;
    font-size: 11px;
}
.hcr-dashboard-history-links {
    position: absolute;
    right: 0;
    top: calc(100% + 7px);
    min-width: 190px;
    z-index: 30;
    display: grid;
    gap: 4px;
    padding: 8px;
    border: 1px solid #D7E2F2;
    border-radius: 8px;
    background: #FFFFFF;
    box-shadow: 0 14px 30px rgba(15,23,42,0.16);
}
.hcr-dashboard-history-links a {
    padding: 9px 10px;
    color: #0F172A;
    border-radius: 6px;
    font-weight: 750;
}
.hcr-dashboard-history-links a:hover,
.hcr-dashboard-history-links a:focus-visible {
    background: #F1F5F9;
    text-decoration: none;
}

.hcr-dashboard-section-heading {
    margin: 8px 0 7px 0;
}
.hcr-dashboard-section-heading h3 {
    margin: 0 0 2px 0;
    color: #0B6EF6;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 900;
    letter-spacing: -.03em;
}
.hcr-dashboard-section-heading p {
    margin: 0;
    color: #6B7280;
    font-size: 12.5px;
}

.hcr-dashboard-table-wrap {
    margin-top: 8px;
    border: 1px solid #E9EFF7;
    border-radius: 6px;
    overflow: hidden;
    background: #FFFFFF;
}
.hcr-dashboard-table,
.hcr-dashboard-window .hcr-table {
    border: 0;
    border-radius: 0;
    border-collapse: collapse;
    font-size: 13px;
}
.hcr-dashboard-table thead tr,
.hcr-dashboard-window .hcr-table thead tr {
    background: #F1F5F9;
    height: 38px;
}
.hcr-dashboard-table th,
.hcr-dashboard-window .hcr-table th {
    padding: 11px 12px;
    color: #697386;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .04em;
    text-transform: uppercase;
    border-bottom: 1px solid #E9EFF7;
    white-space: nowrap;
}
.hcr-dashboard-table td,
.hcr-dashboard-window .hcr-table td {
    height: 61px;
    padding: 10px 12px;
    color: #4B5563;
    font-size: 13px;
    font-weight: 550;
    border-bottom: 1px solid #E9EFF7;
    vertical-align: middle;
}
.hcr-dashboard-table tbody tr:last-child td,
.hcr-dashboard-window .hcr-table tbody tr:last-child td {
    border-bottom: 0;
}
.hcr-dashboard-table tbody tr:hover,
.hcr-dashboard-window .hcr-table tbody tr:hover {
    background: #F8FBFF;
}

.hcr-dashboard-customer-link {
    color: #0B6EF6;
    font-weight: 900;
    text-decoration: none;
}

.hcr-dashboard-customer-link:hover,
.hcr-dashboard-customer-link:focus-visible {
    color: #075FCB;
    text-decoration: underline;
}
.hcr-dashboard-table th.orders-status-cell,
.hcr-dashboard-table td.orders-status-cell {
    width: 110px;
    text-align: center;
}
.hcr-dashboard-table .status-pill {
    min-width: 72px;
    min-height: 24px;
    padding: 5px 11px;
    font-size: 12px;
    font-weight: 900;
}
.return-date-pill {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    justify-content: center;
    padding: 6px 10px;
    border-radius: 5px;
    font-weight: 800;
    white-space: nowrap;
}
.return-date-pill.is-overdue {
    background: #FB6B6F;
    color: #FFFFFF;
}
.return-date-pill.is-due-today {
    background: #FDE68A;
    color: #713F12;
}
.dashboard-action-column,
.dashboard-action-cell {
    width: 190px;
    text-align: left;
}
.dashboard-action-buttons {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-wrap: nowrap;
}
.hcr-dashboard-row-action {
    min-height: 40px;
    min-width: 49px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 11px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none;
}
.hcr-dashboard-row-action.is-primary {
    background: #0B7BF3;
    color: #FFFFFF;
    border: 1px solid #0B7BF3;
    box-shadow: 0 6px 12px rgba(11,111,246,0.18);
}
.hcr-dashboard-row-action.is-secondary {
    background: #FFFFFF;
    color: #0B6EF6;
    border: 1px solid #94BFEA;
}
.hcr-dashboard-row-action:hover,
.hcr-dashboard-row-action:focus-visible {
    text-decoration: none;
    transform: translateY(-1px);
}
.hcr-dashboard-row-action.is-primary:hover,
.hcr-dashboard-row-action.is-primary:focus-visible {
    background: #075FCB;
    color: #FFFFFF;
}
.hcr-dashboard-row-action.is-secondary:hover,
.hcr-dashboard-row-action.is-secondary:focus-visible {
    background: #EFF6FF;
    color: #075FCB;
}
.hcr-empty-dashboard-message {
    height: 72px;
    text-align: center;
    color: #64748B !important;
    font-weight: 800 !important;
}

@media (max-width: 1180px) {
    .hcr-main-content,
    main.hcr-main-content { padding: 30px 28px 42px 28px; }
    .hcr-dashboard-kpi-grid,
    .hcr-dashboard-window .hcr-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .hcr-dashboard-toolbar { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 860px) {
    .hcr-sidebar {
        position: static;
        width: 100%;
        min-height: auto;
        padding: 14px 16px;
    }
    .hcr-sidebar-brand { margin-bottom: 10px; }
    .hcr-sidebar-menu-button { display: none; }
    .hcr-sidebar-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-left: 0; gap: 8px 14px; }
    .hcr-app-shell { display: block; }
    .hcr-main-shell { width: 100%; margin-left: 0; }
    .hcr-header-inner { padding: 10px 16px; justify-content: flex-start; flex-wrap: wrap; }
    .hcr-nav { justify-content: flex-start; flex-wrap: wrap; }
    .hcr-main-content,
    main.hcr-main-content { padding: 20px 14px 32px 14px; }
    .hcr-dashboard-window { padding: 12px; }
    .hcr-dashboard-body { padding: 16px 12px; }
    .hcr-dashboard-kpi-grid,
    .hcr-dashboard-window .hcr-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
    .hcr-dashboard-kpi-grid,
    .hcr-dashboard-window .hcr-kpi-grid { grid-template-columns: 1fr; }
    .hcr-dashboard-primary-actions,
    .hcr-dashboard-filter-actions { width: 100%; }
    .hcr-dashboard-primary-actions .hcr-button,
    .hcr-dashboard-filter,
    .hcr-dashboard-history-menu,
    .hcr-dashboard-history-menu > summary { width: 100%; }
    .hcr-dashboard-history-links { left: 0; right: auto; width: 100%; }
}


/* =========================================================
   Fix 25 - Edit Rental Order detail usability
   - Larger vehicle details below VIN
   - Rate / Hourly / Mileage kept on the same desktop row
   - Order Summary numeric values right-aligned consistently
   ========================================================= */
.fix25-rental-detail-usability .fix22b-vehicle-meta-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 8px 10px !important;
    align-items: stretch !important;
}

.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(1),
.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(2),
.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(6) {
    grid-column: 1 / -1 !important;
}

.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(3) { grid-column: 1 / span 2 !important; }
.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(4) { grid-column: 3 / span 2 !important; }
.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(5) { grid-column: 5 / span 2 !important; }

.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .hcr-vehicle-meta-row:nth-child(n+3) {
    min-width: 0 !important;
    max-width: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
    font-size: 14px !important;
}

.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .hcr-vehicle-meta-row:nth-child(3),
.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .hcr-vehicle-meta-row:nth-child(4),
.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .hcr-vehicle-meta-row:nth-child(5) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    padding: 8px 10px !important;
    margin: 6px 0 0 0 !important;
    border: 1px solid #D8E3F2 !important;
    border-radius: 999px !important;
    background: #F8FAFC !important;
    white-space: nowrap !important;
}

.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .hcr-vehicle-meta-row:nth-child(n+3) > span {
    color: #475569 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: .045em !important;
    text-transform: uppercase !important;
}

.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .hcr-vehicle-meta-row:nth-child(n+3) > strong {
    color: #0F172A !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    line-height: 1.15 !important;
    text-align: right !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
}

.fix25-rental-detail-usability .hcr-meta-specs strong {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px 14px !important;
    justify-content: flex-start !important;
    text-align: left !important;
    white-space: normal !important;
}

.fix25-rental-detail-usability .hcr-meta-specs strong span {
    font-size: 14px !important;
    font-weight: 900 !important;
}

.fix25-rental-detail-usability .fix22n-financial-sidebar .fix22n-primary-total,
.fix25-rental-detail-usability .fix22n-financial-sidebar .payment-mini-summary,
.fix25-rental-detail-usability .fix22n-financial-sidebar .fix21-summary-status-row,
.fix25-rental-detail-usability .fix22n-financial-sidebar .summary-line,
.fix25-rental-detail-usability .fix22n-financial-sidebar .fix21-side-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 136px !important;
    align-items: center !important;
    column-gap: 12px !important;
}

.fix25-rental-detail-usability .fix22n-financial-sidebar .fix22n-primary-total > strong,
.fix25-rental-detail-usability .fix22n-financial-sidebar .payment-mini-summary > strong,
.fix25-rental-detail-usability .fix22n-financial-sidebar .fix21-summary-status-row > strong,
.fix25-rental-detail-usability .fix22n-financial-sidebar .summary-line > input,
.fix25-rental-detail-usability .fix22n-financial-sidebar .summary-line > output,
.fix25-rental-detail-usability .fix22n-financial-sidebar .fix21-side-row > strong,
.fix25-rental-detail-usability .fix22n-financial-sidebar .fix21-side-row > output {
    width: 136px !important;
    min-width: 136px !important;
    max-width: 136px !important;
    margin-left: 0 !important;
    text-align: right !important;
    justify-self: end !important;
    justify-content: flex-end !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-variant-numeric: tabular-nums !important;
    box-sizing: border-box !important;
}

.fix25-rental-detail-usability .fix22n-financial-sidebar input[type="number"] {
    text-align: right !important;
}

.fix25-rental-detail-usability .fix22n-calc-panel > div,
.fix25-rental-detail-usability .mock-tax-detail-grid > div,
.fix25-rental-detail-usability .fix22n-deposit-preview > div {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 118px !important;
    align-items: center !important;
    column-gap: 10px !important;
}

.fix25-rental-detail-usability .fix22n-calc-panel strong,
.fix25-rental-detail-usability .mock-tax-detail-grid strong,
.fix25-rental-detail-usability .fix22n-deposit-preview strong {
    min-width: 118px !important;
    text-align: right !important;
    justify-self: end !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-variant-numeric: tabular-nums !important;
}

.fix25-rental-detail-usability .mock-order-tax-details summary {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 118px !important;
    column-gap: 10px !important;
}

.fix25-rental-detail-usability .mock-order-tax-details summary strong {
    min-width: 118px !important;
    text-align: right !important;
    justify-self: end !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-variant-numeric: tabular-nums !important;
}

@media (max-width: 1040px) {
    .fix25-rental-detail-usability .fix22b-vehicle-meta-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .fix25-rental-detail-usability .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(1),
    .fix25-rental-detail-usability .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(2),
    .fix25-rental-detail-usability .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(5),
    .fix25-rental-detail-usability .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(6) {
        grid-column: 1 / -1 !important;
    }

    .fix25-rental-detail-usability .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(3),
    .fix25-rental-detail-usability .fix22b-vehicle-meta-grid .fix22b-info-row:nth-child(4) {
        grid-column: auto !important;
    }
}


/* =========================================================
   Fix 26 - Edit Rental Order specs one-line layout
   - Keeps Passengers / Doors / Bags on one row under VIN
   ========================================================= */
.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .hcr-meta-specs {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: 8px !important;
}

.fix25-rental-detail-usability .hcr-meta-specs > strong {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    white-space: nowrap !important;
    text-align: left !important;
}

.fix25-rental-detail-usability .hcr-meta-specs > strong > span,
.order-page-shell.hcr-edit-stable-v1.fix25-rental-detail-usability .hcr-meta-specs strong > span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
    padding: 5px 8px !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
}

.fix25-rental-detail-usability .hcr-meta-specs > strong > span span {
    display: inline !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    font-size: inherit !important;
    line-height: inherit !important;
}

@media (max-width: 430px) {
    .fix25-rental-detail-usability .hcr-meta-specs > strong {
        gap: 4px !important;
    }

    .fix25-rental-detail-usability .hcr-meta-specs > strong > span,
    .order-page-shell.hcr-edit-stable-v1.fix25-rental-detail-usability .hcr-meta-specs strong > span {
        padding: 5px 6px !important;
        font-size: 12px !important;
    }
}

/* =========================================================
   Fix 27 - Edit Rental Order specs forced one-line compact row
   - Overrides earlier chip wrapping so Passengers / Doors / Bags
     stay on one horizontal line beside the Specs label.
   ========================================================= */
.order-page-shell.hcr-edit-stable-v1.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .hcr-meta-specs {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

.order-page-shell.hcr-edit-stable-v1.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .hcr-meta-specs > span {
    flex: 0 0 auto !important;
    min-width: auto !important;
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1 !important;
}

.order-page-shell.hcr-edit-stable-v1.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .hcr-meta-specs > strong {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
    white-space: nowrap !important;
    text-align: left !important;
}

.order-page-shell.hcr-edit-stable-v1.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .hcr-meta-specs > strong > span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 4px 6px !important;
    border: 1px solid #DCE7F3 !important;
    border-radius: 999px !important;
    background: #F8FAFC !important;
    color: #0F172A !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: -0.02em !important;
    white-space: nowrap !important;
}

.order-page-shell.hcr-edit-stable-v1.fix25-rental-detail-usability .fix22b-vehicle-meta-grid .hcr-meta-specs > strong > span span {
    display: inline !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
}

/* =========================================================
   Fix 29 - Edit Rental Order options grouped left-aligned layout
   - Coverage: Collision Damage Waiver + Supplemental Liability
   - Drivers / Equipment: Additional Driver + GPS + Child Seat
   - Prevents option rows from stretching across the full section
   ========================================================= */
.order-page-shell.hcr-edit-stable-v1.fix29-options-layout .compact-options-grid.fix22k-option-list.fix29-options-groups {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 14px !important;
    width: fit-content !important;
    max-width: 100% !important;
    min-width: 0 !important;
    justify-self: start !important;
}

.order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-option-group {
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-content: start !important;
    gap: 8px !important;
    width: 430px !important;
    max-width: 100% !important;
    padding: 10px !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 14px !important;
    background: #F8FAFC !important;
    box-sizing: border-box !important;
}

.order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-coverage-group {
    width: 465px !important;
}

.order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-addons-group {
    width: 425px !important;
}

.order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-option-group-title {
    color: #334155 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: .03em !important;
    line-height: 1.1 !important;
    text-align: left !important;
    text-transform: uppercase !important;
    margin: 0 0 2px 2px !important;
}

.order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-option-group .fix22k-option-row,
.order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-option-group .compact-option-card {
    display: grid !important;
    grid-template-columns: minmax(175px, 1fr) 116px 92px !important;
    align-items: center !important;
    gap: 9px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 40px !important;
    padding: 7px 9px !important;
    margin: 0 !important;
    border-radius: 10px !important;
    background: #FFFFFF !important;
    box-sizing: border-box !important;
}

.order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-option-group .option-title {
    min-width: 0 !important;
    color: #0F172A !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    line-height: 1.15 !important;
    text-align: left !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

.order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-option-group .option-control {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    min-width: 0 !important;
    width: auto !important;
    color: #334155 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

.order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-option-group .money-compact {
    width: 92px !important;
    min-width: 92px !important;
    max-width: 92px !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 5px 8px !important;
    text-align: right !important;
}

.order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-option-group .qty-box {
    width: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 5px 6px !important;
    text-align: center !important;
}

@media (max-width: 1320px) {
    .order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-coverage-group,
    .order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-addons-group {
        width: min(100%, 465px) !important;
    }
}

@media (max-width: 640px) {
    .order-page-shell.hcr-edit-stable-v1.fix29-options-layout .compact-options-grid.fix22k-option-list.fix29-options-groups {
        width: 100% !important;
    }

    .order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-option-group {
        width: 100% !important;
    }

    .order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-option-group .fix22k-option-row,
    .order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-option-group .compact-option-card {
        grid-template-columns: 1fr !important;
        align-items: start !important;
    }

    .order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-option-group .money-compact,
    .order-page-shell.hcr-edit-stable-v1.fix29-options-layout .fix29-option-group .qty-box {
        width: 100% !important;
        max-width: none !important;
    }
}

/* =========================================================
   Fix 30 - Edit Rental Order options: force Coverage and
   Drivers / Equipment onto the same horizontal row.
   ========================================================= */
.order-page-shell.hcr-edit-stable-v1.fix30-options-two-column .compact-options-grid.fix22k-option-list.fix29-options-groups {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    align-items: start !important;
    justify-content: stretch !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    justify-self: stretch !important;
}

.order-page-shell.hcr-edit-stable-v1.fix30-options-two-column .fix29-option-group,
.order-page-shell.hcr-edit-stable-v1.fix30-options-two-column .fix29-coverage-group,
.order-page-shell.hcr-edit-stable-v1.fix30-options-two-column .fix29-addons-group {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.order-page-shell.hcr-edit-stable-v1.fix30-options-two-column .fix29-option-group .fix22k-option-row,
.order-page-shell.hcr-edit-stable-v1.fix30-options-two-column .fix29-option-group .compact-option-card {
    grid-template-columns: minmax(104px, 1fr) max-content 82px !important;
    gap: 7px !important;
    padding: 7px 8px !important;
    min-width: 0 !important;
}

.order-page-shell.hcr-edit-stable-v1.fix30-options-two-column .fix29-option-group .option-title {
    min-width: 0 !important;
    font-size: 12.5px !important;
    line-height: 1.12 !important;
}

.order-page-shell.hcr-edit-stable-v1.fix30-options-two-column .fix29-option-group .option-control {
    gap: 5px !important;
    font-size: 11.5px !important;
    min-width: 0 !important;
}

.order-page-shell.hcr-edit-stable-v1.fix30-options-two-column .fix29-option-group .money-compact {
    width: 82px !important;
    min-width: 82px !important;
    max-width: 82px !important;
}

.order-page-shell.hcr-edit-stable-v1.fix30-options-two-column .fix29-option-group .qty-box {
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
}

@media (max-width: 900px) {
    .order-page-shell.hcr-edit-stable-v1.fix30-options-two-column .compact-options-grid.fix22k-option-list.fix29-options-groups {
        grid-template-columns: 1fr !important;
    }
}

/* =========================================================
   Fix 31 - Deposit screen cleanup
   - Remove redundant deposit dropdown dependency
   - Make the deposit tab an action workspace instead of a second summary
   - Add micro-overpayment explanation
   ========================================================= */
.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .deposit-decision-flow,
.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .deposit-action-select-wrap,
.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup #DepositActionSelect {
    display: none !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .fix31-deposit-workspace {
    display: grid !important;
    gap: 14px !important;
    padding: 16px !important;
    border: 1px solid #DDE7F3 !important;
    border-radius: 18px !important;
    background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%) !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .05) !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .deposit-workspace-header {
    display: grid !important;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr) !important;
    gap: 14px !important;
    align-items: start !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .deposit-workspace-header h3 {
    margin: 0 0 4px !important;
    color: #0F172A !important;
    font-size: 17px !important;
    font-weight: 950 !important;
    letter-spacing: -.01em !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .deposit-workspace-header p {
    margin: 0 !important;
    max-width: 620px !important;
    color: #475569 !important;
    font-size: 12.5px !important;
    font-weight: 650 !important;
    line-height: 1.45 !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .deposit-workspace-status {
    display: grid !important;
    gap: 7px !important;
    padding: 10px !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 14px !important;
    background: #FFFFFF !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .deposit-workspace-status span,
.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .deposit-final-result-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 10px !important;
    align-items: center !important;
    color: #475569 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .deposit-workspace-status strong,
.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .deposit-final-result-row strong,
.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .closeout-action-card strong {
    min-width: 86px !important;
    text-align: right !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-variant-numeric: tabular-nums !important;
    color: #0F172A !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .fix31-deposit-workspace .deposit-settlement-actions,
.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .fix31-deposit-workspace .fix22k-deposit-action-list {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin: 0 !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .fix31-deposit-workspace .closeout-action-card {
    display: grid !important;
    grid-template-columns: 24px minmax(0, 1fr) auto !important;
    gap: 6px 10px !important;
    min-height: 72px !important;
    padding: 12px !important;
    align-items: center !important;
    border-radius: 14px !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .fix31-deposit-workspace .closeout-action-card span {
    color: #0F172A !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    line-height: 1.15 !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .fix31-deposit-workspace .closeout-action-card small {
    grid-column: 2 / -1 !important;
    margin: 0 !important;
    color: #64748B !important;
    font-size: 11.5px !important;
    font-weight: 650 !important;
    line-height: 1.3 !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .deposit-final-result-row {
    padding: 10px 12px !important;
    border: 1px solid #DBEAFE !important;
    border-radius: 14px !important;
    background: #EFF6FF !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .deposit-final-result-row small {
    grid-column: 1 / -1 !important;
    color: #1E3A8A !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .micro-overpayment-note {
    display: block !important;
    margin-top: 2px !important;
    color: #0F766E !important;
    font-size: 11.5px !important;
    font-weight: 850 !important;
    line-height: 1.3 !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .micro-overpayment-note[hidden] {
    display: none !important;
}

.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .sidebar-overpayment-note {
    margin: -4px 12px 8px !important;
    padding: 0 !important;
}

/* Defensive cleanup for any orphan text marker around the tax expander. */
.order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .mock-order-tax-details {
    overflow: hidden !important;
}

@media (max-width: 1200px) {
    .order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .deposit-workspace-header,
    .order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .fix31-deposit-workspace .deposit-settlement-actions,
    .order-page-shell.hcr-edit-stable-v1.fix31-deposit-screen-cleanup .fix31-deposit-workspace .fix22k-deposit-action-list {
        grid-template-columns: 1fr !important;
    }
}

/* =========================================================
   Phase 2 Fix 32 - Duration policy, settlement formula, and tax chevrons
   ========================================================= */
.fix32-duration-policy .duration-summary-line {
    align-items: center;
    gap: 8px;
}

.fix32-duration-policy .duration-policy-inline {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 100%;
    min-width: 100%;
    margin-top: 4px;
    font-size: 0.83rem;
    color: #334155;
    line-height: 1.25;
}

.fix32-duration-policy .duration-policy-inline strong {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    padding: 3px 8px;
    border-radius: 999px;
    background: #ecfdf5;
    color: #047857;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: .01em;
}

.fix32-duration-policy .duration-policy-inline strong.is-charged {
    background: #eff6ff;
    color: #1d4ed8;
}

.fix32-duration-policy .rental-charge-formula-line,
.fix32-duration-policy .sidebar-formula-note {
    display: block;
    color: #475569;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.25;
}

.fix32-duration-policy .deposit-workspace-status .rental-charge-formula-line {
    grid-column: 1 / -1;
    text-align: right;
    margin-top: -2px;
}

.fix32-duration-policy .base-time-distance-row {
    border: 1px solid #dbeafe;
    background: #eff6ff;
    border-radius: 10px;
    padding: 8px 10px;
    margin-bottom: 4px;
}

.fix32-duration-policy .base-time-distance-row span,
.fix32-duration-policy .base-time-distance-row strong {
    color: #1e40af;
    font-weight: 800;
}

.fix32-duration-policy .sidebar-formula-note {
    margin: 0 0 8px;
    padding: 0 2px;
}

.fix32-duration-policy .mock-order-tax-details > summary,
.fix32-duration-policy .fix22n-tax-card > summary {
    list-style: none;
}

.fix32-duration-policy .mock-order-tax-details > summary::-webkit-details-marker,
.fix32-duration-policy .fix22n-tax-card > summary::-webkit-details-marker {
    display: none;
}

.fix32-duration-policy [data-tax-details-label] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-style: normal;
    font-weight: 800;
    color: #2563eb;
    white-space: nowrap;
}

.fix32-duration-policy .tax-chevron {
    display: inline-block;
    font-size: 0.72rem;
    line-height: 1;
    transition: transform .16s ease;
}

.fix32-duration-policy details[open] > summary [data-tax-details-label] .tax-chevron {
    transform: rotate(90deg);
}

/* =========================================================
   Phase 2 Fix 33 - Itemized protection options inside Order Summary
   ========================================================= */
.fix33-option-sidebar-summary .sidebar-invoice-block {
    border: 1px solid #e2e8f0;
    background: #ffffff;
    border-radius: 12px;
    padding: 9px 10px;
    margin: 0 0 8px;
}

.fix33-option-sidebar-summary .base-time-distance-block {
    border-color: #dbeafe;
    background: #eff6ff;
}

.fix33-option-sidebar-summary .protection-options-block {
    border-color: #d1fae5;
    background: #f0fdf4;
}

.fix33-option-sidebar-summary .driver-equipment-options-block {
    border-color: #fed7aa;
    background: #fff7ed;
}

.fix33-option-sidebar-summary .sidebar-section-total {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: baseline;
    gap: 10px;
    font-size: .86rem;
    line-height: 1.2;
}

.fix33-option-sidebar-summary .sidebar-section-total span {
    color: #0f172a;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .02em;
}

.fix33-option-sidebar-summary .sidebar-section-total strong {
    color: #0f172a;
    font-variant-numeric: tabular-nums;
    text-align: right;
    min-width: 84px;
}

.fix33-option-sidebar-summary .base-time-distance-block .sidebar-section-total span,
.fix33-option-sidebar-summary .base-time-distance-block .sidebar-section-total strong {
    color: #1e40af;
}

.fix33-option-sidebar-summary .protection-options-block .sidebar-section-total span,
.fix33-option-sidebar-summary .protection-options-block .sidebar-section-total strong {
    color: #047857;
}

.fix33-option-sidebar-summary .driver-equipment-options-block .sidebar-section-total span,
.fix33-option-sidebar-summary .driver-equipment-options-block .sidebar-section-total strong {
    color: #9a3412;
}

.fix33-option-sidebar-summary .sidebar-option-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2px 10px;
    margin-top: 7px;
    padding-top: 7px;
    border-top: 1px dashed rgba(15, 23, 42, .16);
}

.fix33-option-sidebar-summary .sidebar-option-line span {
    color: #334155;
    font-size: .82rem;
    font-weight: 800;
    min-width: 0;
}

.fix33-option-sidebar-summary .sidebar-option-line strong {
    color: #0f172a;
    font-size: .84rem;
    font-weight: 900;
    text-align: right;
    font-variant-numeric: tabular-nums;
    min-width: 74px;
}

.fix33-option-sidebar-summary .sidebar-option-line small,
.fix33-option-sidebar-summary .sidebar-empty-note {
    grid-column: 1 / -1;
    color: #64748b;
    font-size: .73rem;
    font-weight: 700;
    line-height: 1.2;
}

.fix33-option-sidebar-summary .base-time-distance-block .sidebar-formula-note {
    margin: 4px 0 0;
    padding: 0;
}

/* =========================================================
   Phase 2 Fix 34 - Conditional sidebar option rendering/alignment
   ========================================================= */
.order-page-shell.fix34-option-summary-conditional .sidebar-invoice-block[hidden],
.order-page-shell.fix34-option-summary-conditional .sidebar-option-line[hidden],
.order-page-shell.fix34-option-summary-conditional .sidebar-empty-note[hidden] {
    display: none !important;
}

.order-page-shell.fix34-option-summary-conditional .fix22n-financial-sidebar .sidebar-total-focus.fix22n-primary-total,
.order-page-shell.fix34-option-summary-conditional .fix22n-financial-sidebar .payment-mini-summary,
.order-page-shell.fix34-option-summary-conditional .fix22n-financial-sidebar .fix21-summary-status-row,
.order-page-shell.fix34-option-summary-conditional .fix22n-financial-sidebar .mock-order-tax-details > summary,
.order-page-shell.fix34-option-summary-conditional .fix22n-financial-sidebar .sidebar-section-total {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 112px !important;
    align-items: center !important;
    column-gap: 12px !important;
}

.order-page-shell.fix34-option-summary-conditional .fix22n-financial-sidebar .sidebar-total-focus.fix22n-primary-total > strong,
.order-page-shell.fix34-option-summary-conditional .fix22n-financial-sidebar .payment-mini-summary > strong,
.order-page-shell.fix34-option-summary-conditional .fix22n-financial-sidebar .fix21-summary-status-row > strong,
.order-page-shell.fix34-option-summary-conditional .fix22n-financial-sidebar .mock-order-tax-details > summary > strong,
.order-page-shell.fix34-option-summary-conditional .fix22n-financial-sidebar .sidebar-section-total > strong {
    min-width: 112px !important;
    width: 112px !important;
    justify-self: end !important;
    text-align: right !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-variant-numeric: tabular-nums !important;
}

.order-page-shell.fix34-option-summary-conditional .fix22n-financial-sidebar .mock-order-tax-details > summary > em {
    grid-column: 1 / -1 !important;
    justify-self: start !important;
    margin-top: 2px !important;
}


/* =========================================================
   Phase 2 Fix 35 - Order Summary tax accordion expansion
   =========================================================
   Keeps the Taxes & Fees detail list from clipping inside the
   right-side sticky Order Summary card. This is a display-only
   patch; calculation logic is unchanged.
*/
.order-page-shell.fix35-tax-accordion-expand .fix22n-financial-sidebar .sticky-total-card.premium-total-card.fix22n-card,
.order-page-shell.fix35-tax-accordion-expand .fix22n-financial-sidebar .mock-order-tax-details,
.order-page-shell.fix35-tax-accordion-expand .fix22n-financial-sidebar .mock-order-tax-details[open],
.order-page-shell.fix35-tax-accordion-expand .fix22n-financial-sidebar .mock-tax-detail-grid {
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
}

.order-page-shell.fix35-tax-accordion-expand .fix22n-financial-sidebar .mock-order-tax-details[open] .mock-tax-detail-grid {
    display: grid !important;
    grid-auto-rows: minmax(26px, auto) !important;
    max-height: none !important;
    overflow-y: visible !important;
    padding-bottom: 12px !important;
}

.order-page-shell.fix35-tax-accordion-expand .fix22n-financial-sidebar .mock-tax-detail-grid > div {
    min-height: 26px !important;
    height: auto !important;
    overflow: visible !important;
}

.order-page-shell.fix35-tax-accordion-expand .fix22n-financial-sidebar .mock-tax-detail-grid span {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

.order-page-shell.fix35-tax-accordion-expand .fix22n-financial-sidebar .mock-tax-total {
    margin-bottom: 2px !important;
}

/* =========================================================
   Phase 2 Fix 36 - Documents matrix and sidebar polish
   =========================================================
   Display-only refactor based on the approved audit: wider
   Order Summary canvas, scroll-safe tax accordion, 2-column
   document matrix, and stronger summary typography.
*/
.order-page-shell.fix36-docs-sidebar-polish .order-layout-grid.fix18-two-column-layout {
    grid-template-columns: minmax(720px, 1fr) minmax(340px, 360px) !important;
    max-width: 1360px !important;
    width: min(100%, 1360px) !important;
    column-gap: 26px !important;
}

.order-page-shell.fix36-docs-sidebar-polish .order-layout-grid.fix18-two-column-layout > aside.total-sidebar.fix22n-financial-sidebar {
    width: 360px !important;
    min-width: 340px !important;
    max-width: 360px !important;
    max-height: calc(100vh - 120px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding-right: 4px !important;
    scrollbar-gutter: stable !important;
}

.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .sticky-total-card.premium-total-card.fix22n-card {
    overflow: visible !important;
}

.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .mock-order-tax-details,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .mock-order-tax-details[open],
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .mock-tax-detail-grid {
    max-height: none !important;
    overflow: visible !important;
}

.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .mock-order-tax-details[open] .mock-tax-detail-grid {
    display: grid !important;
    grid-auto-rows: minmax(28px, auto) !important;
    padding-bottom: 10px !important;
}

.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .mock-tax-detail-grid > div,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .mock-tax-total {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 118px !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 28px !important;
}

.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .mock-tax-detail-grid strong,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .mock-tax-total strong {
    width: 118px !important;
    min-width: 118px !important;
    justify-self: end !important;
    text-align: right !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-variant-numeric: tabular-nums !important;
}

.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .sidebar-total-focus.fix22n-primary-total,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .payment-mini-summary,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .fix21-summary-status-row,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .mock-order-tax-details > summary,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .sidebar-section-total {
    grid-template-columns: minmax(0, 1fr) 128px !important;
    column-gap: 12px !important;
}

.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .sidebar-total-focus.fix22n-primary-total > span,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .payment-mini-summary > span,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .fix21-summary-status-row > span,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .mock-order-tax-details > summary > span,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .sidebar-section-total > span {
    font-size: .875rem !important;
    font-weight: 900 !important;
    letter-spacing: .02em !important;
}

.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .sidebar-total-focus.fix22n-primary-total > strong,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .payment-mini-summary > strong,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .fix21-summary-status-row > strong,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .mock-order-tax-details > summary > strong,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .sidebar-section-total > strong {
    width: 128px !important;
    min-width: 128px !important;
    justify-self: end !important;
    text-align: right !important;
    font-size: 1.125rem !important;
    font-weight: 950 !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-variant-numeric: tabular-nums !important;
}

.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .sidebar-formula-note,
.order-page-shell.fix36-docs-sidebar-polish .fix22n-financial-sidebar .sidebar-option-line small {
    white-space: normal !important;
    line-height: 1.25 !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

.order-page-shell.fix36-docs-sidebar-polish .mock-documents-panel {
    padding: 14px !important;
}

.order-page-shell.fix36-docs-sidebar-polish .mock-documents-list {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(3, minmax(42px, auto)) !important;
    grid-auto-flow: column !important;
    gap: 8px 12px !important;
    border-top: 0 !important;
}

.order-page-shell.fix36-docs-sidebar-polish .mock-document-row {
    grid-template-columns: 24px minmax(0, 1fr) 96px 22px !important;
    min-height: 42px !important;
    padding: 7px 8px !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 10px !important;
    background: #FFFFFF !important;
}

.order-page-shell.fix36-docs-sidebar-polish .mock-doc-name {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.order-page-shell.fix36-docs-sidebar-polish .mock-doc-badge {
    min-width: 82px !important;
    padding: 4px 8px !important;
    font-size: 11px !important;
}

.order-page-shell.fix36-docs-sidebar-polish .mock-upload-strip {
    grid-template-columns: minmax(170px, .9fr) minmax(170px, 1fr) minmax(190px, 1fr) 180px !important;
    gap: 10px !important;
    margin-top: 14px !important;
    border-top: 1px solid #E2E8F0 !important;
}

@media (max-width: 1180px) {
    .order-page-shell.fix36-docs-sidebar-polish .order-layout-grid.fix18-two-column-layout {
        grid-template-columns: 1fr !important;
        max-width: 100% !important;
    }

    .order-page-shell.fix36-docs-sidebar-polish .order-layout-grid.fix18-two-column-layout > aside.total-sidebar.fix22n-financial-sidebar {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        position: static !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

@media (max-width: 760px) {
    .order-page-shell.fix36-docs-sidebar-polish .mock-documents-list,
    .order-page-shell.fix36-docs-sidebar-polish .mock-upload-strip {
        grid-template-columns: 1fr !important;
        grid-template-rows: none !important;
        grid-auto-flow: row !important;
    }
}

/* =========================================================
   Phase 2 Fix 37 - Return tab layout and sidebar tax toggle cleanup
   =========================================================
   Display-only refactor: keeps Return Date/Mileage controls from
   squashing, preserves full duration-policy text, and removes the
   duplicate Tax Details accordion indicator.
*/
.order-page-shell.fix37-return-sidebar-refactor .date-pair-grid {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 12px 14px !important;
    align-items: end !important;
}

.order-page-shell.fix37-return-sidebar-refactor .date-pair-grid > .required-field {
    grid-column: span 3 !important;
    min-width: 0 !important;
}

.order-page-shell.fix37-return-sidebar-refactor .date-pair-grid .discount-date-row {
    grid-column: span 4 !important;
    max-width: none !important;
    min-width: 0 !important;
}

.order-page-shell.fix37-return-sidebar-refactor .date-pair-grid .duration-date-row {
    grid-column: span 8 !important;
    min-width: 0 !important;
    width: 100% !important;
    align-self: end !important;
}

.order-page-shell.fix37-return-sidebar-refactor .duration-summary-line {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    min-height: 44px !important;
    width: 100% !important;
    overflow: visible !important;
}

.order-page-shell.fix37-return-sidebar-refactor .duration-summary-line .feature-chip {
    flex: 0 0 auto !important;
    min-height: 34px !important;
    padding: 6px 10px !important;
}

.order-page-shell.fix37-return-sidebar-refactor .duration-policy-inline {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: auto !important;
    margin-top: 0 !important;
    display: inline-flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 8px !important;
    overflow: visible !important;
    white-space: nowrap !important;
}

.order-page-shell.fix37-return-sidebar-refactor .duration-policy-inline span,
.order-page-shell.fix37-return-sidebar-refactor .duration-policy-inline strong {
    white-space: nowrap !important;
}

.order-page-shell.fix37-return-sidebar-refactor .duration-policy-inline span {
    overflow: visible !important;
    text-overflow: clip !important;
    font-size: .78rem !important;
}

.order-page-shell.fix37-return-sidebar-refactor .duration-policy-inline strong {
    flex: 0 0 auto !important;
    font-size: .72rem !important;
    padding: 3px 7px !important;
}

.order-page-shell.fix37-return-sidebar-refactor .ro-mileage-row.fix22a-return-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 16px !important;
    align-items: start !important;
}

.order-page-shell.fix37-return-sidebar-refactor .ro-mileage-row.fix22a-return-grid > .field-stack,
.order-page-shell.fix37-return-sidebar-refactor .ro-mileage-row.fix22a-return-grid > .readonly-inline-metric,
.order-page-shell.fix37-return-sidebar-refactor .ro-mileage-row.fix22a-return-grid > .return-odo-required-field {
    min-width: 0 !important;
    width: 100% !important;
    max-width: none !important;
}

.order-page-shell.fix37-return-sidebar-refactor .ro-mileage-row.fix22a-return-grid input,
.order-page-shell.fix37-return-sidebar-refactor .ro-mileage-row.fix22a-return-grid #EndMileage {
    width: 100% !important;
    max-width: none !important;
}

.order-page-shell.fix37-return-sidebar-refactor .ro-mileage-row.fix22a-return-grid .readonly-inline-metric {
    min-height: 38px !important;
    padding: 8px 11px !important;
    overflow: hidden !important;
}

.order-page-shell.fix37-return-sidebar-refactor .ro-mileage-row.fix22a-return-grid .readonly-inline-metric span,
.order-page-shell.fix37-return-sidebar-refactor .ro-mileage-row.fix22a-return-grid .readonly-inline-metric strong,
.order-page-shell.fix37-return-sidebar-refactor .return-odo-inline-warning {
    white-space: nowrap !important;
}

.order-page-shell.fix37-return-sidebar-refactor .ro-mileage-row.fix22a-return-grid .travel-out-state-card {
    grid-column: 1 / -1 !important;
}

.order-page-shell.fix37-return-sidebar-refactor .fix22n-financial-sidebar .mock-order-tax-details > summary > span::after {
    content: none !important;
    display: none !important;
}

.order-page-shell.fix37-return-sidebar-refactor [data-tax-details-label] {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    color: #1a73e8 !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
}

.order-page-shell.fix37-return-sidebar-refactor .tax-chevron {
    display: inline-block !important;
    transform: none !important;
    transition: transform .16s ease !important;
    line-height: 1 !important;
}

.order-page-shell.fix37-return-sidebar-refactor details[open] > summary [data-tax-details-label] .tax-chevron {
    transform: rotate(180deg) !important;
}

@media (max-width: 1100px) {
    .order-page-shell.fix37-return-sidebar-refactor .date-pair-grid,
    .order-page-shell.fix37-return-sidebar-refactor .ro-mileage-row.fix22a-return-grid {
        grid-template-columns: 1fr !important;
    }

    .order-page-shell.fix37-return-sidebar-refactor .date-pair-grid > .required-field,
    .order-page-shell.fix37-return-sidebar-refactor .date-pair-grid .discount-date-row,
    .order-page-shell.fix37-return-sidebar-refactor .date-pair-grid .duration-date-row {
        grid-column: 1 / -1 !important;
    }

    .order-page-shell.fix37-return-sidebar-refactor .duration-summary-line,
    .order-page-shell.fix37-return-sidebar-refactor .duration-policy-inline {
        flex-wrap: wrap !important;
        white-space: normal !important;
    }
}


/* =====================================================================
   Phase 2 Fix 38 - Return tab grid alignment patch
   - Keeps Return ODO validation text out of the 3-column row height flow.
   - Keeps Travel Out of State selector text on one line beside the checkbox.
   ===================================================================== */
.order-page-shell.fix38-return-grid-alignment .ro-mileage-row.fix22a-return-grid {
    align-items: start !important;
}

.order-page-shell.fix38-return-grid-alignment .odo-input-column-wrapper,
.order-page-shell.fix38-return-grid-alignment .ro-mileage-row.fix22a-return-grid > .return-odo-required-field.odo-input-column-wrapper {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: none !important;
    padding-bottom: 20px !important;
    box-sizing: border-box !important;
}

.order-page-shell.fix38-return-grid-alignment .odo-input-column-wrapper input,
.order-page-shell.fix38-return-grid-alignment .odo-input-column-wrapper #EndMileage {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}

.order-page-shell.fix38-return-grid-alignment .odo-error-validation-text,
.order-page-shell.fix38-return-grid-alignment .return-odo-inline-warning.odo-error-validation-text {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: auto !important;
    margin: 0 !important;
    font-size: 11px !important;
    line-height: 12px !important;
    color: #d93025 !important;
    white-space: nowrap !important;
    overflow: visible !important;
    pointer-events: none !important;
}

.order-page-shell.fix38-return-grid-alignment.has-return-odo .odo-error-validation-text,
.order-page-shell.fix38-return-grid-alignment.has-return-odo .return-odo-inline-warning.odo-error-validation-text {
    display: none !important;
}

.order-page-shell.fix38-return-grid-alignment .travel-out-state-card.fix22a-travel-actions {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 280px) !important;
    align-items: center !important;
    gap: 8px 10px !important;
}

.order-page-shell.fix38-return-grid-alignment .travel-checkbox-container,
.order-page-shell.fix38-return-grid-alignment .travel-out-state-card .travel-checkbox-container,
.order-page-shell.fix38-return-grid-alignment .travel-out-state-card .travel-toggle-button.travel-checkbox-container {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-direction: row !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 36px !important;
    height: 36px !important;
    padding: 0 12px !important;
    text-align: left !important;
    white-space: nowrap !important;
    overflow: hidden !important;
}

.order-page-shell.fix38-return-grid-alignment .travel-checkbox-container .ro-blue-check,
.order-page-shell.fix38-return-grid-alignment .travel-out-state-card .travel-checkbox-container input[type="checkbox"] {
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    max-width: 18px !important;
    margin: 0 !important;
}

.order-page-shell.fix38-return-grid-alignment .travel-checkbox-label,
.order-page-shell.fix38-return-grid-alignment .travel-out-state-card .travel-checkbox-label,
.order-page-shell.fix38-return-grid-alignment .travel-out-state-card .travel-toggle-button .travel-checkbox-label {
    white-space: nowrap !important;
    font-size: 13px !important;
    line-height: 16px !important;
    font-weight: 800 !important;
    display: inline-block !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.order-page-shell.fix38-return-grid-alignment #OutOfStateOpenButton {
    min-height: 36px !important;
    height: 36px !important;
    white-space: nowrap !important;
}

@media (max-width: 1100px) {
    .order-page-shell.fix38-return-grid-alignment .travel-out-state-card.fix22a-travel-actions {
        grid-template-columns: 1fr !important;
    }

    .order-page-shell.fix38-return-grid-alignment .odo-error-validation-text,
    .order-page-shell.fix38-return-grid-alignment .return-odo-inline-warning.odo-error-validation-text {
        white-space: normal !important;
        max-width: 100% !important;
    }
}


/* =====================================================================
   Phase 2 Fix 39 - Return ODO duplicate validation cleanup
   - Removes the redundant global Return ODO banner from the Return tab flow.
   - Keeps the single field-level Return ODO validation message positioned
     under the input without expanding the mileage grid row.
   ===================================================================== */
.order-page-shell.fix39-return-validation-cleanup #ReturnOdoRequiredBanner,
.order-page-shell.fix39-return-validation-cleanup .fix22k-return-odo-warning {
    display: none !important;
}

.order-page-shell.fix39-return-validation-cleanup .odo-mileage-row-container,
.order-page-shell.fix39-return-validation-cleanup .ro-mileage-row.fix22a-return-grid.odo-mileage-row-container {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 16px !important;
    align-items: flex-start !important;
    grid-auto-rows: auto !important;
}

.order-page-shell.fix39-return-validation-cleanup .odo-mileage-row-container > .field-stack,
.order-page-shell.fix39-return-validation-cleanup .odo-mileage-row-container > .readonly-inline-metric,
.order-page-shell.fix39-return-validation-cleanup .odo-mileage-row-container > .return-odo-required-field {
    min-width: 0 !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}

.order-page-shell.fix39-return-validation-cleanup .odo-input-column-wrapper,
.order-page-shell.fix39-return-validation-cleanup .return-odo-required-field.odo-input-column-wrapper {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    padding-bottom: 20px !important;
    min-height: 72px !important;
    height: auto !important;
    overflow: visible !important;
}

.order-page-shell.fix39-return-validation-cleanup .odo-input-column-wrapper input,
.order-page-shell.fix39-return-validation-cleanup .return-odo-required-field.odo-input-column-wrapper #EndMileage {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}

.order-page-shell.fix39-return-validation-cleanup .field-level-validation-message,
.order-page-shell.fix39-return-validation-cleanup .odo-error-validation-text.field-level-validation-message,
.order-page-shell.fix39-return-validation-cleanup .return-odo-inline-warning.field-level-validation-message {
    position: absolute !important;
    left: 0 !important;
    bottom: 0 !important;
    margin: 0 !important;
    font-size: 11px !important;
    line-height: 12px !important;
    color: #d93025 !important;
    white-space: nowrap !important;
    overflow: visible !important;
    pointer-events: none !important;
}

.order-page-shell.fix39-return-validation-cleanup.has-return-odo .field-level-validation-message,
.order-page-shell.fix39-return-validation-cleanup.has-return-odo .odo-error-validation-text.field-level-validation-message,
.order-page-shell.fix39-return-validation-cleanup.has-return-odo .return-odo-inline-warning.field-level-validation-message {
    display: none !important;
}

.order-page-shell.fix39-return-validation-cleanup .travel-out-state-card.fix22a-travel-actions {
    grid-column: 1 / -1 !important;
}

@media (max-width: 1100px) {
    .order-page-shell.fix39-return-validation-cleanup .odo-mileage-row-container,
    .order-page-shell.fix39-return-validation-cleanup .ro-mileage-row.fix22a-return-grid.odo-mileage-row-container {
        grid-template-columns: 1fr !important;
    }

    .order-page-shell.fix39-return-validation-cleanup .field-level-validation-message,
    .order-page-shell.fix39-return-validation-cleanup .odo-error-validation-text.field-level-validation-message,
    .order-page-shell.fix39-return-validation-cleanup .return-odo-inline-warning.field-level-validation-message {
        white-space: normal !important;
        max-width: 100% !important;
    }
}

/* =====================================================================
   Phase 2 Fix 40 - Return tab column structural alignment
   - Keeps the mileage/odometer row as exactly three standalone columns.
   - Moves Travel Out of State / toll calculator into its own lower block.
   - Prevents Return ODO field validation from warping the lower panel.
   ===================================================================== */
.order-page-shell.fix40-return-column-structure .dates-mileage-row-grid,
.order-page-shell.fix40-return-column-structure .ro-mileage-row.fix22a-return-grid.odo-mileage-row-container {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: flex-start !important;
    gap: 16px !important;
    width: 100% !important;
    margin-top: 16px !important;
}

.order-page-shell.fix40-return-column-structure .dates-mileage-row-grid > .grid-column,
.order-page-shell.fix40-return-column-structure .dates-mileage-row-grid > .field-stack,
.order-page-shell.fix40-return-column-structure .dates-mileage-row-grid > .readonly-odo-column,
.order-page-shell.fix40-return-column-structure .dates-mileage-row-grid > .return-odo-required-field {
    min-width: 0 !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}

.order-page-shell.fix40-return-column-structure .dates-mileage-row-grid .field-stack {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    min-height: 78px !important;
    padding-bottom: 20px !important;
    margin: 0 !important;
    overflow: visible !important;
}

.order-page-shell.fix40-return-column-structure .dates-mileage-row-grid .field-stack label {
    min-height: 16px !important;
    line-height: 16px !important;
    margin: 0 0 6px 0 !important;
    white-space: nowrap !important;
}

.order-page-shell.fix40-return-column-structure .dates-mileage-row-grid .field-stack input,
.order-page-shell.fix40-return-column-structure .dates-mileage-row-grid .readonly-display-input,
.order-page-shell.fix40-return-column-structure .dates-mileage-row-grid #EndMileage {
    width: 100% !important;
    max-width: none !important;
    min-height: 38px !important;
    height: 38px !important;
    box-sizing: border-box !important;
}

.order-page-shell.fix40-return-column-structure .readonly-display-input {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    padding: 0 12px !important;
    border: 1px solid #d9e3f0 !important;
    border-radius: 10px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    font-weight: 900 !important;
}

.order-page-shell.fix40-return-column-structure .readonly-display-input strong {
    font-size: .9rem !important;
    line-height: 1 !important;
}

.order-page-shell.fix40-return-column-structure .return-odo-required-field .field-level-validation-message,
.order-page-shell.fix40-return-column-structure .return-odo-required-field .return-odo-inline-warning {
    position: absolute !important;
    left: 0 !important;
    bottom: 2px !important;
    margin: 0 !important;
    font-size: 11px !important;
    line-height: 12px !important;
    color: #d93025 !important;
    white-space: nowrap !important;
    overflow: visible !important;
    pointer-events: none !important;
}

.order-page-shell.fix40-return-column-structure.has-return-odo .return-odo-required-field .field-level-validation-message,
.order-page-shell.fix40-return-column-structure.has-return-odo .return-odo-required-field .return-odo-inline-warning {
    display: none !important;
}

.order-page-shell.fix40-return-column-structure .lower-travel-options-block.travel-out-state-card.fix22a-travel-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 280px) !important;
    align-items: center !important;
    gap: 8px 10px !important;
    width: 100% !important;
    margin-top: 4px !important;
    padding: 10px !important;
    box-sizing: border-box !important;
}

.order-page-shell.fix40-return-column-structure .lower-travel-options-block .travel-checkbox-container,
.order-page-shell.fix40-return-column-structure .lower-travel-options-block .travel-toggle-button.travel-checkbox-container {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-direction: row !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 36px !important;
    height: 36px !important;
    padding: 0 12px !important;
    text-align: left !important;
    white-space: nowrap !important;
    overflow: hidden !important;
}

.order-page-shell.fix40-return-column-structure .lower-travel-options-block .travel-checkbox-container input[type="checkbox"],
.order-page-shell.fix40-return-column-structure .lower-travel-options-block .travel-checkbox-container .ro-blue-check {
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    margin: 0 !important;
}

.order-page-shell.fix40-return-column-structure .lower-travel-options-block .travel-checkbox-label {
    white-space: nowrap !important;
    font-size: 13px !important;
    line-height: 16px !important;
    font-weight: 800 !important;
    display: inline-block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.order-page-shell.fix40-return-column-structure .lower-travel-options-block #OutOfStateOpenButton {
    min-height: 36px !important;
    height: 36px !important;
    white-space: nowrap !important;
}

.order-page-shell.fix40-return-column-structure .lower-travel-options-block .travel-helper-text {
    grid-column: 1 / -1 !important;
    margin: 0 !important;
}

@media (max-width: 1100px) {
    .order-page-shell.fix40-return-column-structure .dates-mileage-row-grid,
    .order-page-shell.fix40-return-column-structure .ro-mileage-row.fix22a-return-grid.odo-mileage-row-container,
    .order-page-shell.fix40-return-column-structure .lower-travel-options-block.travel-out-state-card.fix22a-travel-actions {
        grid-template-columns: 1fr !important;
    }

    .order-page-shell.fix40-return-column-structure .return-odo-required-field .field-level-validation-message,
    .order-page-shell.fix40-return-column-structure .return-odo-required-field .return-odo-inline-warning {
        white-space: normal !important;
        max-width: 100% !important;
    }
}

/* ======================================================================
   Phase 2 Fix41 - Mileage / Express Toll Modal Clarity
   - Shows mileage values with mi units and fees with currency symbols
   - Keeps hidden numeric inputs for existing calculation/apply logic
   ====================================================================== */
.out-state-modal .out-state-zip-grid {
    margin-bottom: 14px;
}

.out-state-modal .modal-metric-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 12px;
}

.out-state-modal .modal-metric-card {
    border: 1px solid #dbe7f5;
    border-radius: 14px;
    background: #ffffff;
    padding: 12px 14px;
    min-height: 76px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
}

.out-state-modal .modal-metric-card label {
    margin: 0;
    color: #64748b;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.out-state-modal .modal-metric-value {
    display: block;
    color: #0f172a;
    font-size: 20px;
    line-height: 1.15;
    font-weight: 850;
    font-variant-numeric: tabular-nums;
}

.out-state-modal .price-bold {
    color: #0f766e;
}

.out-state-modal .rate-subtext {
    color: #475569;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
}

.out-state-modal .toll-fee-display-card {
    align-self: stretch;
}

@media (max-width: 760px) {
    .out-state-modal .modal-metric-row {
        grid-template-columns: 1fr;
    }
}

/* ------------------------------------------------------------------
   Fix 42: Customer edit refactor and license scanner enhancements
------------------------------------------------------------------- */
.customer-page-shell .customer-info-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 16px !important;
    width: 100%;
    align-items: start;
}

.customer-page-shell .field-first-name,
.customer-page-shell .field-last-name,
.customer-page-shell .field-birth-date,
.customer-page-shell .field-phone,
.customer-page-shell .field-customer-type {
    grid-column: span 1;
}

.customer-page-shell .field-email {
    grid-column: span 2;
}

.customer-page-shell .field-birth-date,
.customer-page-shell .field-customer-type {
    max-width: none;
}

.customer-page-shell .customer-info-grid .hcr-input,
.customer-page-shell .customer-info-grid .hcr-select {
    width: 100%;
}

.customer-page-shell .address-grid {
    grid-template-columns: minmax(260px, 1fr) 120px 190px !important;
    align-items: start;
}

.customer-page-shell .zip-field,
.customer-page-shell .zip-field .hcr-input {
    max-width: 190px;
    width: 100%;
}

.customer-page-shell .dnr-reason-textarea {
    min-height: 96px;
    line-height: 1.5;
    padding: 12px !important;
}

.customer-page-shell .action-button-row,
.customer-page-shell .customer-save-actions.action-button-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: nowrap;
}

.customer-page-shell .action-button-row .customer-button {
    white-space: nowrap;
    flex: 0 0 auto;
}

.customer-page-shell .license-scan-status {
    margin: -2px 0 14px 0;
    padding: 10px 12px;
    border: 1px dashed #bfdbfe;
    border-radius: 14px;
    background: #eff6ff;
    color: #1e3a8a;
    font-size: 12px;
    line-height: 1.35;
    font-weight: 800;
}

.customer-page-shell .license-scan-status.is-success {
    border-color: #86efac;
    background: #f0fdf4;
    color: #166534;
}

.customer-page-shell .same-address-toggle.is-ready {
    cursor: pointer;
    opacity: 1;
    border-style: solid;
    border-color: #93c5fd;
    background: #eff6ff;
}

.customer-page-shell .same-address-toggle.is-ready strong {
    color: #1d4ed8;
}

@media (max-width: 980px) {
    .customer-page-shell .customer-info-grid,
    .customer-page-shell .address-grid {
        grid-template-columns: 1fr !important;
    }

    .customer-page-shell .field-email,
    .customer-page-shell .field-first-name,
    .customer-page-shell .field-last-name,
    .customer-page-shell .field-birth-date,
    .customer-page-shell .field-phone,
    .customer-page-shell .field-customer-type {
        grid-column: 1 / -1;
    }

    .customer-page-shell .zip-field,
    .customer-page-shell .zip-field .hcr-input {
        max-width: 100%;
    }

    .customer-page-shell .customer-save-actions.action-button-row {
        justify-content: stretch;
        flex-wrap: nowrap;
        width: 100%;
    }

    .customer-page-shell .action-button-row .customer-button {
        flex: 1 1 0;
        min-width: 0;
        padding-left: 10px;
        padding-right: 10px;
    }
}

@media (max-width: 980px) {
    .customer-page-shell .action-button-row .customer-button {
        width: auto !important;
    }
}

.customer-page-shell .license-scan-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.customer-page-shell .license-scan-status > span {
    flex: 1 1 auto;
}

.customer-page-shell .license-camera-scan-button,
.customer-page-shell .license-camera-stop-button {
    border: 1px solid #93c5fd;
    border-radius: 999px;
    background: #ffffff;
    color: #1d4ed8;
    cursor: pointer;
    font-size: 12px;
    font-weight: 900;
    padding: 7px 12px;
    white-space: nowrap;
}

.customer-page-shell .license-camera-scan-button:hover,
.customer-page-shell .license-camera-stop-button:hover {
    background: #dbeafe;
}


.customer-page-shell .license-camera-scan-button:disabled,
.customer-page-shell .license-camera-scan-button.is-unavailable {
    border-color: #cbd5e1;
    background: #f1f5f9;
    color: #64748b;
    cursor: not-allowed;
    opacity: .82;
}

.customer-page-shell .license-camera-scan-button:disabled:hover,
.customer-page-shell .license-camera-scan-button.is-unavailable:hover {
    background: #f1f5f9;
}

.customer-page-shell .license-camera-panel {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) auto;
    align-items: center;
    gap: 12px;
    margin: -4px 0 14px 0;
    padding: 12px;
    border: 1px solid #bfdbfe;
    border-radius: 16px;
    background: #f8fbff;
}

.customer-page-shell .license-camera-panel[hidden] {
    display: none !important;
}

.customer-page-shell .license-camera-panel video {
    width: 100%;
    max-height: 220px;
    border-radius: 12px;
    background: #0f172a;
    object-fit: cover;
}

@media (max-width: 720px) {
    .customer-page-shell .license-scan-status,
    .customer-page-shell .license-camera-panel {
        grid-template-columns: 1fr;
        align-items: stretch;
        flex-direction: column;
    }
}

/* ------------------------------------------------------------------
   Fix 43: Customer master two-column dense docking layout
   Splits New/Edit Customer into left/right operational columns and
   pins the save action footer without changing customer data logic.
------------------------------------------------------------------- */
.customer-page-shell {
    max-width: 1320px;
}

.customer-management-header-banner {
    width: 100%;
}

.customer-entry-form.edit-customer-form-master {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 24px !important;
    align-items: flex-start !important;
    width: 100%;
    padding-bottom: 80px;
}

.customer-grid-full-span,
.customer-entry-form.edit-customer-form-master > .customer-grid-full-span {
    grid-column: 1 / -1 !important;
    width: 100%;
}

.customer-entry-form.edit-customer-form-master > input[type="hidden"] {
    display: none !important;
}

.customer-form-column {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
    width: 100%;
}

.customer-form-column-left {
    grid-column: 1;
}

.customer-form-column-right {
    grid-column: 2;
}

.customer-entry-form.edit-customer-form-master .customer-form-card {
    width: 100%;
    margin-bottom: 0 !important;
}

.customer-entry-form.edit-customer-form-master .customer-card-heading {
    margin-bottom: 14px;
}

.customer-entry-form.edit-customer-form-master .customer-info-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px 14px !important;
}

.customer-entry-form.edit-customer-form-master .license-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px 14px !important;
}

.customer-entry-form.edit-customer-form-master .address-grid {
    grid-template-columns: minmax(0, 1fr) 92px 140px !important;
    gap: 14px 14px !important;
}

.customer-entry-form.edit-customer-form-master .state-field,
.customer-entry-form.edit-customer-form-master .zip-field,
.customer-entry-form.edit-customer-form-master .compact-date,
.customer-entry-form.edit-customer-form-master .compact-select {
    max-width: none !important;
}

.customer-entry-form.edit-customer-form-master .zip-field,
.customer-entry-form.edit-customer-form-master .zip-field .hcr-input {
    width: 100% !important;
    max-width: none !important;
}

.customer-entry-form.edit-customer-form-master .customer-flags-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px 14px !important;
}

.customer-entry-form.edit-customer-form-master .notes-field-stack {
    grid-column: 1 / -1 !important;
}

.customer-entry-form.edit-customer-form-master .dnr-reason-textarea {
    line-height: 1.5;
    padding: 12px !important;
}

.customer-actions.form-action-footer-bar {
    position: sticky;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
    margin-top: 0;
    padding: 16px 24px;
    border-top: 1px solid #dee2e6;
    border-radius: 18px 18px 0 0;
    background: rgba(248, 249, 250, .98);
    box-shadow: 0 -12px 28px rgba(15, 23, 42, .10);
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
}

.customer-actions.form-action-footer-bar .customer-save-actions.action-button-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    flex-wrap: nowrap !important;
    margin-left: auto;
}

.customer-actions.form-action-footer-bar .customer-button,
.customer-actions.form-action-footer-bar .customer-close-link {
    white-space: nowrap;
    flex: 0 0 auto;
}

@media (max-width: 1180px) {
    .customer-entry-form.edit-customer-form-master {
        grid-template-columns: 1fr !important;
    }

    .customer-form-column-left,
    .customer-form-column-right {
        grid-column: 1 / -1;
    }
}

@media (max-width: 820px) {
    .customer-entry-form.edit-customer-form-master .customer-info-grid,
    .customer-entry-form.edit-customer-form-master .license-grid,
    .customer-entry-form.edit-customer-form-master .address-grid,
    .customer-entry-form.edit-customer-form-master .customer-flags-grid {
        grid-template-columns: 1fr !important;
    }

    .customer-entry-form.edit-customer-form-master .field-email,
    .customer-entry-form.edit-customer-form-master .field-first-name,
    .customer-entry-form.edit-customer-form-master .field-last-name,
    .customer-entry-form.edit-customer-form-master .field-birth-date,
    .customer-entry-form.edit-customer-form-master .field-phone,
    .customer-entry-form.edit-customer-form-master .field-customer-type,
    .customer-entry-form.edit-customer-form-master .full-span,
    .customer-entry-form.edit-customer-form-master .notes-field-stack {
        grid-column: 1 / -1 !important;
    }

    .customer-actions.form-action-footer-bar {
        flex-direction: column-reverse !important;
        align-items: stretch !important;
    }

    .customer-actions.form-action-footer-bar .customer-save-actions.action-button-row {
        width: 100%;
        margin-left: 0;
    }

    .customer-actions.form-action-footer-bar .customer-button,
    .customer-actions.form-action-footer-bar .customer-close-link {
        width: 100%;
    }
}

/* ------------------------------------------------------------------
   Fix 44: Customer management grid balancing and sticky footer polish
   Separates the master screen canvas from the two-column data-entry grid,
   keeps documents/history full-width, and stabilizes the action footer.
------------------------------------------------------------------- */
.customer-management-master-canvas {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
}

.customer-entry-form.edit-customer-form-master {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    align-items: stretch !important;
    width: 100%;
    padding-bottom: 0 !important;
}

.top-form-inputs-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    grid-auto-rows: auto;
    gap: 20px !important;
    align-items: stretch !important;
    width: 100%;
}

.customer-entry-form.edit-customer-form-master .top-form-inputs-grid > .customer-form-column {
    display: contents !important;
}

.customer-entry-form.edit-customer-form-master .top-form-inputs-grid .customer-form-card {
    width: 100%;
    height: 100%;
    margin-bottom: 0 !important;
}

.customer-entry-form.edit-customer-form-master .top-form-inputs-grid .customer-info-card {
    grid-column: 1;
    grid-row: 1;
}

.customer-entry-form.edit-customer-form-master .top-form-inputs-grid .driver-license-card {
    grid-column: 1;
    grid-row: 2;
}

.customer-entry-form.edit-customer-form-master .top-form-inputs-grid .address-card {
    grid-column: 2;
    grid-row: 1;
}

.customer-entry-form.edit-customer-form-master .top-form-inputs-grid .account-flags-card {
    grid-column: 2;
    grid-row: 2;
}

.customer-management-header-banner,
.full-width-card,
.customer-documents-card.full-width-card,
.customer-history-card.full-width-card {
    width: 100% !important;
}

.customer-actions.form-action-footer-bar {
    position: sticky !important;
    bottom: 0;
    left: 0;
    right: 0;
    background: #111c24 !important;
    border-top: 1px solid #1e2d38 !important;
    padding: 14px 24px !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 12px !important;
    z-index: 100 !important;
    border-radius: 0 0 8px 8px !important;
    box-shadow: 0 -14px 28px rgba(15, 23, 42, .18) !important;
}

.customer-actions.form-action-footer-bar .customer-close-link {
    margin-right: auto;
    color: #e2e8f0 !important;
    background: rgba(255,255,255,.08) !important;
    border-color: rgba(255,255,255,.18) !important;
}

.customer-actions.form-action-footer-bar .customer-close-link:hover {
    color: #fff !important;
    background: rgba(255,255,255,.14) !important;
    text-decoration: none;
}

.customer-actions.form-action-footer-bar .customer-save-actions.action-button-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    flex-wrap: nowrap !important;
    margin-left: 0 !important;
}

.customer-actions.form-action-footer-bar .customer-button,
.customer-actions.form-action-footer-bar .customer-close-link {
    white-space: nowrap;
    flex: 0 0 auto;
}

@media (max-width: 1180px) {
    .top-form-inputs-grid {
        grid-template-columns: 1fr !important;
    }

    .customer-entry-form.edit-customer-form-master .top-form-inputs-grid .customer-info-card,
    .customer-entry-form.edit-customer-form-master .top-form-inputs-grid .driver-license-card,
    .customer-entry-form.edit-customer-form-master .top-form-inputs-grid .address-card,
    .customer-entry-form.edit-customer-form-master .top-form-inputs-grid .account-flags-card {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
        height: auto;
    }
}

@media (max-width: 820px) {
    .customer-actions.form-action-footer-bar {
        flex-direction: column-reverse !important;
        align-items: stretch !important;
        border-radius: 0 !important;
    }

    .customer-actions.form-action-footer-bar .customer-close-link {
        margin-right: 0;
    }

    .customer-actions.form-action-footer-bar .customer-save-actions.action-button-row {
        width: 100%;
        margin-left: 0 !important;
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .customer-actions.form-action-footer-bar .customer-button,
    .customer-actions.form-action-footer-bar .customer-close-link {
        width: 100%;
    }
}

/* ------------------------------------------------------------------
   Fix 45: Customer consolidated grid migration and phone overlay patch
   Keeps the four customer entry cards in a compact matrix, moves the
   action controls to a fixed viewport footer, and disables conflicting
   browser/contact autocomplete behavior for the phone field.
------------------------------------------------------------------- */
.customer-management-master-canvas {
    padding-bottom: 88px !important;
}

.four-card-input-matrix,
.top-form-inputs-grid.four-card-input-matrix {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 20px !important;
    align-items: stretch !important;
    width: 100% !important;
    margin-bottom: 24px !important;
}

.customer-entry-form.edit-customer-form-master .four-card-input-matrix > .customer-form-column {
    display: contents !important;
}

.customer-entry-form.edit-customer-form-master .four-card-input-matrix .customer-form-card {
    width: 100% !important;
    height: 100% !important;
    margin-bottom: 0 !important;
}

.master-action-footer-sticky,
.customer-actions.form-action-footer-bar.master-action-footer-sticky {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 64px !important;
    min-height: 64px !important;
    background: #111c24 !important;
    border-top: 1px solid #1e2d38 !important;
    border-radius: 0 !important;
    box-shadow: 0 -14px 28px rgba(15, 23, 42, .22) !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 0 24px !important;
    margin: 0 !important;
    z-index: 999 !important;
}

.customer-actions.form-action-footer-bar.master-action-footer-sticky .customer-close-link {
    margin-right: auto !important;
}

.customer-actions.form-action-footer-bar.master-action-footer-sticky .customer-save-actions.action-button-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    flex-wrap: nowrap !important;
    margin-left: 0 !important;
}

.customer-actions.form-action-footer-bar.master-action-footer-sticky .customer-button,
.customer-actions.form-action-footer-bar.master-action-footer-sticky .customer-close-link {
    white-space: nowrap !important;
    flex: 0 0 auto !important;
}

#customer-phone {
    appearance: none;
}

@media (max-width: 1180px) {
    .four-card-input-matrix,
    .top-form-inputs-grid.four-card-input-matrix {
        grid-template-columns: 1fr !important;
    }

    .customer-entry-form.edit-customer-form-master .four-card-input-matrix .customer-info-card,
    .customer-entry-form.edit-customer-form-master .four-card-input-matrix .driver-license-card,
    .customer-entry-form.edit-customer-form-master .four-card-input-matrix .address-card,
    .customer-entry-form.edit-customer-form-master .four-card-input-matrix .account-flags-card {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
        height: auto !important;
    }
}

@media (max-width: 820px) {
    .customer-management-master-canvas {
        padding-bottom: 210px !important;
    }

    .master-action-footer-sticky,
    .customer-actions.form-action-footer-bar.master-action-footer-sticky {
        height: auto !important;
        min-height: 0 !important;
        flex-direction: column-reverse !important;
        align-items: stretch !important;
        padding: 12px 16px !important;
    }

    .customer-actions.form-action-footer-bar.master-action-footer-sticky .customer-close-link {
        margin-right: 0 !important;
    }

    .customer-actions.form-action-footer-bar.master-action-footer-sticky .customer-save-actions.action-button-row {
        width: 100% !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
    }

    .customer-actions.form-action-footer-bar.master-action-footer-sticky .customer-button,
    .customer-actions.form-action-footer-bar.master-action-footer-sticky .customer-close-link {
        width: 100% !important;
    }
}


/* ------------------------------------------------------------------
   Fix 46: Address inline restructuring and required address fields
   Condenses the Address card and restores left alignment for document
   Added timestamps without changing customer/rental data persistence.
------------------------------------------------------------------- */
.customer-entry-form.edit-customer-form-master .address-grid,
.customer-page-shell .address-grid {
    display: grid !important;
    grid-template-columns: repeat(10, minmax(0, 1fr)) !important;
    gap: 14px 14px !important;
    align-items: start !important;
    width: 100% !important;
}

.customer-entry-form.edit-customer-form-master .address-line1-field,
.customer-page-shell .address-line1-field {
    grid-column: span 7 !important;
}

.customer-entry-form.edit-customer-form-master .address-line2-field,
.customer-page-shell .address-line2-field {
    grid-column: span 3 !important;
}

.customer-entry-form.edit-customer-form-master .address-grid .city-field,
.customer-page-shell .address-grid .city-field {
    grid-column: span 4 !important;
}

.customer-entry-form.edit-customer-form-master .address-grid .state-field,
.customer-page-shell .address-grid .state-field {
    grid-column: span 3 !important;
    max-width: none !important;
}

.customer-entry-form.edit-customer-form-master .address-grid .zip-field,
.customer-page-shell .address-grid .zip-field {
    grid-column: span 3 !important;
    max-width: none !important;
}

.customer-entry-form.edit-customer-form-master .address-grid .hcr-input,
.customer-page-shell .address-grid .hcr-input {
    width: 100% !important;
    max-width: none !important;
}

.customer-documents-card .hcr-table th:nth-child(4),
.customer-documents-card .hcr-table td:nth-child(4) {
    text-align: left !important;
    font-variant-numeric: normal !important;
}

@media (max-width: 820px) {
    .customer-entry-form.edit-customer-form-master .address-grid,
    .customer-page-shell .address-grid {
        grid-template-columns: 1fr !important;
    }

    .customer-entry-form.edit-customer-form-master .address-line1-field,
    .customer-entry-form.edit-customer-form-master .address-line2-field,
    .customer-entry-form.edit-customer-form-master .address-grid .city-field,
    .customer-entry-form.edit-customer-form-master .address-grid .state-field,
    .customer-entry-form.edit-customer-form-master .address-grid .zip-field,
    .customer-page-shell .address-line1-field,
    .customer-page-shell .address-line2-field,
    .customer-page-shell .address-grid .city-field,
    .customer-page-shell .address-grid .state-field,
    .customer-page-shell .address-grid .zip-field {
        grid-column: 1 / -1 !important;
    }
}

/* ------------------------------------------------------------------
   Fix 48: Vehicle form grid restructure and input unit hints
   Condenses vehicle identity/status cards while keeping existing model
   binding and controller behavior unchanged.
------------------------------------------------------------------- */
.vehicle-identity-rows,
.vehicle-status-pricing-row {
    width: 100%;
}

.vehicle-identity-rows {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.vehicle-identity-row {
    display: grid;
    gap: 14px 16px;
    align-items: start;
    width: 100%;
}

.vehicle-stock-vin-row {
    grid-template-columns: minmax(0, 3fr) minmax(0, 7fr);
}

.vehicle-year-plate-make-model-row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.vehicle-trim-row {
    grid-template-columns: minmax(0, 1fr);
}

.vehicle-trim-row .field-stack,
.vehicle-identity-row .field-stack,
.vehicle-status-pricing-row .field-stack {
    min-width: 0;
}

.vehicle-status-pricing-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px 16px;
    align-items: start;
}

.vehicle-input-affix {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}

.vehicle-input-affix .hcr-input {
    width: 100%;
}

.vehicle-money-affix .hcr-input {
    padding-left: 30px;
}

.vehicle-mileage-affix .hcr-input {
    padding-right: 38px;
}

.vehicle-affix-symbol {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    color: #475569;
    font-size: 14px;
    font-weight: 900;
    pointer-events: none;
}

.vehicle-money-affix .vehicle-affix-symbol {
    left: 12px;
}

.vehicle-mileage-affix .vehicle-affix-unit {
    right: 12px;
    text-transform: lowercase;
}

@media (max-width: 980px) {
    .vehicle-stock-vin-row,
    .vehicle-year-plate-make-model-row,
    .vehicle-status-pricing-row {
        grid-template-columns: 1fr !important;
    }
}

/* ------------------------------------------------------------------
   Fix 49: Database-mapped vehicle form restructure
   Exposes all vehicle table fields in a compact matrix while retaining
   the Fix48 unit/currency field affordances.
------------------------------------------------------------------- */
.vehicle-db-mapped-form .hcr-form-card {
    width: 100%;
}

.vehicle-db-identity-grid,
.vehicle-db-status-grid {
    display: grid !important;
    gap: 14px 16px !important;
    align-items: start !important;
    width: 100% !important;
}

.vehicle-db-identity-grid {
    grid-template-columns: repeat(20, minmax(0, 1fr)) !important;
}

.vehicle-db-status-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.vehicle-db-identity-grid .field-stack,
.vehicle-db-status-grid .field-stack {
    min-width: 0 !important;
}

.vehicle-stock-field,
.vehicle-asset-field {
    grid-column: span 5;
}

.vehicle-vin-field {
    grid-column: span 10;
}

.vehicle-year-field,
.vehicle-color-field,
.vehicle-plate-field,
.vehicle-quantity-field,
.vehicle-category-field {
    grid-column: span 4;
}

.vehicle-make-field,
.vehicle-model-field,
.vehicle-trim-field,
.vehicle-body-field {
    grid-column: span 5;
}

.vehicle-title-field,
.vehicle-title-scan-field {
    grid-column: span 10;
}

.vehicle-title-scan-toggle {
    min-height: 38px;
    border: 1px solid var(--hcr-border-strong);
    background: #ffffff;
    border-radius: 10px;
    padding: 8px 10px;
    margin: 0;
}

.vehicle-db-mapped-form .vin-format-input {
    text-transform: uppercase;
}

.vehicle-db-mapped-form input[type="number"] {
    min-width: 0;
}

@media (max-width: 1100px) {
    .vehicle-db-identity-grid,
    .vehicle-db-status-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .vehicle-stock-field,
    .vehicle-vin-field,
    .vehicle-asset-field,
    .vehicle-year-field,
    .vehicle-color-field,
    .vehicle-plate-field,
    .vehicle-quantity-field,
    .vehicle-category-field,
    .vehicle-make-field,
    .vehicle-model-field,
    .vehicle-trim-field,
    .vehicle-body-field,
    .vehicle-title-field,
    .vehicle-title-scan-field {
        grid-column: span 1 !important;
    }
}

@media (max-width: 720px) {
    .vehicle-db-identity-grid,
    .vehicle-db-status-grid {
        grid-template-columns: 1fr !important;
    }
}

/* ------------------------------------------------------------------
   Fix 50: Vehicle status/rate separation and quick update modal
   Keeps static compliance fields on the master vehicle form while moving
   high-frequency operational edits to the Vehicles list quick modal.
------------------------------------------------------------------- */
.vehicle-master-static-form .vehicle-identity-card + .hcr-form-card {
    margin-top: 18px;
}

.vehicle-purchase-date-field,
.vehicle-purchase-price-field,
.vehicle-in-service-field,
.vehicle-end-service-field {
    grid-column: span 5;
}

.vehicles-master-table .vehicle-table-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    white-space: nowrap;
}

.quick-vehicle-update-button {
    min-height: 32px;
    padding: 7px 12px;
    font-size: 12px;
}

.quick-vehicle-update-panel {
    max-width: 620px;
    width: min(620px, calc(100vw - 32px));
}

.quick-vehicle-summary {
    border: 1px solid var(--hcr-border-strong);
    background: #f8fafc;
    border-radius: 12px;
    padding: 12px 14px;
    margin: 0 0 14px;
    color: #10243a;
    font-size: 14px;
    font-weight: 800;
}

.quick-vehicle-update-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    width: 100%;
}

.quick-vehicle-update-grid .field-stack {
    min-width: 0;
}

.quick-vehicle-actions {
    margin-top: 18px;
}

@media (max-width: 1100px) {
    .vehicle-purchase-date-field,
    .vehicle-purchase-price-field,
    .vehicle-in-service-field,
    .vehicle-end-service-field {
        grid-column: span 1 !important;
    }
}

@media (max-width: 720px) {
    .quick-vehicle-update-grid {
        grid-template-columns: 1fr;
    }

    .vehicles-master-table .vehicle-table-actions {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ------------------------------------------------------------------
   Fix 51: Vehicle title row height equalization
   Keeps Title Number and Title Scan Attachment Status flush on Row 4
   across Create/Edit Vehicle forms.
------------------------------------------------------------------- */
.title-document-row-grid {
    grid-column: 1 / -1 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    gap: 16px !important;
    width: 100% !important;
}

.title-input-wrapper,
.title-scan-status-card {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    align-self: stretch !important;
}

.title-input-wrapper > label,
.title-scan-status-card > label:first-child {
    white-space: nowrap;
}

.title-input-wrapper input.hcr-input,
.title-scan-status-card .card-inner-border {
    flex: 1 1 auto !important;
    min-height: 48px !important;
}

.title-scan-status-card .card-inner-border {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
}

@media (max-width: 720px) {
    .title-document-row-grid {
        flex-direction: column !important;
    }
}

/* ------------------------------------------------------------------
   Fix 52: Vehicle descriptor dropdowns and header status badge
   Standardizes Category/Body Type/Color inputs and surfaces availability
   immediately on the Edit Vehicle header.
------------------------------------------------------------------- */
.vehicle-standard-select {
    width: 100%;
    min-width: 0;
}

.vehicle-edit-title-bar {
    display: flex;
    align-items: center;
    gap: 0;
    flex-wrap: wrap;
}

.vehicle-status-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 12px;
    margin-left: 16px;
    line-height: 1;
    letter-spacing: .2px;
    white-space: nowrap;
}

.vehicle-status-badge.status-active {
    background-color: #e6f4ea;
    color: #137333;
}

.vehicle-status-badge.status-inactive {
    background-color: #fce8e6;
    color: #c5221f;
}


/* ------------------------------------------------------------------
   Fix 53: Vehicle color dropdown chevron polish
   Adds the same visual dropdown indicator to the Color select that the
   neighboring Category and Body Type select controls show.
------------------------------------------------------------------- */
.vehicle-select-chevron-wrapper {
    position: relative;
    width: 100%;
}

.vehicle-select-chevron-wrapper .vehicle-standard-select {
    padding-right: 36px !important;
}

.vehicle-select-chevron {
    position: absolute;
    top: 50%;
    right: 13px;
    transform: translateY(-50%);
    color: #334155;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    pointer-events: none;
}

.vehicle-color-select-wrapper .vehicle-color-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: #ffffff;
}


/* ------------------------------------------------------------------
   Fix 54: Vehicle identity grid balancing and title scan alignment
   Tightens short ID fields, converts Year to keyboard-friendly text,
   and aligns the title scan status control to the right side of Row 4.
------------------------------------------------------------------- */
.vehicle-db-identity-grid {
    grid-template-columns: repeat(20, minmax(0, 1fr)) !important;
}

.vehicle-db-identity-grid .vehicle-stock-field,
.vehicle-db-identity-grid .vehicle-asset-field {
    grid-column: span 5 !important; /* 25% / 50% / 25% row with VIN */
}

.vehicle-db-identity-grid .vehicle-vin-field {
    grid-column: span 10 !important;
}

.vehicle-year-text-input {
    appearance: textfield;
    -moz-appearance: textfield;
}

.vehicle-year-text-input::-webkit-outer-spin-button,
.vehicle-year-text-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.title-document-row-grid {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 40%) minmax(0, 60%) !important;
    align-items: stretch !important;
    gap: 16px !important;
    width: 100% !important;
}

.title-input-wrapper,
.title-scan-status-card {
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    align-self: stretch !important;
}

.title-input-wrapper input.hcr-input,
.title-scan-status-card .card-inner-border {
    min-height: 48px !important;
}

.title-scan-status-card .card-inner-border,
.vehicle-title-scan-toggle.card-inner-border {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    text-align: right !important;
    white-space: nowrap !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
}

.title-scan-status-card .card-inner-border span,
.vehicle-title-scan-toggle.card-inner-border span {
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: ellipsis;
}

.title-scan-status-card .card-inner-border input[type="checkbox"],
.vehicle-title-scan-toggle.card-inner-border input[type="checkbox"] {
    flex: 0 0 auto !important;
    margin: 0 !important;
}

@media (max-width: 720px) {
    .title-document-row-grid {
        grid-template-columns: 1fr !important;
    }

    .title-scan-status-card .card-inner-border,
    .vehicle-title-scan-toggle.card-inner-border {
        justify-content: flex-start !important;
        text-align: left !important;
    }
}

/* ------------------------------------------------------------------
   Fix 56: Vehicle title row rewrite and recovery
   Restores Row 4 as a compact 40/60 inline grid, recovers the title
   scan status text, left-aligns the checkbox group, and keeps Row 5
   timeline inputs flush on one baseline.
------------------------------------------------------------------- */
.vehicle-db-identity-grid .title-document-row-grid,
.title-document-row-grid {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 40%) minmax(0, 60%) !important;
    align-items: end !important;
    gap: 16px !important;
    width: 100% !important;
}

.title-document-row-grid .title-input-wrapper,
.title-document-row-grid .title-scan-status-card {
    min-width: 0 !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    align-self: stretch !important;
}

.title-document-row-grid .title-input-wrapper > label,
.title-document-row-grid .title-scan-status-card > label:first-child {
    display: block !important;
    min-height: 18px !important;
    margin: 0 0 6px !important;
    white-space: nowrap !important;
}

.title-document-row-grid .title-input-wrapper input.hcr-input {
    height: 44px !important;
    min-height: 44px !important;
}

.title-document-row-grid .title-scan-status-card .card-inner-border,
.title-document-row-grid .vehicle-title-scan-toggle.card-inner-border {
    height: 44px !important;
    min-height: 44px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    padding: 12px 16px !important;
    margin: 0 !important;
    text-align: left !important;
    white-space: nowrap !important;
    border: 1px solid var(--hcr-border-strong) !important;
    border-radius: 10px !important;
    background: #ffffff !important;
}

.title-document-row-grid .title-scan-status-card .card-inner-border input[type="checkbox"],
.title-document-row-grid .vehicle-title-scan-toggle.card-inner-border input[type="checkbox"] {
    flex: 0 0 auto !important;
    margin: 0 !important;
}

.title-document-row-grid .title-scan-status-card .card-inner-border span,
.title-document-row-grid .vehicle-title-scan-toggle.card-inner-border span {
    display: inline-block !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
    text-align: left !important;
}

.vehicle-purchase-date-field,
.vehicle-purchase-price-field,
.vehicle-in-service-field,
.vehicle-end-service-field {
    grid-column: span 5 !important;
    align-self: end !important;
}

.vehicle-purchase-date-field input.hcr-input,
.vehicle-purchase-price-field .vehicle-input-affix,
.vehicle-in-service-field input.hcr-input,
.vehicle-end-service-field input.hcr-input {
    min-height: 44px !important;
}

@media (max-width: 720px) {
    .vehicle-db-identity-grid .title-document-row-grid,
    .title-document-row-grid {
        grid-template-columns: 1fr !important;
        align-items: stretch !important;
    }
}

/* ------------------------------------------------------------------
   Fix 57: Vehicle title row hard reconstruction
   Removes legacy grid-span conflicts by using dedicated title row column
   classes and locks Title Number + Title Scan onto one 40/60 row.
------------------------------------------------------------------- */
.vehicle-db-identity-grid > .vehicle-title-row-final,
.vehicle-title-row-final {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 40%) minmax(0, 60%) !important;
    gap: 16px !important;
    align-items: end !important;
    width: 100% !important;
    min-width: 0 !important;
}

.vehicle-title-row-final > .title-number-column,
.vehicle-title-row-final > .title-scan-column {
    grid-column: auto !important;
    min-width: 0 !important;
    width: 100% !important;
    align-self: end !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
}

.vehicle-title-row-final > .title-number-column > label,
.vehicle-title-row-final > .title-scan-column > label:first-child {
    display: block !important;
    margin: 0 0 6px !important;
    min-height: 18px !important;
    white-space: nowrap !important;
    overflow: visible !important;
}

.vehicle-title-row-final > .title-number-column input.hcr-input {
    height: 44px !important;
    min-height: 44px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.vehicle-title-row-final > .title-scan-column .vehicle-title-scan-toggle.card-inner-border {
    height: 44px !important;
    min-height: 44px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    padding: 0 16px !important;
    margin: 0 !important;
    border: 1px solid var(--hcr-border-strong) !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    text-align: left !important;
    overflow: hidden !important;
}

.vehicle-title-row-final > .title-scan-column .vehicle-title-scan-toggle.card-inner-border input[type="checkbox"] {
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
}

.vehicle-title-row-final > .title-scan-column .vehicle-title-scan-toggle.card-inner-border span {
    display: inline-block !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 30px) !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.2 !important;
    text-align: left !important;
}

@media (max-width: 720px) {
    .vehicle-db-identity-grid > .vehicle-title-row-final,
    .vehicle-title-row-final {
        grid-template-columns: 1fr !important;
        align-items: stretch !important;
    }
}


/* ------------------------------------------------------------------
   Fix 58: Vehicle title scan upload dropzone
   Converts the Title Scan status card into a click/drag upload target
   while preserving the rigid 40/60 Title Number + Title Scan row.
------------------------------------------------------------------- */
.vehicle-title-row-final > .title-scan-column .title-scan-upload-dropzone {
    cursor: pointer !important;
    position: relative !important;
    transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease !important;
}

.vehicle-title-row-final > .title-scan-column .title-scan-upload-dropzone:hover,
.vehicle-title-row-final > .title-scan-column .title-scan-upload-dropzone:focus,
.vehicle-title-row-final > .title-scan-column .title-scan-upload-dropzone.is-drag-over {
    border-color: #1a73e8 !important;
    background: #f8fbff !important;
    box-shadow: 0 0 0 3px rgba(26, 115, 232, .10) !important;
    outline: none !important;
}

.vehicle-title-row-final > .title-scan-column .title-scan-upload-dropzone.is-uploaded {
    border-color: #137333 !important;
    background: #f7fff9 !important;
}

.vehicle-title-row-final > .title-scan-column .title-scan-upload-label {
    display: inline-block !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    line-height: 1.2 !important;
    text-align: left !important;
}

.title-scan-spinner {
    width: 16px;
    height: 16px;
    border: 2px solid #d9e2ec;
    border-top-color: #1a73e8;
    border-radius: 50%;
    animation: hcr-title-scan-spin .8s linear infinite;
    flex: 0 0 16px;
    margin-left: auto;
}

.title-scan-spinner[hidden] {
    display: none !important;
}

@keyframes hcr-title-scan-spin {
    to { transform: rotate(360deg); }
}

/* ------------------------------------------------------------------
   Fix 59: Vehicle features and capacity integration
   Adds vehicle_features inputs as a 4-column row inside the Vehicle
   Identity card and preserves compact database-mapped layout behavior.
------------------------------------------------------------------- */
.vehicle-db-identity-grid > .vehicle-features-capacity-row,
.vehicle-features-capacity-row {
    grid-column: 1 / -1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 12px 14px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    background: #f8fafc !important;
}

.vehicle-features-capacity-heading {
    color: #1e3a8a;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    line-height: 1.2;
}

.vehicle-features-capacity-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 14px 16px !important;
    align-items: end !important;
    width: 100% !important;
}

.vehicle-features-capacity-grid .field-stack {
    min-width: 0 !important;
}

.vehicle-features-capacity-grid .hcr-input,
.vehicle-features-capacity-grid .hcr-select {
    width: 100% !important;
    min-width: 0 !important;
}

@media (max-width: 980px) {
    .vehicle-features-capacity-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    .vehicle-features-capacity-grid {
        grid-template-columns: 1fr !important;
    }
}

/* ------------------------------------------------------------------
   Fix 60: Automated VIN decoder and auto-populate controls
   Adds Decode button, loading spinner, and VIN decoder status feedback.
------------------------------------------------------------------- */
.vehicle-vin-decode-control {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 8px !important;
    position: relative !important;
    width: 100% !important;
}

.vehicle-vin-decode-input {
    padding-right: 34px !important;
}

.vin-decode-button {
    height: 44px !important;
    padding: 0 14px !important;
    border: 1px solid #1a73e8 !important;
    border-radius: 10px !important;
    background: #e8f0fe !important;
    color: #174ea6 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: .02em !important;
    cursor: pointer !important;
    white-space: nowrap !important;
}

.vin-decode-button:hover,
.vin-decode-button:focus {
    background: #d2e3fc !important;
    outline: none !important;
}

.vin-decode-button:disabled {
    cursor: progress !important;
    opacity: .70 !important;
}

.vin-decode-spinner {
    position: absolute !important;
    right: 82px !important;
    top: 50% !important;
    width: 16px !important;
    height: 16px !important;
    margin-top: -8px !important;
    border: 2px solid #d9e2ec !important;
    border-top-color: #1a73e8 !important;
    border-radius: 50% !important;
    animation: hcr-vin-decode-spin .8s linear infinite !important;
    pointer-events: none !important;
}

.vin-decode-spinner[hidden] {
    display: none !important;
}

.vehicle-vin-decode-input.is-decoding-vin {
    background: #f8fbff !important;
    border-color: #1a73e8 !important;
}

.vin-decode-status {
    display: block !important;
    min-height: 14px !important;
    margin-top: 4px !important;
    font-size: 11px !important;
    line-height: 14px !important;
    font-weight: 700 !important;
}

.vin-decode-status.is-muted {
    color: #5f6368 !important;
}

.vin-decode-status.is-success {
    color: #137333 !important;
}

.vin-decode-status.is-error {
    color: #c5221f !important;
}

.vehicle-db-mapped-form input:disabled,
.vehicle-db-mapped-form select:disabled {
    background: #f1f5f9 !important;
    color: #64748b !important;
    cursor: progress !important;
}

@keyframes hcr-vin-decode-spin {
    to { transform: rotate(360deg); }
}

@media (max-width: 720px) {
    .vehicle-vin-decode-control {
        grid-template-columns: 1fr !important;
    }

    .vin-decode-button {
        width: 100% !important;
    }

    .vin-decode-spinner {
        right: 12px !important;
        top: 22px !important;
    }
}

/* Fix64: make server-side vehicle save errors visible after production-schema validation. */
.hcr-validation-summary.validation-summary-errors,
.hcr-validation-summary ul {
    margin: 0 0 16px 0;
    padding: 10px 14px;
    border: 1px solid #f1b8b8;
    border-radius: 12px;
    background: #fff1f1;
    color: #9f1239;
    font-weight: 700;
}

.hcr-validation-summary ul {
    list-style: none;
}

/* ------------------------------------------------------------------
   Fix 65: Vehicle operational status/rate entry
   Keeps vehicle master data static while exposing status/rate/mileage
   through a separate operational quick-update workspace.
------------------------------------------------------------------- */
.vehicle-operational-card {
    margin-bottom: 18px;
}

.vehicle-operational-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
    gap: 12px;
    align-items: stretch;
}

.vehicle-operational-metric {
    border: 1px solid var(--hcr-border-strong);
    background: #f8fafc;
    border-radius: 12px;
    padding: 12px 14px;
    min-width: 0;
}

.vehicle-operational-metric span {
    display: block;
    color: #64748b;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.vehicle-operational-metric strong {
    display: block;
    color: #10243a;
    font-size: 16px;
    font-weight: 900;
    overflow-wrap: anywhere;
}

.vehicle-operational-edit-button {
    align-self: center;
    white-space: nowrap;
    min-height: 44px;
    padding-inline: 18px;
}

@media (max-width: 1100px) {
    .vehicle-operational-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vehicle-operational-edit-button {
        grid-column: 1 / -1;
        justify-self: flex-end;
    }
}

@media (max-width: 720px) {
    .vehicle-operational-summary-grid {
        grid-template-columns: 1fr;
    }

    .vehicle-operational-edit-button {
        width: 100%;
        justify-self: stretch;
    }
}

/* ------------------------------------------------------------------
   Fix 66: Fleet Rates central workspace
   Moves operational status/rate editing out of the Vehicle master form
   and into a bulk-edit operational menu page.
------------------------------------------------------------------- */
.vehicle-static-form-notice {
    margin: 0 0 16px 0;
    padding: 12px 16px;
    border: 1px solid #bfdbfe;
    border-radius: 14px;
    background: #eff6ff;
    color: #1e3a8a;
    font-size: 13px;
    font-weight: 800;
}

.vehicle-static-form-notice a {
    color: #0b57d0;
    text-decoration: underline;
}

.fleet-rates-intro-card,
.fleet-bulk-tools-card {
    display: flex;
    align-items: end;
    gap: 16px;
    margin-bottom: 16px;
    padding: 14px 16px;
    border: 1px solid var(--hcr-border-strong);
    border-radius: 14px;
    background: #f8fafc;
}

.fleet-rates-intro-card {
    align-items: center;
    justify-content: space-between;
}

.fleet-rates-intro-card p {
    margin: 4px 0 0 0;
    color: #4b5563;
    font-size: 13px;
    font-weight: 700;
}

.fleet-rates-filter-form {
    margin-bottom: 14px;
}

.fleet-rates-filter-grid {
    grid-template-columns: auto minmax(220px, 1fr) minmax(170px, 220px) auto auto auto;
    align-items: center;
}

.fleet-rates-checkbox-filter {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #334155;
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
}

.fleet-bulk-tools-card {
    display: grid;
    grid-template-columns: minmax(180px, 260px) auto minmax(220px, 1fr) auto;
    align-items: end;
}

.fleet-rates-table-wrap {
    overflow-x: auto;
}

.fleet-rates-table th,
.fleet-rates-table td {
    vertical-align: middle;
}

.fleet-rates-table .hcr-input,
.fleet-rates-table .hcr-select {
    min-width: 120px;
    width: 100%;
}

.fleet-rate-subline {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 11px;
    font-weight: 800;
}

.fleet-rate-status-select {
    min-width: 150px !important;
}

.fleet-rate-location-input {
    min-width: 160px !important;
}

.fleet-rate-daily-input,
.fleet-rate-mileage-input {
    min-width: 120px !important;
}

.fleet-rates-save-row {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 18px;
}

@media (max-width: 1100px) {
    .fleet-rates-filter-grid,
    .fleet-bulk-tools-card {
        grid-template-columns: 1fr 1fr;
    }

    .fleet-rates-intro-card {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 720px) {
    .fleet-rates-filter-grid,
    .fleet-bulk-tools-card {
        grid-template-columns: 1fr;
    }

    .fleet-rates-save-row {
        flex-direction: column;
    }
}


/* Fix69 - Legacy closed Access order display */
.legacy-closed-order-alert {
    margin: 14px 0;
    padding: 12px 16px;
    border-radius: 14px;
    background: #ecfdf5;
    border: 1px solid #bbf7d0;
    color: #065f46;
    font-weight: 800;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
}

.legacy-closed-action,
button.is-disabled {
    opacity: 0.65;
    cursor: not-allowed !important;
}


/* Fix70 - Tax Reports */
.tax-report-page {
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.tax-report-hero,
.tax-report-filter-card,
.tax-report-filing-card,
.tax-report-orders-card {
    background: rgba(255, 255, 255, 0.96);
    border-radius: 20px;
    padding: 18px;
    box-shadow: 0 18px 50px rgba(15, 23, 42, 0.14);
}
.tax-report-hero {
    background: linear-gradient(135deg, #1d4ed8, #06b6d4);
    color: white;
}
.tax-report-hero h1 { margin: 0; font-size: 28px; }
.tax-report-hero p { margin: 6px 0 0; opacity: .9; }
.tax-filter-grid {
    display: grid;
    grid-template-columns: 180px 180px minmax(260px, 1fr) auto;
    gap: 12px;
    align-items: end;
}
.tax-filter-grid label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-weight: 800;
    color: #334155;
}
.tax-filter-grid input,
.tax-filter-grid textarea {
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    padding: 10px 12px;
    font: inherit;
}
.tax-exclude-field small { color: #64748b; font-weight: 600; }
.tax-filter-actions { display: flex; gap: 8px; align-items: center; }
.tax-report-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}
.tax-report-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 16px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .08);
}
.tax-report-card span,
.tax-report-card small { display: block; color: #64748b; font-weight: 700; }
.tax-report-card strong { display: block; margin: 8px 0; color: #0f172a; font-size: 24px; }
.tax-filing-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.tax-filing-grid > div { border: 1px solid #e2e8f0; border-radius: 16px; padding: 14px; background: #f8fafc; }
.tax-filing-grid h3 { margin: 0 0 6px; }
.tax-filing-grid p { margin: 0 0 8px; color: #475569; }
.tax-report-table-header { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.tax-report-table-wrap { overflow: auto; }
.tax-report-table { width: 100%; border-collapse: collapse; }
.tax-report-table th,
.tax-report-table td { padding: 10px 8px; border-bottom: 1px solid #e5e7eb; text-align: left; white-space: nowrap; }
.tax-report-table th { background: #f1f5f9; color: #334155; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; }
.tax-report-table tr.is-excluded td { color: #94a3b8; text-decoration: line-through; background: #f8fafc; }
@media (max-width: 1100px) {
    .tax-filter-grid,
    .tax-report-summary-grid,
    .tax-filing-grid { grid-template-columns: 1fr; }
}

/* Fix70C - management reports hub and aggregate tax-report layout */
.reports-hub-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
}
.reports-hub-link {
    display: grid;
    gap: 8px;
    padding: 18px;
    border: 1px solid rgba(148, 163, 184, .35);
    border-radius: 18px;
    background: #fff;
    color: #0f172a;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(15,23,42,.08);
}
.reports-hub-link strong {
    font-size: 1.05rem;
}
.reports-hub-link span {
    color: #64748b;
    font-weight: 700;
    line-height: 1.4;
}
.reports-hub-link.is-disabled {
    opacity: .65;
}
.tax-report-old-style-card {
    display: grid;
    grid-template-columns: 230px 1fr;
    gap: 0;
    margin: 18px 0;
    border-radius: 18px;
    background: #fff;
    border: 1px solid rgba(148, 163, 184, .3);
    overflow: hidden;
    box-shadow: 0 12px 28px rgba(15,23,42,.08);
}
.tax-report-sub-menu-title {
    grid-column: 1;
    padding: 14px 18px;
    background: #0078b8;
    color: #fff;
    font-weight: 900;
}
.tax-report-sub-menu-grid {
    grid-column: 1;
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 18px;
    background: #eef6fb;
    min-height: 210px;
}
.tax-report-sub-menu-grid a,
.tax-report-sub-menu-grid span {
    color: #0066b3;
    font-weight: 900;
    text-decoration: none;
}
.tax-report-checklist {
    grid-column: 2;
    grid-row: 1 / span 2;
    padding: 22px 28px;
}
.tax-report-checklist h2 {
    margin: 0 0 18px;
}
.tax-report-checklist label {
    display: block;
    margin: 12px 0;
    color: #0066b3;
    font-weight: 900;
}
.tax-report-checklist input[type="checkbox"] {
    width: 32px;
    height: 20px;
    margin-right: 12px;
    vertical-align: middle;
}
.tax-report-checklist small {
    color: #0f172a;
    font-style: italic;
    font-weight: 600;
}
.tax-report-note {
    margin-top: 16px;
    padding: 10px 12px;
    border-radius: 12px;
    background: #fef3c7;
    color: #92400e;
    font-weight: 800;
}
@media (max-width: 900px) {
    .tax-report-old-style-card {
        grid-template-columns: 1fr;
    }
    .tax-report-checklist {
        grid-column: 1;
        grid-row: auto;
    }
}

/* Fix70D - Management aggregate tax and fee reports */
.tax70d-page {
    max-width: 1420px;
    margin: 0 auto;
    padding: 28px 24px 44px;
}
.tax70d-hero {
    border-radius: 24px;
    padding: 28px 32px;
    margin-bottom: 24px;
    background: linear-gradient(135deg, #0f172a, #2563eb 58%, #14b8a6);
    color: #fff;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .22);
}
.tax70d-hero h1 {
    margin: 0;
    font-size: 32px;
    letter-spacing: -0.03em;
}
.tax70d-hero p {
    margin: 6px 0 0;
    max-width: 860px;
    opacity: .9;
    font-weight: 700;
}
.tax70d-eyebrow {
    margin: 0 0 8px !important;
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: 12px;
    font-weight: 900;
    opacity: .75;
}
.tax70d-layout {
    display: grid;
    grid-template-columns: 340px minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}
.tax70d-filter-panel,
.tax70d-summary-section,
.tax70d-orders-section {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 22px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .09);
}
.tax70d-filter-panel {
    position: sticky;
    top: 88px;
    padding: 20px;
}
.tax70d-filter-panel h2,
.tax70d-section-heading h2,
.tax70d-orders-section h2 {
    margin: 0;
    color: #0f172a;
    letter-spacing: -0.02em;
}
.tax70d-filter-section {
    padding: 18px 0;
    border-top: 1px solid #eef2f7;
}
.tax70d-filter-section:first-of-type { border-top: 0; }
.tax70d-filter-section h3 {
    margin: 0 0 10px;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #334155;
}
.tax70d-help,
.tax70d-section-heading p,
.tax70d-orders-section p {
    color: #64748b;
    font-size: 13px;
    font-weight: 700;
}
.tax70d-field {
    display: block;
    font-size: 13px;
    font-weight: 900;
    color: #334155;
    margin-bottom: 12px;
}
.tax70d-field input,
.tax70d-field select {
    width: 100%;
    margin-top: 6px;
    padding: 11px 12px;
    border: 1px solid #dbe3ee;
    border-radius: 12px;
    font-weight: 800;
    color: #0f172a;
    background: #fff;
}
.tax70d-check {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin: 10px 0;
    padding: 12px;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    background: #f8fafc;
    font-weight: 900;
    color: #0f172a;
}
.tax70d-check small {
    display: block;
    color: #64748b;
    font-weight: 800;
    margin-top: 2px;
}
.tax70d-check.is-locked {
    background: #ecfdf5;
    border-color: #bbf7d0;
    color: #065f46;
}
.tax70d-period-pill,
.tax70d-exclusion-count {
    padding: 10px 12px;
    border-radius: 12px;
    background: #eff6ff;
    color: #1d4ed8;
    font-size: 12px;
    font-weight: 900;
}
.tax70d-link-button {
    border: 0;
    background: transparent;
    color: #2563eb;
    font-weight: 900;
    cursor: pointer;
    padding: 6px 0;
}
.tax70d-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    padding-top: 16px;
}
.tax70d-output {
    display: grid;
    gap: 24px;
}
.tax70d-summary-section,
.tax70d-orders-section {
    padding: 22px;
}
.tax70d-section-heading,
.tax70d-table-header {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 18px;
}
.tax70d-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
}
.tax70d-summary-card {
    border: 1px solid #dbeafe;
    border-radius: 18px;
    padding: 18px;
    background: linear-gradient(180deg, #f8fbff, #fff);
}
.tax70d-summary-card h3 {
    margin: 0 0 10px;
    color: #1e3a8a;
    font-size: 16px;
}
.tax70d-summary-card strong {
    display: block;
    font-size: 26px;
    color: #0f172a;
    margin-bottom: 12px;
}
.tax70d-summary-card dl {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 6px 12px;
    margin: 0 0 12px;
    font-size: 13px;
}
.tax70d-summary-card dt {
    color: #64748b;
    font-weight: 900;
}
.tax70d-summary-card dd {
    margin: 0;
    color: #0f172a;
    font-weight: 900;
}
.tax70d-summary-card p {
    margin: 0;
    color: #64748b;
    font-size: 13px;
    font-weight: 700;
}
.tax70d-empty-state {
    padding: 18px;
    border-radius: 16px;
    background: #f8fafc;
    color: #64748b;
    font-weight: 900;
}
.tax70d-export-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.tax70d-table-wrap,
.tax70d-modal-table-wrap {
    overflow-x: auto;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
}
.tax70d-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.tax70d-table th {
    background: #f1f5f9;
    color: #334155;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-size: 11px;
    text-align: left;
    padding: 12px;
    white-space: nowrap;
}
.tax70d-table td {
    padding: 12px;
    border-top: 1px solid #eef2f7;
    color: #0f172a;
    font-weight: 750;
    white-space: nowrap;
}
.tax70d-table tr.is-excluded td {
    background: #fff1f2;
    color: #9f1239;
    text-decoration: line-through;
}
.tax70d-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(15, 23, 42, .58);
    padding: 42px;
    overflow: auto;
}
.tax70d-modal.is-open { display: block; }
.tax70d-modal-panel {
    max-width: 1120px;
    margin: 0 auto;
    background: #fff;
    border-radius: 22px;
    padding: 22px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .35);
}
.tax70d-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
}
.tax70d-modal-close {
    width: 38px;
    height: 38px;
    border-radius: 999px;
    border: 0;
    background: #fee2e2;
    color: #991b1b;
    font-size: 24px;
    font-weight: 900;
    cursor: pointer;
}
.tax70d-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 18px;
}
@media (max-width: 1100px) {
    .tax70d-layout { grid-template-columns: 1fr; }
    .tax70d-filter-panel { position: static; }
}
@media print {
    .tax70d-filter-panel,
    .tax70d-export-actions,
    .hcr-sidebar,
    .hcr-app-header,
    .tax70d-modal { display: none !important; }
    .tax70d-layout { display: block; }
    .tax70d-page { padding: 0; max-width: none; }
    .tax70d-summary-section,
    .tax70d-orders-section,
    .tax70d-hero { box-shadow: none; border: 1px solid #d1d5db; }
}

/* Fix70E - Aggregate tax report usability cleanup: no horizontal scrolling, duplicate review chips */
.tax70d-page {
    max-width: 1500px;
    width: min(1500px, calc(100vw - 64px));
}
.tax70d-layout {
    grid-template-columns: minmax(280px, 320px) minmax(0, 1fr);
}
.tax70d-output,
.tax70d-summary-section,
.tax70d-orders-section,
.tax70d-card-grid {
    min-width: 0;
}
.tax70d-section-heading,
.tax70d-table-header {
    align-items: flex-start;
    flex-wrap: wrap;
}
.tax70d-export-actions {
    justify-content: flex-start;
}
.tax70e-order-list {
    display: grid;
    gap: 12px;
}
.tax70e-order-card {
    display: grid;
    grid-template-columns: 90px minmax(0, 1fr) minmax(240px, 340px);
    gap: 14px;
    align-items: start;
    padding: 14px;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 6px 18px rgba(15, 23, 42, .04);
}
.tax70e-order-card.is-excluded {
    background: #fff1f2;
    border-color: #fecdd3;
}
.tax70e-order-card.is-duplicate {
    border-color: #facc15;
    background: linear-gradient(180deg, #fffbeb, #ffffff 64%);
}
.tax70e-exclude-inline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: 900;
    color: #475569;
}
.tax70e-order-main {
    min-width: 0;
}
.tax70e-order-title-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 4px;
}
.tax70e-order-id {
    font-size: 15px;
    font-weight: 950;
    color: #2563eb;
    text-decoration: none;
}
.tax70e-order-id:hover { text-decoration: underline; }
.tax70e-order-subtitle {
    font-size: 15px;
    font-weight: 950;
    color: #0f172a;
    margin-bottom: 8px;
}
.tax70e-order-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    color: #475569;
    font-size: 12px;
    font-weight: 800;
}
.tax70e-order-meta span {
    overflow-wrap: anywhere;
}
.tax70e-tax-stack {
    display: grid;
    gap: 7px;
    min-width: 0;
}
.tax70e-tax-pill {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    border: 1px solid #dbeafe;
    background: #f8fbff;
    color: #1e3a8a;
    border-radius: 11px;
    padding: 8px 10px;
    font-size: 12px;
    font-weight: 900;
}
.tax70e-tax-pill span {
    min-width: 0;
    overflow-wrap: anywhere;
}
.tax70e-tax-pill strong {
    color: #0f172a;
    white-space: nowrap;
}
.tax70e-tax-pill.is-total {
    border-color: #bfdbfe;
    background: #eff6ff;
}
.tax70e-duplicate-chip,
.tax70e-excluded-chip {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 4px 8px;
    font-size: 11px;
    font-weight: 950;
}
.tax70e-duplicate-chip {
    background: #fef3c7;
    color: #92400e;
}
.tax70e-excluded-chip {
    background: #ffe4e6;
    color: #9f1239;
}
.tax70e-duplicate-note {
    margin-top: 8px;
    padding: 8px 10px;
    border-radius: 10px;
    background: #fffbeb;
    border: 1px solid #fde68a;
    color: #92400e;
    font-size: 12px;
    font-weight: 850;
}
.tax70d-modal-table-wrap {
    overflow-x: auto;
}
@media (max-width: 1250px) {
    .tax70d-page { width: min(1280px, calc(100vw - 32px)); }
    .tax70e-order-card { grid-template-columns: 82px minmax(0, 1fr); }
    .tax70e-tax-stack { grid-column: 2; }
}
@media (max-width: 900px) {
    .tax70d-page { width: auto; padding: 20px 14px 36px; }
    .tax70e-order-card { grid-template-columns: 1fr; }
    .tax70e-tax-stack { grid-column: auto; }
}
@media print {
    .tax70e-order-card {
        box-shadow: none;
        break-inside: avoid;
        grid-template-columns: 70px 1fr 260px;
    }
}


/* Fix70F - Accountant-friendly tax report table with frozen identity columns.
   Horizontal scrolling is allowed only for user-selected tax columns. */
.tax70f-table-wrap {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    border: 1px solid #e5e7eb;
    border-radius: 18px;
    background: #fff;
    box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.02);
}

.tax70f-audit-table {
    border-collapse: separate;
    border-spacing: 0;
    min-width: 1120px;
    width: max-content;
    font-size: 12px;
}

.tax70f-audit-table th,
.tax70f-audit-table td {
    padding: 11px 10px;
    border-bottom: 1px solid #e5e7eb;
    background: #fff;
    vertical-align: middle;
    white-space: nowrap;
}

.tax70f-audit-table th {
    background: #f1f5f9;
    color: #334155;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-size: 11px;
    position: sticky;
    top: 0;
    z-index: 5;
}

.tax70f-audit-table tr:hover td { background: #f8fafc; }
.tax70f-audit-table tr.is-excluded td { color: #94a3b8; background: #f8fafc; text-decoration: line-through; }
.tax70f-audit-table tr.is-duplicate td { background: #fff7ed; }
.tax70f-audit-table tr.is-duplicate:hover td { background: #ffedd5; }

.tax70f-sticky {
    position: sticky;
    z-index: 4;
    box-shadow: 1px 0 0 #e5e7eb;
}

.tax70f-audit-table th.tax70f-sticky { z-index: 8; }
.tax70f-sticky-1 { left: 0; }
.tax70f-sticky-2 { left: 62px; }
.tax70f-sticky-3 { left: 148px; }
.tax70f-sticky-4 { left: 328px; }
.tax70f-sticky-5 { left: 430px; }
.tax70f-sticky-6 { left: 532px; box-shadow: 4px 0 8px rgba(15, 23, 42, .08); }

.tax70f-exclude-col { width: 62px; min-width: 62px; max-width: 62px; text-align: center; }
.tax70f-order-col { width: 86px; min-width: 86px; max-width: 86px; }
.tax70f-customer-col { width: 180px; min-width: 180px; max-width: 180px; }
.tax70f-date-col { width: 102px; min-width: 102px; max-width: 102px; }
.tax70f-total-col { width: 112px; min-width: 112px; max-width: 112px; text-align: right; font-weight: 900; }
.tax70f-tax-col { width: 155px; min-width: 155px; text-align: right; font-weight: 800; color: #0f172a; }
.tax70f-selected-total { color: #1d4ed8; }

.tax70f-customer-name {
    display: block;
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 900;
}

.tax70f-duplicate-dot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    margin-left: 4px;
    border-radius: 999px;
    background: #f97316;
    color: #fff;
    font-weight: 900;
    font-size: 11px;
}

.tax70f-duplicate-note,
.tax70f-excluded-note {
    display: block;
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 3px;
    color: #9a3412;
    font-weight: 800;
    font-size: 10px;
    text-decoration: none;
}

.tax70f-excluded-note { color: #64748b; }
.tax70f-scroll-guidance {
    margin: 10px 2px 0;
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
}

@media (max-width: 900px) {
    .tax70f-table-wrap {
        border-radius: 14px;
    }
    .tax70f-audit-table {
        min-width: 980px;
        font-size: 11px;
    }
    .tax70f-customer-col { width: 150px; min-width: 150px; max-width: 150px; }
    .tax70f-sticky-4 { left: 298px; }
    .tax70f-sticky-5 { left: 400px; }
    .tax70f-sticky-6 { left: 502px; }
}

@media print {
    .tax70f-table-wrap { overflow: visible; border: 0; }
    .tax70f-audit-table { min-width: 0; width: 100%; font-size: 9px; }
    .tax70f-sticky { position: static; box-shadow: none; }
    .tax70f-audit-table th, .tax70f-audit-table td { padding: 5px 4px; }
    .tax70f-scroll-guidance { display: none; }
}

/* Fix70G - Tax report usability: local top scrollbar and order preview modal.
   Prevents the whole browser from becoming the horizontal scroll surface. */
.tax70d-page {
    width: auto !important;
    max-width: 100% !important;
    box-sizing: border-box;
    overflow-x: hidden;
}
.tax70d-layout,
.tax70d-output,
.tax70d-summary-section,
.tax70d-orders-section {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}
.tax70d-orders-section {
    overflow: hidden;
}
.tax70g-scroll-toolbar {
    margin: 2px 0 10px;
    padding: 10px 12px;
    border: 1px solid #dbeafe;
    border-radius: 14px;
    background: #f8fbff;
}
.tax70g-scroll-toolbar small {
    display: block;
    margin-top: 6px;
    color: #475569;
    font-weight: 800;
    font-size: 12px;
}
.tax70g-top-scroll {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    height: 18px;
}
.tax70g-top-scroll-spacer {
    height: 1px;
    min-width: 100%;
}
.tax70f-table-wrap {
    max-width: 100%;
    overflow-x: auto !important;
    overscroll-behavior-x: contain;
}
.tax70f-audit-table {
    margin: 0;
}
.tax70g-order-popup-link {
    color: #2563eb;
    font-weight: 950;
    text-decoration: none;
}
.tax70g-order-popup-link:hover {
    text-decoration: underline;
}
.tax70g-order-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10050;
    background: rgba(15, 23, 42, .68);
    padding: 22px;
}
.tax70g-order-modal.is-open {
    display: block;
}
.tax70g-order-modal-panel {
    height: calc(100vh - 44px);
    max-width: 1500px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .45);
}
.tax70g-order-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 18px;
    background: #0f172a;
    color: #fff;
}
.tax70g-order-modal-header h2 {
    margin: 0;
    font-size: 18px;
}
.tax70g-order-modal-kicker {
    margin: 0 0 2px;
    color: #93c5fd;
    font-weight: 900;
    font-size: 11px;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.tax70g-order-modal-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}
.tax70g-order-modal-close {
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 999px;
    cursor: pointer;
    background: #fee2e2;
    color: #991b1b;
    font-size: 24px;
    font-weight: 900;
}
.tax70g-order-modal iframe {
    width: 100%;
    flex: 1 1 auto;
    border: 0;
    background: #0b1220;
}
@media print {
    .tax70g-scroll-toolbar,
    .tax70g-order-modal { display: none !important; }
}

/* Fix70H - Tax Reports wider output layout.
   Moves the report header into the left rail and gives summary/table sections more usable width. */
.tax70h-page {
    width: min(1760px, calc(100vw - 220px)) !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 28px 24px 44px !important;
    overflow-x: hidden;
    box-sizing: border-box;
}

.tax70h-layout {
    grid-template-columns: 320px minmax(0, 1fr) !important;
    gap: 22px !important;
    align-items: start;
}

.tax70h-left-panel {
    position: sticky;
    top: 88px;
    align-self: start;
    padding: 16px !important;
}

.tax70h-rail-hero {
    margin: 0 0 16px !important;
    padding: 18px 18px 20px !important;
    border-radius: 18px !important;
    box-shadow: none !important;
}

.tax70h-rail-hero h1 {
    font-size: 24px !important;
    line-height: 1.05;
}

.tax70h-rail-hero p {
    max-width: none !important;
    font-size: 12px;
    line-height: 1.35;
}

.tax70h-page .tax70d-output {
    min-width: 0;
    width: 100%;
}

.tax70h-page .tax70d-summary-section,
.tax70h-page .tax70d-orders-section {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.tax70h-page .tax70d-card-grid {
    grid-template-columns: repeat(auto-fit, minmax(315px, 1fr));
}

.tax70h-page .tax70d-summary-card {
    min-width: 0;
}

.tax70h-page .tax70d-section-heading,
.tax70h-page .tax70d-table-header {
    gap: 14px;
}

.tax70h-page .tax70f-table-wrap,
.tax70h-page .tax70g-top-scroll {
    width: 100%;
    max-width: 100%;
}

.tax70h-page .tax70f-audit-table {
    min-width: 1040px;
}

.tax70h-page .tax70f-exclude-col { width: 58px; min-width: 58px; max-width: 58px; }
.tax70h-page .tax70f-order-col { width: 82px; min-width: 82px; max-width: 82px; }
.tax70h-page .tax70f-customer-col { width: 170px; min-width: 170px; max-width: 170px; }
.tax70h-page .tax70f-date-col { width: 96px; min-width: 96px; max-width: 96px; }
.tax70h-page .tax70f-total-col { width: 108px; min-width: 108px; max-width: 108px; }
.tax70h-page .tax70f-tax-col { width: 140px; min-width: 140px; }

.tax70h-page .tax70f-sticky-1 { left: 0; }
.tax70h-page .tax70f-sticky-2 { left: 58px; }
.tax70h-page .tax70f-sticky-3 { left: 140px; }
.tax70h-page .tax70f-sticky-4 { left: 310px; }
.tax70h-page .tax70f-sticky-5 { left: 406px; }
.tax70h-page .tax70f-sticky-6 { left: 502px; }

.tax70h-page .tax70f-customer-name,
.tax70h-page .tax70f-duplicate-note,
.tax70h-page .tax70f-excluded-note {
    max-width: 150px;
}

@media (max-width: 1280px) {
    .tax70h-page {
        width: auto !important;
        padding: 22px 16px 40px !important;
    }
    .tax70h-layout {
        grid-template-columns: 300px minmax(0, 1fr) !important;
        gap: 18px !important;
    }
    .tax70h-page .tax70d-card-grid {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }
}

@media (max-width: 1100px) {
    .tax70h-layout {
        grid-template-columns: 1fr !important;
    }
    .tax70h-left-panel {
        position: static;
    }
}

@media print {
    .tax70h-page {
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .tax70h-layout {
        display: block !important;
    }
    .tax70h-rail-hero {
        color: #0f172a !important;
        background: #fff !important;
    }
}

/* Fix70I - Tax report layout alignment and wider audit report.
   Moves the report rail closer to the left edge, aligns it with Summary Totals,
   and adds a frozen rental duration column without forcing browser-level scrolling. */
.tax70i-page {
    width: calc(100vw - 178px) !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 16px 12px 44px 0 !important;
    overflow-x: hidden !important;
}

.tax70i-page .tax70h-layout {
    grid-template-columns: 282px minmax(0, 1fr) !important;
    gap: 14px !important;
    align-items: start !important;
}

.tax70i-page .tax70h-left-panel {
    top: 70px !important;
    padding: 14px !important;
    margin-top: 0 !important;
}

.tax70i-page .tax70h-rail-hero {
    padding: 16px !important;
    margin-bottom: 14px !important;
}

.tax70i-page .tax70h-rail-hero h1 {
    font-size: 22px !important;
}

.tax70i-page .tax70h-rail-hero p {
    font-size: 11.5px !important;
}

.tax70i-page .tax70d-summary-section,
.tax70i-page .tax70d-orders-section {
    padding: 18px !important;
    margin-top: 0 !important;
}

.tax70i-page .tax70d-card-grid {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
    gap: 14px !important;
}

.tax70i-page .tax70d-summary-card {
    padding: 16px !important;
}

.tax70i-page .tax70d-table-header {
    margin-bottom: 12px !important;
}

.tax70i-page .tax70g-scroll-toolbar {
    padding: 8px 10px !important;
    margin-bottom: 8px !important;
}

.tax70i-page .tax70f-audit-table {
    min-width: 1000px !important;
    font-size: 11px !important;
}

.tax70i-page .tax70f-audit-table th,
.tax70i-page .tax70f-audit-table td {
    padding: 9px 8px !important;
}

.tax70i-page .tax70f-exclude-col { width: 50px !important; min-width: 50px !important; max-width: 50px !important; }
.tax70i-page .tax70f-order-col { width: 72px !important; min-width: 72px !important; max-width: 72px !important; }
.tax70i-page .tax70f-customer-col { width: 150px !important; min-width: 150px !important; max-width: 150px !important; }
.tax70i-page .tax70f-date-col { width: 88px !important; min-width: 88px !important; max-width: 88px !important; }
.tax70i-page .tax70f-duration-col { width: 70px !important; min-width: 70px !important; max-width: 70px !important; text-align: center; font-weight: 900; }
.tax70i-page .tax70f-total-col { width: 92px !important; min-width: 92px !important; max-width: 92px !important; }
.tax70i-page .tax70f-tax-col { width: 126px !important; min-width: 126px !important; }

.tax70i-page .tax70f-sticky-1 { left: 0 !important; }
.tax70i-page .tax70f-sticky-2 { left: 50px !important; }
.tax70i-page .tax70f-sticky-3 { left: 122px !important; }
.tax70i-page .tax70f-sticky-4 { left: 272px !important; }
.tax70i-page .tax70f-sticky-5 { left: 360px !important; }
.tax70i-page .tax70f-sticky-6 { left: 448px !important; }
.tax70i-page .tax70f-sticky-7 { left: 518px !important; box-shadow: 4px 0 8px rgba(15, 23, 42, .08); }

.tax70i-page .tax70f-customer-name,
.tax70i-page .tax70f-duplicate-note,
.tax70i-page .tax70f-excluded-note {
    max-width: 132px !important;
}

@media (max-width: 1280px) {
    .tax70i-page {
        width: auto !important;
        padding: 16px 10px 40px 0 !important;
    }
    .tax70i-page .tax70h-layout {
        grid-template-columns: 270px minmax(0, 1fr) !important;
        gap: 12px !important;
    }
    .tax70i-page .tax70d-card-grid {
        grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
    }
}

@media (max-width: 1100px) {
    .tax70i-page {
        padding: 18px 14px 40px !important;
    }
    .tax70i-page .tax70h-layout {
        grid-template-columns: 1fr !important;
    }
    .tax70i-page .tax70h-left-panel {
        position: static !important;
    }
}

/* Fix70K - Tax report rail alignment and reporting-period preview corrections. */
.tax70k-page .tax70h-layout {
    align-items: start !important;
}

.tax70k-page .tax70h-left-panel {
    margin-top: -32px !important;
}

.tax70k-page .tax70d-summary-section {
    margin-top: 0 !important;
}

@media (max-width: 1100px) {
    .tax70k-page .tax70h-left-panel {
        margin-top: 0 !important;
    }
}

@media print {
    .tax70k-page .tax70h-left-panel {
        margin-top: 0 !important;
    }
}

/* Fix71B - read-only close shortcut on rental order detail screen. */
.fix71b-close-action {
    min-width: 92px;
    white-space: nowrap;
}

/* Fix71C - Production sidebar toggle behavior
   Expanded: HCR logo + brand text + menu icons/text.
   Collapsed: HCR logo + menu icons only. */
:root {
    --hcr-sidebar-expanded-width: 240px;
    --hcr-sidebar-collapsed-width: 72px;
}

.hcr-sidebar {
    width: var(--hcr-sidebar-expanded-width);
    padding: 20px 14px 24px 14px;
    overflow-x: hidden;
    transition: width .18s ease;
}

.hcr-sidebar.expanded {
    width: var(--hcr-sidebar-expanded-width);
}

.hcr-sidebar.collapsed {
    width: var(--hcr-sidebar-collapsed-width);
    padding-left: 8px;
    padding-right: 8px;
}

.hcr-sidebar-header {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 0 0 28px 0;
}

.hcr-sidebar-brand {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.hcr-sidebar-logo {
    flex: 0 0 32px;
}

.hcr-sidebar-brand-text {
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
}

.hcr-sidebar-menu-button,
.sidebar-toggle {
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    margin: 0;
    border-radius: 8px;
    cursor: pointer;
    transition: background .15s ease, transform .15s ease;
}

.hcr-sidebar-menu-button:hover,
.hcr-sidebar-menu-button:focus-visible,
.sidebar-toggle:hover,
.sidebar-toggle:focus-visible {
    background: rgba(255,255,255,0.12);
    outline: none;
}

.hcr-sidebar-nav {
    display: grid;
    gap: 8px;
    padding: 0;
}

.hcr-sidebar-nav a {
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 10px;
    overflow: hidden;
    white-space: nowrap;
}

.hcr-sidebar-nav-icon {
    width: 22px;
    min-width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #EAF6FF;
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
}

.hcr-sidebar-nav-text {
    display: inline-block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hcr-sidebar.expanded .hcr-sidebar-brand-text,
.hcr-sidebar.expanded .hcr-sidebar-nav-text {
    display: inline-block;
}

.hcr-sidebar.collapsed .hcr-sidebar-header {
    gap: 4px;
    padding-bottom: 28px;
}

.hcr-sidebar.collapsed .hcr-sidebar-brand {
    flex: 0 0 32px;
    justify-content: center;
}

.hcr-sidebar.collapsed .hcr-sidebar-brand-text,
.hcr-sidebar.collapsed .hcr-sidebar-nav-text {
    display: none;
}

.hcr-sidebar.collapsed .hcr-sidebar-logo {
    width: 32px;
    height: 32px;
    flex-basis: 32px;
}

.hcr-sidebar.collapsed .hcr-sidebar-menu-button,
.hcr-sidebar.collapsed .sidebar-toggle {
    flex-basis: 24px;
    width: 24px;
    height: 28px;
}

.hcr-sidebar.collapsed .hcr-sidebar-nav a {
    justify-content: center;
    gap: 0;
    padding: 10px 0;
}

.hcr-sidebar.expanded ~ .hcr-main-shell {
    width: calc(100% - var(--hcr-sidebar-expanded-width));
    margin-left: var(--hcr-sidebar-expanded-width);
    transition: margin-left .18s ease, width .18s ease;
}

.hcr-sidebar.collapsed ~ .hcr-main-shell {
    width: calc(100% - var(--hcr-sidebar-collapsed-width));
    margin-left: var(--hcr-sidebar-collapsed-width);
    transition: margin-left .18s ease, width .18s ease;
}

@media (max-width: 860px) {
    .hcr-sidebar,
    .hcr-sidebar.expanded,
    .hcr-sidebar.collapsed {
        position: static;
        width: 100%;
        min-height: auto;
        padding: 14px 16px;
    }

    .hcr-sidebar-header,
    .hcr-sidebar.collapsed .hcr-sidebar-header {
        padding-bottom: 10px;
        gap: 10px;
    }

    .hcr-sidebar.collapsed .hcr-sidebar-brand {
        flex: 1 1 auto;
        justify-content: flex-start;
    }

    .hcr-sidebar.collapsed .hcr-sidebar-brand-text,
    .hcr-sidebar.collapsed .hcr-sidebar-nav-text {
        display: inline-block;
    }

    .hcr-sidebar.collapsed .hcr-sidebar-nav a {
        justify-content: flex-start;
        gap: 12px;
        padding: 10px 12px;
    }

    .hcr-sidebar-menu-button,
    .sidebar-toggle,
    .hcr-sidebar.collapsed .hcr-sidebar-menu-button,
    .hcr-sidebar.collapsed .sidebar-toggle {
        display: inline-flex;
        width: 30px;
        height: 30px;
        flex-basis: 30px;
    }

    .hcr-sidebar.expanded ~ .hcr-main-shell,
    .hcr-sidebar.collapsed ~ .hcr-main-shell {
        width: 100%;
        margin-left: 0;
    }
}

/* Fix71D - Modern sidebar icon upgrade
   Uses one consistent inline SVG icon system with bold rounded-outline styling.
   Keeps existing HCR logo and Fix71C expand/collapse behavior intact. */
.hcr-sidebar-nav {
    gap: 10px;
}

.hcr-sidebar-nav a {
    min-height: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 16px;
    border-radius: 14px;
    transition: background .15s ease, color .15s ease, transform .15s ease, box-shadow .15s ease;
}

.hcr-sidebar-nav a:hover,
.hcr-sidebar-nav a:focus-visible {
    background: rgba(255, 255, 255, 0.08);
    color: #FFFFFF;
    cursor: pointer;
    outline: none;
    text-decoration: none;
}

.hcr-sidebar-nav a.is-active {
    background: rgba(11, 110, 246, 0.26);
    color: #FFFFFF;
    box-shadow: inset 3px 0 0 rgba(255, 255, 255, 0.84);
}

.hcr-sidebar-nav-icon {
    width: 24px;
    min-width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #EAF6FF;
    line-height: 0;
}

.hcr-sidebar-nav-icon svg {
    width: 24px;
    height: 24px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.15;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.hcr-sidebar-nav a:hover .hcr-sidebar-nav-icon,
.hcr-sidebar-nav a:focus-visible .hcr-sidebar-nav-icon,
.hcr-sidebar-nav a.is-active .hcr-sidebar-nav-icon {
    color: #FFFFFF;
}

.hcr-sidebar.collapsed .hcr-sidebar-nav {
    gap: 10px;
    justify-items: center;
}

.hcr-sidebar.collapsed .hcr-sidebar-nav a {
    width: 48px;
    height: 48px;
    min-height: 48px;
    justify-content: center;
    gap: 0;
    padding: 0;
    border-radius: 14px;
}

.hcr-sidebar.collapsed .hcr-sidebar-nav a.is-active {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16);
}

.hcr-sidebar.collapsed .hcr-sidebar-nav-icon {
    margin: 0;
}

@media (max-width: 860px) {
    .hcr-sidebar.collapsed .hcr-sidebar-nav,
    .hcr-sidebar.expanded .hcr-sidebar-nav {
        justify-items: stretch;
    }

    .hcr-sidebar.collapsed .hcr-sidebar-nav a,
    .hcr-sidebar.expanded .hcr-sidebar-nav a {
        width: 100%;
        justify-content: flex-start;
        gap: 12px;
        padding: 0 16px;
    }
}

/* Fix71E - Rent Estimate workflow */
.status-badge.status-estimate,
.orders-status-badge.estimate,
.status-pill-estimate {
    background: #EDE9FE;
    color: #5B21B6;
    border-color: #C4B5FD;
}
.fix22l-summary-metric.is-estimate {
    background: #F5F3FF;
    border-color: #DDD6FE;
    color: #4C1D95;
}
.estimate-helper-text {
    margin: 6px 0 0;
    color: #64748B;
    font-weight: 700;
}
.estimate-mode-banner {
    margin: 0 0 16px;
    padding: 12px 14px;
    border: 1px solid #C4B5FD;
    background: #F5F3FF;
    color: #4C1D95;
    border-radius: 14px;
    font-size: 14px;
    line-height: 1.45;
}

/* Fix71F - Quick Estimate without customer + Edit Rental Order action bar hierarchy */
.hcr-edit-action-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    min-width: 0;
}

.hcr-edit-action-buttons {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}

.hcr-action-status-badge {
    flex: 0 0 auto;
}

.hcr-action-primary,
button.hcr-action-primary,
.fix20-command-header .hcr-action-primary {
    background-color: #1a73e8;
    color: #ffffff;
    padding: 10px 20px;
    min-height: 42px;
    border-radius: 8px;
    border: none;
    font-weight: 700;
    box-shadow: 0 10px 22px rgba(26, 115, 232, .22);
    white-space: nowrap;
}

.hcr-action-secondary,
.fix20-command-header .hcr-action-secondary {
    background: transparent;
    color: #1f2937;
    border: 1px solid #cbd5e1;
    padding: 10px 20px;
    min-height: 42px;
    border-radius: 8px;
    font-weight: 600;
    box-shadow: none;
    white-space: nowrap;
}

.fix20-command-header .hcr-action-more-menu > summary {
    background: transparent;
    border: none;
    padding: 10px 12px;
    min-height: 42px;
    border-radius: 8px;
    font-weight: 600;
    color: #334155;
    box-shadow: none;
}

.fix20-command-header .hcr-action-more-menu > summary:hover,
.fix20-command-header .hcr-action-more-menu[open] > summary {
    background: #f8fafc;
    color: #0f172a;
}

.hcr-action-dropdown-menu {
    min-width: 220px;
    right: 0;
    left: auto !important;
    margin-top: 4px;
}

.quick-estimate-customer-picker {
    margin-bottom: 12px;
}

.quick-estimate-customer-picker select {
    width: 100%;
    min-height: 40px;
}

.quick-estimate-customer-picker small,
.optional-label {
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
}

.estimate-inline-warning {
    border: 1px solid #c4b5fd;
    background: #f5f3ff;
    color: #4c1d95;
}

@media (max-width: 980px) {
    .hcr-edit-action-bar {
        align-items: flex-start;
        flex-direction: column;
    }

    .hcr-edit-action-buttons {
        justify-content: flex-start;
    }
}

.quick-estimate-customer-workflow-actions { margin-top: 10px; }

/* Fix71H - Quick estimate cleanup, tax visibility, option spacing, and edit button colors. */
.fix22v-new-rental-mock .order-page-header .estimate-helper-text {
    display: block;
    width: 100%;
    max-width: 720px;
    margin: 8px 0 0;
    padding: 8px 12px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.16);
    color: #f8fafc !important;
    border: 1px solid rgba(255, 255, 255, 0.22);
    font-weight: 800;
    line-height: 1.35;
    white-space: normal;
}

.fix22v-new-rental-mock .estimate-details-grid,
.hcr-edit-stable-v1 .estimate-details-grid {
    grid-template-columns: 1fr !important;
}

.fix22v-new-rental-mock .estimate-vehicle-card,
.hcr-edit-stable-v1 .estimate-vehicle-card {
    grid-column: 1 / -1;
}

.fix22v-new-rental-mock .estimate-tax-details {
    margin-top: 10px;
    border: 1px solid #dbeafe;
    border-radius: 12px;
    background: #f8fbff;
    overflow: hidden;
}

.fix22v-new-rental-mock .estimate-tax-details > summary {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    font-weight: 900;
    color: #0f172a;
    cursor: pointer;
}

.fix22v-new-rental-mock .estimate-tax-details > summary::-webkit-details-marker {
    display: none;
}

.fix22v-new-rental-mock .estimate-tax-details .mock-tax-detail-grid {
    padding: 0 12px 12px;
    display: grid;
    gap: 7px;
}

.fix22v-new-rental-mock .estimate-tax-details .mock-tax-detail-grid > div,
.fix22v-new-rental-mock .estimate-tax-details .mock-tax-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    font-size: 12px;
}

.fix22v-new-rental-mock .estimate-tax-details .mock-tax-total {
    border-top: 1px solid #dbeafe;
    padding-top: 8px;
    font-weight: 900;
}

/* Keep Additional Driver quantity label clear of the charge amount box. */
.fix22w-clean-workspace.fix22v-new-rental-mock .additional-driver-row,
.order-page-shell.hcr-edit-stable-v1 .additional-driver-row,
.order-page-shell.hcr-edit-stable-v1 .fix22k-option-row.additional-driver-row {
    grid-template-columns: minmax(160px, 1fr) minmax(138px, auto) 94px !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock .additional-driver-row .option-control,
.order-page-shell.hcr-edit-stable-v1 .additional-driver-row .option-control {
    min-width: 132px;
    justify-content: flex-start !important;
    overflow: visible;
}

.fix22w-clean-workspace.fix22v-new-rental-mock .additional-driver-row .qty-box,
.order-page-shell.hcr-edit-stable-v1 .additional-driver-row .qty-box {
    width: 58px !important;
    min-width: 58px !important;
}

/* Edit Rental Order action colors requested after Fix71F. */
.order-page-shell.hcr-edit-stable-v1 button.hcr-action-primary[data-open-complete-modal],
.order-page-shell.hcr-edit-stable-v1 button.primary-action[data-open-complete-modal],
.order-page-shell.hcr-edit-stable-v1 #ConfirmCompleteRentalButton {
    background-color: #16a34a !important;
    color: #ffffff !important;
    border-color: #16a34a !important;
    box-shadow: 0 10px 22px rgba(22, 163, 74, .24) !important;
}

.order-page-shell.hcr-edit-stable-v1 button.hcr-action-primary[data-open-complete-modal]:hover,
.order-page-shell.hcr-edit-stable-v1 button.primary-action[data-open-complete-modal]:hover,
.order-page-shell.hcr-edit-stable-v1 #ConfirmCompleteRentalButton:hover {
    background-color: #15803d !important;
    border-color: #15803d !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix71b-close-action,
.order-page-shell.hcr-edit-stable-v1 a.fix71b-close-action {
    background: #e5e7eb !important;
    color: #374151 !important;
    border: 1px solid #9ca3af !important;
    box-shadow: none !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix71b-close-action:hover,
.order-page-shell.hcr-edit-stable-v1 a.fix71b-close-action:hover {
    background: #d1d5db !important;
    color: #111827 !important;
    text-decoration: none !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock.fix71h-estimate-create .order-page-header {
    height: auto !important;
    min-height: var(--fix22w-new-header-h) !important;
    align-items: start !important;
    row-gap: 8px;
}


/* Fix71I - Quick Estimate calculation-only, hourly policy, and More Actions dropdown width. */
.fix22w-clean-workspace.fix22v-new-rental-mock .estimate-calculation-only-note {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 0 14px;
    border: 1px solid #bfdbfe;
    border-radius: 10px;
    background: #eff6ff;
    color: #1e3a8a;
    font-weight: 800;
    line-height: 1.3;
}

.fix20-command-header .hcr-action-dropdown-menu {
    min-width: 280px !important;
    width: max-content;
}

.fix20-command-header .hcr-action-dropdown-menu .dropdown-item,
.fix20-command-header .hcr-action-dropdown-menu button,
.fix20-command-header .hcr-action-dropdown-menu a {
    white-space: nowrap;
}

.order-page-shell.hcr-edit-stable-v1 .hcr-action-more-menu {
    position: relative;
}


/* Fix71J - Estimate deposit display, edit header typography, financial summary emphasis, and action dropdown width. */
.fix22w-clean-workspace.fix22v-new-rental-mock .estimate-security-deposit-display {
    background: #f8fafc;
    border-top: 1px solid rgba(148, 163, 184, .35);
    margin-top: 4px;
    padding-top: 10px;
}

.fix22w-clean-workspace.fix22v-new-rental-mock .estimate-security-deposit-display span,
.fix22w-clean-workspace.fix22v-new-rental-mock .estimate-security-deposit-display strong {
    font-weight: 900;
}

.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .fix20-order-identity .eyebrow {
    color: #ffffff !important;
    font-size: 1rem !important;
    letter-spacing: .11em !important;
    font-weight: 900 !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .fix20-order-identity h1 {
    color: #ffffff !important;
    font-size: 1.95rem !important;
    line-height: 1.12 !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .fix20-order-identity p {
    color: #ffffff !important;
    font-size: 1.08rem !important;
    font-weight: 800 !important;
    opacity: 1 !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix22l-summary-metric span {
    font-size: .98rem !important;
    font-weight: 900 !important;
    letter-spacing: .04em !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix22l-summary-metric strong {
    font-size: 1.35rem !important;
    font-weight: 950 !important;
}

.order-page-shell.hcr-edit-stable-v1 .hcr-action-dropdown-menu,
.order-page-shell.hcr-edit-stable-v1 .fix18-overflow-menu .fix18-menu-content,
.order-page-shell.hcr-edit-stable-v1 .fix18-overflow-menu .drop-up {
    min-width: 340px !important;
    width: max-content !important;
}

.order-page-shell.hcr-edit-stable-v1 .hcr-action-dropdown-menu button,
.order-page-shell.hcr-edit-stable-v1 .fix18-overflow-menu .fix18-menu-content button,
.order-page-shell.hcr-edit-stable-v1 .fix18-overflow-menu .drop-up button {
    white-space: nowrap !important;
    text-align: left !important;
}


/* Fix71K - Quick Estimate final cleanup: no notes/order number, deposit visibility, hourly rate policy, financial/header emphasis. */
.fix22w-clean-workspace.fix22v-new-rental-mock.fix71h-estimate-create .order-page-header .eyebrow {
    color: #ffffff !important;
    font-size: 1rem !important;
    line-height: 1.05 !important;
    letter-spacing: .12em !important;
    font-weight: 950 !important;
    text-transform: uppercase !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock.fix71h-estimate-create .order-page-header h1 {
    color: #ffffff !important;
    font-size: 1.95rem !important;
    line-height: 1.1 !important;
    font-weight: 950 !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock.fix71h-estimate-create .order-page-header {
    min-height: 78px !important;
    height: auto !important;
    overflow: visible !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock.fix71h-estimate-create .fix22v-new-summary-bar {
    min-height: 44px !important;
    height: auto !important;
    padding: 6px 10px !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock.fix71h-estimate-create .fix22v-new-summary-metric {
    min-height: 32px !important;
    height: auto !important;
    padding: 5px 10px !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock.fix71h-estimate-create .fix22v-new-summary-metric span {
    font-size: .82rem !important;
    font-weight: 950 !important;
    letter-spacing: .04em !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock.fix71h-estimate-create .fix22v-new-summary-metric strong {
    font-size: 1.15rem !important;
    font-weight: 950 !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock.fix71h-estimate-create .estimate-security-deposit-display {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 42px !important;
    padding: 9px 12px !important;
    margin: 0 !important;
    border-top: 1px solid #dbeafe !important;
    border-bottom: 1px solid #dbeafe !important;
    background: #ecfeff !important;
    color: #0f172a !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock.fix71h-estimate-create .estimate-security-deposit-display span {
    font-size: 12px !important;
    font-weight: 950 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    color: #0f172a !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock.fix71h-estimate-create .estimate-security-deposit-display strong {
    font-size: 17px !important;
    font-weight: 950 !important;
    color: #0b3b74 !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
}

/* Keep the hidden accounting input available for calculation/postback, but do not show a second duplicate deposit row. */
.fix22w-clean-workspace.fix22v-new-rental-mock.fix71h-estimate-create .total-card .estimate-security-deposit-line {
    display: none !important;
}

.fix22w-clean-workspace.fix22v-new-rental-mock.fix71h-estimate-create .vehicle-rate-box input#HourlyPrice {
    color: #0f172a !important;
    font-weight: 950 !important;
}

/* Fix71L - Edit Rental Order header fit and contained action buttons. */
.order-page-shell.hcr-edit-stable-v1 .order-page-header.fix20-command-header {
    min-height: 88px !important;
    height: auto !important;
    align-items: center !important;
    padding: 12px 18px !important;
    overflow: visible !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .fix20-order-identity {
    min-width: 0 !important;
    flex: 1 1 auto !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .fix20-order-identity h1 {
    font-size: 1.48rem !important;
    line-height: 1.04 !important;
    margin: 2px 0 0 !important;
    max-width: 420px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .fix20-order-identity .eyebrow {
    font-size: .86rem !important;
    line-height: 1 !important;
    margin: 0 !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .fix20-order-identity p {
    font-size: .98rem !important;
    line-height: 1.18 !important;
    margin-top: 5px !important;
    max-width: 540px !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .hcr-edit-action-bar {
    align-self: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 14px !important;
    flex: 0 0 auto !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .hcr-edit-action-buttons {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    flex-wrap: nowrap !important;
    margin: 0 !important;
    padding: 0 !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .hcr-action-status-badge,
.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .hcr-action-primary,
.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .hcr-action-secondary,
.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .hcr-action-more-menu > summary {
    min-height: 40px !important;
    height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    line-height: 1 !important;
}

.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .hcr-action-primary,
.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .hcr-action-secondary,
.order-page-shell.hcr-edit-stable-v1 .fix20-command-header .hcr-action-more-menu > summary {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

@media (max-width: 1120px) {
    .order-page-shell.hcr-edit-stable-v1 .order-page-header.fix20-command-header {
        align-items: flex-start !important;
    }

    .order-page-shell.hcr-edit-stable-v1 .fix20-command-header .hcr-edit-action-bar,
    .order-page-shell.hcr-edit-stable-v1 .fix20-command-header .hcr-edit-action-buttons {
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
    }
}

/* =========================================================
   Fix 72A - Management Report Dashboard Phase 1
   Executive KPI cards, revenue trend, top vehicles, tax/fee
   summary, deposit visibility, and operational alerts.
   ========================================================= */
.mgmt-dashboard-page {
    width: min(100%, 1500px);
    margin: 0 auto;
}

.mgmt-dashboard-hero,
.mgmt-filter-card,
.mgmt-card,
.mgmt-kpi-card {
    border: 1px solid rgba(226,232,240,0.92);
    box-shadow: 0 18px 42px rgba(0,0,0,0.18);
}

.mgmt-dashboard-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 16px;
    padding: 24px 28px;
    border-radius: 18px;
    color: #FFFFFF;
    background: linear-gradient(105deg, #101A34 0%, #173C92 55%, #0B8FEF 100%);
}

.mgmt-dashboard-hero h1 {
    margin: 4px 0 6px 0;
    font-size: 30px;
    line-height: 1.05;
    font-weight: 950;
    letter-spacing: -.03em;
}

.mgmt-dashboard-hero p {
    margin: 0;
    color: #DCEBFF;
    font-size: 14px;
    font-weight: 750;
}

.mgmt-eyebrow {
    margin: 0 !important;
    color: #BFE2FF !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.mgmt-generated-at {
    flex: 0 0 auto;
    padding: 8px 12px;
    border: 1px solid rgba(255,255,255,0.18);
    border-radius: 999px;
    background: rgba(255,255,255,0.10);
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 850;
    white-space: nowrap;
}

.mgmt-filter-card {
    margin-bottom: 14px;
    padding: 14px;
    border-radius: 16px;
    background: #FFFFFF;
}

.mgmt-filter-form {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.mgmt-preset-group {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-right: auto;
}

.mgmt-preset,
.mgmt-apply-button,
.mgmt-card-link {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 14px;
    border-radius: 999px;
    border: 1px solid #BFD7F7;
    background: #F8FBFF;
    color: #0B6EF6;
    font-size: 13px;
    font-weight: 900;
    text-decoration: none;
    cursor: pointer;
}

.mgmt-preset:hover,
.mgmt-preset:focus-visible,
.mgmt-card-link:hover,
.mgmt-card-link:focus-visible {
    background: #EAF4FF;
    color: #075FCB;
    text-decoration: none;
}

.mgmt-preset.is-active,
.mgmt-apply-button {
    border-color: #0B6EF6;
    background: #0B6EF6;
    color: #FFFFFF;
}

.mgmt-filter-form label {
    display: grid;
    gap: 5px;
    color: #334155;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.mgmt-filter-form input[type="date"] {
    min-height: 38px;
    min-width: 150px;
    border: 1px solid #CBD5E1;
    border-radius: 10px;
    padding: 8px 11px;
    color: #0F172A;
    font: inherit;
    font-weight: 750;
}

.mgmt-kpi-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.mgmt-kpi-card {
    min-height: 132px;
    display: grid;
    align-content: space-between;
    gap: 10px;
    padding: 16px;
    border-radius: 16px;
    background: #FFFFFF;
}

.mgmt-kpi-card span {
    color: #475569;
    font-size: 12px;
    font-weight: 950;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: .045em;
}

.mgmt-kpi-card strong {
    color: #0B6EF6;
    font-size: 29px;
    line-height: 1;
    font-weight: 950;
    letter-spacing: -.045em;
}

.mgmt-kpi-card small {
    color: #64748B;
    font-size: 12px;
    font-weight: 750;
    line-height: 1.35;
}

.mgmt-kpi-card.is-revenue {
    border-left: 4px solid #0B6EF6;
}

.mgmt-kpi-card.is-fleet {
    border-left: 4px solid #16A34A;
}

.mgmt-kpi-card.is-fleet strong,
.mgmt-kpi-card.is-deposit strong {
    color: #16A34A;
}

.mgmt-kpi-card.is-deposit {
    border-left: 4px solid #14B8A6;
}

.mgmt-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr);
    gap: 16px;
    margin-bottom: 16px;
}

.mgmt-dashboard-grid.is-lower {
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
}

.mgmt-card {
    min-width: 0;
    border-radius: 18px;
    background: #FFFFFF;
    overflow: hidden;
}

.mgmt-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px 12px 20px;
    border-bottom: 1px solid #E2E8F0;
}

.mgmt-card-header h2 {
    margin: 0 0 4px 0;
    color: #0F172A;
    font-size: 19px;
    font-weight: 950;
    letter-spacing: -.025em;
}

.mgmt-card-header p {
    margin: 0;
    color: #64748B;
    font-size: 12.5px;
    font-weight: 750;
}

.mgmt-chart-card {
    min-height: 340px;
}

.mgmt-trend-chart {
    height: 260px;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    align-items: end;
    padding: 18px 20px 20px 20px;
}

.mgmt-trend-point {
    height: 100%;
    min-width: 0;
    display: grid;
    grid-template-rows: auto 1fr auto;
    gap: 8px;
    text-align: center;
}

.mgmt-trend-value {
    color: #0F172A;
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mgmt-trend-bar-wrap {
    display: flex;
    align-items: end;
    justify-content: center;
    min-height: 150px;
    border-radius: 12px;
    background: linear-gradient(180deg, #F8FAFC 0%, #EEF6FF 100%);
    overflow: hidden;
}

.mgmt-trend-bar {
    width: 44%;
    min-height: 8px;
    border-radius: 999px 999px 0 0;
    background: linear-gradient(180deg, #0B6EF6 0%, #06B6D4 100%);
    box-shadow: 0 12px 20px rgba(11,110,246,0.22);
}

.mgmt-trend-label {
    color: #64748B;
    font-size: 12px;
    font-weight: 850;
    white-space: nowrap;
}

.mgmt-top-vehicle-card {
    display: grid;
    grid-template-rows: auto 1fr auto;
}

.mgmt-top-vehicle-main {
    display: grid;
    align-content: center;
    gap: 12px;
    padding: 24px 22px;
}

.mgmt-top-vehicle-main span {
    color: #0F172A;
    font-size: 20px;
    font-weight: 950;
    line-height: 1.2;
}

.mgmt-top-vehicle-main strong {
    color: #0B6EF6;
    font-size: 38px;
    line-height: 1;
    font-weight: 950;
    letter-spacing: -.06em;
}

.mgmt-top-vehicle-card .mgmt-card-link {
    justify-self: start;
    margin: 0 22px 22px 22px;
}

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

.mgmt-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.mgmt-table th,
.mgmt-table td {
    padding: 12px 14px;
    border-bottom: 1px solid #E8EEF7;
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
}

.mgmt-table th {
    color: #475569;
    background: #F1F5F9;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.mgmt-table td {
    color: #334155;
    font-weight: 700;
}

.mgmt-table td strong {
    color: #0F172A;
    font-weight: 900;
}

.mgmt-table .num {
    text-align: right;
}

.mgmt-progress {
    height: 6px;
    margin-top: 7px;
    border-radius: 999px;
    background: #EAF1FA;
    overflow: hidden;
}

.mgmt-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #0B6EF6, #06B6D4);
}

.mgmt-alert-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 78px;
    padding: 6px 10px;
    border-radius: 999px;
    color: #0B6EF6;
    background: #EAF4FF;
    font-size: 12px;
    font-weight: 950;
}

.mgmt-alert-pill.is-overdue {
    color: #BE123C;
    background: #FFE4E6;
}

.mgmt-alert-pill.is-due-today {
    color: #92400E;
    background: #FEF3C7;
}

.mgmt-alert-pill.is-active {
    color: #166534;
    background: #DCFCE7;
}

.mgmt-tax-list,
.mgmt-compact-rank-list {
    display: grid;
    gap: 0;
    padding: 8px 20px 18px 20px;
}

.mgmt-tax-row,
.mgmt-rank-row {
    display: grid;
    gap: 7px;
    padding: 13px 0;
    border-bottom: 1px solid #E8EEF7;
}

.mgmt-tax-row {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}

.mgmt-tax-row:last-child,
.mgmt-rank-row:last-child {
    border-bottom: 0;
}

.mgmt-tax-row span,
.mgmt-rank-row span {
    min-width: 0;
    color: #334155;
    font-size: 13px;
    font-weight: 850;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mgmt-tax-row strong,
.mgmt-rank-row strong {
    color: #0F172A;
    font-size: 14px;
    font-weight: 950;
}

.mgmt-rank-row {
    grid-template-columns: minmax(0, 1fr) auto;
}

.mgmt-rank-row .mgmt-progress {
    grid-column: 1 / -1;
    margin-top: 0;
}

.mgmt-empty {
    padding: 22px;
    color: #64748B !important;
    text-align: center;
    font-weight: 850 !important;
}

@media (max-width: 1280px) {
    .mgmt-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .mgmt-dashboard-grid,
    .mgmt-dashboard-grid.is-lower { grid-template-columns: 1fr; }
}

@media (max-width: 800px) {
    .mgmt-dashboard-hero { align-items: flex-start; flex-direction: column; }
    .mgmt-generated-at { white-space: normal; }
    .mgmt-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mgmt-trend-chart { grid-template-columns: repeat(3, minmax(0, 1fr)); height: auto; }
    .mgmt-trend-point { min-height: 210px; }
}

@media (max-width: 560px) {
    .mgmt-kpi-grid { grid-template-columns: 1fr; }
    .mgmt-preset-group,
    .mgmt-filter-form label,
    .mgmt-apply-button { width: 100%; }
    .mgmt-preset { flex: 1 1 calc(50% - 8px); }
    .mgmt-filter-form input[type="date"] { width: 100%; }
}

/* =========================================================
   Fix 72B - Management Dashboard Phase 1 Corrections
   Period-based deposit metric, add-ons revenue, revenue
   composition chart, tax percentages, and alert polish.
   ========================================================= */
.mgmt-kpi-grid {
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.mgmt-kpi-card.is-addons {
    border-left: 4px solid #8B5CF6;
}

.mgmt-kpi-card.is-addons strong {
    color: #7C3AED;
}

.mgmt-chart-legend {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #475569;
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.mgmt-chart-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.mgmt-chart-legend i {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    display: inline-block;
}

.mgmt-chart-legend i.is-base {
    background: #0B6EF6;
}

.mgmt-chart-legend i.is-addons {
    background: #8B5CF6;
}

.mgmt-trend-stack {
    width: 46%;
    min-height: 8px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    border-radius: 999px 999px 0 0;
    overflow: hidden;
    box-shadow: 0 12px 20px rgba(11,110,246,0.18);
}

.mgmt-trend-segment {
    width: 100%;
    min-height: 3px;
}

.mgmt-trend-segment.is-base {
    background: linear-gradient(180deg, #0B6EF6 0%, #06B6D4 100%);
}

.mgmt-trend-segment.is-addons {
    background: linear-gradient(180deg, #A78BFA 0%, #7C3AED 100%);
}

.mgmt-progress.is-addons span {
    background: linear-gradient(90deg, #8B5CF6, #06B6D4);
}

.mgmt-alert-pill.is-upcoming {
    color: #075985;
    background: #E0F2FE;
}

.mgmt-tax-row {
    grid-template-columns: minmax(0, 1fr) auto auto;
    column-gap: 12px;
}

.mgmt-tax-row span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.mgmt-tax-row em {
    color: #64748B;
    font-size: 12px;
    font-style: normal;
    font-weight: 900;
    white-space: nowrap;
}

.mgmt-tax-icon {
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    border-radius: 8px;
    background: linear-gradient(135deg, #EAF4FF, #DBEAFE);
    border: 1px solid #BFDBFE;
    position: relative;
}

.mgmt-tax-icon::after {
    content: "$";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #0B6EF6;
    font-size: 12px;
    font-weight: 950;
}

.mgmt-dashboard-grid.is-single {
    grid-template-columns: 1fr;
}

@media (max-width: 1500px) {
    .mgmt-kpi-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1280px) {
    .mgmt-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}


/* =========================================================
   Fix 72H - Management Dashboard Fee Basis + Close Action
   Daily fees are explained by billable rental days; percentage
   taxes are explained by taxable revenue. Also adds a Close button.
   ========================================================= */
.mgmt-hero-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex: 0 0 auto;
    flex-wrap: wrap;
}

.mgmt-close-button {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 16px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.32);
    background: rgba(15,23,42,0.34);
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 950;
    line-height: 1;
    text-decoration: none;
}

.mgmt-close-button:hover,
.mgmt-close-button:focus-visible {
    background: rgba(255,255,255,0.16);
    color: #FFFFFF;
    text-decoration: none;
}

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

.mgmt-kpi-card.is-days {
    border-left: 4px solid #F59E0B;
}

.mgmt-kpi-card.is-days strong {
    color: #D97706;
}

.mgmt-tax-name-cell {
    min-width: 0;
    display: grid !important;
    gap: 4px !important;
    align-items: center;
    overflow: visible !important;
    white-space: normal !important;
}

.mgmt-tax-name-cell > span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    color: #334155;
    font-size: 13px;
    font-weight: 900;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mgmt-tax-name-cell small {
    display: block;
    padding-left: 32px;
    color: #64748B;
    font-size: 11.5px;
    font-weight: 800;
    line-height: 1.25;
    white-space: normal;
}

@media (max-width: 1500px) {
    .mgmt-kpi-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1280px) {
    .mgmt-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 800px) {
    .mgmt-hero-actions {
        width: 100%;
        justify-content: flex-start;
    }

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

@media (max-width: 560px) {
    .mgmt-kpi-grid { grid-template-columns: 1fr; }
}

/* Fix73A RBAC: login, user menu, and user management */
.hcr-login-body {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at top, rgba(20, 145, 255, .18), transparent 35%), #06101f;
    color: #101827;
    padding: 24px;
}

.hcr-login-card {
    width: min(460px, 100%);
    background: #fff;
    border-radius: 24px;
    box-shadow: 0 24px 80px rgba(0, 0, 0, .35);
    padding: 28px;
}

.hcr-login-brand {
    display: flex;
    gap: 14px;
    align-items: center;
    margin-bottom: 12px;
}

.hcr-login-brand h1 {
    margin: 0;
    font-size: 30px;
}

.hcr-login-note {
    color: #536276;
    margin: 0 0 22px;
    font-weight: 700;
}

.hcr-login-form {
    display: grid;
    gap: 10px;
}

.hcr-login-form label,
.hcr-user-form label {
    font-weight: 800;
    color: #243142;
}

.hcr-login-form input,
.hcr-user-form input,
.hcr-user-form select {
    border: 1px solid #d8e0ea;
    border-radius: 12px;
    padding: 12px 14px;
    font-size: 15px;
    font-weight: 700;
}

.hcr-check-row {
    display: flex;
    gap: 10px;
    align-items: center;
}

.hcr-check-row input {
    width: 18px;
    height: 18px;
}

.hcr-login-button {
    margin-top: 8px;
    width: 100%;
}

.hcr-user-area {
    gap: 8px;
}

.hcr-user-avatar {
    min-width: 38px;
    padding: 0 8px;
}

.hcr-logout-form {
    display: inline-flex;
    margin: 0;
}

.hcr-logout-form button {
    border: 1px solid rgba(255,255,255,.45);
    background: rgba(255,255,255,.14);
    color: #fff;
    border-radius: 999px;
    padding: 7px 12px;
    font-weight: 800;
    cursor: pointer;
}

.hcr-logout-form button:hover {
    background: rgba(255,255,255,.24);
}

.hcr-rbac-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.hcr-rbac-table th,
.hcr-rbac-table td {
    padding: 12px 10px;
    border-bottom: 1px solid #e7edf5;
    text-align: left;
    vertical-align: middle;
}

.hcr-rbac-table th {
    background: #f4f7fb;
    color: #334155;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.role-pill {
    display: inline-flex;
    border-radius: 999px;
    padding: 5px 10px;
    background: #eaf3ff;
    color: #0757b8;
    font-weight: 900;
}

.btn-compact {
    padding: 7px 12px;
    font-size: 13px;
}

.hcr-user-form {
    display: grid;
    gap: 12px;
    max-width: 620px;
}

.hcr-form-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 8px;
}

.hcr-alert {
    border-radius: 14px;
    padding: 12px 14px;
    margin: 12px 0;
    font-weight: 800;
}

.hcr-alert-success {
    background: #e8fff1;
    color: #08753d;
    border: 1px solid #b7f0ce;
}

.text-danger {
    color: #b42318;
    font-weight: 700;
}

/* Fix73D - Main menu dark theme and signed-in user chip
   Match top navigation background to the left sidebar for a unified admin-shell look. */
.hcr-app-header {
    background: linear-gradient(180deg, #111B2F 0%, #101A2D 78%, #0E1728 100%) !important;
    color: #FFFFFF;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.045), 0 8px 26px rgba(0, 0, 0, 0.18);
    border-left: 1px solid rgba(255, 255, 255, 0.035);
}

.hcr-header-inner {
    min-height: 64px;
    padding: 0 22px 0 32px;
    gap: 18px;
}

.hcr-nav {
    gap: 8px;
}

.hcr-nav a {
    min-height: 42px;
    color: #F1F5F9;
    padding: 0 14px;
    border-radius: 14px;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: -0.01em;
    transition: background .15s ease, color .15s ease, transform .15s ease, box-shadow .15s ease;
}

.hcr-nav a:hover,
.hcr-nav a:focus-visible {
    color: #FFFFFF;
    background: rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.07);
    outline: none;
    text-decoration: none;
    transform: translateY(-1px);
}

.hcr-nav a.is-active {
    color: #FFFFFF;
    background: rgba(11, 110, 246, 0.32);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14);
    text-decoration: none;
}

.hcr-user-area {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
}

.hcr-user-chip {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 5px 12px 5px 6px;
    border-radius: 999px;
    color: #FFFFFF;
    background: rgba(255, 255, 255, 0.075);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

.hcr-user-avatar {
    width: 34px;
    height: 34px;
    min-width: 34px;
    padding: 0;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #0B6EF6 0%, #0896F2 100%);
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 950;
    letter-spacing: .02em;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.18), 0 6px 14px rgba(0,0,0,.18);
}

.hcr-user-meta {
    display: inline-flex;
    flex-direction: column;
    line-height: 1.05;
    min-width: 0;
}

.hcr-user-name {
    max-width: 142px;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 850;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hcr-user-role {
    margin-top: 3px;
    color: #BBD7FF;
    font-size: 10px;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.hcr-logout-form button {
    min-height: 40px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(255,255,255,.075);
    color: #FFFFFF;
    padding: 0 13px;
    font-size: 12px;
    font-weight: 850;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, transform .15s ease;
}

.hcr-logout-form button:hover,
.hcr-logout-form button:focus-visible {
    background: rgba(255,255,255,.13);
    border-color: rgba(255,255,255,.30);
    outline: none;
    transform: translateY(-1px);
}

@media (max-width: 1024px) {
    .hcr-header-inner {
        padding: 8px 16px;
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .hcr-nav {
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .hcr-user-area {
        margin-left: auto;
    }
}

@media (max-width: 760px) {
    .hcr-user-meta,
    .hcr-logout-form button {
        display: none;
    }

    .hcr-user-chip {
        padding: 5px;
    }
}

/* Fix73E - User dropdown menu in top navigation */
.hcr-user-menu {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.hcr-user-menu > summary {
    list-style: none;
    cursor: pointer;
}

.hcr-user-menu > summary::-webkit-details-marker {
    display: none;
}

.hcr-user-caret {
    color: #BBD7FF;
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
    transition: transform .15s ease;
}

.hcr-user-menu[open] .hcr-user-caret {
    transform: rotate(180deg);
}

.hcr-user-menu[open] .hcr-user-chip,
.hcr-user-chip:hover,
.hcr-user-chip:focus-visible {
    background: rgba(255, 255, 255, 0.13);
    border-color: rgba(255, 255, 255, 0.26);
    outline: none;
}

.hcr-user-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 500;
    width: 190px;
    overflow: hidden;
    border-radius: 14px;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.24);
    padding: 6px;
}

.hcr-user-dropdown::before {
    content: "";
    position: absolute;
    top: -6px;
    right: 20px;
    width: 12px;
    height: 12px;
    transform: rotate(45deg);
    background: #FFFFFF;
    border-left: 1px solid #E2E8F0;
    border-top: 1px solid #E2E8F0;
}

.hcr-user-dropdown a,
.hcr-user-dropdown-form button {
    position: relative;
    z-index: 1;
    width: 100%;
    display: flex;
    align-items: center;
    min-height: 42px;
    padding: 0 14px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #0F172A;
    font: inherit;
    font-size: 14px;
    font-weight: 750;
    text-align: left;
    cursor: pointer;
}

.hcr-user-dropdown a:hover,
.hcr-user-dropdown a:focus-visible,
.hcr-user-dropdown-form button:hover,
.hcr-user-dropdown-form button:focus-visible {
    background: #EFF6FF;
    color: #0B6EF6;
    text-decoration: none;
    outline: none;
}

.hcr-user-dropdown-form {
    margin: 0;
    padding: 0;
}

.hcr-user-dropdown-form button {
    color: #B42318;
}

.hcr-user-dropdown-form button:hover,
.hcr-user-dropdown-form button:focus-visible {
    background: #FEF2F2;
    color: #B42318;
}

.hcr-account-page {
    max-width: 760px;
    margin: 0 auto;
}

.hcr-account-card {
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 22px;
    box-shadow: 0 20px 55px rgba(15, 23, 42, 0.12);
    overflow: hidden;
}

.hcr-account-card-header {
    padding: 24px 28px;
    color: #FFFFFF;
    background: linear-gradient(135deg, #111B2F 0%, #1D2A64 52%, #0B6EF6 100%);
}

.hcr-account-card-header h1 {
    margin: 4px 0 0;
    font-size: 28px;
    line-height: 1.1;
}

.hcr-account-card-body {
    padding: 24px 28px 28px;
}

.hcr-account-readonly {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.hcr-account-readonly div {
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 14px;
    padding: 12px 14px;
}

.hcr-account-readonly span {
    display: block;
    color: #64748B;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.hcr-account-readonly strong {
    display: block;
    margin-top: 4px;
    color: #0F172A;
    font-size: 15px;
}

.hcr-account-form {
    display: grid;
    gap: 12px;
}

.hcr-account-form label {
    color: #334155;
    font-weight: 850;
    font-size: 13px;
}

.hcr-account-form input {
    width: 100%;
    border: 1px solid #CBD5E1;
    border-radius: 12px;
    padding: 11px 12px;
    font: inherit;
}

.hcr-account-form input:focus {
    outline: none;
    border-color: #0B6EF6;
    box-shadow: 0 0 0 3px rgba(11,110,246,.14);
}

.hcr-account-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 10px;
}

@media (max-width: 760px) {
    .hcr-user-dropdown {
        right: auto;
        left: 50%;
        transform: translateX(-50%);
    }

    .hcr-user-caret {
        display: none;
    }

    .hcr-account-readonly {
        grid-template-columns: 1fr;
    }
}

/* Fix74A - Fleet Maintenance Management */
.hcr-maintenance-page {
    display: grid;
    gap: 18px;
}

.hcr-maintenance-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 24px 28px;
    border: 1px solid rgba(148, 163, 184, 0.38);
    border-radius: 22px;
    background: linear-gradient(135deg, #111B2F 0%, #1E2D6D 54%, #0786D8 100%);
    color: #FFFFFF;
    box-shadow: 0 18px 45px rgba(15, 23, 42, .16);
}

.hcr-maintenance-hero h1 {
    margin: 4px 0 6px;
    font-size: 30px;
    line-height: 1.05;
}

.hcr-maintenance-hero p {
    margin: 0;
    color: rgba(255, 255, 255, .88);
    font-weight: 700;
}

.hcr-eyebrow {
    color: rgba(255, 255, 255, .78);
    font-size: 12px;
    font-weight: 950;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.hcr-maintenance-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.hcr-maintenance-tile {
    min-height: 150px;
    padding: 22px;
    border: 1px solid #DBE7F3;
    border-radius: 22px;
    background: #FFFFFF;
    box-shadow: 0 16px 40px rgba(15, 23, 42, .10);
    color: #0F172A;
    text-decoration: none;
    display: grid;
    gap: 8px;
    align-content: start;
}

.hcr-maintenance-tile:hover {
    border-color: #0B83D8;
    box-shadow: 0 20px 50px rgba(11, 131, 216, .18);
    transform: translateY(-1px);
}

.hcr-maintenance-tile.is-disabled {
    opacity: .58;
    pointer-events: none;
}

.hcr-maintenance-tile strong {
    font-size: 20px;
}

.hcr-maintenance-tile span:not(.hcr-maintenance-icon) {
    color: #64748B;
    font-weight: 700;
}

.hcr-maintenance-icon {
    width: 44px;
    height: 44px;
    display: inline-grid;
    place-items: center;
    border-radius: 16px;
    background: linear-gradient(135deg, #0B6EF6, #16C0D6);
    color: #FFFFFF;
    font-weight: 900;
}

.hcr-maintenance-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.hcr-stat-card {
    background: #FFFFFF;
    border: 1px solid #DBE7F3;
    border-radius: 18px;
    padding: 18px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .08);
}

.hcr-stat-card span {
    display: block;
    color: #64748B;
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.hcr-stat-card strong {
    display: block;
    margin-top: 6px;
    color: #0B6EF6;
    font-size: 28px;
}

.hcr-preventive-layout {
    display: grid;
    grid-template-columns: minmax(420px, 560px) minmax(420px, 1fr);
    gap: 18px;
    align-items: start;
}

.hcr-card.hcr-preventive-card,
.hcr-card.hcr-maintenance-options-card,
.hcr-card.hcr-last-services-card,
.hcr-card.hcr-setup-card {
    background: #FFFFFF;
    border: 1px solid #DBE7F3;
    border-radius: 20px;
    padding: 18px;
    box-shadow: 0 16px 40px rgba(15, 23, 42, .09);
}

.hcr-field-row {
    display: grid;
    grid-template-columns: 170px 1fr;
    gap: 12px;
    align-items: center;
    margin-bottom: 10px;
}

.hcr-field-row label {
    color: #0F172A;
    font-weight: 850;
}

.hcr-field-row input,
.hcr-field-row select,
.hcr-field-row textarea {
    width: 100%;
    border: 1px solid #CBD5E1;
    border-radius: 10px;
    padding: 10px 11px;
    font: inherit;
    background: #FFFFFF;
}

.hcr-field-row input[readonly] {
    background: #F8FAFC;
    color: #334155;
}

.hcr-vin-search-row {
    grid-template-columns: 170px 1fr auto;
}

.hcr-notes-row {
    align-items: start;
}

.hcr-lookup-message {
    min-height: 18px;
    margin: -4px 0 10px 182px;
    color: #64748B;
    font-size: 13px;
    font-weight: 800;
}

.hcr-lookup-message.is-error { color: #B42318; }
.hcr-lookup-message.is-success { color: #087443; }

.hcr-maintenance-fieldsets {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.hcr-maintenance-fieldsets fieldset {
    border: 1px solid #0B83D8;
    border-radius: 14px;
    padding: 14px;
    margin: 0;
}

.hcr-maintenance-fieldsets legend {
    padding: 0 8px;
    color: #0B3A75;
    font-weight: 950;
}

.hcr-maintenance-fieldsets label {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
    padding: 8px 2px;
    font-weight: 800;
}

.hcr-attention-launch {
    margin-top: 14px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 14px;
    border: 1px solid #0B83D8;
    border-radius: 12px;
    background: #F8FBFF;
    color: #0B3A75;
    font-weight: 950;
    cursor: pointer;
}

.hcr-maintenance-actions {
    justify-content: center;
    margin: 6px 0 0;
    gap: 28px;
}

.hcr-last-services-card h2 {
    margin: 0 0 12px;
    color: #0B6EF6;
    font-size: 20px;
}

.hcr-maintenance-table-wrap {
    overflow-x: auto;
}

.hcr-maintenance-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 900px;
    font-size: 14px;
}

.hcr-maintenance-table th {
    background: #0578C2;
    color: #FFFFFF;
    padding: 9px 8px;
    text-align: left;
    white-space: nowrap;
}

.hcr-maintenance-table td {
    border-bottom: 1px solid #E2E8F0;
    padding: 9px 8px;
    vertical-align: top;
}

.hcr-empty-row td {
    color: #64748B;
    font-weight: 800;
    text-align: center;
    padding: 28px 8px;
}

.hcr-modal-backdrop {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, .52);
    z-index: 1000;
    padding: 24px;
}

.hcr-modal-backdrop.is-open {
    display: flex;
}

.hcr-modal-panel {
    width: min(920px, 96vw);
    background: #FFFFFF;
    border-radius: 18px;
    box-shadow: 0 30px 80px rgba(15, 23, 42, .34);
    overflow: hidden;
}

.hcr-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    background: #0578C2;
    color: #FFFFFF;
    padding: 16px 22px;
}

.hcr-modal-header h2 {
    margin: 0;
    color: #FFFFFF;
    font-size: 22px;
}

.hcr-modal-close {
    border: 0;
    background: rgba(255, 255, 255, .18);
    color: #FFFFFF;
    border-radius: 999px;
    width: 34px;
    height: 34px;
    font-size: 24px;
    cursor: pointer;
}

.hcr-attention-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px;
    padding: 28px 32px 16px;
}

.hcr-attention-grid h3 {
    margin: 0 0 14px;
    color: #006EB8;
    font-size: 18px;
}

.hcr-attention-row {
    display: grid;
    grid-template-columns: 80px 1fr;
    gap: 12px;
    align-items: center;
    margin-bottom: 10px;
}

.hcr-attention-row span {
    font-weight: 850;
}

.hcr-attention-row input {
    border: 1px solid #CBD5E1;
    border-radius: 8px;
    padding: 10px;
}

.hcr-modal-actions {
    display: flex;
    justify-content: center;
    gap: 160px;
    padding: 16px 32px 28px;
}

.hcr-btn-danger {
    background: #B42318;
    color: #FFFFFF;
    border-color: #B42318;
}

@media (max-width: 1100px) {
    .hcr-preventive-layout,
    .hcr-maintenance-grid,
    .hcr-maintenance-stats,
    .hcr-attention-grid {
        grid-template-columns: 1fr;
    }

    .hcr-modal-actions {
        gap: 14px;
    }
}

@media (max-width: 760px) {
    .hcr-field-row,
    .hcr-vin-search-row {
        grid-template-columns: 1fr;
    }

    .hcr-lookup-message {
        margin-left: 0;
    }
}

/* Fix74B - Preventive Service form usability/polish */
.hcr-preventive-service-page {
    gap: 16px;
}

.hcr-preventive-service-page .hcr-blue-titlebar {
    padding: 20px 24px;
    border-radius: 18px;
    background: linear-gradient(135deg, #0B3A75 0%, #0B6EF6 58%, #16B7D8 100%);
}

.hcr-preventive-service-page .hcr-blue-titlebar h1 {
    color: #FFFFFF;
    font-size: 28px;
}

.hcr-preventive-service-page .hcr-btn-primary,
.hcr-preventive-service-page .hcr-btn.hcr-btn-primary {
    background: #1E73BE;
    border-color: #1E73BE;
    color: #FFFFFF;
}

.hcr-preventive-service-page .hcr-btn-primary:hover,
.hcr-preventive-service-page .hcr-btn.hcr-btn-primary:hover {
    background: #155E9C;
    border-color: #155E9C;
}

.hcr-preventive-service-page .hcr-btn-secondary,
.hcr-preventive-service-page .hcr-btn.hcr-btn-secondary {
    background: #E0E0E0;
    border-color: #C9CED6;
    color: #0F172A;
}

.hcr-preventive-service-page .hcr-btn-light {
    background: rgba(255,255,255,.92) !important;
    color: #0B3A75 !important;
    border-color: rgba(255,255,255,.75) !important;
}

.hcr-preventive-two-column {
    display: grid;
    grid-template-columns: minmax(390px, 520px) minmax(520px, 1fr);
    gap: 18px;
    align-items: start;
}

.hcr-preventive-left,
.hcr-preventive-right {
    display: grid;
    gap: 18px;
}

.hcr-section-title {
    margin: -2px -2px 16px;
    padding: 10px 13px;
    border-radius: 12px;
    background: #F7F9FC;
    border: 1px solid #E2E8F0;
    color: #0B3A75;
    font-size: 14px;
    line-height: 1.2;
    font-weight: 950;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.hcr-section-title-spaced {
    margin-top: 18px;
}

.hcr-preventive-service-page .hcr-card.hcr-preventive-card,
.hcr-preventive-service-page .hcr-card.hcr-maintenance-options-card,
.hcr-preventive-service-page .hcr-card.hcr-last-services-card {
    padding: 18px;
    border-radius: 18px;
}

.hcr-preventive-service-page .hcr-field-row {
    grid-template-columns: 170px minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 12px;
}

.hcr-preventive-service-page .hcr-vin-search-row {
    grid-template-columns: 170px minmax(120px, 1fr) auto;
}

.hcr-preventive-service-page .hcr-field-row label {
    font-weight: 900;
    color: #172033;
}

.hcr-preventive-service-page .hcr-field-row input,
.hcr-preventive-service-page .hcr-field-row select,
.hcr-preventive-service-page .hcr-field-row textarea,
.hcr-attention-row input {
    min-height: 42px;
    border-radius: 9px;
    border-color: #B8C3D1;
}

.hcr-preventive-service-page .hcr-field-row input:focus,
.hcr-preventive-service-page .hcr-field-row select:focus,
.hcr-preventive-service-page .hcr-field-row textarea:focus,
.hcr-attention-row input:focus {
    outline: none;
    border-color: #1E73BE;
    box-shadow: 0 0 0 4px rgba(30, 115, 190, .12);
}

.hcr-internal-disabled {
    background: #EEF2F7 !important;
    color: #64748B !important;
    font-weight: 950 !important;
    letter-spacing: .04em;
}

.hcr-character-hint {
    margin: -4px 0 0 184px;
    color: #64748B;
    font-size: 12px;
    font-weight: 800;
    text-align: right;
}

.hcr-field-error {
    display: block;
    margin: -4px 0 8px 184px;
    font-size: 12px;
    font-weight: 800;
}

.hcr-field-error-offset {
    margin-top: -8px;
}

.hcr-validation-summary {
    margin: 0;
    padding: 0 2px;
}

.hcr-toast-zone {
    display: none;
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 1300;
    max-width: 380px;
    padding: 13px 16px;
    border-radius: 14px;
    box-shadow: 0 22px 60px rgba(15, 23, 42, .25);
    color: #FFFFFF;
    font-weight: 900;
}

.hcr-toast-zone.is-visible { display: block; }
.hcr-toast-zone.is-success { background: #047857; }
.hcr-toast-zone.is-error { background: #B42318; }

.hcr-preventive-service-page .hcr-maintenance-fieldsets {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
}

.hcr-preventive-service-page .hcr-maintenance-fieldsets fieldset {
    background: #FFFFFF;
    border-color: #1E73BE;
    border-radius: 12px;
}

.hcr-preventive-service-page .hcr-maintenance-fieldsets fieldset:nth-child(3) {
    grid-column: 1 / -1;
    max-width: 520px;
}

.hcr-attention-control {
    margin-top: 16px;
    padding: 12px 14px;
    border: 1px solid #1E73BE;
    border-radius: 12px;
    background: #F7F9FC;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.hcr-attention-check {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #0B3A75;
    font-weight: 950;
}

.hcr-attention-check input {
    width: 18px;
    height: 18px;
}

.hcr-maintenance-actions {
    justify-content: flex-end;
    margin-top: 0;
    gap: 12px;
}

.hcr-last-services-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 14px;
    margin-bottom: 12px;
}

.hcr-last-services-header h2 {
    margin: 0;
}

.hcr-table-hint {
    color: #64748B;
    font-size: 12px;
    font-weight: 800;
}

.hcr-preventive-service-page .hcr-maintenance-table {
    min-width: 980px;
}

.hcr-preventive-service-page .hcr-maintenance-table tbody tr:nth-child(even) td {
    background: #F2F4F7;
}

.hcr-preventive-service-page .hcr-maintenance-table tbody tr:nth-child(odd) td {
    background: #FFFFFF;
}

.hcr-preventive-service-page .hcr-maintenance-table tbody tr:hover td {
    background: #EAF4FF;
}

.hcr-table-sort {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 0;
    background: transparent;
    color: #FFFFFF;
    font: inherit;
    font-weight: 950;
    padding: 0;
    cursor: pointer;
}

.hcr-table-sort[data-direction="asc"]::after { content: "▲"; font-size: 10px; }
.hcr-table-sort[data-direction="desc"]::after { content: "▼"; font-size: 10px; }

.hcr-preventive-service-page .hcr-empty-row td {
    background: #FFFFFF !important;
}

.hcr-attention-modal {
    width: min(980px, 96vw);
}

.hcr-attention-modal .hcr-modal-header {
    background: #0578C2;
}

.hcr-attention-grid {
    gap: 46px;
}

.hcr-attention-row input {
    background: #FFFFFF;
}

@media (max-width: 1280px) {
    .hcr-preventive-two-column {
        grid-template-columns: minmax(360px, 470px) minmax(460px, 1fr);
        gap: 14px;
    }

    .hcr-preventive-service-page .hcr-field-row,
    .hcr-preventive-service-page .hcr-vin-search-row {
        grid-template-columns: 150px minmax(0, 1fr);
    }

    .hcr-preventive-service-page .hcr-vin-search-row {
        grid-template-columns: 150px minmax(110px, 1fr) auto;
    }

    .hcr-lookup-message,
    .hcr-field-error,
    .hcr-character-hint {
        margin-left: 164px;
    }
}

@media (max-width: 1100px) {
    .hcr-preventive-two-column {
        grid-template-columns: 1fr;
    }

    .hcr-preventive-service-page .hcr-maintenance-fieldsets fieldset:nth-child(3) {
        max-width: none;
    }
}

@media (max-width: 760px) {
    .hcr-preventive-service-page .hcr-field-row,
    .hcr-preventive-service-page .hcr-vin-search-row {
        grid-template-columns: 1fr;
    }

    .hcr-lookup-message,
    .hcr-field-error,
    .hcr-character-hint {
        margin-left: 0;
        text-align: left;
    }

    .hcr-maintenance-actions,
    .hcr-last-services-header,
    .hcr-attention-control {
        align-items: stretch;
        flex-direction: column;
    }

    .hcr-preventive-service-page .hcr-maintenance-fieldsets {
        grid-template-columns: 1fr;
    }
}

/* Fix74C - Preventive Service layout, button hierarchy, modal reliability, and sidebar-only nav polish */
.hcr-nav.hcr-nav-context-hidden {
    display: none !important;
}

.hcr-nav.hcr-nav-context-hidden + .hcr-user-area,
.hcr-header-inner:has(.hcr-nav-context-hidden) .hcr-user-area {
    margin-left: auto;
}

.hcr-preventive-service-page,
.hcr-preventive-service-page .hcr-preventive-form {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.hcr-preventive-service-page .hcr-blue-titlebar,
.hcr-preventive-service-page .hcr-maintenance-hero,
.hcr-preventive-service-page .hcr-preventive-hero {
    width: 100%;
    box-sizing: border-box;
    margin: 0;
}

.hcr-preventive-two-column {
    grid-template-columns: minmax(0, 52fr) minmax(0, 48fr) !important;
    gap: 16px !important;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.hcr-preventive-left,
.hcr-preventive-right,
.hcr-preventive-service-page .hcr-card {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.hcr-preventive-service-page .hcr-card.hcr-preventive-card,
.hcr-preventive-service-page .hcr-card.hcr-maintenance-options-card,
.hcr-preventive-service-page .hcr-card.hcr-last-services-card {
    padding: 16px !important;
}

.hcr-preventive-service-page .hcr-field-row,
.hcr-preventive-service-page .hcr-vin-search-row,
.hcr-preventive-service-page .hcr-notes-row {
    align-items: start;
}

.hcr-preventive-service-page .hcr-field-row label,
.hcr-preventive-service-page .hcr-notes-row label {
    text-align: left !important;
    justify-content: flex-start !important;
    align-self: start;
    padding-top: 10px;
}

.hcr-preventive-service-page .hcr-field-row input,
.hcr-preventive-service-page .hcr-field-row select,
.hcr-preventive-service-page .hcr-field-row textarea {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.hcr-preventive-service-page .hcr-maintenance-fieldsets {
    gap: 14px !important;
}

.hcr-preventive-service-page .hcr-maintenance-fieldsets fieldset {
    padding: 14px 14px 12px;
}

.hcr-preventive-service-page .hcr-maintenance-fieldsets label {
    min-height: 30px;
    margin: 7px 0;
    gap: 14px;
}

.hcr-attention-control {
    margin-top: 18px !important;
    align-items: center;
}

.hcr-btn-attention {
    background: #FFFFFF;
    color: #0B6EF6;
    border: 1px solid #BBD7FF;
    box-shadow: 0 8px 18px rgba(11, 110, 246, .08);
}

.hcr-btn-attention:hover,
.hcr-btn-attention:focus-visible {
    background: #EFF6FF;
    border-color: #0B6EF6;
    color: #074DB8;
}

.hcr-preventive-service-page .hcr-btn-neutral,
.hcr-preventive-service-page .hcr-btn.hcr-btn-neutral {
    background: #E0E0E0;
    border-color: #C9CED6;
    color: #0F172A;
}

.hcr-preventive-service-page .hcr-btn-danger-soft,
.hcr-preventive-service-page .hcr-btn.hcr-btn-danger-soft {
    background: #FFF1F2;
    border-color: #FDA4AF;
    color: #B42318;
}

.hcr-preventive-service-page .hcr-btn-danger-soft:hover,
.hcr-preventive-service-page .hcr-btn.hcr-btn-danger-soft:hover {
    background: #FFE4E6;
    border-color: #FB7185;
}

.hcr-maintenance-actions {
    padding-top: 4px;
}

.hcr-maintenance-table-wrap {
    max-width: 100%;
    overflow-x: auto;
}

.hcr-preventive-service-page .hcr-maintenance-table {
    min-width: 760px !important;
    width: 100%;
    table-layout: fixed;
    font-size: 12px;
}

.hcr-preventive-service-page .hcr-maintenance-table th,
.hcr-preventive-service-page .hcr-maintenance-table td {
    padding: 9px 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hcr-preventive-service-page .hcr-maintenance-table th:nth-child(1),
.hcr-preventive-service-page .hcr-maintenance-table td:nth-child(1) { width: 96px; }
.hcr-preventive-service-page .hcr-maintenance-table th:nth-child(2),
.hcr-preventive-service-page .hcr-maintenance-table td:nth-child(2) { width: 122px; }
.hcr-preventive-service-page .hcr-maintenance-table th:nth-child(3),
.hcr-preventive-service-page .hcr-maintenance-table td:nth-child(3) { width: 92px; }
.hcr-preventive-service-page .hcr-maintenance-table th:nth-child(9),
.hcr-preventive-service-page .hcr-maintenance-table td:nth-child(9) { width: auto; }

.hcr-preventive-service-page .hcr-empty-row td {
    white-space: normal;
    text-align: center;
    color: #64748B;
    font-weight: 850;
}

/* Make the attention modal unambiguous and above all app chrome. */
.hcr-modal-backdrop#attentionModal {
    z-index: 5000 !important;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity .14s ease;
}

.hcr-modal-backdrop#attentionModal.is-open {
    display: flex !important;
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

.hcr-attention-modal {
    max-width: 980px;
}

@media (max-width: 1280px) {
    .hcr-preventive-two-column {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

@media (max-width: 760px) {
    .hcr-preventive-service-page .hcr-card.hcr-preventive-card,
    .hcr-preventive-service-page .hcr-card.hcr-maintenance-options-card,
    .hcr-preventive-service-page .hcr-card.hcr-last-services-card {
        padding: 14px !important;
    }
}

/* Fix74D - Global blueprint alignment + Preventive Service workspace automation */
:root {
    --hcr-canvas-bg: #061020;
    --hcr-panel-bg: #0B192E;
    --hcr-input-bg: #FFFFFF;
    --hcr-readonly-bg: #E2E8F0;
    --hcr-input-text: #1E293B;
    --hcr-table-head-bg: #1E3A8A;
    --hcr-table-head-text: #FFFFFF;
    --hcr-active-accent: #38BDF8;
}

body {
    background: var(--hcr-canvas-bg);
}

.hcr-main-shell,
main.hcr-main-content,
.hcr-maintenance-page {
    background: var(--hcr-canvas-bg);
}

.hcr-app-header {
    min-height: 64px !important;
    height: 64px;
    background: var(--hcr-panel-bg) !important;
    box-shadow: 0 1px 0 rgba(255,255,255,.08), 0 14px 34px rgba(0,0,0,.22) !important;
}

.hcr-header-inner {
    min-height: 64px !important;
    padding-left: 32px !important;
    padding-right: 32px !important;
}

.hcr-nav a {
    padding-left: 24px !important;
    padding-right: 24px !important;
}

.hcr-nav a.is-active {
    box-shadow: inset 0 -3px 0 var(--hcr-active-accent);
}

.hcr-user-chip {
    min-height: 44px;
    gap: 12px !important;
    padding: 6px 12px 6px 8px !important;
}

.hcr-user-avatar {
    flex: 0 0 38px;
    width: 38px !important;
    height: 38px !important;
    background: #1D4ED8 !important;
    color: #FFFFFF !important;
}

.hcr-user-meta {
    min-width: 0;
    gap: 2px;
}

.hcr-user-name::before {
    content: "HCR ";
}

.hcr-user-role::before {
    content: "Role: ";
}

.hcr-user-caret {
    margin-left: auto;
    padding-left: 12px;
}

.hcr-main-content,
main.hcr-main-content {
    padding: 32px !important;
}

.hcr-preventive-service-page .hcr-preventive-form {
    display: grid;
    gap: 16px;
}

.hcr-preventive-service-page .hcr-blue-titlebar,
.hcr-preventive-service-page .hcr-maintenance-hero,
.hcr-preventive-service-page .hcr-preventive-hero {
    grid-column: 1 / -1;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 98px;
    padding: 22px 28px !important;
    background: linear-gradient(135deg, #0B192E 0%, #1E3A8A 62%, #0284C7 100%) !important;
}

.hcr-preventive-two-column {
    grid-template-columns: minmax(0, 52fr) minmax(0, 48fr) !important;
    gap: 16px !important;
    overflow-x: hidden;
}

.hcr-preventive-service-page .hcr-card.hcr-preventive-card,
.hcr-preventive-service-page .hcr-card.hcr-maintenance-options-card,
.hcr-preventive-service-page .hcr-card.hcr-last-services-card {
    padding: 16px !important;
    border-color: #D7E2F0 !important;
}

.hcr-section-title {
    background: #F7F9FC;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    padding: 10px 12px;
    color: #0B192E;
}

.hcr-preventive-service-page .hcr-field-row {
    grid-template-columns: minmax(134px, 154px) minmax(0, 1fr);
    gap: 12px;
}

.hcr-preventive-service-page .hcr-vin-search-row {
    grid-template-columns: minmax(134px, 154px) minmax(0, 1fr) auto;
}

.hcr-preventive-service-page .hcr-field-row label {
    text-align: left !important;
    align-self: center;
    justify-self: start;
}

.hcr-preventive-service-page .hcr-field-row input,
.hcr-preventive-service-page .hcr-field-row select,
.hcr-preventive-service-page .hcr-field-row textarea,
.hcr-notes-block textarea {
    background: var(--hcr-input-bg) !important;
    color: var(--hcr-input-text) !important;
}

.hcr-preventive-service-page .hcr-field-row input[readonly],
.hcr-preventive-service-page .hcr-field-row input:disabled,
.hcr-internal-disabled {
    background: var(--hcr-readonly-bg) !important;
    color: #475569 !important;
}

.hcr-notes-block {
    display: block;
    width: 100%;
    margin-top: 12px;
}

.hcr-notes-block label {
    display: block;
    margin-bottom: 7px;
    color: #0F172A;
    font-weight: 850;
    text-align: left !important;
}

.hcr-notes-block textarea {
    width: 100%;
    min-height: 136px;
    border: 1px solid #CBD5E1;
    border-radius: 10px;
    padding: 10px 11px;
    font: inherit;
    resize: vertical;
}

.hcr-notes-block .hcr-character-hint,
.hcr-character-hint {
    display: block;
    width: 100%;
    margin: 6px 0 0 !important;
    text-align: right !important;
    color: #64748B;
    font-size: 12px;
    font-weight: 750;
}

.hcr-preventive-service-page .hcr-maintenance-fieldsets {
    gap: 16px !important;
}

.hcr-preventive-service-page .hcr-maintenance-fieldsets fieldset {
    background: #F7F9FC;
    padding: 14px 16px 12px !important;
}

.hcr-preventive-service-page .hcr-maintenance-fieldsets label {
    justify-content: flex-start !important;
    gap: 10px !important;
    min-height: 32px;
    margin: 8px 0 !important;
}

.hcr-preventive-service-page .hcr-maintenance-fieldsets input[type="checkbox"],
.hcr-attention-check input[type="checkbox"] {
    order: 0;
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px;
    margin: 0;
}

.hcr-preventive-service-page .hcr-maintenance-fieldsets label span,
.hcr-attention-check span {
    order: 1;
}

.hcr-attention-control {
    justify-content: flex-start !important;
    align-items: flex-start !important;
    margin-top: 18px !important;
    padding-top: 14px;
    border-top: 1px solid #E2E8F0;
}

.hcr-attention-check {
    width: 100%;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 12px 14px;
    border: 1px solid #BBD7FF;
    border-radius: 12px;
    background: #EFF6FF;
    color: #0B3A75;
    font-weight: 950;
    cursor: pointer;
}

.hcr-attention-inline-panel {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    pointer-events: none;
    margin-top: 0;
    transition: grid-template-rows .18s ease, opacity .18s ease, margin-top .18s ease;
}

.hcr-attention-inline-panel.is-open {
    grid-template-rows: 1fr;
    opacity: 1;
    pointer-events: auto;
    margin-top: 14px;
}

.hcr-attention-inline-panel > * {
    overflow: hidden;
}

.hcr-attention-inline-header {
    background: var(--hcr-table-head-bg);
    color: #FFFFFF;
    font-size: 17px;
    font-weight: 900;
    padding: 12px 14px;
    border-radius: 12px 12px 0 0;
}

.hcr-attention-inline-grid {
    padding: 16px;
    border-left: 1px solid #D7E2F0;
    border-right: 1px solid #D7E2F0;
    background: #FFFFFF;
    gap: 18px;
}

.hcr-attention-inline-grid h3 {
    margin: 0 0 10px;
    color: #0B3A75;
    font-size: 14px;
    font-weight: 900;
}

.hcr-attention-inline-grid .hcr-attention-row {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    margin-bottom: 8px;
    color: #0F172A;
    font-weight: 750;
}

.hcr-attention-inline-grid input[type="text"] {
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #CBD5E1;
    border-radius: 8px;
    padding: 9px 10px;
    color: #1E293B;
}

.hcr-attention-inline-actions {
    display: flex;
    justify-content: flex-start;
    padding: 12px 16px;
    border: 1px solid #D7E2F0;
    border-top: 0;
    border-radius: 0 0 12px 12px;
    background: #F8FAFC;
}

.hcr-workspace-footer-actions {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100%;
    margin-top: 4px !important;
    padding: 16px 0 0 !important;
    border-top: 1px solid rgba(226,232,240,.45);
    gap: 16px !important;
}

.hcr-footer-left-actions,
.hcr-footer-right-actions {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.hcr-footer-left-actions {
    margin-right: auto;
}

.hcr-footer-right-actions {
    margin-left: auto;
}

.hcr-maintenance-table th {
    background: var(--hcr-table-head-bg) !important;
    color: var(--hcr-table-head-text) !important;
}

.hcr-preventive-service-page .hcr-maintenance-table {
    min-width: 0 !important;
    width: 100%;
    table-layout: fixed;
}

@media (max-width: 1280px) {
    .hcr-preventive-two-column {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 860px) {
    .hcr-attention-inline-grid,
    .hcr-attention-grid {
        grid-template-columns: 1fr !important;
    }
    .hcr-workspace-footer-actions {
        align-items: stretch !important;
        flex-direction: column;
    }
    .hcr-footer-left-actions,
    .hcr-footer-right-actions {
        width: 100%;
        justify-content: flex-end;
    }
    .hcr-footer-left-actions {
        justify-content: flex-start;
    }
}

/* Fix74D attention slide override */
.hcr-attention-inline-panel {
    display: block !important;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    margin-top: 0;
    transition: max-height .22s ease, opacity .18s ease, margin-top .18s ease;
}
.hcr-attention-inline-panel.is-open {
    max-height: 980px;
    opacity: 1;
    pointer-events: auto;
    margin-top: 14px;
}
.hcr-attention-inline-panel > * {
    overflow: visible;
}

/* Fix74E - Preventive Service form balancing, full-width service history, and footer button polish */
.hcr-preventive-service-page .hcr-preventive-form {
    grid-template-columns: 1fr;
}

.hcr-preventive-two-column {
    align-items: stretch !important;
    grid-template-columns: minmax(0, 52fr) minmax(0, 48fr) !important;
}

.hcr-preventive-left,
.hcr-preventive-right {
    align-self: stretch;
    display: flex !important;
    flex-direction: column;
    gap: 0 !important;
}

.hcr-preventive-service-page .hcr-card.hcr-preventive-card,
.hcr-preventive-service-page .hcr-card.hcr-maintenance-options-card {
    height: 100%;
    min-height: 0;
}

.hcr-preventive-service-page .hcr-card.hcr-preventive-card {
    padding: 14px 16px !important;
}

.hcr-preventive-service-page .hcr-field-row {
    min-height: 36px;
    margin-bottom: 7px !important;
    gap: 10px !important;
}

.hcr-preventive-service-page .hcr-vin-search-row {
    margin-bottom: 6px !important;
}

.hcr-preventive-service-page .hcr-field-row input,
.hcr-preventive-service-page .hcr-field-row select,
.hcr-preventive-service-page .hcr-field-row textarea,
.hcr-attention-row input {
    min-height: 36px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

.hcr-preventive-service-page .hcr-section-title {
    margin-bottom: 9px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

.hcr-preventive-service-page .hcr-section-title-spaced {
    margin-top: 12px !important;
}

.hcr-preventive-service-page .hcr-notes-block {
    margin-top: 8px !important;
}

.hcr-preventive-service-page .hcr-notes-block label {
    margin-bottom: 5px !important;
}

.hcr-preventive-service-page .hcr-notes-block textarea {
    min-height: 88px !important;
    max-height: 130px;
}

.hcr-preventive-service-page .hcr-character-hint {
    margin-top: 4px !important;
}

.hcr-last-services-fullwidth {
    width: 100%;
    grid-column: 1 / -1;
    margin-top: 0;
}

.hcr-preventive-service-page .hcr-last-services-fullwidth .hcr-maintenance-table-wrap {
    width: 100%;
    overflow-x: auto;
}

.hcr-preventive-service-page .hcr-last-services-fullwidth .hcr-maintenance-table {
    min-width: 1060px !important;
    width: 100%;
    table-layout: auto;
    font-size: 13px;
}

.hcr-preventive-service-page .hcr-last-services-fullwidth .hcr-maintenance-table th,
.hcr-preventive-service-page .hcr-last-services-fullwidth .hcr-maintenance-table td {
    white-space: nowrap;
    text-overflow: initial;
}

.hcr-preventive-service-page .hcr-last-services-fullwidth .hcr-maintenance-table th:nth-child(9),
.hcr-preventive-service-page .hcr-last-services-fullwidth .hcr-maintenance-table td:nth-child(9) {
    min-width: 220px;
    white-space: normal;
}

.hcr-preventive-service-page .hcr-form-actions.hcr-workspace-footer-actions {
    padding: 16px 0 0 !important;
    margin-top: 0 !important;
}

.hcr-preventive-service-page .hcr-btn,
.hcr-preventive-service-page a.hcr-btn,
.hcr-preventive-service-page button.hcr-btn {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 18px;
    border-radius: 10px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none !important;
    border: 1px solid transparent;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .08);
}

.hcr-preventive-service-page .hcr-btn-neutral,
.hcr-preventive-service-page .hcr-btn.hcr-btn-neutral,
.hcr-preventive-service-page a.hcr-btn-neutral {
    min-width: 110px;
    background: #E0E0E0 !important;
    border-color: #9CA3AF !important;
    color: #111827 !important;
}

.hcr-preventive-service-page .hcr-btn-neutral:hover,
.hcr-preventive-service-page .hcr-btn.hcr-btn-neutral:hover,
.hcr-preventive-service-page a.hcr-btn-neutral:hover {
    background: #D1D5DB !important;
    border-color: #6B7280 !important;
}

.hcr-preventive-service-page .hcr-btn-danger-soft,
.hcr-preventive-service-page .hcr-btn.hcr-btn-danger-soft,
.hcr-preventive-service-page button.hcr-btn-danger-soft {
    min-width: 160px;
}

.hcr-preventive-service-page .hcr-footer-right-actions .hcr-btn-primary {
    min-width: 130px;
}

@media (max-width: 1280px) {
    .hcr-preventive-two-column {
        grid-template-columns: 1fr !important;
        align-items: start !important;
    }
    .hcr-preventive-service-page .hcr-card.hcr-preventive-card,
    .hcr-preventive-service-page .hcr-card.hcr-maintenance-options-card {
        height: auto;
    }
}

/* Fix74F - Preventive maintenance package + due report */
.hcr-maintenance-package-panel {
    background: #f7f9fc;
    border: 1px solid #dbe4f0;
    border-radius: 12px;
    padding: 14px 16px;
    margin: 8px 0 14px;
}

.hcr-package-toggle,
.hcr-covered-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #1e293b;
    font-weight: 700;
    margin: 8px 0;
}

.hcr-package-toggle input,
.hcr-covered-toggle input {
    width: 18px;
    height: 18px;
}

.hcr-package-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 10px 0 8px;
}

.hcr-package-summary div {
    background: #ffffff;
    border: 1px solid #dbe4f0;
    border-radius: 10px;
    padding: 10px;
}

.hcr-package-summary span {
    display: block;
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.hcr-package-summary strong {
    display: block;
    color: #0f172a;
    font-size: 18px;
    margin-top: 2px;
}

.hcr-maintenance-due-kpis {
    display: grid;
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    gap: 14px;
    margin: 18px 0;
}

.hcr-maintenance-due-kpis .warning strong { color: #b45309; }
.hcr-maintenance-due-kpis .due strong { color: #c2410c; }
.hcr-maintenance-due-kpis .danger strong { color: #dc2626; }
.hcr-maintenance-due-kpis .neutral strong { color: #64748b; }

.hcr-maintenance-report-card {
    background: #ffffff;
    border: 1px solid #dbe4f0;
    border-radius: 18px;
    padding: 18px;
}

.hcr-maintenance-due-table-wrap {
    overflow-x: auto;
}

.hcr-due-report-table {
    min-width: 1700px;
}

.hcr-due-report-table th,
.hcr-due-report-table td {
    white-space: nowrap;
}

.hcr-status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 86px;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 800;
}

.hcr-status-pill.current { background: #dcfce7; color: #166534; }
.hcr-status-pill.warning { background: #fef3c7; color: #92400e; }
.hcr-status-pill.due { background: #ffedd5; color: #9a3412; }
.hcr-status-pill.danger { background: #fee2e2; color: #991b1b; }
.hcr-status-pill.neutral { background: #e2e8f0; color: #334155; }

.hcr-due-row.danger td { background: #fff1f2; }
.hcr-due-row.due td { background: #fff7ed; }
.hcr-due-row.warning td { background: #fffbeb; }

.hcr-btn-mini {
    min-height: 32px !important;
    padding: 6px 10px !important;
    font-size: 12px !important;
}

@media (max-width: 1100px) {
    .hcr-maintenance-due-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hcr-package-summary { grid-template-columns: 1fr; }
}

/* Fix74H - Preventive Maintenance Due Report audit-safe compact layout */
.hcr-alert-danger {
    background: #fff1f2;
    color: #9f1239;
    border: 1px solid #fecdd3;
}

.hcr-maintenance-due-kpis-six {
    grid-template-columns: repeat(6, minmax(120px, 1fr));
}

.hcr-maintenance-due-kpis .audit strong { color: #d97706; }

.hcr-due-report-table-compact {
    min-width: 980px;
    table-layout: fixed;
}

.hcr-due-report-table-compact th,
.hcr-due-report-table-compact td {
    white-space: normal;
    vertical-align: middle;
}

.hcr-due-report-table-compact th:nth-child(1) { width: 110px; }
.hcr-due-report-table-compact th:nth-child(2) { width: 220px; }
.hcr-due-report-table-compact th:nth-child(3) { width: 150px; }
.hcr-due-report-table-compact th:nth-child(4) { width: 150px; }
.hcr-due-report-table-compact th:nth-child(5) { width: 175px; }
.hcr-due-report-table-compact th:nth-child(6) { width: 170px; }
.hcr-due-report-table-compact th:nth-child(7) { width: 95px; }
.hcr-due-report-table-compact th:nth-child(8) { width: 150px; }

.hcr-cell-stack {
    display: flex;
    flex-direction: column;
    gap: 4px;
    line-height: 1.25;
}

.hcr-cell-stack strong {
    color: #0f172a;
    font-size: 13px;
    font-weight: 900;
}

.hcr-cell-stack span {
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
}

.hcr-status-pill.audit {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #f59e0b;
}

.hcr-due-row.audit td {
    background: #fffbeb;
}

.hcr-attention-yes {
    color: #b45309;
    font-weight: 900;
}

.hcr-muted-text {
    color: #64748b;
    font-weight: 800;
}

.hcr-action-cell {
    text-align: right;
}

.hcr-btn-warning {
    background: #f59e0b;
    color: #111827;
    border-color: #d97706;
    font-weight: 900;
}

.hcr-baseline-modal-panel {
    width: min(620px, 94vw);
}

.hcr-modal-copy {
    margin: 0 0 16px;
    color: #475569;
    font-weight: 700;
}

.hcr-baseline-form {
    display: grid;
    gap: 14px;
}

.hcr-baseline-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.hcr-field-stack {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.hcr-field-stack label {
    color: #334155;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .02em;
}

.hcr-field-stack input {
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    padding: 10px 12px;
    font-weight: 800;
    color: #0f172a;
    background: #ffffff;
}

.hcr-field-stack input[readonly] {
    background: #e2e8f0;
    color: #334155;
}

.hcr-baseline-modal .hcr-modal-actions {
    justify-content: flex-end;
    gap: 12px;
    padding: 8px 0 0;
}

@media (max-width: 1100px) {
    .hcr-maintenance-due-kpis-six { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hcr-due-report-table-compact { min-width: 920px; }
}

@media (max-width: 760px) {
    .hcr-baseline-grid { grid-template-columns: 1fr; }
}

/* Fix74I - Fleet Maintenance main report hub and attention-item reports */
.hcr-maintenance-grid-primary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.hcr-maintenance-report-hub {
    margin-top: 18px;
    background: #ffffff;
    border: 1px solid #dbe4f0;
    border-radius: 18px;
    padding: 18px;
}

.hcr-maintenance-report-links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-top: 14px;
}

.hcr-maintenance-report-link,
.hcr-maintenance-stats-clickable .attention-link {
    display: flex;
    flex-direction: column;
    gap: 6px;
    text-decoration: none;
    border: 1px solid #dbe4f0;
    border-radius: 16px;
    background: #ffffff;
    padding: 14px 16px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .08);
    transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.hcr-maintenance-report-link:hover,
.hcr-maintenance-stats-clickable .attention-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 40px rgba(15, 23, 42, .14);
}

.hcr-maintenance-report-link span,
.hcr-maintenance-stats-clickable .attention-link span {
    color: #334155;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.hcr-maintenance-report-link strong,
.hcr-maintenance-stats-clickable .attention-link strong {
    color: #0f172a;
    font-size: 28px;
    font-weight: 950;
    line-height: 1;
}

.hcr-maintenance-report-link small,
.hcr-maintenance-stats-clickable .attention-link small {
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
}

.hcr-maintenance-report-link.danger,
.hcr-maintenance-stats-clickable .attention-link.danger {
    border-left: 5px solid #ef4444;
}

.hcr-maintenance-report-link.warning,
.hcr-maintenance-stats-clickable .attention-link.warning {
    border-left: 5px solid #f59e0b;
}

.hcr-maintenance-report-link.neutral {
    border-left: 5px solid #64748b;
}

.hcr-maintenance-report-link.audit {
    border-left: 5px solid #d97706;
}

.hcr-maintenance-report-link.danger strong,
.hcr-maintenance-stats-clickable .attention-link.danger strong { color: #dc2626; }
.hcr-maintenance-report-link.warning strong,
.hcr-maintenance-stats-clickable .attention-link.warning strong { color: #d97706; }
.hcr-maintenance-report-link.neutral strong { color: #64748b; }
.hcr-maintenance-report-link.audit strong { color: #b45309; }

.hcr-maintenance-stats-clickable a.hcr-stat-card {
    color: inherit;
}

.hcr-report-filter-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 16px 0;
}

.hcr-filter-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    border-radius: 999px;
    border: 1px solid #bfdbfe;
    background: #eff6ff;
    color: #1d4ed8;
    font-size: 13px;
    font-weight: 900;
    padding: 8px 14px;
    text-decoration: none;
}

.hcr-filter-chip:hover,
.hcr-filter-chip.is-active {
    background: #1d4ed8;
    color: #ffffff;
    border-color: #1d4ed8;
}

.hcr-attention-report-table {
    min-width: 980px;
    table-layout: fixed;
}

.hcr-attention-report-table th,
.hcr-attention-report-table td {
    white-space: normal;
    vertical-align: top;
}

.hcr-attention-report-table th:nth-child(1) { width: 120px; }
.hcr-attention-report-table th:nth-child(2) { width: 240px; }
.hcr-attention-report-table th:nth-child(3) { width: 260px; }
.hcr-attention-report-table th:nth-child(4) { width: auto; }
.hcr-attention-report-table th:nth-child(5) { width: 190px; }

.hcr-attention-item-text span {
    color: #0f172a;
    font-size: 13px;
    font-weight: 800;
}

.hcr-header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

@media (max-width: 1200px) {
    .hcr-maintenance-report-links,
    .hcr-maintenance-grid-primary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .hcr-maintenance-report-links,
    .hcr-maintenance-grid-primary {
        grid-template-columns: 1fr;
    }
}

/* Fix74J - Grouped Fleet Maintenance Attention Items Report */
.hcr-attention-report-grouped-table {
    min-width: 1040px;
    table-layout: fixed;
}

.hcr-attention-report-grouped-table th,
.hcr-attention-report-grouped-table td {
    white-space: normal;
    vertical-align: middle;
}

.hcr-attention-report-grouped-table th:nth-child(1),
.hcr-attention-report-grouped-table td:nth-child(1) { width: 10%; }
.hcr-attention-report-grouped-table th:nth-child(2),
.hcr-attention-report-grouped-table td:nth-child(2) { width: 20%; }
.hcr-attention-report-grouped-table th:nth-child(3),
.hcr-attention-report-grouped-table td:nth-child(3) { width: 20%; }
.hcr-attention-report-grouped-table th:nth-child(4),
.hcr-attention-report-grouped-table td:nth-child(4) { width: 35%; }
.hcr-attention-report-grouped-table th:nth-child(5),
.hcr-attention-report-grouped-table td:nth-child(5) { width: 15%; }

.hcr-attention-report-grouped-table tbody tr:nth-child(odd) td {
    background: rgba(15, 23, 42, 0.04);
}

.hcr-attention-report-grouped-table tbody tr:nth-child(even) td {
    background: rgba(255, 255, 255, 0.98);
}

.hcr-attention-items-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.hcr-attention-items-list li {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 6px;
    align-items: start;
    color: #0f172a;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.35;
}

.hcr-attention-item-number {
    color: #1d4ed8;
    font-weight: 950;
    white-space: nowrap;
}

.hcr-vehicle-asset-cell strong,
.hcr-service-log-cell strong {
    color: #0f172a;
    font-size: 13px;
    font-weight: 950;
}

.hcr-vehicle-asset-cell span,
.hcr-service-log-cell span {
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
}

.hcr-attention-action-cell {
    text-align: right;
    vertical-align: middle !important;
}

.hcr-attention-action-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    min-width: 148px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 950;
    padding: 8px 12px;
    white-space: normal;
    text-align: center;
}

.hcr-attention-summary-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid rgba(59, 130, 246, 0.25);
    background: #eff6ff;
    color: #1e3a8a;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
    padding: 8px 12px;
}

@media (max-width: 980px) {
    .hcr-attention-report-grouped-table {
        min-width: 900px;
    }

    .hcr-attention-action-button {
        min-width: 128px;
    }
}


/* Fix74K - Strict left alignment for grouped Attention Items report */
.hcr-attention-report-grouped-table th:nth-child(4),
.hcr-attention-report-grouped-table td:nth-child(4),
.hcr-attention-items-cell {
    text-align: left !important;
}

.hcr-attention-items-cell {
    justify-content: flex-start !important;
    align-items: flex-start !important;
}

.hcr-attention-items-cell .hcr-attention-items-list {
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 6px;
    text-align: left;
}

.hcr-attention-items-cell .hcr-attention-items-list li {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 4px;
    width: 100%;
    text-align: left;
}

.hcr-attention-items-cell .hcr-attention-item-number {
    flex: 0 0 auto;
    margin-right: 0;
    white-space: nowrap;
}

.hcr-attention-items-cell .hcr-attention-item-number + span {
    flex: 1 1 auto;
    text-align: left;
}

/* Fix74L - Preventive service cost/package status and report close actions */
.hcr-preventive-service-page .hcr-service-cost-row input {
    background: #ffffff !important;
    color: #1e293b !important;
    font-weight: 800;
}

.hcr-preventive-service-page .hcr-package-cost-status {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    margin: 4px 0 8px 152px;
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid #cbd5e1;
    background: #f8fafc;
    color: #334155;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .01em;
}

.hcr-preventive-service-page .hcr-package-cost-status.is-covered {
    background: #dcfce7;
    border-color: #86efac;
    color: #166534;
}

.hcr-preventive-service-page .hcr-last-services-fullwidth .hcr-maintenance-table {
    min-width: 1180px !important;
}

.hcr-preventive-service-page .hcr-last-services-fullwidth .hcr-maintenance-table th:nth-child(11),
.hcr-preventive-service-page .hcr-last-services-fullwidth .hcr-maintenance-table td:nth-child(11) {
    min-width: 220px;
    white-space: normal;
}

.hcr-maintenance-report-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
}

.hcr-maintenance-report-actions .hcr-btn {
    min-width: 130px;
}

@media (max-width: 900px) {
    .hcr-preventive-service-page .hcr-package-cost-status {
        margin-left: 0;
    }
}

/* Fix74M: Maintenance report card header Close button and footer cleanup */
.hcr-maintenance-page .hcr-report-card-header-with-action {
    align-items: flex-start;
    gap: 16px;
}

.hcr-maintenance-page .hcr-report-card-title-block {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.hcr-maintenance-page .hcr-report-card-header-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin-left: auto;
    flex-shrink: 0;
}

.hcr-maintenance-page .hcr-report-card-close {
    height: 36px;
    min-width: 86px;
    padding: 0 16px;
    border: 1px solid #cbd5e1;
    background: #ffffff;
    color: #334155;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .08);
    transition: background-color .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.hcr-maintenance-page .hcr-report-card-close:hover,
.hcr-maintenance-page .hcr-report-card-close:focus {
    background: #f8fafc;
    color: #0f172a;
    border-color: #94a3b8;
    box-shadow: 0 2px 6px rgba(15, 23, 42, .12);
}

.hcr-maintenance-page .hcr-maintenance-report-actions {
    display: none !important;
}

@media (max-width: 900px) {
    .hcr-maintenance-page .hcr-report-card-header-with-action,
    .hcr-maintenance-page .hcr-report-card-header-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .hcr-maintenance-page .hcr-report-card-header-actions {
        width: 100%;
    }

    .hcr-maintenance-page .hcr-report-card-close {
        width: 100%;
    }
}

/* Fix74N - Preventive Maintenance Cost Report */
.hcr-maintenance-report-link.cost {
    border-left: 5px solid #2563eb;
}

.hcr-maintenance-report-link.cost strong {
    color: #1d4ed8;
    font-size: 24px;
}

@media (min-width: 1400px) {
    .hcr-maintenance-report-links {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}

.hcr-cost-report-filters {
    background: #ffffff;
    border: 1px solid #dbe4f0;
    border-radius: 18px;
    padding: 16px 18px;
    margin-bottom: 18px;
}

.hcr-cost-filter-grid {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) minmax(160px, 1fr) minmax(220px, 1.2fr) auto;
    gap: 14px;
    align-items: end;
}

.hcr-cost-filter-grid input,
.hcr-cost-filter-grid select {
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    min-height: 42px;
    padding: 9px 12px;
    color: #0f172a;
    background: #ffffff;
    font-weight: 800;
}

.hcr-cost-filter-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: flex-end;
}

.hcr-maintenance-cost-kpis {
    grid-template-columns: repeat(6, minmax(130px, 1fr));
}

.hcr-maintenance-cost-kpis .danger strong {
    color: #dc2626;
}

.hcr-cost-report-table {
    min-width: 1120px;
    table-layout: fixed;
}

.hcr-cost-report-table th,
.hcr-cost-report-table td {
    white-space: normal;
    vertical-align: middle;
}

.hcr-cost-report-table th:nth-child(1),
.hcr-cost-report-table td:nth-child(1) { width: 22%; }
.hcr-cost-report-table th:nth-child(2),
.hcr-cost-report-table td:nth-child(2) { width: 20%; }
.hcr-cost-report-table th:nth-child(3),
.hcr-cost-report-table td:nth-child(3) { width: 14%; }
.hcr-cost-report-table th:nth-child(4),
.hcr-cost-report-table td:nth-child(4) { width: 18%; }
.hcr-cost-report-table th:nth-child(5),
.hcr-cost-report-table td:nth-child(5) { width: 18%; }
.hcr-cost-report-table th:nth-child(6),
.hcr-cost-report-table td:nth-child(6) { width: 8%; }

.hcr-cost-cell strong {
    font-size: 15px;
}

.hcr-cost-row.package td {
    background: #f0fdf4;
}

.hcr-cost-row.missing td {
    background: #fff7ed;
}

.hcr-cost-row.missing .hcr-cost-cell strong {
    color: #c2410c;
}

.hcr-cost-row.paid .hcr-cost-cell strong {
    color: #166534;
}

.hcr-cost-row.package .hcr-cost-cell strong {
    color: #1d4ed8;
}

@media (max-width: 1100px) {
    .hcr-cost-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hcr-maintenance-cost-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .hcr-cost-filter-grid {
        grid-template-columns: 1fr;
    }

    .hcr-cost-filter-actions {
        justify-content: stretch;
        flex-direction: column;
    }

    .hcr-cost-filter-actions .hcr-btn {
        width: 100%;
    }
}

/* Fix74O - Maintenance attention action text, top-left item alignment, and cost-report accounting polish */
.hcr-attention-items-cell,
.hcr-attention-items-cell .hcr-attention-items-top-left,
.hcr-attention-items-cell .hcr-attention-items-top-left li {
    align-items: flex-start !important;
    justify-content: flex-start !important;
    text-align: left !important;
    vertical-align: top !important;
}

.hcr-attention-items-cell .hcr-attention-items-top-left {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

.hcr-attention-items-cell .hcr-attention-items-top-left li {
    display: flex !important;
    flex-direction: row !important;
    line-height: 1.3 !important;
}

.hcr-attention-items-cell .hcr-attention-items-top-left .hcr-attention-item-number {
    display: inline-flex !important;
    align-items: flex-start !important;
    line-height: 1.3 !important;
}

.hcr-maintenance-cost-report-page .hcr-cost-report-filters {
    width: 100%;
    background: #0B192E !important;
    border: 1px solid #1e293b !important;
    border-radius: 12px !important;
    padding: 16px !important;
    box-shadow: 0 12px 30px rgba(2, 6, 23, .22);
}

.hcr-maintenance-cost-report-page .hcr-cost-filter-grid {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) minmax(160px, 1fr) minmax(220px, 1.2fr) auto;
    gap: 16px;
    align-items: end;
}

.hcr-maintenance-cost-report-page .hcr-cost-report-filters label {
    color: #e2e8f0 !important;
    font-weight: 900;
}

.hcr-maintenance-cost-report-page .hcr-cost-report-filters input,
.hcr-maintenance-cost-report-page .hcr-cost-report-filters select {
    min-height: 44px;
    border: 1px solid #334155 !important;
    background: #ffffff !important;
    color: #0f172a !important;
}

.hcr-cost-report-table th.hcr-cost-money-col,
.hcr-cost-report-table td.hcr-cost-money-col {
    text-align: right !important;
    padding-right: 24px !important;
}

.hcr-cost-report-table td.hcr-cost-money-col .hcr-cost-cell {
    align-items: flex-end !important;
    text-align: right !important;
}

.hcr-cost-report-table td.hcr-cost-money-col .hcr-cost-cell strong {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-weight: 800;
    white-space: nowrap;
}

.hcr-cost-report-table td.hcr-cost-money-col .hcr-cost-cell span {
    white-space: nowrap;
    font-size: 11px;
}

.hcr-cost-report-table td:nth-child(4) .hcr-cell-stack strong,
.hcr-cost-report-table td:nth-child(4) .hcr-cell-stack span {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .hcr-maintenance-cost-report-page .hcr-cost-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .hcr-maintenance-cost-report-page .hcr-cost-filter-grid {
        grid-template-columns: 1fr;
    }
}

/* Fix75A - Major Vehicle Repair workflow */
.hcr-major-repair-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr);
    gap: 18px;
    align-items: start;
}

.hcr-major-repair-page .hcr-readonly-grid,
.hcr-major-vehicle-card {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 12px;
    border: 1px solid #D8E4F0;
    border-radius: 14px;
    background: #F8FAFC;
}

.hcr-major-repair-page .hcr-readonly-grid div {
    display: grid;
    gap: 4px;
}

.hcr-major-repair-page .hcr-readonly-grid span {
    color: #64748B;
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.hcr-major-repair-page .hcr-readonly-grid strong {
    color: #0F172A;
    font-weight: 950;
}

.hcr-major-repair-checks {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 12px;
}

.hcr-major-repair-checks label {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
    border: 1px solid #D8E4F0;
    border-radius: 12px;
    background: #F8FAFC;
    color: #0F172A;
    font-weight: 900;
}

.hcr-major-repair-checks input[type="checkbox"] {
    width: 18px;
    height: 18px;
}

.hcr-major-repair-page .hcr-major-notes {
    width: 100%;
    min-height: 132px;
    border: 1px solid #B8C3D1;
    border-radius: 10px;
    padding: 10px 11px;
    resize: vertical;
}

.hcr-major-attention-resolution-card,
.hcr-major-repair-page .hcr-last-services-card {
    margin-top: 18px;
}

.hcr-major-attention-table {
    min-width: 760px;
}

.hcr-major-attention-table td:nth-child(3) {
    text-align: left;
    vertical-align: top;
}

.hcr-major-attention-table select {
    min-width: 170px;
    border: 1px solid #CBD5E1;
    border-radius: 8px;
    padding: 8px 10px;
    background: #FFFFFF;
}

.hcr-major-history-table {
    min-width: 980px;
}

.hcr-form-footer-actions {
    margin-top: 18px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    padding: 16px 18px;
    border: 1px solid #D8E4F0;
    border-radius: 18px;
    background: #FFFFFF;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .08);
}

.hcr-form-footer-actions > div {
    display: flex;
    gap: 12px;
    align-items: center;
}

@media (max-width: 1100px) {
    .hcr-major-repair-layout,
    .hcr-major-repair-page .hcr-readonly-grid,
    .hcr-major-repair-checks {
        grid-template-columns: 1fr;
    }

    .hcr-form-footer-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .hcr-form-footer-actions > div {
        justify-content: flex-end;
        flex-wrap: wrap;
    }
}

/* Fix75D - Major Vehicle Repair receipt upload controls */
.hcr-accounting-input {
    text-align: right !important;
    padding-right: 1rem !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
    font-weight: 700 !important;
}

.hcr-major-repair-receipt-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
    margin-top: 1rem;
}

.hcr-receipt-upload-card {
    min-width: 0;
}

.hcr-receipt-label {
    display: block;
    margin-bottom: 0.4rem;
    color: #cbd5e1;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.hcr-receipt-dropzone {
    display: flex;
    min-height: 6rem;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.15rem;
    border: 2px dashed rgba(148, 163, 184, 0.75);
    border-radius: 0.8rem;
    background: rgba(15, 23, 42, 0.35);
    color: #e2e8f0;
    padding: 0.75rem;
    text-align: center;
    cursor: pointer;
    transition: background-color 150ms ease, border-color 150ms ease, transform 150ms ease;
}

.hcr-receipt-dropzone:hover,
.hcr-receipt-dropzone:focus-within {
    background: rgba(30, 41, 59, 0.75);
    border-color: #38bdf8;
    transform: translateY(-1px);
}

.hcr-receipt-icon {
    font-size: 1.35rem;
    line-height: 1;
}

.hcr-receipt-title {
    display: block;
    font-size: 0.86rem;
    font-weight: 800;
}

.hcr-receipt-help {
    display: block;
    color: #94a3b8;
    font-size: 0.74rem;
}

.hcr-receipt-file-input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.hcr-receipt-selected {
    min-height: 1.1rem;
    margin-top: 0.35rem;
    font-size: 0.78rem;
    color: #94a3b8;
}

.hcr-receipt-selected.is-valid {
    color: #86efac;
    font-weight: 700;
}

.hcr-receipt-selected.is-error {
    color: #fecaca;
    font-weight: 700;
}

.hcr-receipt-current {
    display: grid;
    gap: 0.15rem;
    margin-top: 0.55rem;
    padding: 0.6rem;
    border: 1px solid rgba(148, 163, 184, 0.28);
    border-radius: 0.7rem;
    background: rgba(2, 6, 23, 0.32);
    color: #cbd5e1;
    font-size: 0.78rem;
}

.hcr-receipt-current strong {
    color: #f8fafc;
    overflow-wrap: anywhere;
}

.hcr-receipt-current small {
    color: #94a3b8;
}

.hcr-receipt-current a {
    width: fit-content;
    color: #7dd3fc;
    font-weight: 800;
    text-decoration: none;
}

.hcr-receipt-current a:hover {
    text-decoration: underline;
}

@media (max-width: 900px) {
    .hcr-major-repair-receipt-grid {
        grid-template-columns: 1fr;
    }
}

/* Fix75E - Major Vehicle Repair design system polish, viewport constraint, layout balance, upload contrast, and footer rebuild */
.hcr-major-repair-shell {
    max-width: 80rem;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 2rem 1.5rem;
    box-sizing: border-box;
    gap: 1.5rem;
}

.hcr-major-repair-page .hcr-major-repair-form {
    display: grid;
    gap: 1.5rem;
}

.hcr-major-repair-page .hcr-maintenance-hero {
    width: 100%;
    box-sizing: border-box;
}

.hcr-major-repair-page .hcr-major-repair-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
    align-items: start;
}

.hcr-major-repair-page .hcr-card.hcr-preventive-card,
.hcr-major-repair-page .hcr-card.hcr-maintenance-options-card,
.hcr-major-repair-page .hcr-card.hcr-last-services-card,
.hcr-major-repair-page .hcr-card.hcr-major-repair-textarea-card,
.hcr-major-repair-page .hcr-card.hcr-major-attention-resolution-card {
    padding: 1.25rem !important;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.hcr-major-repair-page .hcr-preventive-card .hcr-field-row,
.hcr-major-repair-page .hcr-maintenance-options-card .hcr-field-row {
    grid-template-columns: minmax(140px, 160px) minmax(0, 1fr);
    gap: 0.75rem;
    margin-bottom: 0.55rem;
    min-height: 2.25rem;
}

.hcr-major-repair-page .hcr-preventive-card .hcr-section-title,
.hcr-major-repair-page .hcr-maintenance-options-card .hcr-section-title {
    margin-bottom: 0.65rem !important;
}

.hcr-major-repair-page .hcr-section-title-spaced {
    margin-top: 1rem !important;
}

.hcr-major-repair-page .hcr-readonly-grid,
.hcr-major-repair-page .hcr-major-vehicle-card {
    gap: 0.55rem;
    padding: 0.75rem;
}

.hcr-major-repair-textarea-card {
    margin-top: 0 !important;
}

.hcr-major-repair-textarea-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
}

.hcr-major-repair-page .hcr-major-textarea-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
    margin-bottom: 0 !important;
    align-items: start;
}

.hcr-major-repair-page .hcr-major-textarea-row label {
    padding-top: 0 !important;
    text-align: left !important;
    justify-self: start;
    color: #0f172a;
    font-weight: 850;
}

.hcr-major-repair-page .hcr-major-textarea-row textarea {
    min-height: 120px;
    width: 100%;
    max-width: 100%;
    resize: vertical;
    border: 1px solid #cbd5e1;
    border-radius: 0.625rem;
    background: #ffffff;
    color: #0f172a;
    padding: 0.65rem 0.75rem;
    font-size: 0.92rem;
}

.hcr-major-repair-page .hcr-accounting-input {
    text-align: right !important;
    padding-right: 1rem !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
    font-weight: 700 !important;
    background: #ffffff !important;
    color: #0f172a !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 0.625rem !important;
}

.hcr-major-repair-page #majorRepairTotalCost.hcr-accounting-input,
.hcr-major-repair-page .hcr-accounting-input[readonly] {
    background: #f8fafc !important;
    color: #334155 !important;
    font-weight: 800 !important;
}

.hcr-major-repair-page .hcr-major-repair-checks {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.65rem;
    margin-bottom: 0.75rem;
}

.hcr-major-repair-page .hcr-major-repair-checks label {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.75rem;
    min-height: 2.5rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid #d8e4f0;
    border-radius: 0.75rem;
    background: #f8fafc;
    color: #334155;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    text-align: left;
}

.hcr-major-repair-page .hcr-major-repair-checks input[type="checkbox"] {
    flex: 0 0 auto;
    width: 1rem;
    height: 1rem;
    margin: 0;
}

.hcr-major-repair-page .hcr-major-repair-receipt-grid,
.hcr-major-repair-page .hcr-receipt-row-spaced {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
    margin-top: 1rem;
}

.hcr-major-repair-page .hcr-receipt-label {
    display: block;
    margin-bottom: 0.5rem;
    color: #334155;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.hcr-major-repair-page .hcr-receipt-dropzone {
    min-height: 6rem;
    border: 2px dashed #94a3b8;
    border-radius: 0.8rem;
    background: #f8fafc;
    color: #1e293b;
    padding: 0.75rem;
    text-align: center;
    cursor: pointer;
    transition: background-color 150ms ease, border-color 150ms ease, transform 150ms ease, box-shadow 150ms ease;
}

.hcr-major-repair-page .hcr-receipt-dropzone:hover,
.hcr-major-repair-page .hcr-receipt-dropzone:focus-within {
    background: #ffffff;
    border-color: #0b83d8;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
    transform: translateY(-1px);
}

.hcr-major-repair-page .hcr-receipt-icon,
.hcr-major-repair-page .hcr-receipt-title {
    color: #1e293b;
}

.hcr-major-repair-page .hcr-receipt-title {
    font-weight: 900;
}

.hcr-major-repair-page .hcr-receipt-help {
    color: #334155;
    font-weight: 650;
}

.hcr-major-repair-page .hcr-receipt-current {
    border: 1px solid #d8e4f0;
    background: #ffffff;
    color: #334155;
}

.hcr-major-repair-page .hcr-receipt-current strong {
    color: #0f172a;
}

.hcr-major-repair-page .hcr-receipt-current small {
    color: #64748b;
}

.hcr-major-repair-page .hcr-receipt-current a {
    color: #0b6ef6;
}

.hcr-major-repair-page .hcr-btn,
.hcr-major-repair-page a.hcr-btn,
.hcr-major-repair-page button.hcr-btn {
    min-height: 2.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0 1.125rem;
    border-radius: 0.625rem;
    border: 1px solid transparent;
    font-size: 0.875rem;
    font-weight: 800;
    line-height: 1;
    text-decoration: none !important;
    cursor: pointer;
    transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}

.hcr-major-repair-page .hcr-btn-primary {
    background: #0b6ef6;
    border-color: #0b6ef6;
    color: #ffffff;
    box-shadow: 0 10px 20px rgba(11, 110, 246, 0.16);
}

.hcr-major-repair-page .hcr-btn-primary:hover,
.hcr-major-repair-page .hcr-btn-primary:focus-visible {
    background: #0859c6;
    border-color: #0859c6;
}

.hcr-major-repair-page .hcr-btn-light {
    background: rgba(255, 255, 255, 0.94);
    border-color: rgba(255, 255, 255, 0.72);
    color: #0f172a;
}

.hcr-major-repair-page .hcr-btn-cancel,
.hcr-major-repair-page a.hcr-btn-cancel {
    height: 2.5rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    border: 1px solid #cbd5e1;
    background: #ffffff;
    color: #334155;
    border-radius: 0.625rem;
    font-size: 0.875rem;
    font-weight: 800;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.hcr-major-repair-page .hcr-btn-cancel:hover,
.hcr-major-repair-page .hcr-btn-cancel:focus-visible {
    background: #f8fafc;
    color: #0f172a;
    border-color: #94a3b8;
}

.hcr-major-repair-page .hcr-btn-clear,
.hcr-major-repair-page button.hcr-btn-clear {
    height: 2.5rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    border: 1px solid #fecaca;
    background: #fff7ed;
    color: #9f1239;
    border-radius: 0.625rem;
    font-size: 0.875rem;
    font-weight: 850;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.hcr-major-repair-page .hcr-btn-clear:hover,
.hcr-major-repair-page .hcr-btn-clear:focus-visible {
    background: #ffe4e6;
    color: #881337;
    border-color: #fda4af;
}

.hcr-major-repair-page .hcr-major-repair-footer-actions {
    margin-top: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.125rem;
    border: 1px solid #d8e4f0;
    border-radius: 1.125rem;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

.hcr-major-repair-page .hcr-major-repair-footer-actions .hcr-footer-right-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.hcr-major-repair-page .hcr-major-history-table td:nth-child(5),
.hcr-major-repair-page .hcr-major-history-table td:nth-child(6) {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

@media (max-width: 1100px) {
    .hcr-major-repair-shell {
        max-width: 100%;
    }

    .hcr-major-repair-page .hcr-major-repair-layout,
    .hcr-major-repair-textarea-grid {
        grid-template-columns: 1fr;
    }

    .hcr-major-repair-page .hcr-major-repair-footer-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .hcr-major-repair-page .hcr-major-repair-footer-actions .hcr-footer-right-actions {
        justify-content: flex-end;
    }
}

@media (max-width: 900px) {
    .hcr-major-repair-page .hcr-major-repair-receipt-grid,
    .hcr-major-repair-page .hcr-receipt-row-spaced {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .hcr-major-repair-shell {
        padding: 1rem;
    }

    .hcr-major-repair-page .hcr-preventive-card .hcr-field-row,
    .hcr-major-repair-page .hcr-maintenance-options-card .hcr-field-row {
        grid-template-columns: 1fr;
    }

    .hcr-major-repair-page .hcr-maintenance-hero {
        align-items: stretch;
        flex-direction: column;
    }
}

.hcr-major-repair-page .hcr-card.hcr-major-repair-textarea-card {
    background: #ffffff;
    border: 1px solid #dbe7f3;
    border-radius: 1.25rem;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.09);
}

/* Fix75F - Major Vehicle Repair twin-column field regularization */
.hcr-major-repair-page .hcr-major-details-grid,
.hcr-major-repair-page .hcr-major-cost-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem 1rem;
    align-items: start;
}

.hcr-major-repair-page .hcr-major-details-grid .hcr-field-row,
.hcr-major-repair-page .hcr-major-cost-grid .hcr-field-row {
    display: grid;
    grid-template-columns: 1fr !important;
    gap: 0.35rem;
    margin-bottom: 0 !important;
    min-height: 0 !important;
    align-items: start;
}

.hcr-major-repair-page .hcr-major-details-grid .hcr-field-row label,
.hcr-major-repair-page .hcr-major-cost-grid .hcr-field-row label {
    padding-top: 0 !important;
    text-align: left !important;
    justify-self: start;
    color: #334155;
    font-size: 0.82rem;
    font-weight: 800;
    line-height: 1.2;
}

.hcr-major-repair-page .hcr-major-details-grid .hcr-field-row input,
.hcr-major-repair-page .hcr-major-details-grid .hcr-field-row select,
.hcr-major-repair-page .hcr-major-cost-grid .hcr-field-row input,
.hcr-major-repair-page .hcr-major-cost-grid .hcr-field-row select {
    width: 100%;
    min-width: 0;
    height: 2.5rem;
    box-sizing: border-box;
}

.hcr-major-repair-page .hcr-major-grid-empty {
    min-height: 1px;
}

@media (max-width: 760px) {
    .hcr-major-repair-page .hcr-major-details-grid,
    .hcr-major-repair-page .hcr-major-cost-grid {
        grid-template-columns: 1fr;
    }

    .hcr-major-repair-page .hcr-major-grid-empty {
        display: none;
    }
}

/* Fix75H - Major Vehicle Repair mock screen design application */
.hcr-major-mock-page {
    width: min(1120px, calc(100vw - 3rem));
    margin: 0 auto;
    padding: 2rem 0 0;
    color: #071837;
}

.hcr-major-mock-form {
    display: grid;
    gap: 0.65rem;
}

.hcr-major-mock-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 0.5rem 0 1.75rem;
    color: #ffffff;
}

.hcr-major-mock-hero h1 {
    margin: 0;
    color: #ffffff;
    font-size: clamp(2.25rem, 4vw, 3.05rem);
    line-height: 1.05;
    font-weight: 950;
    letter-spacing: -0.045em;
}

.hcr-major-mock-hero p {
    margin: 0.9rem 0 0;
    color: rgba(255, 255, 255, 0.9);
    font-size: 1rem;
    font-weight: 700;
}

.hcr-major-mock-top-actions,
.hcr-major-footer-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.hcr-major-action,
.hcr-major-mock-page a.hcr-major-action,
.hcr-major-mock-page button.hcr-major-action {
    min-height: 3rem;
    min-width: 8.6rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 1.3rem;
    border-radius: 0.35rem;
    border: 1px solid transparent;
    font-size: 0.98rem;
    font-weight: 900;
    text-decoration: none !important;
    line-height: 1;
    cursor: pointer;
    transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, box-shadow 150ms ease;
}

.hcr-major-action-primary,
.hcr-major-mock-page button.hcr-major-action-primary {
    background: #075fd2;
    border-color: #075fd2;
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(4, 78, 170, 0.24);
}

.hcr-major-action-primary:hover,
.hcr-major-action-primary:focus-visible {
    background: #004caf;
    border-color: #004caf;
}

.hcr-major-action-light,
.hcr-major-action-footer-light,
.hcr-major-mock-page a.hcr-major-action-light,
.hcr-major-mock-page a.hcr-major-action-footer-light,
.hcr-major-mock-page button.hcr-major-action-light,
.hcr-major-mock-page button.hcr-major-action-footer-light {
    background: #f8fafc;
    border-color: #d7e0eb;
    color: #071837;
    box-shadow: 0 2px 5px rgba(15, 23, 42, 0.08);
}

.hcr-major-action-light:hover,
.hcr-major-action-footer-light:hover,
.hcr-major-action-light:focus-visible,
.hcr-major-action-footer-light:focus-visible {
    background: #ffffff;
    border-color: #aab9ca;
}

.hcr-major-screen-card {
    width: 100%;
    background: #f8fafc;
    border: 1px solid #d0d9e6;
    border-radius: 0.85rem;
    padding: 1.05rem 1.25rem 1.15rem;
    box-shadow: 0 10px 28px rgba(0, 11, 31, 0.13);
    box-sizing: border-box;
    overflow: hidden;
}

.hcr-major-card-title {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 1.9rem;
    margin-bottom: 0.75rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid #c5cedb;
    color: #071837;
}

.hcr-major-card-title > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1rem;
    color: #064fba;
    font-size: 1.1rem;
    font-weight: 950;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 2px;
}

.hcr-major-card-title h2 {
    margin: 0;
    color: #071837;
    font-size: 1.28rem;
    line-height: 1.2;
    font-weight: 950;
    letter-spacing: -0.02em;
}

.hcr-major-title-with-arrow b {
    margin-left: auto;
    color: #071837;
    font-size: 1.25rem;
    line-height: 1;
}

.hcr-major-lookup-grid {
    display: grid;
    grid-template-columns: minmax(220px, 2.1fr) minmax(112px, 0.75fr) minmax(115px, 1fr) minmax(140px, 1fr) minmax(130px, 1fr);
    border: 1px solid #cbd5e1;
    border-radius: 0.3rem;
    overflow: hidden;
    background: #ffffff;
}

.hcr-major-lookup-vin-cell,
.hcr-major-vehicle-cell {
    min-height: 2.55rem;
    display: grid;
    align-content: center;
    gap: 0.1rem;
    padding: 0.45rem 1rem;
    border-right: 1px solid #cbd5e1;
    border-bottom: 1px solid #cbd5e1;
    background: #ffffff;
}

.hcr-major-lookup-vin-cell label,
.hcr-major-vehicle-cell span {
    color: #53627a;
    font-size: 0.82rem;
    font-weight: 850;
}

.hcr-major-lookup-vin-cell input {
    width: 100%;
    min-width: 0;
    height: 2rem;
    border: 0 !important;
    outline: none;
    box-shadow: none;
    background: transparent !important;
    color: #071837 !important;
    font-size: 1rem;
    font-weight: 800;
    padding: 0 !important;
}

.hcr-major-lookup-btn,
.hcr-major-mock-page button.hcr-major-lookup-btn {
    min-height: 2.55rem;
    border: 0;
    border-right: 1px solid #cbd5e1;
    border-bottom: 1px solid #cbd5e1;
    background: #075fd2;
    color: #ffffff;
    font-weight: 950;
    font-size: 0.96rem;
    cursor: pointer;
}

.hcr-major-lookup-btn:hover,
.hcr-major-lookup-btn:focus-visible {
    background: #004caf;
}

.hcr-major-vehicle-cell strong {
    min-width: 0;
    color: #071837;
    font-size: 0.96rem;
    font-weight: 950;
    overflow-wrap: anywhere;
}

.hcr-major-status-text,
.hcr-major-vehicle-cell .is-success {
    color: #2a8b22 !important;
}

.hcr-major-vehicle-cell .is-error {
    color: #b42318 !important;
}

.hcr-major-vehicle-wide {
    grid-column: span 2;
}

.hcr-major-message-cell {
    grid-column: span 1;
}

.hcr-major-details-two-panel {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem;
}

.hcr-major-panel-label {
    margin: 0 0 0.35rem;
    color: #071837;
    font-size: 0.9rem;
    font-weight: 950;
}

.hcr-major-field-table {
    border: 1px solid #cbd5e1;
    border-radius: 0.35rem;
    overflow: hidden;
    background: #ffffff;
}

.hcr-major-table-field {
    min-height: 2.95rem;
    display: grid;
    grid-template-columns: minmax(150px, 0.85fr) minmax(0, 1fr);
    border-bottom: 1px solid #d7dee9;
    background: #ffffff;
}

.hcr-major-table-field:last-child {
    border-bottom: 0;
}

.hcr-major-table-field label {
    display: flex;
    align-items: center;
    padding: 0 1rem;
    border-right: 1px solid #cbd5e1;
    background: #f8fafc;
    color: #071837;
    font-size: 0.93rem;
    font-weight: 950;
    line-height: 1.15;
}

.hcr-major-table-field input,
.hcr-major-table-field select {
    width: 100%;
    min-width: 0;
    height: 100% !important;
    min-height: 2.95rem;
    border: 0 !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    color: #071837 !important;
    font-size: 0.96rem;
    font-weight: 850;
    padding: 0 1rem !important;
    box-shadow: none !important;
}

.hcr-major-placeholder-field input:disabled {
    color: #64748b !important;
    background: #f8fafc !important;
}

.hcr-major-safety-checks {
    display: grid;
    gap: 0.65rem;
    padding: 0.35rem 0 0.75rem;
}

.hcr-major-safety-checks label {
    display: flex;
    align-items: center;
    gap: 0.95rem;
    color: #071837;
    font-size: 1rem;
    font-weight: 950;
    cursor: pointer;
}

.hcr-major-safety-checks input[type="checkbox"] {
    width: 1.55rem;
    height: 1.55rem;
    margin: 0;
    border: 1px solid #cbd5e1;
    border-radius: 0.2rem;
    background: #ffffff;
}

.hcr-major-hold-warning {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    min-height: 2.9rem;
    padding: 0 1.2rem;
    border: 1px solid #ffd689;
    border-radius: 0.35rem;
    background: #ffedbe;
    color: #071837;
}

.hcr-major-hold-warning span {
    color: #ed8a00;
    font-size: 1.05rem;
}

.hcr-major-hold-warning strong {
    font-size: 0.98rem;
    font-weight: 800;
}

.hcr-major-cost-row {
    display: grid;
    gap: 1.25rem;
    align-items: end;
}

.hcr-major-cost-row-primary {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.15fr);
    padding: 0 0 0.9rem;
    border-bottom: 1px solid #d7dee9;
}

.hcr-major-cost-row-secondary {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(210px, 0.9fr) minmax(210px, 0.9fr);
    padding-top: 0.9rem;
}

.hcr-major-cost-field {
    min-width: 0;
    display: grid;
    gap: 0.45rem;
}

.hcr-major-cost-field label {
    color: #071837;
    font-size: 0.98rem;
    font-weight: 950;
    line-height: 1.15;
}

.hcr-major-total-field label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.hcr-major-total-field label strong {
    white-space: nowrap;
    font-size: 1.05rem;
    font-weight: 950;
}

.hcr-major-cost-field input,
.hcr-major-cost-field select {
    width: 100%;
    height: 2.75rem;
    min-width: 0;
    border: 1px solid #cbd5e1;
    border-radius: 0.35rem;
    background: #ffffff;
    color: #071837;
    padding: 0 0.85rem;
    font-size: 0.98rem;
    font-weight: 850;
    box-sizing: border-box;
}

.hcr-major-cost-field .hcr-accounting-input,
.hcr-major-mock-page .hcr-accounting-input {
    text-align: right !important;
    padding-right: 1rem !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
    font-weight: 850 !important;
    color: #071837 !important;
    background: #ffffff !important;
}

.hcr-major-total-field .hcr-accounting-input {
    background: linear-gradient(90deg, #086bd8 0 50%, #ffffff 50% 100%) !important;
    color: #071837 !important;
}

.hcr-major-receipt-compact {
    min-width: 0;
    display: grid;
    gap: 0.25rem;
}

.hcr-major-upload-button {
    min-height: 2.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    border: 1px solid #1e67b6;
    border-radius: 0.3rem;
    background: #ffffff;
    color: #071837;
    font-size: 0.9rem;
    font-weight: 950;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.hcr-major-upload-button:hover,
.hcr-major-upload-button:focus-within {
    background: #f2f7ff;
    border-color: #075fd2;
}

.hcr-major-receipt-current a {
    color: #075fd2;
    font-size: 0.78rem;
    font-weight: 850;
    text-decoration: none;
}

.hcr-major-notes-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.hcr-major-note-box {
    min-width: 0;
    border: 1px solid #cbd5e1;
    border-radius: 0.45rem;
    background: #ffffff;
    overflow: hidden;
}

.hcr-major-note-box label {
    display: block;
    padding: 0.75rem 1rem 0.45rem;
    color: #071837;
    font-size: 0.98rem;
    font-weight: 950;
    border-bottom: 1px solid #d7dee9;
}

.hcr-major-note-box textarea {
    width: 100%;
    min-height: 6rem;
    border: 0 !important;
    resize: vertical;
    background: #ffffff !important;
    color: #071837;
    padding: 0.8rem 1rem;
    font-size: 0.96rem;
    box-shadow: none !important;
    box-sizing: border-box;
}

.hcr-major-history-title em {
    margin-left: auto;
    color: #071837;
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 650;
    opacity: 0.82;
}

.hcr-major-history-wrap {
    border: 1px solid #cbd5e1;
    border-radius: 0.15rem;
    overflow-x: auto;
    background: #ffffff;
}

.hcr-major-history-table {
    width: 100%;
    min-width: 880px;
    border-collapse: collapse;
    color: #071837;
}

.hcr-major-history-table thead th {
    height: 2.4rem;
    padding: 0 0.9rem;
    background: #123985;
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    text-align: center;
}

.hcr-major-history-table tbody td {
    height: 3.1rem;
    padding: 0.65rem 0.9rem;
    border-top: 1px solid #d7dee9;
    background: #ffffff;
    color: #071837;
    font-size: 0.9rem;
    font-weight: 750;
    text-align: center;
}

.hcr-major-history-table .hcr-empty-row td {
    text-align: center !important;
    color: #071837;
    font-size: 0.96rem;
    font-weight: 850;
}

.hcr-major-mock-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 1.25rem calc((100vw - min(1120px, calc(100vw - 3rem))) / -2) 0;
    padding: 1rem calc((100vw - min(1120px, calc(100vw - 3rem))) / 2);
    background: #f8fafc;
    border-top: 1px solid #d7dee9;
    box-shadow: 0 -12px 28px rgba(15, 23, 42, 0.08);
}

.hcr-major-clear-btn,
.hcr-major-mock-page button.hcr-major-clear-btn {
    min-height: 3rem;
    min-width: 10rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 1.25rem;
    border: 1px solid #fecaca;
    border-radius: 0.35rem;
    background: #fff7ed;
    color: #c0392b;
    font-size: 1.1rem;
    font-weight: 950;
    cursor: pointer;
}

.hcr-major-clear-btn:hover,
.hcr-major-clear-btn:focus-visible {
    background: #ffe4e6;
    border-color: #fda4af;
}

.hcr-major-mock-page .text-danger,
.hcr-major-mock-page .hcr-field-error {
    display: block;
    margin-top: 0.35rem;
    color: #b42318 !important;
    font-size: 0.8rem;
    font-weight: 850;
}

.hcr-major-mock-page .hcr-validation-summary {
    padding: 0.9rem 1rem;
    border: 1px solid #fecaca;
    border-radius: 0.65rem;
    background: #fff1f2;
    color: #9f1239;
    font-weight: 850;
}

.hcr-major-mock-page .hcr-receipt-selected {
    min-height: 1rem;
    color: #334155;
    font-size: 0.75rem;
    font-weight: 750;
}

.hcr-major-mock-page .hcr-receipt-selected.is-valid {
    color: #166534;
}

.hcr-major-mock-page .hcr-receipt-selected.is-error {
    color: #b42318;
}

@media (max-width: 1180px) {
    .hcr-major-mock-page {
        width: calc(100vw - 2rem);
    }

    .hcr-major-mock-footer {
        margin-left: -1rem;
        margin-right: -1rem;
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

@media (max-width: 980px) {
    .hcr-major-mock-hero,
    .hcr-major-mock-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .hcr-major-mock-top-actions,
    .hcr-major-footer-actions {
        justify-content: flex-start;
    }

    .hcr-major-lookup-grid,
    .hcr-major-details-two-panel,
    .hcr-major-cost-row-primary,
    .hcr-major-cost-row-secondary,
    .hcr-major-notes-grid {
        grid-template-columns: 1fr;
    }

    .hcr-major-vehicle-wide,
    .hcr-major-message-cell {
        grid-column: span 1;
    }

    .hcr-major-lookup-vin-cell,
    .hcr-major-vehicle-cell,
    .hcr-major-lookup-btn {
        border-right: 0;
    }
}

@media (max-width: 640px) {
    .hcr-major-mock-page {
        width: calc(100vw - 1rem);
        padding-top: 1rem;
    }

    .hcr-major-screen-card {
        padding: 0.85rem;
        border-radius: 0.7rem;
    }

    .hcr-major-table-field {
        grid-template-columns: 1fr;
    }

    .hcr-major-table-field label {
        min-height: 2rem;
        border-right: 0;
        border-bottom: 1px solid #e2e8f0;
    }

    .hcr-major-action,
    .hcr-major-clear-btn {
        width: 100%;
    }
}

/* Fix75I - Major Repair recommendation application */
.hcr-major-mock-page button.hcr-major-lookup-btn,
.hcr-major-lookup-btn {
    align-self: center;
    justify-self: center;
    width: calc(100% - 0.8rem);
    min-height: 2.2rem;
    max-height: 2.2rem;
    margin: 0.2rem 0.4rem;
    border: 1px solid #075fd2;
    border-radius: 0.35rem;
    font-size: 0.86rem;
    line-height: 1;
}

.hcr-major-severity-control {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.6rem;
    background: #ffffff;
}

.hcr-major-severity-control select {
    min-width: 0;
}

.hcr-major-severity-indicator {
    margin-right: 0.75rem;
    padding: 0.22rem 0.65rem;
    border-radius: 999px;
    color: #ffffff;
    font-size: 0.76rem;
    font-weight: 950;
    line-height: 1;
    white-space: nowrap;
    background: #16a34a;
}

.hcr-major-severity-indicator.severity-low {
    background: #16a34a;
}

.hcr-major-severity-indicator.severity-medium {
    background: #f97316;
}

.hcr-major-severity-indicator.severity-high {
    background: #dc2626;
}

.hcr-major-hold-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.25rem;
    margin-top: 0.55rem;
    color: #475569;
    font-size: 0.78rem;
    font-weight: 800;
}

.hcr-major-upload-dropzone {
    min-height: 4.35rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    padding: 0.55rem 0.7rem;
    border: 2px dashed #2f70be;
    border-radius: 0.42rem;
    background: #f8fbff;
    color: #1e293b;
    text-align: center;
    cursor: pointer;
    transition: background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.hcr-major-upload-dropzone:hover,
.hcr-major-upload-dropzone:focus-within,
.hcr-major-upload-dropzone.is-dragover {
    background: #eaf3ff;
    border-color: #075fd2;
    box-shadow: 0 0 0 3px rgba(7, 95, 210, 0.12);
    transform: translateY(-1px);
}

.hcr-major-upload-dropzone .hcr-major-upload-icon {
    font-size: 1.2rem;
    line-height: 1;
}

.hcr-major-upload-dropzone strong {
    color: #1e293b;
    font-size: 0.83rem;
    font-weight: 950;
    line-height: 1.15;
}

.hcr-major-upload-dropzone small {
    color: #334155;
    font-size: 0.72rem;
    font-weight: 750;
    line-height: 1.15;
}

.hcr-major-mock-page .hcr-receipt-preview {
    padding-top: 0.15rem;
    overflow-wrap: anywhere;
}

.hcr-major-mock-page .hcr-receipt-preview span {
    color: #475569;
    font-weight: 750;
}

.hcr-major-title-with-tools {
    align-items: center;
    gap: 0.75rem;
}

.hcr-major-template-picker {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.hcr-major-template-picker label {
    color: #475569;
    font-size: 0.75rem;
    font-weight: 900;
    text-transform: uppercase;
    white-space: nowrap;
}

.hcr-major-template-picker select {
    height: 2.1rem;
    min-width: 13.5rem;
    border: 1px solid #cbd5e1;
    border-radius: 0.35rem;
    background: #ffffff;
    color: #071837;
    padding: 0 0.65rem;
    font-size: 0.82rem;
    font-weight: 850;
}

.hcr-major-history-link {
    margin-left: auto;
    color: #075fd2;
    font-size: 0.8rem;
    font-weight: 950;
    text-decoration: none;
    white-space: nowrap;
}

.hcr-major-history-link:hover,
.hcr-major-history-link:focus-visible {
    text-decoration: underline;
}

.hcr-major-history-title em {
    margin-left: 0.75rem;
}

@media (max-width: 980px) {
    .hcr-major-title-with-tools {
        flex-wrap: wrap;
    }

    .hcr-major-template-picker {
        width: 100%;
        margin-left: 0;
        justify-content: flex-start;
    }

    .hcr-major-template-picker select {
        min-width: 0;
        flex: 1;
    }

    .hcr-major-severity-control {
        grid-template-columns: 1fr;
        gap: 0.35rem;
        padding-bottom: 0.4rem;
    }

    .hcr-major-severity-indicator {
        justify-self: start;
        margin-left: 0.75rem;
    }
}

/* Fix75J - Major Repair VIN Last 6 Characters workflow */
.hcr-major-vin-input-wrap {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.35rem;
}

.hcr-major-vin-input-wrap input {
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.hcr-major-vin-clear {
    width: 1.55rem;
    height: 1.55rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: #ffffff;
    color: #475569;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
}

.hcr-major-vin-clear:hover,
.hcr-major-vin-clear:focus-visible {
    background: #e2e8f0;
    color: #0f172a;
}

.hcr-major-vin-clear[hidden] {
    display: none !important;
}

.hcr-major-vin-inline-error {
    min-height: 1rem;
    color: #b42318;
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1.15;
    display: none;
}

.hcr-major-vin-inline-error.is-visible {
    display: block;
}

.hcr-major-mock-page button.hcr-major-lookup-btn,
.hcr-major-lookup-btn {
    width: auto;
    min-width: 5.4rem;
    height: 2rem;
    min-height: 2rem;
    max-height: 2rem;
    align-self: center;
    justify-self: center;
    padding: 0 0.8rem;
    font-weight: 500;
}

.hcr-major-mock-page button.hcr-major-lookup-btn:disabled,
.hcr-major-lookup-btn:disabled {
    background: #e2e8f0;
    border-color: #cbd5e1;
    color: #64748b;
    cursor: not-allowed;
}

.hcr-major-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: rgba(2, 6, 23, 0.68);
}

.hcr-major-modal[hidden] {
    display: none !important;
}

.hcr-major-modal-panel {
    width: min(720px, 100%);
    max-height: calc(100vh - 4rem);
    overflow: auto;
    border-radius: 1rem;
    border: 1px solid #cbd5e1;
    background: #ffffff;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.35);
    padding: 1.25rem;
}

.hcr-major-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: 0.8rem;
    margin-bottom: 0.8rem;
}

.hcr-major-modal-header h3 {
    margin: 0;
    color: #071837;
    font-size: 1.15rem;
    font-weight: 950;
}

.hcr-major-modal-header button {
    width: 2rem;
    height: 2rem;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: #f8fafc;
    color: #0f172a;
    font-weight: 900;
    cursor: pointer;
}

.hcr-major-modal-panel p {
    margin: 0 0 0.9rem;
    color: #475569;
    font-weight: 700;
}

.hcr-major-modal-list {
    display: grid;
    gap: 0.7rem;
}

.hcr-major-modal-candidate {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 0.7fr);
    gap: 0.75rem;
    align-items: center;
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 0.7rem;
    background: #f8fafc;
    color: #0f172a;
    padding: 0.8rem;
    text-align: left;
    cursor: pointer;
}

.hcr-major-modal-candidate:hover,
.hcr-major-modal-candidate:focus-visible {
    border-color: #075fd2;
    background: #eff6ff;
    outline: none;
}

.hcr-major-modal-candidate strong {
    color: #071837;
    font-weight: 950;
}

.hcr-major-modal-candidate span {
    min-width: 0;
    overflow-wrap: anywhere;
    color: #334155;
    font-size: 0.88rem;
    font-weight: 750;
}

@media (max-width: 760px) {
    .hcr-major-modal-candidate {
        grid-template-columns: 1fr;
    }
}

/* Fix75M - Major Repair required-field, history detail, safety-row, and hover polish */
.hcr-major-safety-card .hcr-major-safety-checks {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem 2rem;
}

.hcr-major-safety-card .hcr-major-safety-checks label {
    min-width: 0;
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    white-space: nowrap;
}

.hcr-major-hover-danger:hover,
.hcr-major-hover-danger:focus-visible,
.hcr-major-mock-page a.hcr-major-hover-danger:hover,
.hcr-major-mock-page a.hcr-major-hover-danger:focus-visible,
.hcr-major-mock-page button.hcr-major-hover-danger:hover,
.hcr-major-mock-page button.hcr-major-hover-danger:focus-visible {
    background: #D32F2F !important;
    border-color: #D32F2F !important;
    color: #FFFFFF !important;
    box-shadow: 0 8px 18px rgba(211, 47, 47, 0.22);
}

.hcr-major-table-field .hcr-field-error,
.hcr-major-cost-field .hcr-field-error,
.hcr-major-note-box .hcr-field-error {
    padding: 0.15rem 0.75rem 0.35rem;
    margin-top: 0;
    line-height: 1.15;
}

.hcr-major-full-history-table th:nth-child(2),
.hcr-major-full-history-table td:nth-child(2),
.hcr-major-full-history-table th:nth-child(6),
.hcr-major-full-history-table td:nth-child(6),
.hcr-major-full-history-table th:nth-child(8),
.hcr-major-full-history-table td:nth-child(8) {
    text-align: left;
}

.hcr-major-history-detail,
.hcr-major-history-diagnostic {
    margin-top: 0.25rem;
    color: #334155;
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1.3;
}

.hcr-major-history-diagnostic span {
    color: #0f172a;
    font-weight: 950;
}

@media (max-width: 640px) {
    .hcr-major-safety-card .hcr-major-safety-checks {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* Fix75N - Major Repair standardized required-field validation */
.field-error {
    color: #D32F2F !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    margin-top: 4px !important;
}

.input-error {
    border: 2px solid #D32F2F !important;
}

.hcr-major-mock-page input.input-error,
.hcr-major-mock-page select.input-error,
.hcr-major-mock-page textarea.input-error,
.hcr-major-table-field input.input-error,
.hcr-major-table-field select.input-error,
.hcr-major-cost-field input.input-error,
.hcr-major-cost-field select.input-error,
.hcr-major-note-box textarea.input-error,
.hcr-major-lookup-vin-cell input.input-error {
    border: 2px solid #D32F2F !important;
    box-shadow: 0 0 0 3px rgba(211, 47, 47, 0.12) !important;
}

.hcr-major-mock-page .field-error,
.hcr-major-mock-page .hcr-field-error {
    display: block;
    color: #D32F2F !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    margin-top: 4px !important;
    line-height: 1.25;
}

.hcr-major-table-field .field-error,
.hcr-major-table-field .hcr-field-error {
    grid-column: 2 / -1;
    padding: 0.2rem 0.75rem 0.45rem;
    margin: 0 !important;
    background: #fffafa;
}

.hcr-major-cost-field .field-error,
.hcr-major-cost-field .hcr-field-error,
.hcr-major-receipt-compact .field-error,
.hcr-major-receipt-compact .hcr-field-error {
    padding: 0;
    margin-top: 4px !important;
}

.hcr-major-note-box .field-error,
.hcr-major-note-box .hcr-field-error {
    padding: 0 1rem 0.55rem;
    margin-top: 4px !important;
}

.field-label-invalid {
    color: #D32F2F !important;
}

.hcr-error-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 0.4rem;
    color: #D32F2F;
    font-size: 0.9em;
    line-height: 1;
    vertical-align: middle;
}

.hcr-form-error-banner {
    display: none;
    margin: 0 0 0.65rem;
    padding: 0.85rem 1rem;
    border: 1px solid #D32F2F;
    border-left-width: 5px;
    border-radius: 0.55rem;
    background: #fff1f1;
    color: #9f1d1d;
    font-size: 0.95rem;
    font-weight: 800;
}

.hcr-form-error-banner.is-visible {
    display: block;
}

.hcr-major-mock-page .hcr-validation-summary.validation-summary-errors,
.hcr-major-mock-page .hcr-validation-summary.validation-summary-valid {
    display: none;
}

.hcr-major-vin-inline-error.is-visible {
    color: #D32F2F;
    font-size: 13px;
    font-weight: 500;
    margin-top: 4px;
}

@media (max-width: 640px) {
    .hcr-major-table-field .field-error,
    .hcr-major-table-field .hcr-field-error {
        grid-column: 1 / -1;
    }
}

/* Fix75O - Save & New green hover and required-field hardening */
.hcr-major-hover-success:hover,
.hcr-major-hover-success:focus-visible,
.hcr-major-mock-page button.hcr-major-hover-success:hover,
.hcr-major-mock-page button.hcr-major-hover-success:focus-visible {
    background: #2E7D32 !important;
    border-color: #2E7D32 !important;
    color: #FFFFFF !important;
    box-shadow: 0 8px 18px rgba(46, 125, 50, 0.22);
}

.hcr-major-repair-details-card input[required],
.hcr-major-repair-details-card select[required],
.hcr-major-cost-card input[required],
.hcr-major-cost-card select[required] {
    scroll-margin-top: 6rem;
}

/* Fix75AD - Reports navigation hierarchy and modular vehicle reports submenu. */
.hcr-sidebar-section-label {
    display: block;
    margin: 12px 12px 2px;
    color: rgba(234, 246, 255, .62);
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .10em;
    text-transform: uppercase;
}

.hcr-sidebar-report-subnav {
    display: grid;
    gap: 4px;
    margin: -2px 0 4px 34px;
}

.hcr-sidebar-report-subnav a {
    min-height: 28px;
    padding: 7px 10px;
    border-radius: 8px;
    color: rgba(234,246,255,.82);
    font-size: .82rem;
    font-weight: 800;
    text-decoration: none;
}

.hcr-sidebar-report-subnav a:hover,
.hcr-sidebar-report-subnav a:focus-visible,
.hcr-sidebar-report-subnav a.is-active {
    background: rgba(255,255,255,.12);
    color: #fff;
    box-shadow: inset 3px 0 0 #93c5fd;
    outline: none;
}

.hcr-sidebar.collapsed .hcr-sidebar-section-label,
.hcr-sidebar.collapsed .hcr-sidebar-report-subnav {
    display: none;
}

@media (max-width: 860px) {
    .hcr-sidebar-section-label,
    .hcr-sidebar.collapsed .hcr-sidebar-section-label {
        display: block;
        margin: 10px 0 0;
    }

    .hcr-sidebar-report-subnav,
    .hcr-sidebar.collapsed .hcr-sidebar-report-subnav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        margin: 0;
    }
}

/* Fix75AE - Preventive Service attached blueprint redesign */
.hcr-preventive-service-page .hcr-preventive-form {
    display: flex !important;
    flex-direction: column;
    gap: 14px;
    max-width: 1500px;
    margin: 0 auto;
}

.hcr-preventive-blueprint-workspace {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.hcr-preventive-service-page .hcr-blue-titlebar,
.hcr-preventive-service-page .hcr-maintenance-hero,
.hcr-preventive-service-page .hcr-preventive-hero {
    padding: 16px 22px !important;
    border-radius: 16px !important;
    margin-bottom: 0 !important;
}

.hcr-preventive-service-page .hcr-blue-titlebar h1 {
    font-size: 26px !important;
    line-height: 1.1;
}

.hcr-preventive-service-page .hcr-blue-titlebar p {
    max-width: 1100px;
    margin-top: 4px;
}

.hcr-preventive-section-card,
.hcr-last-services-blueprint {
    background: #FFFFFF;
    border: 1px solid #D7E2F0;
    border-radius: 16px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, .07);
    padding: 14px 16px;
}

.hcr-preventive-section-heading {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid #E2E8F0;
    color: #0B3A75;
    text-transform: uppercase;
    letter-spacing: .035em;
}

.hcr-preventive-section-heading span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 74px;
    min-height: 24px;
    padding: 4px 8px;
    border-radius: 999px;
    background: #EAF4FF;
    color: #0B3A75;
    font-size: 11px;
    font-weight: 950;
}

.hcr-preventive-section-heading strong {
    font-size: 14px;
    font-weight: 950;
}

.hcr-preventive-details-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 24px;
    row-gap: 10px;
    align-items: start;
}

.hcr-preventive-field {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
}

.hcr-preventive-field label {
    color: #172033;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.2;
}

.hcr-preventive-field input,
.hcr-preventive-field select,
.hcr-notes-block-blueprint textarea,
.hcr-preventive-service-page .hcr-attention-row input {
    width: 100%;
    min-height: 38px !important;
    border: 1px solid #B8C3D1;
    border-radius: 9px;
    background: #FFFFFF;
    color: #0F172A;
    font-size: 14px;
    padding: 8px 10px !important;
}

.hcr-preventive-field input[readonly],
.hcr-preventive-field input:disabled,
.hcr-preventive-field select:disabled,
.hcr-preventive-field select.is-disabled {
    background: #EEF2F7 !important;
    color: #64748B !important;
}

.hcr-preventive-field input:focus,
.hcr-preventive-field select:focus,
.hcr-notes-block-blueprint textarea:focus,
.hcr-preventive-service-page .hcr-attention-row input:focus {
    outline: none;
    border-color: #1E73BE;
    box-shadow: 0 0 0 4px rgba(30, 115, 190, .12);
}

.hcr-preventive-inline-control {
    display: grid;
    grid-template-columns: minmax(120px, 1fr) auto;
    gap: 8px;
    align-items: center;
}

.hcr-preventive-service-page .hcr-btn-compact {
    min-height: 38px !important;
    min-width: 72px !important;
    padding: 0 14px !important;
}

.hcr-field-error-inline,
.hcr-lookup-message-inline {
    grid-column: 2;
    margin: 3px 0 0 !important;
    font-size: 12px;
    line-height: 1.25;
}

.hcr-preventive-package-category-grid {
    display: grid;
    grid-template-columns: minmax(360px, 42fr) minmax(520px, 58fr);
    gap: 18px;
    align-items: stretch;
}

.hcr-preventive-column-panel {
    border: 1px solid #E2E8F0;
    border-radius: 14px;
    background: #F8FAFC;
    padding: 14px;
}

.hcr-preventive-column-title {
    margin: -2px 0 12px;
    color: #0B3A75;
    font-size: 13px;
    font-weight: 950;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.hcr-preventive-large-check,
.hcr-attention-control-blueprint .hcr-attention-check {
    display: flex !important;
    align-items: center;
    gap: 10px;
    min-height: 36px;
    margin: 8px 0 10px !important;
    color: #172033 !important;
    font-size: 13px;
    font-weight: 900 !important;
}

.hcr-preventive-large-check input,
.hcr-attention-control-blueprint input {
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 auto;
}

.hcr-preventive-field-tight {
    grid-template-columns: 118px minmax(0, 1fr);
    margin-bottom: 9px;
}

.hcr-package-summary-table {
    display: grid !important;
    grid-template-columns: 1.2fr .8fr .9fr !important;
    gap: 0 !important;
    margin: 12px 0 !important;
    border: 1px solid #D7E2F0;
    border-radius: 12px;
    overflow: hidden;
}

.hcr-package-summary-table div {
    border: 0 !important;
    border-right: 1px solid #D7E2F0 !important;
    border-radius: 0 !important;
    background: #FFFFFF !important;
    padding: 10px 12px !important;
}

.hcr-package-summary-table div:last-child {
    border-right: 0 !important;
}

.hcr-package-summary-table span {
    color: #64748B !important;
    font-size: 11px !important;
    font-weight: 950 !important;
}

.hcr-package-summary-table strong {
    color: #0F172A !important;
    font-size: 16px !important;
    font-weight: 950 !important;
}

.hcr-package-cost-status {
    margin: 6px 0 10px !important;
    padding: 8px 10px;
    border: 1px solid #CBD5E1;
    border-radius: 10px;
    background: #FFFFFF;
    color: #334155;
    font-size: 13px;
    font-weight: 850;
}

.hcr-package-cost-status.is-covered {
    background: #ECFDF3;
    border-color: #A7F3D0;
    color: #047857;
}

.hcr-total-care-row {
    margin-top: 8px;
}

.hcr-maintenance-fieldsets-blueprint {
    display: grid !important;
    grid-template-columns: minmax(170px, 1fr) minmax(230px, 1.25fr) !important;
    gap: 14px !important;
}

.hcr-maintenance-fieldsets-blueprint fieldset {
    min-width: 0;
    border: 1px solid #D7E2F0 !important;
    border-radius: 12px !important;
    background: #FFFFFF !important;
    padding: 12px 14px !important;
}

.hcr-maintenance-fieldsets-blueprint .hcr-tire-service-fieldset {
    grid-column: 1 / -1;
    max-width: none !important;
}

.hcr-maintenance-fieldsets-blueprint legend {
    padding: 0 5px;
    color: #0B3A75;
    font-size: 12px;
    font-weight: 950;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.hcr-maintenance-fieldsets-blueprint label {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    min-height: 30px;
    margin: 4px 0 !important;
    color: #1E293B;
    font-size: 14px;
    font-weight: 800;
}

.hcr-maintenance-fieldsets-blueprint input[type="checkbox"] {
    width: 17px !important;
    height: 17px !important;
}

.hcr-attention-control-blueprint {
    margin-top: 12px !important;
    padding: 9px 12px !important;
    border-color: #D7E2F0 !important;
    background: #FFFFFF !important;
}

.hcr-notes-block-blueprint {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    margin: 0 !important;
}

.hcr-notes-block-blueprint label {
    margin: 9px 0 0 !important;
    color: #172033;
    font-size: 13px;
    font-weight: 900;
}

.hcr-notes-block-blueprint textarea {
    min-height: 72px !important;
    max-height: 110px !important;
    resize: vertical;
}

.hcr-notes-block-blueprint .hcr-character-hint {
    grid-column: 2;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin: 0 !important;
    color: #64748B;
    font-size: 12px;
    font-weight: 800;
    text-align: left;
}

.hcr-notes-block-blueprint .hcr-character-hint strong {
    color: #334155;
}

.hcr-last-services-blueprint {
    padding: 14px 16px !important;
}

.hcr-last-services-blueprint .hcr-last-services-header {
    margin-bottom: 10px !important;
}

.hcr-last-services-blueprint .hcr-last-services-header h2 {
    color: #0B3A75;
    font-size: 18px;
    font-weight: 950;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.hcr-last-services-blueprint .hcr-maintenance-table {
    min-width: 1080px !important;
    table-layout: fixed !important;
    font-size: 13px;
}

.hcr-last-services-blueprint .hcr-maintenance-table th,
.hcr-last-services-blueprint .hcr-maintenance-table td {
    padding: 9px 10px !important;
    vertical-align: middle;
}

.hcr-last-services-blueprint .hcr-maintenance-table th:nth-child(1) { width: 98px; }
.hcr-last-services-blueprint .hcr-maintenance-table th:nth-child(2) { width: 120px; }
.hcr-last-services-blueprint .hcr-maintenance-table th:nth-child(3) { width: 82px; }
.hcr-last-services-blueprint .hcr-maintenance-table th:nth-child(4),
.hcr-last-services-blueprint .hcr-maintenance-table th:nth-child(5),
.hcr-last-services-blueprint .hcr-maintenance-table th:nth-child(6),
.hcr-last-services-blueprint .hcr-maintenance-table th:nth-child(7),
.hcr-last-services-blueprint .hcr-maintenance-table th:nth-child(8) { width: 70px; text-align: center; }
.hcr-last-services-blueprint .hcr-maintenance-table th:nth-child(9) { width: 95px; }
.hcr-last-services-blueprint .hcr-maintenance-table th:nth-child(10) { width: 105px; }
.hcr-last-services-blueprint .hcr-maintenance-table th:nth-child(11) { width: auto; }

.hcr-preventive-footer-blueprint {
    padding-top: 8px !important;
    border-top: 0 !important;
}

@media (max-width: 1280px) {
    .hcr-preventive-details-grid,
    .hcr-preventive-package-category-grid {
        grid-template-columns: 1fr !important;
    }

    .hcr-preventive-field {
        grid-template-columns: 145px minmax(0, 1fr);
    }
}

@media (max-width: 780px) {
    .hcr-preventive-section-card,
    .hcr-last-services-blueprint {
        padding: 12px;
    }

    .hcr-preventive-field,
    .hcr-preventive-field-tight,
    .hcr-notes-block-blueprint {
        grid-template-columns: 1fr;
    }

    .hcr-field-error-inline,
    .hcr-lookup-message-inline,
    .hcr-notes-block-blueprint .hcr-character-hint {
        grid-column: 1;
    }

    .hcr-maintenance-fieldsets-blueprint {
        grid-template-columns: 1fr !important;
    }

    .hcr-preventive-footer-blueprint,
    .hcr-footer-left-actions,
    .hcr-footer-right-actions {
        width: 100%;
        align-items: stretch !important;
        flex-direction: column;
    }

    .hcr-preventive-service-page .hcr-btn {
        width: 100%;
    }
}

/* Fix75AF - Preventive Service searchable vehicle primary lookup */
.hcr-preventive-service-page .hcr-preventive-field-wide {
    grid-column: 1 / -1;
}

.hcr-preventive-service-page .hcr-preventive-vehicle-lookup-field {
    align-items: start;
}

.hcr-preventive-service-page .hcr-vehicle-search-combo {
    display: grid;
    grid-template-columns: minmax(220px, .8fr) minmax(360px, 1.6fr);
    gap: 8px;
    align-items: start;
}

.hcr-preventive-service-page .hcr-vehicle-lookup-filter,
.hcr-preventive-service-page .hcr-vehicle-search-select {
    width: 100%;
    min-height: 38px !important;
    border: 1px solid #B8C3D1;
    border-radius: 9px;
    background: #FFFFFF;
    color: #0F172A;
    font-size: 14px;
    padding: 8px 10px !important;
}

.hcr-preventive-service-page .hcr-vehicle-lookup-filter:focus,
.hcr-preventive-service-page .hcr-vehicle-search-select:focus {
    outline: none;
    border-color: #1E73BE;
    box-shadow: 0 0 0 4px rgba(30, 115, 190, .12);
}

.hcr-preventive-service-page .hcr-vehicle-search-combo .hcr-lookup-message-inline {
    grid-column: 1 / -1;
    margin: 0 !important;
}

.hcr-preventive-service-page .hcr-preventive-field-readonly input[readonly] {
    font-weight: 800;
}

@media (max-width: 980px) {
    .hcr-preventive-service-page .hcr-vehicle-search-combo {
        grid-template-columns: 1fr;
    }
}

/* Fix75AH - Preventive Service Section 3 Notes layout correction */
.hcr-preventive-service-page .hcr-preventive-section-notes {
    overflow: hidden !important;
    padding: 14px 18px 16px !important;
}

.hcr-preventive-service-page .hcr-preventive-section-notes .internal-use-label {
    display: none !important;
}

.hcr-preventive-service-page .hcr-preventive-notes-panel {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
}

.hcr-preventive-service-page .hcr-preventive-notes-label-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    margin: 0 0 8px !important;
}

.hcr-preventive-service-page .hcr-preventive-notes-label-row label {
    margin: 0 !important;
    color: #172033 !important;
    font-size: 14px !important;
    font-weight: 950 !important;
    line-height: 1.2 !important;
    text-align: left !important;
}

.hcr-preventive-service-page .hcr-preventive-notes-label-row span {
    color: #64748B !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    white-space: nowrap !important;
}

.hcr-preventive-service-page .hcr-preventive-notes-panel textarea,
.hcr-preventive-service-page .hcr-preventive-section-notes textarea#Notes {
    display: block !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    min-height: 92px !important;
    max-height: 180px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 11px 12px !important;
    border: 1px solid #B8C3D1 !important;
    border-radius: 10px !important;
    background: #FFFFFF !important;
    color: #0F172A !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    resize: vertical !important;
}

.hcr-preventive-service-page .hcr-preventive-notes-panel textarea:focus,
.hcr-preventive-service-page .hcr-preventive-section-notes textarea#Notes:focus {
    outline: none !important;
    border-color: #1E73BE !important;
    box-shadow: 0 0 0 4px rgba(30, 115, 190, .12) !important;
}

.hcr-preventive-service-page .hcr-preventive-notes-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    margin: 7px 0 0 !important;
    color: #64748B !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    text-align: left !important;
}

.hcr-preventive-service-page .hcr-preventive-notes-footer strong {
    color: #334155 !important;
    font-weight: 950 !important;
    white-space: nowrap !important;
}

@media (max-width: 780px) {
    .hcr-preventive-service-page .hcr-preventive-notes-label-row,
    .hcr-preventive-service-page .hcr-preventive-notes-footer {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 4px !important;
    }

    .hcr-preventive-service-page .hcr-preventive-notes-label-row span,
    .hcr-preventive-service-page .hcr-preventive-notes-footer strong {
        white-space: normal !important;
    }
}

/* Fix75AI - Preventive Service Log hierarchy, odometer validation, package visibility, and lookup alignment */
.hcr-preventive-service-page .hcr-preventive-section-heading {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: -14px -16px 16px !important;
    padding: 13px 18px !important;
    border-bottom: 0 !important;
    border-radius: 16px 16px 0 0 !important;
    background: linear-gradient(135deg, #0B3A75 0%, #1E73BE 100%) !important;
    color: #FFFFFF !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
}

.hcr-preventive-service-page .hcr-preventive-section-notes .hcr-preventive-section-heading {
    margin: -14px -18px 16px !important;
}

.hcr-preventive-service-page .hcr-preventive-section-heading span {
    min-width: 82px !important;
    min-height: 26px !important;
    background: rgba(255,255,255,.18) !important;
    border: 1px solid rgba(255,255,255,.28) !important;
    color: #FFFFFF !important;
}

.hcr-preventive-service-page .hcr-preventive-section-heading strong {
    color: #FFFFFF !important;
    font-size: 15px !important;
}

.hcr-preventive-service-page .hcr-preventive-single-flow {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

.hcr-preventive-service-page .hcr-preventive-flow-panel {
    border: 1px solid #D7E2F0;
    border-radius: 14px;
    background: #F8FAFC;
    padding: 14px;
}

.hcr-preventive-service-page .hcr-preventive-flow-help {
    margin: -6px 0 12px;
    color: #64748B;
    font-size: 13px;
    font-weight: 750;
}

.hcr-preventive-service-page .hcr-maintenance-fieldsets-single {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.hcr-preventive-service-page .hcr-maintenance-fieldsets-single .hcr-tire-service-fieldset {
    grid-column: auto !important;
}

.hcr-preventive-service-page .hcr-package-fields-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: 12px 18px;
    align-items: start;
}

.hcr-preventive-service-page .hcr-package-conditional-content[hidden],
.hcr-preventive-service-page .hcr-no-package-message[hidden] {
    display: none !important;
}

.hcr-preventive-service-page .hcr-no-package-message {
    display: block;
    margin: 8px 0 12px;
    padding: 12px 14px;
    border: 1px solid #CBD5E1;
    border-left: 5px solid #94A3B8;
    border-radius: 12px;
    background: #F8FAFC;
    color: #475569;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.4;
}

.hcr-preventive-service-page .hcr-preventive-field-numeric input,
.hcr-preventive-service-page .hcr-field-odo input,
.hcr-preventive-service-page .hcr-service-cost-row input {
    max-width: 150px !important;
    justify-self: start;
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 850;
}

.hcr-preventive-service-page .hcr-service-cost-row {
    margin-top: 10px;
}

.hcr-preventive-service-page .hcr-hard-warning-banner {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 12px;
    padding: 12px 14px;
    border: 1px solid #FDA4AF;
    border-left: 5px solid #E11D48;
    border-radius: 12px;
    background: #FFF1F2;
    color: #9F1239;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.35;
}

.hcr-preventive-service-page .hcr-hard-warning-banner[hidden] {
    display: none !important;
}

.hcr-preventive-service-page input.hcr-hard-invalid,
.hcr-preventive-service-page input.input-validation-error,
.hcr-preventive-service-page select.input-validation-error,
.hcr-preventive-service-page textarea.input-validation-error {
    border-color: #F59E0B !important;
    background: #FFFBEB !important;
    box-shadow: 0 0 0 4px rgba(245, 158, 11, .16) !important;
}

.hcr-preventive-service-page .hcr-preventive-field:has(.input-validation-error) label::after,
.hcr-preventive-service-page .hcr-preventive-field:has(.hcr-hard-invalid) label::after {
    content: " ⚠";
    color: #D97706;
    font-weight: 950;
}

.hcr-preventive-service-page .hcr-field-error-inline.field-validation-error,
.hcr-preventive-service-page span.field-validation-error {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    width: fit-content;
    margin-top: 5px !important;
    padding: 5px 8px;
    border: 1px solid #FED7AA;
    border-radius: 8px;
    background: #FFF7ED;
    color: #9A3412 !important;
    font-size: 12px;
    font-weight: 850;
}

.hcr-preventive-service-page span.field-validation-error::before {
    content: "⚠";
}

.hcr-preventive-service-page .hcr-workspace-footer-actions {
    position: sticky !important;
    bottom: 0;
    z-index: 30;
    justify-content: flex-end !important;
    padding: 12px 16px !important;
    margin: 6px -16px -14px !important;
    border-top: 1px solid rgba(203, 213, 225, .9) !important;
    border-radius: 0 0 16px 16px;
    background: rgba(248, 250, 252, .96);
    backdrop-filter: blur(8px);
    box-shadow: 0 -10px 24px rgba(15, 23, 42, .08);
}

.hcr-preventive-service-page .hcr-footer-actions-consolidated {
    display: inline-flex !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    margin-left: auto !important;
}

.hcr-preventive-service-page .hcr-btn-save-primary {
    min-width: 150px !important;
    font-size: 14px !important;
    box-shadow: 0 10px 24px rgba(30, 115, 190, .24) !important;
}

.hcr-preventive-service-page .hcr-lookup-message,
.hcr-preventive-service-page .hcr-lookup-message-inline,
.hcr-preventive-service-page .hcr-vehicle-search-combo .hcr-lookup-message-inline {
    text-align: left !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    width: 100% !important;
}

.hcr-preventive-service-page .hcr-toast-zone {
    text-align: left !important;
}

@media (max-width: 1100px) {
    .hcr-preventive-service-page .hcr-maintenance-fieldsets-single,
    .hcr-preventive-service-page .hcr-package-fields-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 780px) {
    .hcr-preventive-service-page .hcr-preventive-section-heading,
    .hcr-preventive-service-page .hcr-preventive-section-notes .hcr-preventive-section-heading {
        margin-left: -12px !important;
        margin-right: -12px !important;
        flex-wrap: wrap;
    }

    .hcr-preventive-service-page .hcr-workspace-footer-actions {
        position: static !important;
        margin-left: -12px !important;
        margin-right: -12px !important;
    }

    .hcr-preventive-service-page .hcr-footer-actions-consolidated {
        width: 100%;
        flex-direction: column;
    }
}


/* Fix75AJ — HCR logo rollout + login experience polish */
.hcr-sidebar-logo--image {
    width: 48px;
    height: 28px;
    flex: 0 0 48px;
    background: transparent;
    border-radius: 0;
    padding: 0;
    overflow: visible;
}

.hcr-logo-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.hcr-login-logo {
    width: 96px;
    height: 56px;
    flex-basis: 96px;
}

.hcr-sidebar.collapsed .hcr-sidebar-logo--image {
    width: 36px;
    height: 22px;
    flex-basis: 36px;
}

.hcr-login-card {
    width: min(500px, 100%);
}

.hcr-login-brand {
    gap: 16px;
    align-items: center;
    margin-bottom: 14px;
}

.hcr-login-note {
    color: #536276;
    margin: 0 0 24px;
    font-weight: 700;
    font-size: 16px;
    line-height: 1.5;
}

.hcr-login-form {
    gap: 12px;
}

.hcr-login-form input {
    border: 1.5px solid #737373;
}

.hcr-login-form input:focus {
    border-color: #1d4ed8;
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.12);
    outline: none;
}

.hcr-password-field-wrap {
    position: relative;
}

.hcr-password-field-wrap input {
    width: 100%;
    padding-right: 48px;
}

.hcr-password-toggle {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    border: 0;
    background: transparent;
    color: #1d4ed8;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
}

.hcr-password-toggle:hover,
.hcr-password-toggle:focus-visible {
    color: #163ea5;
    outline: none;
}

.hcr-password-toggle-closed {
    display: none;
}

.hcr-password-toggle.is-active .hcr-password-toggle-open {
    display: none;
}

.hcr-password-toggle.is-active .hcr-password-toggle-closed {
    display: inline;
}

.hcr-login-field-meta {
    margin-top: -4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.hcr-field-help-link {
    color: #1d4ed8;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.hcr-field-help-link:hover,
.hcr-field-help-link:focus-visible {
    color: #163ea5;
    text-decoration: underline;
}

.hcr-check-row {
    margin-top: 2px;
}

.hcr-login-button {
    margin-top: 12px;
}

@media (max-width: 560px) {
    .hcr-login-logo {
        width: 80px;
        height: 48px;
        flex-basis: 80px;
    }

    .hcr-login-field-meta {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* Fix75AK — Forgot Password page visibility and standalone auth layout */
.hcr-recovery-body {
    background: radial-gradient(circle at top, rgba(20, 145, 255, .18), transparent 35%), #06101f;
}

.hcr-recovery-card {
    width: min(540px, 100%);
    color: #101827;
}

.hcr-recovery-brand {
    margin-bottom: 18px;
}

.hcr-recovery-brand h1 {
    color: #101827;
    font-size: 32px;
    line-height: 1.15;
}

.hcr-recovery-note {
    color: #344256;
    font-size: 16px;
    line-height: 1.55;
    margin-bottom: 18px;
}

.hcr-recovery-instructions {
    border: 1px solid #bfdbfe;
    background: #eff6ff;
    color: #1e3a8a;
    border-radius: 16px;
    padding: 16px 18px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
}

.hcr-recovery-actions {
    margin-top: 22px;
}

.hcr-recovery-back-button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    text-decoration: none;
}

/* Fix75AL - Missing Close buttons + Preventive Service width/action polish */
.hcr-title-bar-with-action,
.vehicle-edit-title-bar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 1rem !important;
}

.hcr-close-button-standard,
.hcr-titlebar-close,
.hcr-header-close-button,
.hcr-maintenance-close-cta,
.hcr-maintenance-bottom-close {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 2.5rem !important;
    padding: 0 1.15rem !important;
    border: 1px solid #CBD5E1 !important;
    border-radius: 0.625rem !important;
    background: #FFFFFF !important;
    color: #334155 !important;
    font-size: 0.875rem !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08) !important;
    white-space: nowrap !important;
}

.hcr-close-button-standard:hover,
.hcr-close-button-standard:focus-visible,
.hcr-titlebar-close:hover,
.hcr-titlebar-close:focus-visible,
.hcr-header-close-button:hover,
.hcr-header-close-button:focus-visible,
.hcr-maintenance-close-cta:hover,
.hcr-maintenance-close-cta:focus-visible,
.hcr-maintenance-bottom-close:hover,
.hcr-maintenance-bottom-close:focus-visible {
    background: #F8FAFC !important;
    border-color: #94A3B8 !important;
    color: #0F172A !important;
    outline: none !important;
}

.customer-management-header-banner {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 1rem !important;
}

.customer-management-header-banner .hcr-header-close-button {
    margin-left: auto !important;
    flex: 0 0 auto !important;
}

.hcr-maintenance-page-footer-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 0.25rem;
    padding: 1rem 1.125rem;
    border: 1px solid #D8E4F0;
    border-radius: 1.125rem;
    background: #FFFFFF;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

.hcr-maintenance-hero .hcr-maintenance-close-cta {
    background: rgba(255, 255, 255, 0.95) !important;
    border-color: rgba(255, 255, 255, 0.8) !important;
    color: #0F172A !important;
}

.hcr-preventive-service-page .hcr-preventive-form {
    max-width: 80rem !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.hcr-preventive-service-page .hcr-preventive-blueprint-workspace {
    max-width: 80rem !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.hcr-preventive-service-page .hcr-workspace-footer-actions {
    padding: 1rem 1.125rem !important;
    margin: 0 !important;
    border: 1px solid #D8E4F0 !important;
    border-radius: 1.125rem !important;
    background: #FFFFFF !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08) !important;
}

.hcr-preventive-service-page .hcr-workspace-footer-actions .hcr-btn,
.hcr-preventive-service-page .hcr-workspace-footer-actions a.hcr-btn,
.hcr-preventive-service-page .hcr-workspace-footer-actions button.hcr-btn {
    height: 2.5rem !important;
    min-height: 2.5rem !important;
    padding: 0 1.25rem !important;
    border-radius: 0.625rem !important;
    font-size: 0.875rem !important;
    line-height: 1 !important;
}

.hcr-preventive-service-page .hcr-workspace-footer-actions .hcr-btn-danger-soft,
.hcr-preventive-service-page .hcr-workspace-footer-actions button.hcr-btn-danger-soft {
    min-width: 9.75rem !important;
}

.hcr-preventive-service-page .hcr-workspace-footer-actions .hcr-btn-neutral,
.hcr-preventive-service-page .hcr-workspace-footer-actions a.hcr-btn-neutral {
    min-width: 6.75rem !important;
}

.hcr-preventive-service-page .hcr-workspace-footer-actions .hcr-btn-save-primary,
.hcr-preventive-service-page .hcr-workspace-footer-actions button.hcr-btn-save-primary {
    min-width: 9rem !important;
}

@media (max-width: 780px) {
    .customer-management-header-banner,
    .hcr-title-bar-with-action,
    .vehicle-edit-title-bar {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    .hcr-titlebar-close,
    .hcr-header-close-button {
        width: 100% !important;
    }

    .hcr-maintenance-page-footer-actions,
    .hcr-preventive-service-page .hcr-workspace-footer-actions {
        border-radius: 0.875rem !important;
    }
}

/* Fix75AO - Preventive Service lookup width and action hierarchy polish */
.hcr-preventive-service-page .hcr-preventive-vehicle-lookup-field {
    max-width: 85% !important;
}

.hcr-preventive-service-page .hcr-vehicle-search-combo {
    grid-template-columns: minmax(220px, .76fr) minmax(306px, 1.36fr) !important;
}

.hcr-preventive-service-page #VehicleLookupSelect,
.hcr-preventive-service-page .hcr-vehicle-search-select {
    width: 85% !important;
    justify-self: start !important;
}

.hcr-preventive-service-page .hcr-preventive-actions-v2 {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
}

.hcr-preventive-service-page .hcr-footer-clear-area {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin-right: auto !important;
}

.hcr-preventive-service-page .hcr-clear-text-button {
    border: 0 !important;
    background: transparent !important;
    color: #64748B !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    padding: 7px 4px !important;
    min-width: auto !important;
    min-height: 32px !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

.hcr-preventive-service-page .hcr-clear-text-button:hover,
.hcr-preventive-service-page .hcr-clear-text-button:focus-visible {
    color: #334155 !important;
    background: #F1F5F9 !important;
    border-radius: 8px !important;
    outline: none !important;
}

.hcr-preventive-service-page .hcr-btn-outline,
.hcr-preventive-service-page button.hcr-btn-outline {
    border: 1.5px solid #1E73BE !important;
    background: #FFFFFF !important;
    color: #1E73BE !important;
    box-shadow: none !important;
}

.hcr-preventive-service-page .hcr-btn-outline:hover,
.hcr-preventive-service-page button.hcr-btn-outline:hover,
.hcr-preventive-service-page .hcr-btn-outline:focus-visible,
.hcr-preventive-service-page button.hcr-btn-outline:focus-visible {
    background: #EFF6FF !important;
    color: #0B3A75 !important;
    border-color: #0B3A75 !important;
}

.hcr-preventive-service-page .hcr-btn-save-new-secondary {
    min-width: 136px !important;
}

.hcr-preventive-service-page .hcr-btn-save-primary {
    min-width: 132px !important;
}

@media (max-width: 980px) {
    .hcr-preventive-service-page .hcr-preventive-vehicle-lookup-field {
        max-width: 100% !important;
    }

    .hcr-preventive-service-page #VehicleLookupSelect,
    .hcr-preventive-service-page .hcr-vehicle-search-select {
        width: 100% !important;
    }
}

@media (max-width: 780px) {
    .hcr-preventive-service-page .hcr-preventive-actions-v2 {
        align-items: stretch !important;
        flex-direction: column-reverse !important;
    }

    .hcr-preventive-service-page .hcr-footer-clear-area,
    .hcr-preventive-service-page .hcr-footer-actions-consolidated {
        width: 100% !important;
    }

    .hcr-preventive-service-page .hcr-clear-text-button {
        width: 100% !important;
        text-align: left !important;
    }
}

/* Fix75AP - Preventive Service action bar refinement
   Tightens the action area after Fix75AO: contained footer, compact buttons,
   subdued clear action, and cleaner primary/secondary hierarchy. */
.hcr-preventive-service-page .hcr-workspace-footer-actions.hcr-preventive-actions-v2,
.hcr-preventive-service-page .hcr-preventive-actions-v2 {
    position: static !important;
    display: grid !important;
    grid-template-columns: minmax(160px, 1fr) auto !important;
    align-items: center !important;
    gap: 18px !important;
    width: 100% !important;
    margin: 18px 0 0 !important;
    padding: 14px 16px !important;
    border: 1px solid #D8E3EF !important;
    border-radius: 14px !important;
    background: #F8FAFC !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

.hcr-preventive-service-page .hcr-footer-clear-area {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    min-width: 0 !important;
    margin: 0 !important;
}

.hcr-preventive-service-page .hcr-footer-actions-consolidated {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    margin: 0 !important;
    width: auto !important;
    flex-wrap: nowrap !important;
}

.hcr-preventive-service-page .hcr-clear-text-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    border: 0 !important;
    background: transparent !important;
    color: #64748B !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    text-decoration: none !important;
    padding: 8px 2px !important;
    min-width: auto !important;
    width: auto !important;
    min-height: 36px !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

.hcr-preventive-service-page .hcr-clear-text-button::before {
    content: "↺";
    display: inline-block;
    margin-right: 6px;
    font-size: 13px;
    color: #94A3B8;
}

.hcr-preventive-service-page .hcr-clear-text-button:hover,
.hcr-preventive-service-page .hcr-clear-text-button:focus-visible {
    color: #334155 !important;
    background: #EEF2F7 !important;
    outline: 2px solid rgba(30, 115, 190, .18) !important;
    outline-offset: 2px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
}

.hcr-preventive-service-page .hcr-workspace-footer-actions a.hcr-btn,
.hcr-preventive-service-page .hcr-workspace-footer-actions button.hcr-btn {
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 18px !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    line-height: 40px !important;
    box-shadow: none !important;
}

.hcr-preventive-service-page .hcr-workspace-footer-actions .hcr-btn-neutral,
.hcr-preventive-service-page .hcr-workspace-footer-actions a.hcr-btn-neutral {
    min-width: 104px !important;
    border: 1px solid #CBD5E1 !important;
    background: #FFFFFF !important;
    color: #334155 !important;
}

.hcr-preventive-service-page .hcr-workspace-footer-actions .hcr-btn-neutral:hover,
.hcr-preventive-service-page .hcr-workspace-footer-actions a.hcr-btn-neutral:hover,
.hcr-preventive-service-page .hcr-workspace-footer-actions .hcr-btn-neutral:focus-visible,
.hcr-preventive-service-page .hcr-workspace-footer-actions a.hcr-btn-neutral:focus-visible {
    background: #F1F5F9 !important;
    border-color: #94A3B8 !important;
    color: #0F172A !important;
}

.hcr-preventive-service-page .hcr-btn-save-new-secondary,
.hcr-preventive-service-page .hcr-workspace-footer-actions button.hcr-btn-save-new-secondary {
    min-width: 126px !important;
    border: 1.5px solid #1E73BE !important;
    background: #FFFFFF !important;
    color: #1E73BE !important;
}

.hcr-preventive-service-page .hcr-btn-save-new-secondary:hover,
.hcr-preventive-service-page .hcr-workspace-footer-actions button.hcr-btn-save-new-secondary:hover,
.hcr-preventive-service-page .hcr-btn-save-new-secondary:focus-visible,
.hcr-preventive-service-page .hcr-workspace-footer-actions button.hcr-btn-save-new-secondary:focus-visible {
    background: #EFF6FF !important;
    border-color: #0B3A75 !important;
    color: #0B3A75 !important;
}

.hcr-preventive-service-page .hcr-btn-save-primary,
.hcr-preventive-service-page .hcr-workspace-footer-actions button.hcr-btn-save-primary {
    min-width: 118px !important;
    border: 1px solid #1E73BE !important;
    background: #1E73BE !important;
    color: #FFFFFF !important;
    box-shadow: 0 8px 18px rgba(30, 115, 190, .20) !important;
}

.hcr-preventive-service-page .hcr-btn-save-primary:hover,
.hcr-preventive-service-page .hcr-workspace-footer-actions button.hcr-btn-save-primary:hover,
.hcr-preventive-service-page .hcr-btn-save-primary:focus-visible,
.hcr-preventive-service-page .hcr-workspace-footer-actions button.hcr-btn-save-primary:focus-visible {
    background: #155C9A !important;
    border-color: #155C9A !important;
}

@media (max-width: 780px) {
    .hcr-preventive-service-page .hcr-workspace-footer-actions.hcr-preventive-actions-v2,
    .hcr-preventive-service-page .hcr-preventive-actions-v2 {
        grid-template-columns: 1fr !important;
        align-items: stretch !important;
        padding: 14px !important;
    }

    .hcr-preventive-service-page .hcr-footer-actions-consolidated {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .hcr-preventive-service-page .hcr-footer-actions-consolidated .hcr-btn,
    .hcr-preventive-service-page .hcr-footer-actions-consolidated button.hcr-btn {
        width: 100% !important;
    }
}

/* Fix75AQ - Preventive Service select-only lookup and action button refinement */
.hcr-preventive-service-page .hcr-preventive-vehicle-select-only {
    max-width: 90% !important;
}

.hcr-preventive-service-page .hcr-vehicle-select-only-combo,
.hcr-preventive-service-page .hcr-vehicle-search-combo.hcr-vehicle-select-only-combo {
    display: grid !important;
    grid-template-columns: minmax(420px, 90%) !important;
    gap: 8px !important;
    align-items: start !important;
}

.hcr-preventive-service-page .hcr-vehicle-select-only-combo #VehicleLookupSelect,
.hcr-preventive-service-page #VehicleLookupSelect.hcr-vehicle-search-select {
    width: 90% !important;
    min-width: 420px !important;
    max-width: 760px !important;
    justify-self: start !important;
}

.hcr-preventive-service-page .hcr-workspace-footer-actions.hcr-preventive-actions-v2,
.hcr-preventive-service-page .hcr-preventive-actions-v2 {
    grid-template-columns: minmax(180px, 1fr) auto !important;
    padding: 16px 18px !important;
    border-color: #D5E0EC !important;
    background: #FBFDFF !important;
}

.hcr-preventive-service-page .hcr-workspace-footer-actions a.hcr-btn,
.hcr-preventive-service-page .hcr-workspace-footer-actions button.hcr-btn,
.hcr-preventive-service-page .hcr-clear-text-button {
    min-height: 40px !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

.hcr-preventive-service-page .hcr-clear-text-button {
    min-width: 116px !important;
    padding: 0 14px !important;
    justify-content: center !important;
    border: 1px solid #CBD5E1 !important;
    background: transparent !important;
    color: #64748B !important;
    text-decoration: none !important;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .15s ease !important;
}

.hcr-preventive-service-page .hcr-clear-text-button::before {
    content: "" !important;
    margin: 0 !important;
}

.hcr-preventive-service-page .hcr-clear-text-button:hover,
.hcr-preventive-service-page .hcr-clear-text-button:focus-visible {
    background: #DC2626 !important;
    border-color: #B91C1C !important;
    color: #FFFFFF !important;
    outline: 3px solid rgba(220, 38, 38, .22) !important;
    outline-offset: 2px !important;
    box-shadow: 0 8px 18px rgba(220, 38, 38, .20) !important;
    transform: translateY(-1px) !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
}

.hcr-preventive-service-page .hcr-clear-text-button:active {
    background: #991B1B !important;
    border-color: #7F1D1D !important;
    color: #FFFFFF !important;
    transform: translateY(0) !important;
}

.hcr-preventive-service-page .hcr-workspace-footer-actions .hcr-btn-neutral,
.hcr-preventive-service-page .hcr-workspace-footer-actions a.hcr-btn-neutral {
    min-width: 104px !important;
    border: 1px solid #CBD5E1 !important;
    background: transparent !important;
    color: #64748B !important;
    box-shadow: none !important;
}

.hcr-preventive-service-page .hcr-workspace-footer-actions .hcr-btn-neutral:hover,
.hcr-preventive-service-page .hcr-workspace-footer-actions a.hcr-btn-neutral:hover,
.hcr-preventive-service-page .hcr-workspace-footer-actions .hcr-btn-neutral:focus-visible,
.hcr-preventive-service-page .hcr-workspace-footer-actions a.hcr-btn-neutral:focus-visible {
    background: #F1F5F9 !important;
    border-color: #94A3B8 !important;
    color: #334155 !important;
    outline: 3px solid rgba(148, 163, 184, .22) !important;
    outline-offset: 2px !important;
}

.hcr-preventive-service-page .hcr-workspace-footer-actions a.hcr-btn,
.hcr-preventive-service-page .hcr-workspace-footer-actions button.hcr-btn {
    padding: 0 18px !important;
}

@media (max-width: 980px) {
    .hcr-preventive-service-page .hcr-preventive-vehicle-select-only,
    .hcr-preventive-service-page .hcr-vehicle-select-only-combo #VehicleLookupSelect,
    .hcr-preventive-service-page #VehicleLookupSelect.hcr-vehicle-search-select {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .hcr-preventive-service-page .hcr-vehicle-select-only-combo,
    .hcr-preventive-service-page .hcr-vehicle-search-combo.hcr-vehicle-select-only-combo {
        grid-template-columns: 1fr !important;
    }
}

/* Fix75AR - Forgot password sending feedback and Hostinger SMTP diagnostics */
.hcr-send-reset-button {
    position: relative;
    min-height: 46px;
}

.hcr-send-reset-button .hcr-send-reset-busy {
    display: none;
}

.hcr-send-reset-button.is-sending .hcr-send-reset-label {
    display: none;
}

.hcr-send-reset-button.is-sending .hcr-send-reset-busy {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.hcr-send-reset-button:disabled {
    opacity: .78;
    cursor: wait;
}

.hcr-send-reset-status {
    min-height: 22px;
    margin-top: 10px;
    color: #1e3a8a;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.45;
}

.hcr-dev-reset-link {
    word-break: break-word;
}

/* Fix75AT - Customer driver license scanner panel */
.customer-entry-form.edit-customer-form-master .top-form-inputs-grid .license-scanner-card,
.customer-entry-form.edit-customer-form-master .top-form-inputs-grid .customer-scanner-card {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    height: auto !important;
    border: 1px solid #bfdbfe;
    background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
}

.customer-entry-form.edit-customer-form-master .top-form-inputs-grid .customer-info-card { grid-row: 2 !important; }
.customer-entry-form.edit-customer-form-master .top-form-inputs-grid .address-card { grid-row: 2 !important; }
.customer-entry-form.edit-customer-form-master .top-form-inputs-grid .driver-license-card { grid-row: 3 !important; }
.customer-entry-form.edit-customer-form-master .top-form-inputs-grid .account-flags-card { grid-row: 3 !important; }

.customer-scanner-layout {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) auto;
    gap: 12px 16px;
    align-items: center;
}

.customer-scanner-instructions {
    display: flex;
    flex-direction: column;
    gap: 4px;
    color: #334155;
    font-size: 13px;
    line-height: 1.4;
}

.customer-scanner-instructions strong {
    color: #0f172a;
    font-weight: 900;
}

.customer-scanner-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.scanner-mode-button,
.scanner-extract-button,
.scanner-clear-button {
    border-radius: 999px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 900;
    min-height: 36px;
    padding: 8px 14px;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}

.scanner-mode-button {
    border: 1px solid #0ea5e9;
    background: #0284c7;
    color: #ffffff;
}

.scanner-mode-button:hover,
.scanner-mode-button.is-active {
    background: #0369a1;
    border-color: #075985;
}

.scanner-extract-button {
    border: 1px solid #1d4ed8;
    background: #ffffff;
    color: #1d4ed8;
}

.scanner-extract-button:hover {
    background: #dbeafe;
}

.scanner-clear-button {
    border: 1px solid #cbd5e1;
    background: #ffffff;
    color: #475569;
}

.scanner-clear-button:hover {
    border-color: #ef4444;
    background: #fee2e2;
    color: #991b1b;
}

.license-scan-buffer {
    grid-column: 1 / -1;
    width: 100%;
    min-height: 74px;
    resize: vertical;
    border: 1px solid #94a3b8;
    border-radius: 12px;
    background: #ffffff;
    color: #0f172a;
    font-size: 12px;
    line-height: 1.35;
    padding: 10px 12px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

.license-scan-buffer:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .15);
    outline: none;
}

.customer-scanner-status,
.customer-page-shell .customer-scanner-status {
    grid-column: 1 / -1;
    margin: 0 !important;
}

.license-eligibility-warning {
    grid-column: 1 / -1;
    border: 1px solid #f97316;
    border-radius: 12px;
    background: #fff7ed;
    color: #9a3412;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.4;
    padding: 10px 12px;
}

.license-eligibility-warning[hidden] {
    display: none !important;
}

.customer-entry-form.is-license-scanner-mode .license-scan-buffer {
    border-color: #16a34a;
    box-shadow: 0 0 0 3px rgba(22, 163, 74, .16);
}

.customer-entry-form.edit-customer-form-master .license-camera-panel {
    grid-column: 1 / -1;
    margin: 0;
}

@media (max-width: 920px) {
    .customer-scanner-layout {
        grid-template-columns: 1fr;
    }

    .customer-scanner-actions {
        justify-content: stretch;
    }

    .scanner-mode-button,
    .scanner-extract-button,
    .scanner-clear-button,
    .customer-scanner-actions .license-camera-scan-button {
        flex: 1 1 auto;
    }
}

/* Fix75AW - Customer eligibility and security hardening */
.customer-eligibility-banner,
.customer-rental-block-banner {
    border: 1px solid #b91c1c;
    border-left: 6px solid #dc2626;
    border-radius: 14px;
    background: #fef2f2;
    color: #7f1d1d;
    padding: 12px 14px;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.45;
    box-shadow: 0 10px 22px rgba(220, 38, 38, .10);
}

.customer-eligibility-banner {
    grid-column: 1 / -1;
    margin: 0 0 14px;
}

.customer-eligibility-banner strong {
    display: block;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .05em;
    margin-bottom: 4px;
}

.customer-eligibility-banner[hidden] {
    display: none !important;
}

.customer-rental-block-banner {
    margin-top: 10px;
}

.hcr-critical-field,
.customer-page-shell .hcr-critical-field {
    border-color: #dc2626 !important;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, .16) !important;
}

.hcr-danger-badge,
.hcr-muted-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border-radius: 999px;
    padding: 4px 8px;
    margin: 2px 4px 2px 0;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
}

.hcr-danger-badge {
    border: 1px solid #fecaca;
    background: #fee2e2;
    color: #991b1b;
}

.hcr-muted-badge {
    border: 1px solid #d1d5db;
    background: #f3f4f6;
    color: #4b5563;
}

.customer-eligibility-row {
    box-shadow: inset 4px 0 0 #dc2626;
}

/* ------------------------------------------------------------------
   Fix 75AX: Existing Customer search-first + customer footer alignment
   Prevents broad customer list exposure by default and aligns the
   customer form Close action with the inner customer panel instead of
   the browser viewport edge.
------------------------------------------------------------------- */
.customer-search-first-panel {
    margin: 18px 0 14px 0;
    padding: 16px 18px;
    border: 1px solid #BFDBFE;
    border-radius: 16px;
    background: #EFF6FF;
    color: #1E3A8A;
    display: flex;
    flex-direction: column;
    gap: 4px;
    box-shadow: 0 10px 22px rgba(37, 99, 235, .08);
}

.customer-search-first-panel strong {
    font-size: 14px;
    font-weight: 900;
}

.customer-search-first-panel span {
    color: #334155;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.4;
}

.customer-search-results-wrap.is-awaiting-search .hcr-table tbody td {
    color: #64748B;
    font-weight: 750;
    background: #F8FAFC;
}

.customer-actions.form-action-footer-bar.master-action-footer-sticky {
    position: sticky !important;
    bottom: 14px !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    max-width: 1320px !important;
    margin: 24px auto 0 auto !important;
    height: auto !important;
    min-height: 58px !important;
    padding: 10px 14px !important;
    border-radius: 18px !important;
    box-sizing: border-box !important;
}

.customer-management-master-canvas {
    padding-bottom: 24px !important;
}

.customer-actions.form-action-footer-bar.master-action-footer-sticky .customer-close-link {
    margin-left: 0 !important;
}

@media (max-width: 820px) {
    .customer-actions.form-action-footer-bar.master-action-footer-sticky {
        bottom: 8px !important;
        border-radius: 14px !important;
        margin-top: 18px !important;
    }
}

/* Fix75AY — Login page brand/logo and system version polish */
.hcr-login-brand--stacked {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: 14px;
    margin-bottom: 22px;
}

.hcr-login-main-logo {
    display: block;
    width: min(420px, 100%);
    max-height: 92px;
    object-fit: contain;
    margin: 0 auto;
}

.hcr-login-brand--stacked h1 {
    margin: 0;
    font-size: 28px;
    line-height: 1.15;
}

.hcr-login-system-version {
    margin: 18px 0 0;
    padding-top: 14px;
    border-top: 1px solid #e5e7eb;
    color: #5b6472;
    font-size: 12px;
    font-weight: 800;
    text-align: center;
    letter-spacing: 0.02em;
}

@media (max-width: 560px) {
    .hcr-login-main-logo {
        width: min(320px, 100%);
        max-height: 76px;
    }

    .hcr-login-brand--stacked h1 {
        font-size: 24px;
    }
}
