/* Compact workspace standard. Opt in with ui-workspace; see docs/compact-workspace.md. */
.ui-workspace {
    --ui-surface: var(--bs-body-bg);
    --ui-surface-soft: color-mix(in srgb, var(--bs-body-bg) 65%, var(--bs-tertiary-bg));
    --ui-border: color-mix(in srgb, var(--bs-body-color) 14%, var(--bs-body-bg));
    --ui-muted: var(--bs-secondary-color);
    --ui-accent: var(--bs-primary);
    --ui-icon: color-mix(in srgb, var(--bs-primary) 70%, var(--bs-body-color));
    --ui-accent-soft: color-mix(in srgb, var(--bs-primary) 10%, var(--bs-body-bg));
    color: var(--bs-body-color);
    font-size: .875rem;
    line-height: 1.5;
    min-width: 0;
}

.ui-workspace.ui-section,
.ui-workspace .ui-section {
    min-width: 0;
    border: 1px solid var(--ui-border);
    border-radius: 12px;
    background: var(--ui-surface);
    box-shadow: 0 2px 6px rgb(0 0 0 / 3%);
}

.ui-workspace .ui-section-header {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: 1rem 1.125rem;
}

.ui-workspace .ui-section-heading { flex: 1; min-width: 0; }
.ui-workspace .ui-section-heading h2 { margin: 0; font-size: .9375rem; font-weight: 650; line-height: 1.4; }
.ui-workspace .ui-section-heading p,
.ui-workspace .ui-editor-title p { margin: .125rem 0 0; color: var(--ui-muted); font-size: .8125rem; line-height: 1.5; }
.ui-workspace .ui-section-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 10px;
    background: var(--ui-accent-soft);
    color: var(--ui-icon);
}
.ui-workspace .ui-section-icon .k-svg-icon { width: 18px; height: 18px; }
.ui-workspace .ui-section-body { padding: 0 1.125rem 1.125rem; }
.ui-workspace .ui-form-stack { display: grid; gap: .875rem; }
.ui-workspace .ui-field { display: grid; gap: .35rem; min-width: 0; }
.ui-workspace .ui-field > label { font-size: .8125rem; font-weight: 600; }
.ui-workspace .ui-field > .k-input,
.ui-workspace .ui-field > .k-picker { width: 100%; }
.ui-workspace .k-input:not(.k-checkbox):not(.k-switch),
.ui-workspace .k-picker { border-radius: 7px; border-color: var(--ui-border); background: var(--ui-surface); }
.ui-workspace .ui-field .k-input-inner { padding: .5rem .65rem; }
.ui-workspace .ui-field .k-textarea { min-height: 90px; }
.ui-workspace .ui-field-error { color: var(--bs-danger-text-emphasis, #b02a37); font-size: .8125rem; }
.ui-workspace .ui-toggle {
    appearance: none;
    position: relative;
    width: 40px;
    height: 24px;
    flex: 0 0 40px;
    margin: 0;
    border: 1px solid var(--ui-border);
    border-radius: 999px;
    background: var(--bs-secondary-bg);
    cursor: pointer;
}
.ui-workspace .ui-toggle::before { content: ""; position: absolute; width: 18px; height: 18px; top: 2px; left: 2px; border-radius: 50%; background: var(--bs-body-color); }
.ui-workspace .ui-toggle:checked { background: var(--ui-accent); border-color: var(--ui-accent); }
.ui-workspace .ui-toggle:checked::before { transform: translateX(16px); background: #fff; }
.ui-workspace .ui-toggle:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 3px; }
.ui-workspace .ui-toggle:disabled { opacity: .5; cursor: default; }
.ui-workspace .k-button:not(.k-input-button):not(.k-switch-thumb) { border-radius: 7px; }
.ui-workspace .k-button { font-size: .8125rem; border: 1px solid var(--ui-border); background: var(--ui-surface); color: var(--bs-body-color); }
.ui-workspace .k-button:focus-visible,
.ui-workspace .k-switch:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 3px; }
.ui-workspace .ui-primary-action.k-button {
    background: var(--ui-accent);
    color: #fff;
    border-color: var(--ui-accent);
    font-weight: 600;
}
.ui-workspace .ui-primary-action.k-button:not(:disabled):not(.k-disabled):hover {
    background: color-mix(in srgb, var(--ui-accent) 85%, #000);
    border-color: color-mix(in srgb, var(--ui-accent) 85%, #000);
}

/* Tables: one action bar, horizontal row dividers, and useful column proportions. */
.ui-workspace .ui-data-grid.k-grid {
    --grid-command-button-size: 32px;
    --grid-command-icon-size: 16px;
    border-width: 0;
    border-radius: 0 0 12px 12px;
    background: transparent;
    min-width: 0;
}
.ui-workspace .ui-data-grid .k-grid-toolbar {
    gap: .5rem;
    padding: .5rem 1.125rem .75rem;
    border-width: 0;
    background: transparent;
    flex-wrap: wrap;
}
.ui-workspace .ui-data-grid .k-toolbar-items { display: flex; flex: 1; width: 100%; min-width: 0; gap: .5rem; flex-wrap: wrap; }
.ui-workspace .ui-grid-count { color: var(--ui-muted); font-size: .75rem; white-space: nowrap; }
.ui-workspace .ui-toolbar-spacer { flex: 1 1 auto; }
.ui-workspace .ui-data-grid .k-grid-header,
.ui-workspace .ui-data-grid .k-table-thead,
.ui-workspace .ui-data-grid .k-table-th { background: var(--ui-surface-soft); }
.ui-workspace .ui-data-grid .k-grid-header th,
.ui-workspace .ui-data-grid .k-table-th {
    padding: .625rem .75rem;
    border-inline-width: 0;
    border-block-width: 0 1px;
    color: var(--ui-muted);
    font-size: .75rem;
    font-weight: 600;
    line-height: 1.4;
}
.ui-workspace .ui-data-grid td {
    padding: .625rem .75rem;
    font-size: .8125rem;
    line-height: 1.45;
    border-inline-width: 0;
    border-bottom: 1px solid var(--ui-border);
    font-variant-numeric: tabular-nums;
}
.ui-workspace .ui-data-grid .k-table-tbody > tr:not(.k-selected) { background: var(--ui-surface); }
.ui-workspace .ui-data-grid .k-table-tbody > tr:not(.k-selected):hover { background: var(--ui-accent-soft); }
.ui-workspace .ui-data-grid .k-table-tbody > tr:last-child > td { border-bottom: 0; }
.ui-workspace .ui-data-grid .k-table-tbody > tr > td:first-child { white-space: normal; overflow-wrap: anywhere; }
.ui-workspace .ui-data-grid .k-grid-content { overflow-y: auto; }
.ui-workspace .ui-data-grid .k-command-cell { white-space: nowrap; }
.ui-workspace .ui-data-grid .k-command-cell > .k-button,
.ui-workspace .ui-data-grid .k-command-cell > .k-dropdown-button > .k-button {
    background: transparent;
    border-color: transparent;
}
.ui-workspace .ui-data-grid .k-command-cell > .k-button:hover,
.ui-workspace .ui-data-grid .k-command-cell > .k-dropdown-button > .k-button:hover { border-color: var(--ui-border); }
.ui-workspace .ui-data-grid .k-pager {
    background: transparent;
    border-top: 1px solid var(--ui-border);
    padding: .5rem .75rem;
    font-size: .75rem;
    border-radius: 0 0 12px 12px;
}
.ui-workspace .ui-record-name { font-weight: 600; overflow-wrap: anywhere; }
.ui-workspace .ui-record-description { color: var(--ui-muted); font-size: .75rem; white-space: normal; overflow-wrap: anywhere; }
.ui-workspace .ui-empty-state { padding: .75rem 1.125rem 1.25rem; color: var(--ui-muted); font-size: .8125rem; text-align: left; }
.ui-workspace .ui-embedded-grid { border: 0; }

/* AppWindow owns vertical scrolling; its footer stays visible. */
.ui-workspace.ui-editor-window.k-window { border-radius: 16px; overflow: hidden; }
.ui-workspace.ui-editor-window .k-window-titlebar { height: auto; min-height: 76px; padding: 1rem 1.25rem; background: var(--ui-surface) !important; border-bottom: 1px solid var(--ui-border); }
.ui-workspace.ui-editor-window .k-window-title { min-width: 0; white-space: normal; }
.ui-workspace .ui-editor-title { display: flex; align-items: center; gap: .875rem; }
.ui-workspace .ui-editor-title h1 { margin: 0; font-size: 1.1875rem; font-weight: 650; letter-spacing: -.02em; line-height: 1.4; }
.ui-workspace.ui-editor-window .k-window-content { padding: 0; background: var(--ui-surface-soft) !important; }
.ui-workspace.ui-editor-window .app-window-body { padding: 1.25rem; scrollbar-gutter: stable; }
.ui-workspace.ui-editor-window .app-window-footer { margin: 0; padding: .875rem 1.25rem; background: var(--ui-surface); border-top: 1px solid var(--ui-border); }
.ui-workspace .ui-editor-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; }
.ui-workspace .ui-footer-note { font-size: .75rem; color: var(--ui-muted); }
.ui-workspace .ui-editor-actions { display: flex; align-items: center; justify-content: flex-end; gap: .5rem; }
.ui-workspace .ui-editor-actions .k-button { min-height: 36px; padding-inline: 1rem; }
.ui-workspace.ui-detail-window .editfield-window-title { display: grid; gap: .25rem; }
.ui-workspace.ui-detail-window .editfield-window-title .page-title { font-size: 1.125rem; }
.ui-workspace.ui-detail-window .app-window-body > .p-2 { padding: 0 !important; }

.plan-editor-layout { display: grid; grid-template-columns: minmax(300px, .9fr) minmax(0, 1.6fr); gap: 1.125rem; align-items: start; }
.plan-editor-details,
.plan-editor-inclusions { display: grid; gap: 1.125rem; min-width: 0; }
.plan-journey-summary { display: grid; justify-items: start; gap: .625rem; }
.plan-journey-summary strong { overflow-wrap: anywhere; }
.plan-journey-path { width: 144px; height: 24px; color: var(--ui-icon); }
.plan-cost-field { max-width: 220px; }
.ui-workspace .ui-plan-items-grid :is(.k-grid-table, .k-grid-header-table) { min-width: 550px; }
.plan-template-list .ui-data-grid :is(.k-grid-table, .k-grid-header-table) { min-width: 480px; }

@media (max-width: 1023px) {
    .plan-editor-layout { grid-template-columns: minmax(0, 1fr); }
    .plan-editor-details { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: start; }
}
@media (max-width: 640px) {
    .plan-editor-details { grid-template-columns: minmax(0, 1fr); }
    .ui-workspace.ui-editor-window.k-window { border-radius: 0; }
    .ui-workspace.ui-editor-window .k-window-titlebar { padding: .875rem; }
    .ui-workspace.ui-editor-window .app-window-body { padding: .75rem; }
    .ui-workspace .ui-section-header { padding: .875rem; gap: .5rem; }
    .ui-workspace .ui-section-body { padding: 0 .875rem .875rem; }
    .ui-workspace .ui-data-grid .k-grid-toolbar { padding-inline: .75rem; }
    .ui-workspace .ui-editor-footer { flex-wrap: wrap; gap: .5rem; }
    .ui-workspace .ui-editor-actions { flex: 1; }
    .ui-workspace .ui-editor-actions .k-button { flex: 1; }
    .ui-workspace .ui-data-grid.k-grid { --grid-command-button-size: 36px; }
    .ui-workspace .ui-data-grid .k-command-cell { padding-block: .25rem !important; }
}