/* FluxoBar Design System 1.0 — a única camada de identidade visual da aplicação. */
:root {
  color-scheme: light;
  --fb-blue-50: #eef7ff;
  --fb-blue-100: #d9edff;
  --fb-blue-200: #bce0ff;
  --fb-blue-300: #8ecbff;
  --fb-blue-400: #50a8f5;
  --fb-blue-500: #3890e8;
  --fb-blue-600: #2175c9;
  --fb-blue-700: #1c5da2;
  --fb-blue-800: #1d4f85;
  --fb-blue-900: #1b426e;
  --fb-pink-50: #fff0f7;
  --fb-pink-100: #ffe2f0;
  --fb-pink-200: #ffc6e1;
  --fb-pink-300: #ff96c6;
  --fb-pink-400: #fa5b9b;
  --fb-pink-500: #f04090;
  --fb-pink-600: #d91f72;
  --fb-pink-700: #b9155c;
  --fb-pink-800: #99154e;
  --fb-pink-900: #801744;
  --fb-neutral-0: #ffffff;
  --fb-neutral-25: #fbfcfe;
  --fb-neutral-50: #f5f7fb;
  --fb-neutral-100: #edf1f6;
  --fb-neutral-200: #d9e0ea;
  --fb-neutral-300: #bdc8d7;
  --fb-neutral-400: #8c9aae;
  --fb-neutral-500: #66758a;
  --fb-neutral-600: #48566a;
  --fb-neutral-700: #344154;
  --fb-neutral-800: #1d2939;
  --fb-neutral-850: #152136;
  --fb-neutral-900: #101a2b;
  --fb-neutral-925: #0b1220;
  --fb-neutral-950: #060b14;
  --fb-success-100: #d9fbe8;
  --fb-success-500: #22c55e;
  --fb-success-700: #087a3b;
  --fb-warning-100: #fff3cc;
  --fb-warning-500: #f4b740;
  --fb-warning-800: #7a4a00;
  --fb-error-100: #ffe2e4;
  --fb-error-500: #c43d4b;
  --fb-error-700: #8e2230;
  --fb-info-100: #dceeff;
  --fb-info-500: #3890e8;
  --fb-info-700: #1c5da2;
  --fb-overlay: rgb(6 11 20 / 72%);
  --fb-shadow-sm: 0 1px 2px rgb(6 11 20 / 8%);
  --fb-shadow-md: 0 8px 28px rgb(6 11 20 / 12%);
  --fb-shadow-lg: 0 24px 72px rgb(6 11 20 / 24%);
  --fb-font-body: "DM Sans", system-ui, sans-serif;
  --fb-font-heading: "Manrope", "DM Sans", system-ui, sans-serif;
  --fb-space-1: .25rem;
  --fb-space-2: .5rem;
  --fb-space-3: .75rem;
  --fb-space-4: 1rem;
  --fb-space-5: 1.25rem;
  --fb-space-6: 1.5rem;
  --fb-space-8: 2rem;
  --fb-space-10: 2.5rem;
  --fb-radius-sm: .5rem;
  --fb-radius-md: .75rem;
  --fb-radius-lg: 1rem;
  --fb-radius-xl: 1.25rem;
  --fb-touch: 2.75rem;
  --fb-page: 96rem;
  --fb-sidebar: 16rem;
}

html[data-theme="light"] {
  color-scheme: light;
  --fb-bg: var(--fb-neutral-50);
  --fb-surface: var(--fb-neutral-0);
  --fb-surface-raised: var(--fb-neutral-0);
  --fb-surface-soft: var(--fb-neutral-100);
  --fb-surface-selected: var(--fb-blue-50);
  --fb-text: var(--fb-neutral-950);
  --fb-text-soft: var(--fb-neutral-700);
  --fb-text-muted: var(--fb-neutral-500);
  --fb-border: var(--fb-neutral-200);
  --fb-border-strong: var(--fb-neutral-300);
  --fb-sidebar-bg: var(--fb-neutral-950);
  --fb-sidebar-surface: var(--fb-neutral-900);
  --fb-sidebar-text: var(--fb-neutral-50);
  --fb-sidebar-muted: var(--fb-neutral-300);
  --fb-focus: var(--fb-blue-500);
  --fb-primary: var(--fb-blue-600);
  --fb-primary-hover: var(--fb-blue-700);
  --fb-primary-text: var(--fb-neutral-0);
  --fb-accent: var(--fb-pink-600);
  --fb-accent-text: var(--fb-neutral-0);
  --ink: var(--fb-text);
  --navy: var(--fb-text);
  --muted: var(--fb-text-muted);
  --subtle: var(--fb-neutral-400);
  --line: var(--fb-border);
  --line-strong: var(--fb-border-strong);
  --paper: var(--fb-surface);
  --canvas: var(--fb-bg);
  --surface-soft: var(--fb-surface-soft);
  --blue: var(--fb-primary);
  --blue-2: var(--fb-blue-400);
  --pink: var(--fb-accent);
  --green: var(--fb-success-700);
  --amber: var(--fb-warning-800);
  --red: var(--fb-error-700);
  --violet: var(--fb-pink-700);
  --brand-primary: var(--fb-primary);
  --brand-primary-strong: var(--fb-primary-hover);
  --brand-primary-soft: var(--fb-blue-50);
  --brand-secondary: var(--fb-neutral-950);
  --brand-accent: var(--fb-accent);
  --brand-on-primary: var(--fb-primary-text);
  --brand-on-accent: var(--fb-accent-text);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --fb-bg: var(--fb-neutral-950);
  --fb-surface: var(--fb-neutral-925);
  --fb-surface-raised: var(--fb-neutral-900);
  --fb-surface-soft: var(--fb-neutral-850);
  --fb-surface-selected: var(--fb-blue-900);
  --fb-text: var(--fb-neutral-50);
  --fb-text-soft: var(--fb-neutral-200);
  --fb-text-muted: var(--fb-neutral-400);
  --fb-border: var(--fb-neutral-700);
  --fb-border-strong: var(--fb-neutral-600);
  --fb-sidebar-bg: var(--fb-neutral-950);
  --fb-sidebar-surface: var(--fb-neutral-900);
  --fb-sidebar-text: var(--fb-neutral-50);
  --fb-sidebar-muted: var(--fb-neutral-300);
  --fb-focus: var(--fb-blue-400);
  --fb-primary: var(--fb-blue-400);
  --fb-primary-hover: var(--fb-blue-300);
  --fb-primary-text: var(--fb-neutral-950);
  --fb-accent: var(--fb-pink-400);
  --fb-accent-text: var(--fb-neutral-950);
  --ink: var(--fb-text);
  --navy: var(--fb-text);
  --muted: var(--fb-text-muted);
  --subtle: var(--fb-neutral-500);
  --line: var(--fb-border);
  --line-strong: var(--fb-border-strong);
  --paper: var(--fb-surface);
  --canvas: var(--fb-bg);
  --surface-soft: var(--fb-surface-soft);
  --blue: var(--fb-primary);
  --blue-2: var(--fb-blue-300);
  --pink: var(--fb-accent);
  --green: var(--fb-success-500);
  --amber: var(--fb-warning-500);
  --red: var(--fb-error-500);
  --violet: var(--fb-pink-400);
  --brand-primary: var(--fb-primary);
  --brand-primary-strong: var(--fb-primary-hover);
  --brand-primary-soft: var(--fb-blue-900);
  --brand-secondary: var(--fb-neutral-950);
  --brand-accent: var(--fb-accent);
  --brand-on-primary: var(--fb-primary-text);
  --brand-on-accent: var(--fb-accent-text);
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { width: 100%; max-width: 100%; overflow-x: clip; }
body { margin: 0; color: var(--fb-text); background: var(--fb-bg); font-family: var(--fb-font-body); font-size: .9375rem; line-height: 1.45; text-rendering: optimizeLegibility; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: .1875rem solid color-mix(in srgb, var(--fb-focus) 55%, transparent); outline-offset: .125rem; }

.app-shell { min-height: 100dvh; background: var(--fb-bg); }
.sidebar { width: var(--fb-sidebar); padding: var(--fb-space-4); color: var(--fb-sidebar-text); background: var(--fb-sidebar-bg); border-color: color-mix(in srgb, var(--fb-sidebar-text) 10%, transparent); box-shadow: none; }
.brand { min-height: 3.5rem; padding: 0 var(--fb-space-2) var(--fb-space-4); gap: var(--fb-space-3); }
.brand-mark { width: 2.5rem; height: 2.5rem; border-radius: var(--fb-radius-md); background: var(--fb-sidebar-surface); }
.brand-mark img { width: 100%; height: 100%; object-fit: contain; }
.brand strong { color: var(--fb-sidebar-text); font-family: var(--fb-font-heading); font-size: 1.05rem; letter-spacing: -.02em; }
.brand small, .venue-switcher small, .profile-card small { color: var(--fb-sidebar-muted); }
.venue-switcher, .profile-card, .app-meta-button { color: var(--fb-sidebar-text); background: var(--fb-sidebar-surface); border: 1px solid color-mix(in srgb, var(--fb-sidebar-text) 10%, transparent); border-radius: var(--fb-radius-md); }
.venue-switcher { min-width: 0; }
.venue-switcher > div:nth-child(2) { min-width: 0; }
.venue-switcher strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav { gap: var(--fb-space-1); }
.nav-item { min-height: var(--fb-touch); padding: .65rem .75rem; color: var(--fb-sidebar-muted); border-radius: var(--fb-radius-md); }
.nav-item:hover { color: var(--fb-sidebar-text); background: color-mix(in srgb, var(--fb-sidebar-text) 7%, transparent); }
.nav-item.active { color: var(--fb-sidebar-text); background: color-mix(in srgb, var(--fb-blue-500) 24%, var(--fb-sidebar-surface)); box-shadow: inset .1875rem 0 0 var(--fb-blue-400); }
.sidebar-footer { border-color: color-mix(in srgb, var(--fb-sidebar-text) 10%, transparent); }
.sync-status strong { color: var(--fb-sidebar-text); }
.workspace { min-width: 0; margin-left: var(--fb-sidebar); background: var(--fb-bg); }
.topbar { min-height: 4.5rem; height: auto; padding: .75rem clamp(1rem, 2.5vw, 2rem); color: var(--fb-text); background: color-mix(in srgb, var(--fb-surface) 94%, transparent); border-color: var(--fb-border); }
.page-title { min-width: 0; }
.page-title h1 { color: var(--fb-text); font-family: var(--fb-font-heading); overflow-wrap: anywhere; }
.page-title small { color: var(--fb-text-muted); }
.topbar-actions { min-width: 0; }
.theme-toggle { flex: 0 0 var(--fb-touch); }
main#app { width: min(100%, var(--fb-page)); min-width: 0; padding: clamp(1rem, 2vw, 2rem); }

.panel, .metric-card, .data-panel, .cash-panel, .settings-panel, .form-stack, .branding-form,
.operations-order-toolbar, .operations-table-toolbar, .order-inspector, .team-card, .printer-card,
.reservation-card, .template-card, .promotion-card, .device-card, .expense-card, .kds-card {
  color: var(--fb-text); background: var(--fb-surface); border: 1px solid var(--fb-border); border-radius: var(--fb-radius-lg); box-shadow: var(--fb-shadow-sm);
}
.section-heading { gap: var(--fb-space-4); margin-bottom: var(--fb-space-6); }
.section-heading h2, .operations-section-title h3 { color: var(--fb-text); font-family: var(--fb-font-heading); }
.section-heading p, .operations-section-title p { color: var(--fb-text-muted); }

.primary-button, .secondary-button, .ghost-button, .danger-button, .icon-button, .role-chip, .filter-button {
  min-height: var(--fb-touch); border-radius: var(--fb-radius-md); font-weight: 750; transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}
.primary-button { color: var(--fb-primary-text); background: var(--fb-primary); border: 1px solid var(--fb-primary); }
.primary-button:hover { color: var(--fb-primary-text); background: var(--fb-primary-hover); border-color: var(--fb-primary-hover); }
.secondary-button, .icon-button, .role-chip, .filter-button { color: var(--fb-text); background: var(--fb-surface-raised); border: 1px solid var(--fb-border-strong); }
.secondary-button:hover, .icon-button:hover, .role-chip:hover, .filter-button:hover { color: var(--fb-text); background: var(--fb-surface-soft); }
.ghost-button { color: var(--fb-primary); background: transparent; border: 1px solid transparent; }
.ghost-button:hover { background: color-mix(in srgb, var(--fb-primary) 10%, transparent); }
.danger-button { color: var(--fb-error-700); background: var(--fb-error-100); border: 1px solid color-mix(in srgb, var(--fb-error-500) 40%, transparent); }
html[data-theme="dark"] .danger-button { color: var(--fb-error-100); background: color-mix(in srgb, var(--fb-error-500) 22%, var(--fb-surface)); }
button:disabled { opacity: .48; cursor: not-allowed; }

.input-control, .select-control, input:not([type="checkbox"]):not([type="radio"]):not([type="color"]), select, textarea {
  min-width: 0; width: 100%; min-height: var(--fb-touch); padding: .7rem .875rem; color: var(--fb-text); background: var(--fb-surface-raised); border: 1px solid var(--fb-border-strong); border-radius: var(--fb-radius-md); font-size: 1rem;
}
input::placeholder, textarea::placeholder { color: var(--fb-text-muted); opacity: 1; }
label { min-width: 0; color: var(--fb-text); }

.badge { border: 1px solid transparent; }
.badge.blue { color: var(--fb-info-700); background: var(--fb-info-100); }
.badge.green { color: var(--fb-success-700); background: var(--fb-success-100); }
.badge.amber { color: var(--fb-warning-800); background: var(--fb-warning-100); }
.badge.red { color: var(--fb-error-700); background: var(--fb-error-100); }
.badge.gray { color: var(--fb-text-soft); background: var(--fb-surface-soft); }
.badge.violet { color: var(--fb-pink-700); background: var(--fb-pink-100); }
html[data-theme="dark"] .badge { color: var(--fb-text); background: var(--fb-surface-soft); border-color: var(--fb-border); }

.operations-order-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 1fr; }
.operation-order-card.panel { min-width: 0; color: var(--fb-text); background: var(--fb-surface); border-color: var(--fb-border); border-left: .25rem solid var(--stage-color); border-top-width: 1px; border-radius: var(--fb-radius-lg); box-shadow: var(--fb-shadow-sm); overflow: hidden; }
.operation-order-card:hover { border-color: var(--stage-color); box-shadow: var(--fb-shadow-md); transform: translateY(-.0625rem); }
.operation-order-card strong.operation-order-number, .operation-order-place, .operation-order-footer b { color: var(--fb-text); }
.operation-order-meta, .operation-order-items, .operation-order-customer, .operation-order-footer small { color: var(--fb-text-muted); }
.operation-order-footer { border-color: var(--fb-border); }
.operation-order-action { color: var(--fb-primary); }
.order-status-tabs button { color: var(--fb-text-soft); background: var(--fb-surface); border-color: var(--fb-border); }
.order-status-tabs button[aria-selected="true"] { color: var(--fb-primary-text); background: var(--fb-primary); border-color: var(--fb-primary); }
.segmented-control { background: var(--fb-surface-soft); border-color: var(--fb-border); }
.segmented-control button { min-height: var(--fb-touch); color: var(--fb-text-muted); }
.segmented-control button[aria-pressed="true"] { color: var(--fb-text); background: var(--fb-surface-raised); box-shadow: var(--fb-shadow-sm); }
.operations-order-layout { width: 100%; min-width: 0; }
.operations-order-layout > * { min-width: 0; }
.order-inspector { color: var(--fb-text); background: var(--fb-surface); }

.operations-order-grid.view-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fb-space-3); width: 100%; }
.operations-order-grid.view-list .operation-order-card { width: 100%; max-width: 100%; min-height: 0; }

.operations-tables-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.operations-tables-grid .restaurant-table { min-width: 0; color: var(--fb-text); background: var(--fb-surface); border-color: var(--fb-border); }
.operations-tables-grid .restaurant-table.free { background: var(--fb-surface); border-color: color-mix(in srgb, var(--fb-success-500) 30%, var(--fb-border)); }
.operations-tables-grid .restaurant-table.occupied { background: color-mix(in srgb, var(--fb-primary) 10%, var(--fb-surface)); border-color: color-mix(in srgb, var(--fb-primary) 55%, var(--fb-border)); }
.operation-table-number, .operations-tables-grid .operation-table-footer b { color: var(--fb-text); }
.operations-tables-grid .operation-table-status { color: var(--fb-success-700); }
.operations-tables-grid .occupied .operation-table-status { color: var(--fb-primary); }

.table-scroll { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
.data-table { color: var(--fb-text); background: var(--fb-surface); }
.data-table th { color: var(--fb-text-soft); background: var(--fb-surface-soft); }
.data-table td { color: var(--fb-text); background: var(--fb-surface); border-color: var(--fb-border); }
.data-table tbody tr:hover td { background: color-mix(in srgb, var(--fb-primary) 6%, var(--fb-surface)); }
.management-name strong, .management-number { color: var(--fb-text); }
.product-filters { display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; align-items: end; }
.product-filters > label { display: grid; gap: .35rem; color: var(--fb-text-soft); font-size: .75rem; font-weight: 700; }
.product-result-count { align-self: center; color: var(--fb-text-muted); font-size: .8125rem; white-space: nowrap; }
.management-actions { display: flex; flex-wrap: wrap; gap: .25rem; }

@media (min-width: 768px) {
  .products-table td.management-actions { width: 7.5rem; min-width: 7.5rem; white-space: nowrap; }
  .products-table td.management-actions button { display: flex; width: auto; white-space: nowrap; }
}
.toggle-row { display: flex !important; align-items: center; gap: .75rem; min-height: var(--fb-touch); padding: .75rem; background: var(--fb-surface-soft); border-radius: var(--fb-radius-md); }
.toggle-row input { width: 1.25rem; height: 1.25rem; }
.toggle-row span { min-width: 0; }
.toggle-row strong, .toggle-row small { display: block; }
.toggle-row small { color: var(--fb-text-muted); font-weight: 500; }

.modal { width: min(48rem, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); color: var(--fb-text); background: var(--fb-surface-raised); border: 1px solid var(--fb-border); border-radius: var(--fb-radius-xl); box-shadow: var(--fb-shadow-lg); overflow: hidden; }
.modal-head { min-height: 4rem; height: auto; padding: .75rem 1.25rem; color: var(--fb-text); background: var(--fb-surface-raised); border-color: var(--fb-border); }
.modal-head > div { min-width: 0; }
.modal-head h2 { color: var(--fb-text); overflow-wrap: anywhere; }
.modal-head small { color: var(--fb-text-muted); }
.modal-close { min-width: var(--fb-touch); min-height: var(--fb-touch); color: var(--fb-text); background: var(--fb-surface-soft); border: 1px solid var(--fb-border); }
.modal-form, .modal-body { max-height: calc(100dvh - 7rem); overflow-y: auto; overflow-x: hidden; }
.product-hub { width: 100%; min-width: 0; }
.product-hub .compact-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.product-hub .form-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
.product-hub .form-actions > button { width: 100%; min-width: 0; white-space: normal; }
.modal-form .form-actions { align-items: stretch; }

.login-screen { min-height: 100dvh; padding: clamp(1rem, 5vw, 3rem); background: var(--fb-bg); }
.login-card { width: min(100%, 28rem); color: var(--fb-text); background: var(--fb-surface); border: 1px solid var(--fb-border); border-radius: var(--fb-radius-xl); box-shadow: var(--fb-shadow-lg); }
.login-brand img { object-fit: contain; }
.login-brand strong, .login-card h1 { color: var(--fb-text); }
.login-card p, .login-help, .login-device { color: var(--fb-text-muted); }
.login-remember { color: var(--fb-text); background: var(--fb-surface-soft); border-radius: var(--fb-radius-md); padding: var(--fb-space-3); }
.login-error { color: var(--fb-error-700); background: var(--fb-error-100); }

.overlay { background: var(--fb-overlay); }
.toast { color: var(--fb-text); background: var(--fb-surface-raised); border: 1px solid var(--fb-border); border-radius: var(--fb-radius-lg); box-shadow: var(--fb-shadow-lg); }
.mobile-nav { color: var(--fb-text); background: color-mix(in srgb, var(--fb-surface) 96%, transparent); border-color: var(--fb-border); }
.mobile-nav button { min-width: var(--fb-touch); min-height: var(--fb-touch); color: var(--fb-text-muted); }
.mobile-nav button.active { color: var(--fb-primary); }

@media (min-width: 48rem) {
  .product-filters { grid-template-columns: minmax(16rem, 1fr) minmax(8rem, 11rem) minmax(10rem, 14rem) auto; }
  .operations-order-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .operations-tables-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .operations-order-grid.view-list .operation-order-card {
    display: grid;
    grid-template-columns: minmax(6rem, .7fr) minmax(7rem, .8fr) minmax(10rem, 1.5fr) minmax(9rem, auto);
    grid-template-rows: auto auto;
    gap: .4rem 1rem;
    align-items: center;
    padding: 1rem;
  }
  .operations-order-grid.view-list .operation-order-top { grid-column: 1; grid-row: 1 / 3; align-self: stretch; }
  .operations-order-grid.view-list .operation-order-number { grid-column: 2; grid-row: 1; }
  .operations-order-grid.view-list .operation-order-place { grid-column: 2; grid-row: 2; }
  .operations-order-grid.view-list .operation-order-customer { grid-column: 3; grid-row: 1; }
  .operations-order-grid.view-list .operation-order-meta { grid-column: 3; grid-row: 2; overflow-wrap: normal; }
  .operations-order-grid.view-list .operation-order-items { display: none; }
  .operations-order-grid.view-list .operation-order-footer { grid-column: 4; grid-row: 1 / 3; min-width: 0; margin: 0; padding: 0 0 0 1rem; border-top: 0; border-left: 1px solid var(--fb-border); }
}

@media (min-width: 64rem) {
  .operations-order-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .operations-tables-grid { grid-template-columns: repeat(8, minmax(0, 1fr)); }
}

@media (min-width: 75rem) {
  .operations-order-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(19rem, 22rem); gap: var(--fb-space-4); }
  .operations-order-layout .operations-order-grid:not(.view-list) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 63.99rem) {
  .workspace { margin-left: 0; }
  .sidebar { max-width: min(20rem, calc(100vw - 3rem)); }
  .topbar { min-height: 4rem; }
}

@media (max-width: 47.99rem) {
  main#app { padding: 1rem .75rem 6rem; }
  .topbar { padding: .5rem .75rem; gap: .5rem; }
  .topbar-actions { gap: .375rem; }
  .role-chip { max-width: 7rem; padding-inline: .55rem; }
  .role-chip #current-role { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .section-heading { align-items: stretch; }
  .section-heading > .primary-button, .heading-actions > * { width: 100%; justify-content: center; }
  .heading-actions { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
  .operations-order-toolbar, .operations-table-toolbar { padding: .75rem; }
  .operations-order-grid { gap: .625rem; }
  .operation-order-card.panel { min-height: 10.5rem; padding: .75rem; }
  .operations-tables-grid { gap: .5rem; }
  .operations-tables-grid .restaurant-table { min-height: 8.75rem; padding: .75rem .375rem; }
  .modal { top: auto; bottom: 1px; left: 0; width: 100%; max-height: calc(100dvh - .75rem); border-radius: var(--fb-radius-xl) var(--fb-radius-xl) 0 0; transform: translateY(4%); }
  .modal.visible { transform: none; }
  .modal-form, .modal-body { max-height: calc(100dvh - 5rem); padding: 1rem; }
  .product-hub .compact-metrics, .product-hub .form-actions { grid-template-columns: minmax(0, 1fr); }
  .data-table { min-width: 0; }
  .products-table thead { display: none; }
  .products-table, .products-table tbody, .products-table tr, .products-table td { display: block; width: 100%; }
  .products-table tbody { display: grid; gap: .75rem; padding: .75rem; }
  .products-table tr { padding: .875rem; border: 1px solid var(--fb-border); border-radius: var(--fb-radius-lg); background: var(--fb-surface); }
  .products-table td { display: flex; justify-content: space-between; gap: 1rem; padding: .4rem 0; border: 0; text-align: right; overflow-wrap: anywhere; }
  .products-table td::before { content: attr(data-label); flex: 0 0 auto; color: var(--fb-text-muted); font-size: .75rem; font-weight: 700; text-align: left; }
  .products-table td.management-name { display: block; padding-bottom: .75rem; margin-bottom: .35rem; border-bottom: 1px solid var(--fb-border); text-align: left; }
  .products-table td.management-name::before { display: block; margin-bottom: .25rem; }
  .products-table td.management-actions button { width: 100%; }
}

@media (max-width: 23rem) {
  .operations-order-grid { grid-template-columns: minmax(0, 1fr); }
  .operations-tables-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .theme-toggle { display: none; }
}