.firma-page { --firma-accent: var(--gold); min-width: 0; }
.firma-stack { display: grid; align-content: start; gap: var(--space-5); min-width: 0; }
.firma-card { padding: var(--space-5); background: var(--glass); border: 1px solid var(--glass-line); border-radius: var(--radius-glass); min-width: 0; }
.firma-card h2 { font-size: 20px; line-height: 1.35; }
.firma-card h3 { font-size: 17px; line-height: 1.45; }
.firma-page .page-heading { margin-bottom: 0; }
.firma-page .instruments { margin-bottom: 0; }
.firma-help { color: var(--muted); font-size: 15px; line-height: 1.65; overflow-wrap: anywhere; }
.firma-copy { display: grid; gap: var(--space-2); min-width: 0; overflow-wrap: anywhere; }
.firma-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: var(--space-5); }
.firma-main-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, 1fr); align-items: start; gap: var(--space-5); }
.firma-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-4) 0; border-bottom: 1px solid var(--line); }
.firma-row:last-child { border-bottom: 0; }
.firma-row > .firma-copy { flex: 1; min-width: 160px; }
.firma-toolbar { display: flex; flex-wrap: wrap; align-items: end; gap: var(--space-3); }
.firma-privacy { padding: var(--space-3); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-2); }
.firma-badge { display: inline-flex; align-items: center; gap: 7px; width: fit-content; padding: 4px 11px; border: 1px solid var(--line); border-radius: var(--radius-pill); color: var(--muted); background: var(--surface); font-size: 13px; line-height: 1.5; white-space: normal; }
.firma-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: none; }
.firma-badge.ready, .firma-badge.paid, .firma-badge.active, .firma-badge.approved, .firma-badge.success { color: var(--success-text); }
.firma-badge.awaiting_parts, .firma-badge.warning, .firma-badge.queued { color: var(--warning-text); }
.firma-badge.danger { color: var(--danger-text); }
.firma-badge.in_progress, .firma-badge.cooking { color: var(--info-text); }
.firma-tabs { display: flex; flex-wrap: wrap; gap: var(--space-2); border-bottom: 1px solid var(--line); padding-bottom: var(--space-3); }
.firma-tabs [aria-pressed="true"] { border-color: var(--firma-accent); color: var(--firma-accent); background: var(--glow); }
.firma-field { display: grid; gap: var(--space-2); min-width: 0; }
.firma-field > label { color: var(--ink); font-size: 15px; }
.firma-field input, .firma-field select, .firma-field textarea { width: 100%; min-width: 0; padding: 11px 13px; border: 1px solid var(--line); border-radius: var(--radius-sm); color: var(--ink); background: var(--surface-2); font: inherit; }
.firma-field textarea { resize: vertical; }
.firma-form { display: grid; gap: var(--space-4); }
.firma-tuning { padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-2); }
.firma-tuning summary { cursor: pointer; color: var(--firma-accent); font-size: 15px; }
.firma-tuning[open] summary { margin-bottom: var(--space-4); }
.firma-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.firma-action { display: grid; justify-items: start; gap: var(--space-2); min-width: 0; }
.firma-action-status:empty { display: none; }
.firma-action-status .state-card { padding: var(--space-4); }
.firma-reference { color: var(--firma-accent); font-family: var(--font-mono); font-size: 15px; }
.firma-total { color: var(--firma-accent); font-size: clamp(25px, 3vw, 36px); font-weight: 600; font-variant-numeric: tabular-nums; }
.firma-meter { display: grid; gap: var(--space-2); }
.firma-meter-track { height: 8px; background: var(--surface-2); border-radius: var(--radius-pill); overflow: hidden; }
.firma-fill { display: block; width: 0; height: 100%; background: var(--firma-accent); border-radius: inherit; }
.firma-chart { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(70px, 1fr); gap: var(--space-3); align-items: end; overflow-x: auto; padding-bottom: var(--space-2); }
.firma-chart-column { display: grid; justify-items: center; gap: var(--space-3); }
.firma-chart-track { display: flex; align-items: end; height: 150px; width: min(56px, 100%); border-radius: 5px 5px 0 0; background: var(--surface-2); overflow: hidden; }
.firma-chart-track .firma-fill { width: 100%; height: 0; border-radius: 5px 5px 0 0; background: linear-gradient(var(--gold-fill), var(--brand-gold-deep)); }
.firma-chart-value { font-size: 15px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.firma-product-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--space-3); }
.firma-product { display: grid; gap: var(--space-3); align-content: space-between; text-align: left; padding: var(--space-4); background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius-md); color: var(--ink); font: inherit; cursor: pointer; }
.firma-product:hover { border-color: var(--firma-accent); }
.firma-product strong { font-size: 17px; }
.firma-product span { color: var(--firma-accent); font-variant-numeric: tabular-nums; }
.firma-cart { position: sticky; top: 105px; }
.firma-cart-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-3); padding: var(--space-3) 0; border-bottom: 1px solid var(--line); }
.firma-cart-row .firma-toolbar { grid-column: 1 / -1; }
.firma-notice { border-left: 3px solid var(--firma-accent); }
.firma-table-wrap { max-width: 100%; overflow-x: auto; }
.firma-table { width: 100%; border-collapse: collapse; text-align: left; font-size: 15px; }
.firma-table th, .firma-table td { padding: var(--space-3); border-bottom: 1px solid var(--line); vertical-align: top; overflow-wrap: anywhere; }
.firma-table th { color: var(--muted); font-weight: 600; }
.firma-table-scroll { min-width: 0; }
.firma-table-scroll th, .firma-table-scroll td { white-space: nowrap; overflow-wrap: normal; }
.firma-scroll-hint { display: none; }
@media (max-width: 1100px) { .firma-scroll-hint { display: block; } }
.firma-matrix .firma-table th, .firma-matrix .firma-table td { min-width: 130px; }
.firma-schedule { display: grid; grid-template-columns: repeat(7, minmax(130px, 1fr)); gap: var(--space-2); overflow-x: auto; padding-bottom: var(--space-3); }
.firma-day { padding: var(--space-3); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); display: grid; align-content: start; gap: var(--space-3); }
.firma-day h3 { font-size: 15px; color: var(--firma-accent); }
.firma-shift { display: grid; gap: var(--space-2); padding: var(--space-3); border-left: 2px solid var(--firma-accent); border-radius: var(--radius-xs); background: var(--surface-2); font-size: 15px; }
.firma-switch { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-3); padding: var(--space-4) 0; border-bottom: 1px solid var(--line); }
.firma-switch:last-child { border-bottom: 0; }
.firma-accent-gold { --firma-accent: var(--gold); }
.firma-accent-blue { --firma-accent: var(--info-text); }
.firma-accent-green { --firma-accent: var(--success-text); }
.firma-preview { padding: var(--space-5); border: 1px solid var(--line); border-top: 3px solid var(--firma-accent); border-radius: var(--radius-md); background: var(--surface-2); display: grid; gap: var(--space-3); }
.firma-invoice { background: #f6f2ea; color: #16202e; border: 1px solid #d7cfbe; border-radius: var(--radius-md); padding: clamp(20px, 4vw, 48px); display: grid; gap: var(--space-6); }
.firma-invoice h2, .firma-invoice h3 { color: #16202e; }
.firma-invoice .firma-help { color: #4b566d; }
.firma-invoice .firma-table th { color: #4b566d; }
.firma-invoice .firma-table th, .firma-invoice .firma-table td { border-color: #d7cfbe; }
.firma-invoice-header { display: flex; justify-content: space-between; gap: var(--space-4); flex-wrap: wrap; border-bottom: 2px solid #16202e; padding-bottom: var(--space-5); }
.firma-invoice .firma-total { color: #16202e; }
.firma-print-only { display: none; }
@media (max-width: 1150px) { .firma-main-grid { grid-template-columns: 1fr; } .firma-cart { position: static; } }
@media (max-width: 850px) { .firma-grid { grid-template-columns: 1fr; } }
@media (max-width: 550px) { .firma-card { padding: var(--space-4); } .firma-form-grid { grid-template-columns: 1fr; } .firma-row { align-items: start; } .firma-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .firma-product { padding: var(--space-3); } .firma-page .page-heading h1 { font-size: 31px; } .firma-chart { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-columns: auto; gap: var(--space-5) var(--space-3); overflow: visible; } .firma-chart-column { min-width: 0; } .firma-chart-column .firma-help { text-align: center; } .firma-table th, .firma-table td { padding: 10px; } }
@media print { .firma-screen-only, .firma-invoice-page > .page-heading { display: none !important; } .firma-print-only { display: block !important; } .firma-invoice-page, .firma-invoice { display: block; padding: 0; border: 0; border-radius: 0; background: white; color: #16202e; } .firma-invoice > * { margin-bottom: 8mm; } .firma-invoice-header { display: flex; } .firma-invoice .firma-table-wrap { overflow: visible; } .firma-invoice .firma-help, .firma-invoice .firma-table th { color: #4b566d; } .firma-invoice .firma-table { color: #16202e; } .firma-invoice { break-inside: avoid; } }
.firma-fill-0 { width: 0%; } .firma-chart-track .firma-fill-0 { height: 0%; width: 100%; }
.firma-fill-5 { width: 5%; } .firma-chart-track .firma-fill-5 { height: 5%; width: 100%; }
.firma-fill-10 { width: 10%; } .firma-chart-track .firma-fill-10 { height: 10%; width: 100%; }
.firma-fill-15 { width: 15%; } .firma-chart-track .firma-fill-15 { height: 15%; width: 100%; }
.firma-fill-20 { width: 20%; } .firma-chart-track .firma-fill-20 { height: 20%; width: 100%; }
.firma-fill-25 { width: 25%; } .firma-chart-track .firma-fill-25 { height: 25%; width: 100%; }
.firma-fill-30 { width: 30%; } .firma-chart-track .firma-fill-30 { height: 30%; width: 100%; }
.firma-fill-35 { width: 35%; } .firma-chart-track .firma-fill-35 { height: 35%; width: 100%; }
.firma-fill-40 { width: 40%; } .firma-chart-track .firma-fill-40 { height: 40%; width: 100%; }
.firma-fill-45 { width: 45%; } .firma-chart-track .firma-fill-45 { height: 45%; width: 100%; }
.firma-fill-50 { width: 50%; } .firma-chart-track .firma-fill-50 { height: 50%; width: 100%; }
.firma-fill-55 { width: 55%; } .firma-chart-track .firma-fill-55 { height: 55%; width: 100%; }
.firma-fill-60 { width: 60%; } .firma-chart-track .firma-fill-60 { height: 60%; width: 100%; }
.firma-fill-65 { width: 65%; } .firma-chart-track .firma-fill-65 { height: 65%; width: 100%; }
.firma-fill-70 { width: 70%; } .firma-chart-track .firma-fill-70 { height: 70%; width: 100%; }
.firma-fill-75 { width: 75%; } .firma-chart-track .firma-fill-75 { height: 75%; width: 100%; }
.firma-fill-80 { width: 80%; } .firma-chart-track .firma-fill-80 { height: 80%; width: 100%; }
.firma-fill-85 { width: 85%; } .firma-chart-track .firma-fill-85 { height: 85%; width: 100%; }
.firma-fill-90 { width: 90%; } .firma-chart-track .firma-fill-90 { height: 90%; width: 100%; }
.firma-fill-95 { width: 95%; } .firma-chart-track .firma-fill-95 { height: 95%; width: 100%; }
.firma-fill-100 { width: 100%; } .firma-chart-track .firma-fill-100 { height: 100%; width: 100%; }
[data-panel="firma"][data-accent="blue"] .firma-page { --firma-accent: var(--info-text); } [data-panel="firma"][data-accent="green"] .firma-page { --firma-accent: var(--success-text); }
.firma-compact-order, .firma-compact-row { padding: 10px 0; border-bottom: 1px solid var(--line); min-width: 0; }
.firma-order-line { display: grid; grid-template-columns: 70px minmax(120px, 1.2fr) minmax(120px, 1fr) auto auto minmax(145px, auto); align-items: center; gap: 10px; }
.firma-order-line h3, .firma-compact-row h3 { font-size: 15px; }
.firma-order-line .btn { padding: 5px 10px; min-height: 32px; font-size: 13px; }
.firma-order-line .firma-toolbar { gap: 5px; }
.firma-order-details { margin-top: 8px; }
.firma-order-details > :not(summary), .firma-compact-row details > :not(summary) { margin-top: 14px; }
.firma-kitchen-line { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.firma-kitchen-line > .firma-row { flex: 1; padding: 0; border: 0; }
.firma-compact-row > .firma-row { padding: 0; border: 0; }
.firma-total { white-space: nowrap; }
.firma-badge.offen { color: var(--warning-text); }
.firma-badge.ruhig, .firma-badge.aktiv { color: var(--success-text); }
@media (max-width: 1250px) { .firma-order-line { grid-template-columns: 70px minmax(120px, 1fr) minmax(100px, 1fr) auto; } .firma-order-line > .firma-toolbar { grid-column: 2 / -1; } }
@media (max-width: 600px) { .firma-order-line { grid-template-columns: 65px minmax(0, 1fr); } .firma-order-line > .firma-toolbar { grid-column: 1 / -1; } }

/* Labels stay on one line so every bar shares the same baseline. */
.firma-chart { align-items: start; }
.firma-chart-column .firma-help { white-space: nowrap; }