/* Shared ERP visual language for Pipeline and Planung; screen UI only. */
@media screen {
  body.erp-app {
    --tec-brand: #003878; --tec-ink: #1d2b3a; --tec-muted: #64748b;
    --tec-line: #dfe5ec; --tec-bg: #f3f5f8; --border: #dfe5ec;
    --bg: #f3f5f8; --text: #1d2b3a; --muted: #64748b;
    --shadow: 0 1px 2px #1633530d, 0 2px 8px #1633530a;
    font-family: "Segoe UI", system-ui, Arial, sans-serif;
    color: #1d2b3a; background: #f3f5f8; line-height: 1.45;
  }
  .erp-app :is(.topbar, .app-header) { background: #003878; box-shadow: 0 1px 4px #18335330; }
  .erp-app :is(.topbar h1, .header-title) { font-weight: 600; letter-spacing: .1px; }
  .erp-app :is(.main-nav-tab, .view-tab) { color: #ffffffd9; border-radius: 7px; }
  .erp-app :is(.main-nav-tab, .view-tab).active { background: #fff; color: #003878; box-shadow: none; }
  .erp-app :is(.card, .form-container, .settings-card, .region-card, .contract-card) {
    border-radius: 10px; border-color: #dfe5ec; box-shadow: var(--shadow);
  }
  .erp-app :is(.settings-card h3, .modal-header h2, .card h2) { color: #344c67; font-weight: 600; }
  .erp-app :is(.modal-content, .modal-overlay > .modal) { border-radius: 10px; box-shadow: 0 18px 50px #152b4933; }
  .erp-app .modal-header { border-radius: 10px 10px 0 0; border-bottom-color: #dfe5ec; }
  .erp-app .modal-footer { background: #f8fafc; border-top-color: #dfe5ec; }
  .erp-app .btn { border-radius: 7px; font-weight: 600; box-shadow: none; min-height: 34px; }
  .erp-app :is(.btn-primary, .btn.primary) { background: #003878; color: #fff; border: 1px solid #003878; }
  .erp-app :is(.btn-primary, .btn.primary):hover { background: #002c60; }
  .erp-app :is(.btn-outline, .btn.cancel) { background: #fff; color: #003878; border: 1px solid #dfe5ec; }
  .erp-app :is(.btn-outline, .btn.cancel):hover { background: #eef4fb; border-color: #b8cde4; }
  .erp-app :is(.tt-table, .order-lines-table) { font-variant-numeric: tabular-nums; }
  .erp-app .tt-table > thead > tr > th { background: #f1f5f9; color: #344c67; padding: 8px 10px; }
  .erp-app .tt-table > tbody > tr > td { padding: 7px 10px; border-bottom-color: #edf1f5; }
  .erp-app .tt-table > tbody > tr:hover > td { background: #f6f9fd; }
  .erp-app :is(.tt-bar, .panel-header) { background: #f8fafc; border-color: #dfe5ec; }
  .erp-app :is(button, a, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid #e69926; outline-offset: 2px;
  }
  /* Pipeline workspace and sales views. Document preview markup is not targeted. */
  .erp-pipeline .dashboard-header { background: #fff; color: #1d2b3a; border-bottom: 1px solid #dfe5ec; box-shadow: none; }
  .erp-pipeline .dashboard-header :is(h1, h2) { color: #1d2b3a; font-weight: 600; }
  .erp-pipeline #topNav .toggle-btn { border-radius: 7px; box-shadow: none; }
  .erp-pipeline #topNav .toggle-btn.active { background: #fff; color: #003878; }
  .erp-pipeline :is(#viewList, #viewAuftraege, #viewQuotation) { --border: #dfe5ec; }
  .erp-pipeline #quotationList .list-item { border-color: #dfe5ec; border-radius: 7px; }
  .erp-pipeline #quotationList .list-item-title { font-size: 14px; }
  .erp-pipeline #quotationList .list-item-id { font-variant-numeric: tabular-nums; color: #003878; }
  .erp-pipeline #viewQuotation .form-container { box-shadow: var(--shadow); }
  .erp-pipeline #orderDetailContainer .order-info-card { background: #fff; box-shadow: var(--shadow); }
  .erp-pipeline #orderDetailContainer .order-info-row + .order-info-row { border-top: 1px solid #edf1f5; }
  .erp-pipeline #orderDetailContainer .order-info-row { padding-top: 6px; padding-bottom: 6px; }
  /* Planung: keep all type, employee, overdue and appointment status colours. */
  .erp-planning :is(.calendar-header, .panel-header) { background: #fff; border-bottom: 1px solid #dfe5ec; }
  .erp-planning .panel-tabs { background: #f8fafc; border: 1px solid #edf1f5; }
  .erp-planning .panel-tab.active { background: #eef4fb; color: #003878; box-shadow: inset 0 -2px #003878; }
  .erp-planning .order-card { border-radius: 7px; box-shadow: 0 1px 2px #1633530d; }
  .erp-planning .order-card:hover { box-shadow: 0 2px 8px #16335318; }
  .erp-planning .order-id { font-weight: 600; font-variant-numeric: tabular-nums; }
  .erp-planning .calendar-day-header { background: #f1f5f9; color: #344c67; border-color: #dfe5ec; }
  .erp-planning #orderPreparation { background: #f8fafc; border-color: #dfe5ec; border-radius: 10px; }
  .erp-planning :is(.object-history, .planning-dossiers) { border-color: #dfe5ec; background: #f8fafc; }
  .erp-planning :is(.settings-card, .wartung-stat-card) { border-radius: 10px; box-shadow: var(--shadow); }
  .erp-planning .wartung-stat-value { font-weight: 600; font-variant-numeric: tabular-nums; }
}
@media screen and (max-width: 700px) {
  .erp-app :is(.btn, .main-nav-tab, .view-tab, .panel-tab, .modal-close) { min-height: 44px; }
  .erp-app :is(.modal-header, .modal-footer) { padding: 12px; }
  .erp-app :is(.topbar-actions, .form-actions) { gap: 6px; flex-wrap: wrap; }
}
@media screen and (max-width: 700px) {
  /* Stack the backlog above the calendar instead of squeezing its toolbar. */
  .erp-planning .main-content { display: flex !important; flex-direction: column !important; height: auto !important; overflow: visible !important; }
  .erp-planning .order-panel { width: 100%; max-height: 45vh; border-right: 0; border-bottom: 1px solid #dfe5ec; }
  .erp-planning .main-content.orders-collapsed .order-panel { max-height: 0; overflow: hidden; border: 0; }
  .erp-planning .calendar-panel { width: 100%; min-height: 400px; flex: none; }
  .erp-planning .calendar-header { gap: 8px; }
  .erp-planning :is(.calendar-nav, .type-filters) { flex-basis: 100%; }
}
@media screen and (max-width: 700px) {
  .erp-planning .app { grid-template-columns: minmax(0, 1fr); }
  .erp-planning :is(.main-content, .order-panel, .calendar-panel) { min-width: 0; max-width: 100%; }
}