/* ProFix24 portal reset: single compact layer for every logged-in role and device. */
:root {
  color-scheme: light;
  --pf24-ui-page: #f4f7fa;
  --pf24-ui-panel: #ffffff;
  --pf24-ui-soft: #f8fbfd;
  --pf24-ui-blue-soft: #eef6ff;
  --pf24-ui-text: #102033;
  --pf24-ui-muted: #526173;
  --pf24-ui-line: #d8e2ee;
  --pf24-ui-orange: #f58220;
  --pf24-ui-radius: 8px;
}

html[data-theme],
html[data-theme="dark"],
html[data-theme="light"] {
  color-scheme: light !important;
}

html[data-theme] body.portal-active,
html[data-theme] body.admin-body.active,
body.portal-active,
body.admin-body.active {
  background: var(--pf24-ui-page) !important;
  color: var(--pf24-ui-text) !important;
  font-size: 13px !important;
  line-height: 1.38 !important;
  letter-spacing: 0 !important;
}

body.portal-active :where(*),
body.admin-body.active :where(*) {
  box-sizing: border-box !important;
  min-width: 0;
  letter-spacing: 0 !important;
}

body.portal-active :where(h1, h2),
body.admin-body.active :where(h1, h2) {
  color: var(--pf24-ui-text) !important;
  font-size: 16px !important;
  line-height: 1.18 !important;
  font-weight: 680 !important;
  margin: 0 0 6px !important;
}

body.portal-active :where(h3, h4, h5, h6, legend, summary),
body.admin-body.active :where(h3, h4, h5, h6, legend, summary) {
  color: var(--pf24-ui-text) !important;
  font-size: 14px !important;
  line-height: 1.22 !important;
  font-weight: 650 !important;
  margin: 0 !important;
}

body.portal-active :where(p, small, span, li, td, th, label, input, select, textarea, button, .button, .form-message, .empty),
body.admin-body.active :where(p, small, span, li, td, th, label, input, select, textarea, button, .button, .form-message, .empty) {
  font-size: 12.5px !important;
  line-height: 1.38 !important;
}

body.portal-active :where(p, small, .form-message, .empty),
body.admin-body.active :where(p, small, .form-message, .empty) {
  color: var(--pf24-ui-muted) !important;
}

body.portal-active :where(strong, b),
body.admin-body.active :where(strong, b) {
  color: var(--pf24-ui-text) !important;
  font-weight: 650 !important;
}

body.portal-active :where(.professional-section.portal-view-active, .customer-section.portal-view-active, .tab-panel, .workspace),
body.admin-body.active :where(.professional-section.portal-view-active, .customer-section.portal-view-active, .tab-panel, .workspace) {
  display: grid !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}

body.portal-active :where(#portalDashboard, #dashboard, .dashboard, .portal-shell, .admin-shell, .workspace, .workspace-content),
body.admin-body.active :where(#portalDashboard, #dashboard, .dashboard, .portal-shell, .admin-shell, .workspace, .workspace-content) {
  width: 100% !important;
  max-width: none !important;
}

body.portal-active :where(.portal-view-active, .tab-panel, .workspace-panel, .professional-section, .customer-section),
body.admin-body.active :where(.portal-view-active, .tab-panel, .workspace-panel, .professional-section, .customer-section) {
  border-radius: 12px !important;
}

body.portal-active :where(.portal-view-active > :not(script):not(style) + :not(script):not(style)),
body.admin-body.active :where(.portal-view-active > :not(script):not(style) + :not(script):not(style)) {
  margin-top: 10px !important;
}

body.portal-active :where(
  .portal-panel,
  .professional-section,
  .customer-section,
  .professional-cockpit,
  .customer-cockpit,
  .taxi-pool-panel,
  .transport-workspace-panel,
  .professional-foldout,
  .customer-request-card,
  .wallet-panel,
  .account-context-panel,
  .settings-card,
  .module-card,
  .dashboard-card,
  .summary-card,
  .metric-card,
  .field-next-task,
  .field-card,
  .workday-shell,
  .workday-panel,
  .request-row,
  .finance-row,
  .admin-card,
  .admin-panel,
  .workspace-card,
  .task-card,
  .card,
  article
),
body.admin-body.active :where(
  .portal-panel,
  .professional-section,
  .customer-section,
  .professional-cockpit,
  .customer-cockpit,
  .taxi-pool-panel,
  .transport-workspace-panel,
  .professional-foldout,
  .customer-request-card,
  .wallet-panel,
  .account-context-panel,
  .settings-card,
  .module-card,
  .dashboard-card,
  .summary-card,
  .metric-card,
  .field-next-task,
  .field-card,
  .workday-shell,
  .workday-panel,
  .request-row,
  .finance-row,
  .admin-card,
  .admin-panel,
  .workspace-card,
  .task-card,
  .card,
  article
) {
  border-color: var(--pf24-ui-line) !important;
  border-radius: var(--pf24-ui-radius) !important;
  background: var(--pf24-ui-panel) !important;
  color: var(--pf24-ui-text) !important;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .05) !important;
}

body.portal-active :where(.portal-panel, .professional-section, .customer-section, .tab-panel, .workspace-panel, .admin-panel, .admin-card, .dashboard-card, .card, article),
body.admin-body.active :where(.portal-panel, .professional-section, .customer-section, .tab-panel, .workspace-panel, .admin-panel, .admin-card, .dashboard-card, .card, article) {
  padding: 12px !important;
}

body.portal-active :where(.workspace-grid, .dashboard-grid, .cards-grid, .summary-grid, .module-grid, .admin-grid, .professional-grid, .customer-grid, .field-card-list),
body.admin-body.active :where(.workspace-grid, .dashboard-grid, .cards-grid, .summary-grid, .module-grid, .admin-grid, .professional-grid, .customer-grid, .field-card-list) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)) !important;
  gap: 10px !important;
  align-items: stretch !important;
}

body.portal-active :where(.inline-actions, .portal-actions, .card-actions, .row-actions, .form-actions, .workscreen-actions),
body.admin-body.active :where(.inline-actions, .portal-actions, .card-actions, .row-actions, .form-actions, .workscreen-actions) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 7px !important;
}

body.portal-active :where(.section-title-row, .panel-head, .customer-head, .professional-head, .admin-section-head) {
  padding-bottom: 6px !important;
  border-bottom: 1px solid #edf2f7 !important;
}

body.portal-active :where(.section-title-row, .panel-head, .customer-head, .professional-head) {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin-bottom: 6px !important;
}

body.portal-active :where(
  .panel-head.compact-head p,
  .section-title-row.compact p,
  .customer-head p,
  .professional-head p,
  .smart-work-options > .section-title-row p,
  .business-operations-head em
),
body.admin-body.active :where(
  .panel-head.compact-head p,
  .section-title-row.compact p,
  .admin-section-head p,
  .settings-help
) {
  display: none !important;
}

body.portal-active :where(.panel-head, .section-title-row, .customer-head, .professional-head),
body.admin-body.active :where(.panel-head, .section-title-row, .admin-section-head) {
  min-height: 0 !important;
}

body:has(#portalDashboard:not(.hidden)) :where(.portal-shell) {
  display: none !important;
}

body:has(#portalDashboard:not(.hidden)) :where(.admin-shell) {
  min-height: auto !important;
  padding-top: 12px !important;
  padding-bottom: 18px !important;
}

body:has(#portalDashboard:not(.hidden)) :where(#portalDashboard.dashboard) {
  margin-top: 0 !important;
}

body.portal-active:has(#portalDashboard:not(.hidden)) :where(#portalDashboard.dashboard > .panel-head.customer-head) {
  display: none !important;
}

body.portal-active:has(#portalDashboard:not(.hidden)) :where(.topbar, .portal-topbar),
body.admin-body.active:has(#dashboard:not(.hidden)) :where(.topbar, .admin-topbar) {
  grid-template-columns: minmax(190px, 300px) minmax(0, 1fr) auto !important;
  min-height: 58px !important;
  padding: 8px 14px !important;
}

body.portal-active:has(#portalDashboard:not(.hidden)) :where(.topbar .brand img, .portal-topbar .brand img),
body.admin-body.active:has(#dashboard:not(.hidden)) :where(.topbar .brand img, .admin-topbar .brand img) {
  min-width: 0 !important;
  max-width: 190px !important;
  max-height: 42px !important;
  height: 42px !important;
}

body.portal-active:has(#portalDashboard:not(.hidden)) :where(.topbar .brand img[src*="profix24-header-light"], .portal-topbar .brand img[src*="profix24-header-light"]),
body.admin-body.active:has(#dashboard:not(.hidden)) :where(.topbar .brand img[src*="profix24-header-light"], .admin-topbar .brand img[src*="profix24-header-light"]) {
  min-width: 0 !important;
  max-width: 190px !important;
  max-height: 42px !important;
  height: 42px !important;
}

body.portal-active:has(#portalDashboard:not(.hidden)) :where(.brand-copy),
body.admin-body.active:has(#dashboard:not(.hidden)) :where(.brand-copy) {
  display: none !important;
}

body.portal-active:has(#portalDashboard:not(.hidden)) :where(.portal-nav, .nav-actions),
body.admin-body.active:has(#dashboard:not(.hidden)) :where(.portal-nav, .nav-actions) {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 7px !important;
}

body.portal-active:has(#portalDashboard:not(.hidden)) :where(.theme-select-wrap),
body.admin-body.active:has(#dashboard:not(.hidden)) :where(.theme-select-wrap) {
  display: none !important;
}

body.portal-active:has(#portalDashboard:not(.hidden)) :where(.language-select),
body.admin-body.active:has(#dashboard:not(.hidden)) :where(.language-select) {
  width: auto !important;
  min-width: 64px !important;
  max-width: 76px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 6px 28px 6px 10px !important;
  text-align: left !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  color: var(--pf24-ui-text) !important;
  background-color: #fff !important;
}

body.portal-active:has(#portalDashboard:not(.hidden)) :where(.topbar-assistant-actions, .portal-header-assistant),
body.admin-body.active:has(#dashboard:not(.hidden)) :where(.topbar-assistant-actions, .portal-header-assistant) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: auto !important;
  min-width: 0 !important;
}

body.portal-active:has(#portalDashboard:not(.hidden)) :where(.voice-menu-icon-button, .settings-toggle, .settings-button, .icon-button),
body.admin-body.active:has(#dashboard:not(.hidden)) :where(.voice-menu-icon-button, .settings-toggle, .settings-button, .icon-button) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
}

body.portal-active:has(#portalDashboard:not(.hidden)) :where(.voice-menu-icon-button svg, .settings-toggle svg, .settings-button svg, .icon-button svg),
body.admin-body.active:has(#dashboard:not(.hidden)) :where(.voice-menu-icon-button svg, .settings-toggle svg, .settings-button svg, .icon-button svg) {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
}

body.portal-active:has(#portalDashboard:not(.hidden)) :where(.portal-page-footer),
body.admin-body.active:has(#dashboard:not(.hidden)) :where(.admin-page-footer) {
  position: static !important;
  justify-content: flex-end !important;
  min-height: 34px !important;
  padding: 6px 14px !important;
  background: transparent !important;
  border-top: 0 !important;
  box-shadow: none !important;
}

body.portal-active:has(#portalDashboard:not(.hidden)) :where(.portal-page-footer img),
body.admin-body.active:has(#dashboard:not(.hidden)) :where(.admin-page-footer img) {
  max-height: 20px !important;
}

body.portal-active :where(input, select, textarea),
body.admin-body.active :where(input, select, textarea) {
  width: 100% !important;
  min-height: 34px !important;
  padding: 7px 9px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 7px !important;
  background: #fff !important;
  color: var(--pf24-ui-text) !important;
  box-shadow: none !important;
}

body.portal-active :where(label, .checkbox-line),
body.admin-body.active :where(label, .checkbox-line) {
  display: grid !important;
  gap: 4px !important;
  color: var(--pf24-ui-muted) !important;
  font-weight: 600 !important;
}

body.portal-active :where(button, .button, .icon-button),
body.admin-body.active :where(button, .button, .icon-button) {
  min-height: 32px !important;
  border-radius: 7px !important;
  font-weight: 650 !important;
  box-shadow: none !important;
}

body.portal-active :where(.compact-table-wrap, table, .compact-table),
body.admin-body.active :where(.compact-table-wrap, table, .compact-table) {
  width: 100% !important;
  max-width: 100% !important;
}

body.portal-active :where(.compact-table-wrap),
body.admin-body.active :where(.compact-table-wrap) {
  overflow-x: auto !important;
}

body.portal-active :where(.compact-table th, .compact-table td),
body.admin-body.active :where(.compact-table th, .compact-table td) {
  padding: 7px 8px !important;
  color: var(--pf24-ui-text) !important;
  vertical-align: top !important;
}

body.portal-active :where(details) > summary,
body.admin-body.active :where(details) > summary {
  cursor: pointer !important;
  list-style: none !important;
}

body.portal-active :where(details) > summary::-webkit-details-marker,
body.admin-body.active :where(details) > summary::-webkit-details-marker {
  display: none !important;
}

body.portal-active :where(.badge, .status-pill),
body.admin-body.active :where(.badge, .status-pill) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 22px !important;
  padding: 3px 7px !important;
  border-radius: 999px !important;
  background: rgba(245, 130, 32, .12) !important;
  color: #9a4b00 !important;
  font-size: 11px !important;
  font-weight: 650 !important;
}

body.portal-active :where(.professional-cockpit, .customer-cockpit) {
  display: grid !important;
  gap: 12px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.portal-active :where(.professional-regie-brand) {
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 12px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-left: 4px solid var(--pf24-ui-orange) !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: 0 10px 24px rgba(15, 31, 51, .05) !important;
}

body.portal-active :where(.professional-regie-logo) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 46px !important;
  height: 46px !important;
  border: 1px solid #d9e4ef !important;
  border-radius: 10px !important;
  background: #f8fbfd !important;
}

body.portal-active :where(.professional-regie-brand h2, .professional-regie-brand h3) {
  margin: 0 !important;
  font-size: 18px !important;
  line-height: 1.15 !important;
}

body.portal-active :where(.professional-regie-brand p, .professional-regie-brand small) {
  margin: 2px 0 0 !important;
  color: var(--pf24-ui-muted) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}

body.portal-active :where(.owner-dashboard-toolbar) {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 10px !important;
  background: #fff !important;
}

body.portal-active :where(.owner-dashboard-density) {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
}

body.portal-active :where(.owner-dashboard-density .icon-button, .professional-cockpit .icon-button, .customer-cockpit .icon-button) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  border-radius: 8px !important;
}

body.portal-active :where(.professional-regiecentrum, .business-operations-director, .professional-business-core, .professional-live-map-panel, .professional-smart-work-options, .owner-comparison-panel, .owner-signal-panel, .owner-dashboard-card) {
  display: grid !important;
  gap: 10px !important;
  padding: 12px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: 0 10px 24px rgba(15, 31, 51, .045) !important;
}

body.portal-active :where(.professional-regie-grid, .owner-comparison-kpis, .business-operations-grid, .professional-core-grid, .owner-signal-grid) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)) !important;
  gap: 10px !important;
}

body.portal-active :where(.professional-regie-grid > *, .owner-comparison-kpis > *, .business-operations-grid > *, .professional-core-grid > *, .owner-signal-grid > *) {
  min-width: 0 !important;
  padding: 10px !important;
  border: 1px solid #e4edf5 !important;
  border-radius: 9px !important;
  background: #fbfdff !important;
}

@media (max-width: 720px) {
  body.portal-active:has(#portalDashboard:not(.hidden)) :where(.topbar, .portal-topbar),
  body.admin-body.active:has(#dashboard:not(.hidden)) :where(.topbar, .admin-topbar) {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
    min-height: 56px !important;
    padding: 7px 10px !important;
  }

  body.portal-active:has(#portalDashboard:not(.hidden)) :where(.topbar .brand img, .portal-topbar .brand img),
  body.admin-body.active:has(#dashboard:not(.hidden)) :where(.topbar .brand img, .admin-topbar .brand img) {
    max-width: 150px !important;
    height: 34px !important;
    max-height: 34px !important;
    object-fit: contain !important;
  }

  body.portal-active:has(#portalDashboard:not(.hidden)) :where(.portal-nav, .nav-actions),
  body.admin-body.active:has(#dashboard:not(.hidden)) :where(.portal-nav, .nav-actions) {
    min-width: max-content !important;
  }

  body.portal-active:has(#portalDashboard:not(.hidden)) :where(.professional-section-nav, .portal-section-nav) {
    position: sticky !important;
    top: 56px !important;
    z-index: 20 !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    max-height: 74px !important;
    padding: 7px 8px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    border: 1px solid var(--pf24-ui-line) !important;
    border-radius: 0 !important;
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 6px 18px rgba(15, 23, 42, .06) !important;
  }

  body.portal-active:has(#portalDashboard:not(.hidden)) :where(.professional-section-nav .portal-sidebar-brand, .portal-section-nav .portal-sidebar-brand, .professional-section-nav .portal-nav-group-label, .portal-section-nav .portal-nav-group-label, .professional-section-nav .portal-workscreen-actions, .portal-section-nav .portal-workscreen-actions, .professional-section-nav .portal-app-download, .portal-section-nav .portal-app-download, .professional-section-nav .sidebar-chat-widget, .portal-section-nav .sidebar-chat-widget, .professional-section-nav .sidebar-chat-compact, .portal-section-nav .sidebar-chat-compact, .professional-section-nav .portal-sidebar-logout, .portal-section-nav .portal-sidebar-logout) {
    display: none !important;
  }

  body.portal-active:has(#portalDashboard:not(.hidden)) :where(.professional-section-nav .portal-nav-links, .portal-section-nav .portal-nav-links) {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    gap: 6px !important;
    width: max-content !important;
    min-width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
  }

  body.portal-active:has(#portalDashboard:not(.hidden)) :where(.professional-section-nav .portal-nav-group, .portal-section-nav .portal-nav-group) {
    display: contents !important;
  }

  body.portal-active:has(#portalDashboard:not(.hidden)) :where(.professional-section-nav a, .portal-section-nav a) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    width: auto !important;
    min-width: max-content !important;
    min-height: 34px !important;
    padding: 7px 10px !important;
    border: 1px solid var(--pf24-ui-line) !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: var(--pf24-ui-muted) !important;
    white-space: nowrap !important;
  }

  body.portal-active:has(#portalDashboard:not(.hidden)) :where(.professional-section-nav a.active, .portal-section-nav a.active) {
    border-color: rgba(245, 130, 32, .45) !important;
    background: rgba(245, 130, 32, .12) !important;
    color: #8a4300 !important;
  }

  body.portal-active:has(#portalDashboard:not(.hidden)) :where(.professional-section-nav .portal-nav-icon, .portal-section-nav .portal-nav-icon, .professional-section-nav svg, .portal-section-nav svg) {
    width: 16px !important;
    height: 16px !important;
    flex: 0 0 16px !important;
  }
}

body.workapp-entry.portal-active:has(#portalDashboard:not(.hidden)) :where(.topbar, .portal-topbar) {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 56px !important;
  padding: 7px 12px !important;
}

body.workapp-entry.portal-active:has(#portalDashboard:not(.hidden)) :where(.topbar .brand, .portal-topbar .brand) {
  min-width: 0 !important;
}

body.workapp-entry.portal-active:has(#portalDashboard:not(.hidden)) :where(.topbar .brand img, .portal-topbar .brand img) {
  max-width: 148px !important;
  height: 34px !important;
  max-height: 34px !important;
  object-fit: contain !important;
}

body.workapp-entry.portal-active:has(#portalDashboard:not(.hidden)) :where(.portal-nav .nav-links, .portal-nav .language-select, .portal-nav .settings-toggle, .portal-nav .settings-button) {
  display: none !important;
}

body.workapp-entry.portal-active:has(#portalDashboard:not(.hidden)) :where(.portal-nav, .nav-actions) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  width: auto !important;
  min-width: 0 !important;
}

body.workapp-entry.portal-active:has(#portalDashboard:not(.hidden)) :where(.professional-section-nav, .portal-section-nav) {
  display: none !important;
}

body.workapp-entry.portal-active:has(#portalDashboard:not(.hidden)) :where(.portal-notifications) {
  display: none !important;
}

.taxi-pool-panel {
  display: grid !important;
  gap: 10px !important;
  padding: 12px !important;
}

.taxi-ops-overview {
  display: grid !important;
  gap: 9px !important;
}

.taxi-ops-foldouts {
  display: grid !important;
  gap: 8px !important;
}

.taxi-compact-foldout {
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
  overflow: hidden !important;
}

.taxi-compact-foldout > summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 42px !important;
  padding: 9px 10px !important;
  background: var(--pf24-ui-soft) !important;
  border-bottom: 1px solid transparent !important;
}

.taxi-compact-foldout[open] > summary {
  border-bottom-color: var(--pf24-ui-line) !important;
}

.taxi-compact-foldout > summary span {
  display: grid !important;
  gap: 2px !important;
}

.taxi-compact-foldout > summary small {
  color: var(--pf24-ui-muted) !important;
}

.taxi-compact-foldout > .taxi-foldout-body {
  display: grid !important;
  gap: 8px !important;
  padding: 10px !important;
}

.taxi-pool-kpis,
.taxi-dispatch-kpis {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(112px, 1fr)) !important;
  gap: 6px !important;
}

.taxi-pool-kpis span,
.taxi-dispatch-kpis span {
  display: grid !important;
  gap: 2px !important;
  min-height: 48px !important;
  padding: 7px 8px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
  line-height: 1.2 !important;
}

.taxi-dispatch-intelligence,
.taxi-dispatch-workbench,
.taxi-service-catalog,
.taxi-transport-profiles,
.taxi-school-routes,
.taxi-driver-checks {
  display: grid !important;
  gap: 8px !important;
  padding: 10px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
}

.taxi-pool-status-form {
  display: grid !important;
  grid-template-columns: minmax(160px, auto) minmax(180px, 1fr) minmax(160px, auto) !important;
  align-items: end !important;
  gap: 10px !important;
  padding: 10px 0 !important;
}

.taxi-pool-toggle {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 38px !important;
  font-weight: 700 !important;
}

.taxi-pool-toggle input[type="checkbox"] {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  accent-color: var(--pf24-ui-accent) !important;
}

.taxi-rule-note {
  margin-top: 8px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
}

.taxi-rule-note summary {
  padding: 8px 10px !important;
  cursor: pointer !important;
  font-weight: 700 !important;
}

.taxi-rule-note p {
  margin: 0 !important;
  padding: 0 10px 10px !important;
  color: var(--pf24-ui-muted) !important;
}

.taxi-service-grid,
.taxi-profile-grid,
.taxi-school-route-grid,
.taxi-intelligence-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 8px !important;
}

.taxi-intelligence-signal,
.taxi-service-grid article,
.taxi-profile-grid article,
.taxi-school-route-card,
.taxi-ride-row {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
  padding: 9px 10px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
  line-height: 1.25 !important;
}

.taxi-intelligence-signal :where(b, small, em),
.taxi-service-grid article :where(strong, small, em, p, span),
.taxi-ride-row :where(strong, small, span, b, dt, dd) {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  line-height: 1.25 !important;
}

.taxi-ride-list {
  display: grid !important;
  gap: 8px !important;
}

.taxi-ride-row {
  grid-template-columns: minmax(190px, 1fr) minmax(250px, 1.6fr) minmax(300px, 2fr) !important;
  align-items: start !important;
}

.taxi-ride-row header {
  display: flex !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

.taxi-service-grid article header {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 8px !important;
}

.taxi-service-grid article header span {
  display: grid !important;
  gap: 2px !important;
}

.taxi-ride-row dl {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
  margin: 0 !important;
}

.taxi-ride-row dl div {
  display: grid !important;
  gap: 1px !important;
}

.taxi-ride-row dt {
  color: var(--pf24-ui-muted) !important;
}

.taxi-ride-row dd {
  margin: 0 !important;
  font-weight: 700 !important;
}

.smart-work-options {
  display: grid !important;
  gap: 9px !important;
  padding: 12px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
}

.smart-work-options-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 8px !important;
}

.smart-work-option {
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 8px !important;
  min-height: 58px !important;
  padding: 8px 9px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-left: 3px solid #8fb3d9 !important;
  border-radius: 8px !important;
  background: var(--pf24-ui-soft) !important;
  color: var(--pf24-ui-text) !important;
  text-decoration: none !important;
}

.smart-work-option.attention,
.smart-work-option.warning {
  border-left-color: var(--pf24-ui-orange) !important;
  background: #fff8f1 !important;
}

.smart-work-option.ok {
  border-left-color: #0f766e !important;
}

.smart-work-option > i,
.smart-work-option > svg {
  width: 19px !important;
  height: 19px !important;
  color: var(--pf24-ui-orange) !important;
}

.smart-work-option span {
  display: grid !important;
  gap: 2px !important;
}

.smart-work-option small {
  display: none !important;
}

.smart-work-option small,
.smart-work-option em {
  color: var(--pf24-ui-muted) !important;
  font-style: normal !important;
}

.smart-work-option b {
  align-self: start !important;
  padding: 3px 7px !important;
  border-radius: 999px !important;
  background: rgba(245, 130, 32, .12) !important;
  color: #9a4b00 !important;
  font-size: 11px !important;
  white-space: nowrap !important;
}

@media (min-width: 1080px) {
  body.portal-active:not(.werkapp-entry):not(.klantapp-entry):not(.kassaapp-entry):not(.zelfscanapp-entry) #portalDashboard.dashboard {
    grid-template-columns: 244px minmax(0, 1fr) !important;
    gap: 14px !important;
    width: min(100% - 28px, 1500px) !important;
    padding-top: 14px !important;
  }
}

@media (max-width: 719px) {
  body.portal-active #portalDashboard.dashboard {
    padding-inline: 8px !important;
    overflow-x: hidden !important;
  }

  body.portal-active :where(.section-title-row, .panel-head, .customer-head, .professional-head) {
    display: grid !important;
  }

  .taxi-service-grid,
  .taxi-ride-row,
  .taxi-profile-grid,
  .taxi-school-route-grid,
  .taxi-intelligence-grid,
  .smart-work-options-grid {
    grid-template-columns: 1fr !important;
  }

  .taxi-pool-status-form {
    grid-template-columns: 1fr !important;
  }

  .taxi-ride-row dl {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .smart-work-option {
    grid-template-columns: 22px minmax(0, 1fr) !important;
  }

  .smart-work-option b {
    grid-column: 2 !important;
    justify-self: start !important;
  }
}

/* Presentation polish: one final, light, compact layer over older portal styles. */
body.portal-active,
body.admin-body.active {
  --pf24-ui-page: #f3f6f9;
  --pf24-ui-panel: #ffffff;
  --pf24-ui-soft: #f8fafc;
  --pf24-ui-text: #0f1f33;
  --pf24-ui-muted: #5f6d7c;
  --pf24-ui-line: #dbe4ee;
  --pf24-ui-orange: #f58220;
  overflow-x: hidden !important;
}

body.portal-active :where(.admin-shell, .portal-shell, #portalDashboard, #dashboard, main, .dashboard-main, .portal-main, .content, .workspace-content),
body.admin-body.active :where(.admin-shell, .portal-shell, #portalDashboard, #dashboard, main, .dashboard-main, .portal-main, .content, .workspace-content) {
  background: var(--pf24-ui-page) !important;
  color: var(--pf24-ui-text) !important;
}

body.portal-active :where(.topbar, .portal-topbar, .admin-topbar),
body.admin-body.active :where(.topbar, .portal-topbar, .admin-topbar) {
  min-height: 54px !important;
  padding: 8px 14px !important;
  border-bottom: 1px solid var(--pf24-ui-line) !important;
  background: rgba(255, 255, 255, .96) !important;
  color: var(--pf24-ui-text) !important;
  box-shadow: 0 4px 18px rgba(15, 31, 51, .06) !important;
}

body.portal-active :where(.brand, .portal-brand, .admin-brand),
body.admin-body.active :where(.brand, .portal-brand, .admin-brand) {
  min-width: 0 !important;
  color: var(--pf24-ui-text) !important;
}

body.portal-active :where(.brand img, .portal-brand img, .admin-brand img),
body.admin-body.active :where(.brand img, .portal-brand img, .admin-brand img) {
  width: auto !important;
  max-width: 168px !important;
  height: 34px !important;
  object-fit: contain !important;
  object-position: left center !important;
}

body.portal-active :where(.brand-copy, .brand-tagline),
body.admin-body.active :where(.brand-copy, .brand-tagline) {
  color: var(--pf24-ui-muted) !important;
  font-size: 11px !important;
  line-height: 1.15 !important;
}

body.portal-active :where(nav, .sidebar, .side-nav, .portal-sidebar, .portal-menu, .admin-menu, .left-menu, .nav-group),
body.admin-body.active :where(nav, .sidebar, .side-nav, .portal-sidebar, .portal-menu, .admin-menu, .left-menu, .nav-group) {
  gap: 5px !important;
  background: #fff !important;
  color: var(--pf24-ui-text) !important;
}

body.portal-active :where(nav a, nav button, .sidebar a, .sidebar button, .side-nav a, .side-nav button, .portal-menu a, .portal-menu button, .admin-menu a, .admin-menu button, .nav-group a, .nav-group button),
body.admin-body.active :where(nav a, nav button, .sidebar a, .sidebar button, .side-nav a, .side-nav button, .portal-menu a, .portal-menu button, .admin-menu a, .admin-menu button, .nav-group a, .nav-group button) {
  min-height: 30px !important;
  padding: 6px 8px !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: var(--pf24-ui-text) !important;
  font-size: 12px !important;
  font-weight: 560 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

body.portal-active :where(nav a.active, nav button.active, nav [aria-current="page"], .sidebar .active, .side-nav .active, .portal-menu .active, .admin-menu .active),
body.admin-body.active :where(nav a.active, nav button.active, nav [aria-current="page"], .sidebar .active, .side-nav .active, .portal-menu .active, .admin-menu .active) {
  border-color: #fed7aa !important;
  background: #fff7ed !important;
  color: #8a3d00 !important;
}

body.portal-active :where(.panel, .panel-card, .card, .tile, .stat-card, .metric, .metric-card, .summary-card, .dashboard-card, .request-card, .request-detail, .mail-card, .invoice-card, .quote-card, .work-card, .workscreen, .module-card, .business-domain-chip, .business-operations-action),
body.admin-body.active :where(.panel, .panel-card, .card, .tile, .stat-card, .metric, .metric-card, .summary-card, .dashboard-card, .request-card, .request-detail, .mail-card, .invoice-card, .quote-card, .work-card, .workscreen, .module-card, .business-domain-chip, .business-operations-action) {
  border: 1px solid var(--pf24-ui-line) !important;
  background: #fff !important;
  color: var(--pf24-ui-text) !important;
  box-shadow: 0 6px 18px rgba(15, 31, 51, .045) !important;
}

body.portal-active :where(.dark, .dark-card, .hero-card, .glass-card, .surface-dark, .admin-hero, .command-card, .operations-card),
body.admin-body.active :where(.dark, .dark-card, .hero-card, .glass-card, .surface-dark, .admin-hero, .command-card, .operations-card) {
  background: #fff !important;
  color: var(--pf24-ui-text) !important;
  border-color: var(--pf24-ui-line) !important;
}

body.portal-active :where(.dark *, .dark-card *, .hero-card *, .glass-card *, .surface-dark *, .admin-hero *, .command-card *, .operations-card *),
body.admin-body.active :where(.dark *, .dark-card *, .hero-card *, .glass-card *, .surface-dark *, .admin-hero *, .command-card *, .operations-card *) {
  color: inherit !important;
}

body.portal-active :where(.kpi-strip, .stats-strip, .summary-strip, .dashboard-stats, .admin-kpis, .servicecenter-kpis, .professional-kpis, .customer-kpis),
body.admin-body.active :where(.kpi-strip, .stats-strip, .summary-strip, .dashboard-stats, .admin-kpis, .servicecenter-kpis, .professional-kpis, .customer-kpis) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)) !important;
  gap: 7px !important;
  margin: 0 0 8px !important;
}

body.portal-active :where(.kpi-strip > *, .stats-strip > *, .summary-strip > *, .dashboard-stats > *, .admin-kpis > *, .servicecenter-kpis > *, .professional-kpis > *, .customer-kpis > *),
body.admin-body.active :where(.kpi-strip > *, .stats-strip > *, .summary-strip > *, .dashboard-stats > *, .admin-kpis > *, .servicecenter-kpis > *, .professional-kpis > *, .customer-kpis > *) {
  min-height: 46px !important;
  padding: 7px 9px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--pf24-ui-text) !important;
  box-shadow: none !important;
}

body.portal-active :where(.kpi-strip strong, .stats-strip strong, .summary-strip strong, .dashboard-stats strong, .admin-kpis strong, .servicecenter-kpis strong, .professional-kpis strong, .customer-kpis strong),
body.admin-body.active :where(.kpi-strip strong, .stats-strip strong, .summary-strip strong, .dashboard-stats strong, .admin-kpis strong, .servicecenter-kpis strong, .professional-kpis strong, .customer-kpis strong) {
  display: block !important;
  font-size: 15px !important;
  line-height: 1.1 !important;
}

body.portal-active :where(.assistant-fab, .ai-fab, .portal-assistant-button, .assistant-button, [data-assistant-open], [data-voice-assistant-open]),
body.admin-body.active :where(.assistant-fab, .ai-fab, .portal-assistant-button, .assistant-button, [data-assistant-open], [data-voice-assistant-open]) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  border-radius: 999px !important;
}

body.portal-active :where(.assistant-fab svg, .ai-fab svg, .portal-assistant-button svg, .assistant-button svg, [data-assistant-open] svg, [data-voice-assistant-open] svg),
body.admin-body.active :where(.assistant-fab svg, .ai-fab svg, .portal-assistant-button svg, .assistant-button svg, [data-assistant-open] svg, [data-voice-assistant-open] svg) {
  display: block !important;
  width: 17px !important;
  height: 17px !important;
  margin: 0 !important;
}

body.portal-active :where(.driver-navigation-actions),
body.admin-body.active :where(.driver-navigation-actions) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
  width: 100% !important;
}

body.portal-active :where(.driver-navigation-actions .button),
body.admin-body.active :where(.driver-navigation-actions .button) {
  justify-content: center !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}

body.portal-active :where(.driver-route-map),
body.admin-body.active :where(.driver-route-map) {
  position: relative !important;
  min-height: 142px !important;
  overflow: hidden !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 8px !important;
  background: #eef4fb !important;
}

body.portal-active :where(.driver-route-map-live),
body.admin-body.active :where(.driver-route-map-live) {
  display: block !important;
  height: 148px !important;
  padding: 0 !important;
}

body.portal-active :where(.driver-route-map-live .leaflet-control-container),
body.admin-body.active :where(.driver-route-map-live .leaflet-control-container) {
  font-size: 10px !important;
}

body.portal-active :where(.driver-route-map-offline)::after,
body.admin-body.active :where(.driver-route-map-offline)::after {
  content: "Kaart tijdelijk offline";
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 500;
  padding: 4px 7px;
  border-radius: 999px;
  background: rgba(15, 31, 51, .84);
  color: #fff;
  font-size: 11px;
}

body.field-workapp-active {
  overflow: hidden !important;
  background: #edf3f8 !important;
}

body.field-workapp-active :where(.topbar, .portal-topbar, .portal-page-footer) {
  display: none !important;
}

body.field-workapp-active :where(.admin-shell, .portal-shell, #portalDashboard, #dashboard) {
  display: block !important;
  width: 100vw !important;
  max-width: none !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #edf3f8 !important;
}

body.field-workapp-active :where(.field-workapp-shell) {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  width: 100vw !important;
  max-width: 520px !important;
  height: 100dvh !important;
  margin: 0 auto !important;
  overflow: hidden !important;
  background: #edf3f8 !important;
  color: var(--pf24-ui-text) !important;
}

body.field-workapp-active :where(.field-workapp-header) {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) 38px !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 58px !important;
  padding: 9px 12px !important;
  border-bottom: 1px solid var(--pf24-ui-line) !important;
  background: rgba(255, 255, 255, .97) !important;
  box-shadow: 0 6px 18px rgba(15, 31, 51, .05) !important;
}

body.field-workapp-active :where(.field-workapp-avatar, .field-workapp-logout) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: var(--pf24-ui-text) !important;
  box-shadow: none !important;
}

body.field-workapp-active :where(.field-workapp-avatar svg, .field-workapp-logout svg) {
  width: 18px !important;
  height: 18px !important;
}

body.field-workapp-active :where(.field-workapp-header h1) {
  margin: 0 !important;
  font-size: 16px !important;
  line-height: 1.12 !important;
}

body.field-workapp-active :where(.field-workapp-header small, .field-workapp-header p) {
  display: block !important;
  margin: 0 !important;
  color: var(--pf24-ui-muted) !important;
  font-size: 11px !important;
  line-height: 1.18 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.field-workapp-active :where(.field-workapp-section) {
  display: none !important;
  min-height: 0 !important;
  padding: 12px 12px calc(92px + env(safe-area-inset-bottom)) !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
}

body.field-workapp-active :where(.field-workapp-section.portal-view-active) {
  display: grid !important;
  align-content: start !important;
  gap: 10px !important;
}

body.field-workapp-active :where(.field-next-task, .field-card, .driver-payment-form) {
  display: grid !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 12px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: var(--pf24-ui-text) !important;
  box-shadow: 0 10px 28px rgba(15, 31, 51, .07) !important;
}

body.field-workapp-active :where(.driver-task) {
  align-content: start !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

body.field-workapp-active :where(.field-next-task h2) {
  margin: 0 !important;
  font-size: 17px !important;
  line-height: 1.16 !important;
}

body.field-workapp-active :where(.field-next-task h3) {
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
}

body.field-workapp-active :where(.field-next-task p, .field-next-task small, .driver-payment-box, .driver-payment-box small) {
  margin: 0 !important;
  color: var(--pf24-ui-muted) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
}

body.field-workapp-active :where(.field-next-task p strong, .driver-payment-box b) {
  color: var(--pf24-ui-text) !important;
  font-weight: 700 !important;
}

body.field-workapp-active :where(.workday-pill) {
  justify-self: start !important;
  min-height: 22px !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  background: #fff7ed !important;
  color: #8a3d00 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

body.field-workapp-active :where(.driver-passenger-info, .driver-payment-box) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px 10px !important;
}

body.field-workapp-active :where(.driver-passenger-info span, .driver-passenger-info a, .driver-payment-box span) {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  min-height: 24px !important;
  color: var(--pf24-ui-muted) !important;
  font-size: 12px !important;
  text-decoration: none !important;
}

body.field-workapp-active :where(.driver-passenger-info svg, .driver-payment-box svg) {
  width: 16px !important;
  height: 16px !important;
  color: #6b7a8a !important;
}

body.field-workapp-active :where(.driver-payment-box) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 7px 10px !important;
  padding: 8px !important;
  border: 1px solid #e2eaf2 !important;
  border-radius: 10px !important;
  background: #f8fbfd !important;
}

body.field-workapp-active :where(.driver-payment-box small, .driver-payment-box b, .driver-ride-details) {
  grid-column: 1 / -1 !important;
}

body.field-workapp-active :where(.driver-ride-details) {
  flex-basis: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.field-workapp-active :where(.driver-ride-details summary) {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 24px !important;
  color: #31506f !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

body.field-workapp-active :where(.driver-ride-details[open]) {
  display: grid !important;
  gap: 4px !important;
  margin-top: 3px !important;
}

body.field-workapp-active :where(.driver-ride-actions) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
  width: 100% !important;
}

body.field-workapp-active :where(.driver-ride-actions > .driver-navigation-actions) {
  display: grid !important;
  grid-column: 1 / -1 !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
  width: 100% !important;
}

body.field-workapp-active :where(.field-workapp-section .button, .field-workapp-bottom a) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  min-height: 38px !important;
  padding: 8px 9px !important;
  border-radius: 10px !important;
  font-size: 12px !important;
  line-height: 1.15 !important;
  white-space: normal !important;
  text-align: center !important;
  overflow-wrap: anywhere !important;
}

body.field-workapp-active :where(.field-workapp-section .button svg, .field-workapp-bottom a svg) {
  flex: 0 0 auto !important;
  width: 18px !important;
  height: 18px !important;
}

body.field-workapp-active :where(.field-mini-map.driver-route-map) {
  display: block !important;
  width: 100% !important;
  min-height: 190px !important;
  height: 190px !important;
  padding: 0 !important;
  border-radius: 12px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .72), rgba(238, 246, 255, .42)),
    repeating-linear-gradient(45deg, #dce8f5 0 2px, #eaf2fb 2px 18px) !important;
}

body.field-workapp-active :where(.field-mini-map.driver-route-map.driver-route-map-live) {
  background: #eef4fb !important;
}

body.field-workapp-active :where(.field-mini-map.driver-route-map:not(.driver-route-map-live) > svg) {
  position: absolute !important;
  top: 12px !important;
  left: 12px !important;
  width: 22px !important;
  height: 22px !important;
}

body.field-workapp-active :where(.field-mini-map.driver-route-map:not(.driver-route-map-live) > span, .field-mini-map.driver-route-map:not(.driver-route-map-live) > small) {
  display: block !important;
  padding: 0 12px 0 44px !important;
  color: var(--pf24-ui-text) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}

body.field-workapp-active :where(.field-mini-map.driver-route-map:not(.driver-route-map-live) > span) {
  padding-top: 12px !important;
  font-weight: 700 !important;
}

body.field-workapp-active :where(.field-workapp-bottom) {
  position: static !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  z-index: auto !important;
  transform: none !important;
  width: auto !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
  padding: 8px 10px calc(8px + env(safe-area-inset-bottom)) !important;
  border-top: 1px solid var(--pf24-ui-line) !important;
  background: rgba(255, 255, 255, .98) !important;
  box-shadow: 0 -8px 20px rgba(15, 31, 51, .06) !important;
}

body.field-workapp-active :where(.field-workapp-bottom a) {
  flex-direction: column !important;
  min-height: 48px !important;
  padding: 5px !important;
  border: 1px solid transparent !important;
  border-radius: 11px !important;
  background: transparent !important;
  color: var(--pf24-ui-muted) !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
}

body.field-workapp-active :where(.field-workapp-bottom a.active) {
  border-color: #fed7aa !important;
  background: #fff7ed !important;
  color: #8a3d00 !important;
}

body.portal-active :where(table),
body.admin-body.active :where(table) {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  font-size: 12px !important;
}

body.portal-active :where(th),
body.admin-body.active :where(th) {
  background: #f2f6fa !important;
  color: #314357 !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  text-transform: none !important;
}

body.portal-active :where(td),
body.admin-body.active :where(td) {
  color: var(--pf24-ui-text) !important;
  border-color: var(--pf24-ui-line) !important;
}

body.portal-active :where(.form-message:not(:empty), .notice, .alert, .warning, .error, .success),
body.admin-body.active :where(.form-message:not(:empty), .notice, .alert, .warning, .error, .success) {
  border-radius: 8px !important;
  color: var(--pf24-ui-text) !important;
}

body.portal-active :where(.portal-view, .portal-view-active, .tab-content, .tab-panel, .workspace-panel),
body.admin-body.active :where(.portal-view, .portal-view-active, .tab-content, .tab-panel, .workspace-panel) {
  width: 100% !important;
  max-width: none !important;
}

body.admin-body.active #dashboard.dashboard :where(.bookkeeping-checklist) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 8px !important;
  min-width: 0 !important;
}

body.admin-body.active #dashboard.dashboard :where(.bookkeeping-check) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: start !important;
  justify-items: stretch !important;
  gap: 4px !important;
  width: 100% !important;
  min-width: 0 !important;
  text-align: left !important;
}

body.admin-body.active #dashboard.dashboard :where(.bookkeeping-check span, .bookkeeping-check strong, .bookkeeping-check b) {
  display: block !important;
  width: 100% !important;
  min-width: 96px !important;
  max-width: 100% !important;
  height: auto !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  line-height: 1.25 !important;
}

body.admin-body.active #dashboard.dashboard :where(.servicecenter-ticket-main em) {
  display: inline-flex !important;
  width: auto !important;
  min-width: 92px !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  line-height: 1.25 !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.professional-cockpit) {
  display: grid !important;
  gap: 10px !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.professional-regie-brand, .owner-dashboard-toolbar, .business-core-card, .business-operations-staff-queue article, .professional-regie-item, .professional-live-map-panel, .smart-work-options) {
  border-color: var(--pf24-ui-line) !important;
  background: #fff !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.professional-regie-brand) {
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.professional-regie-brand h2, .professional-regie-brand span, .professional-regie-brand small) {
  display: block !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  line-height: 1.25 !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.owner-dashboard-toolbar > div:first-child) {
  display: flex !important;
  align-items: baseline !important;
  flex-wrap: wrap !important;
  gap: 4px 8px !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.owner-dashboard-toolbar strong, .owner-dashboard-toolbar small, .owner-comparison-kpis article span, .owner-comparison-kpis article strong, .owner-comparison-kpis article small) {
  line-height: 1.25 !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.professional-role-widget) {
  display: grid !important;
  gap: 8px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.professional-role-widget-head) {
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) 28px !important;
  align-items: center !important;
  gap: 8px !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.professional-role-widget-head small, .professional-role-widget-head strong, .professional-role-widget-head span) {
  display: inline !important;
  line-height: 1.25 !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.professional-role-widget-grid) {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.professional-role-widget-grid article) {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
  padding: 9px 10px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.professional-role-widget-grid span, .professional-role-widget-grid strong, .professional-role-widget-grid small) {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  line-height: 1.22 !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.owner-comparison-kpis) {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.owner-comparison-kpis article) {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.smart-work-options-grid) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)) !important;
  gap: 8px !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.smart-work-option) {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 8px !important;
  min-height: 0 !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.smart-work-option b) {
  grid-column: 2 !important;
  justify-self: start !important;
  max-width: 100% !important;
  white-space: normal !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.smart-work-option strong, .smart-work-option em, .business-core-card strong, .business-core-card small, .business-core-card em) {
  display: block !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  line-height: 1.25 !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.empty-map-panel .panel-head) {
  min-height: 0 !important;
  padding: 10px 12px !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.business-core-grid) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
  gap: 8px !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.business-core-card) {
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 8px !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.business-core-card em) {
  grid-column: 2 / -1 !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.professional-regie-grid) {
  display: grid !important;
  gap: 8px !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.professional-regie-item) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 6px 10px !important;
  align-items: start !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.professional-regie-item strong, .professional-regie-item span, .professional-regie-item small) {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  line-height: 1.25 !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.owner-organization-shortcuts) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
  gap: 8px !important;
  margin: 0 !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.owner-organization-shortcuts a) {
  display: grid !important;
  gap: 3px !important;
  align-content: start !important;
  min-width: 0 !important;
  padding: 10px 12px !important;
  border: 1px solid var(--pf24-ui-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
  text-decoration: none !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.owner-organization-shortcuts strong, .owner-organization-shortcuts span) {
  display: block !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  line-height: 1.25 !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.business-operations-staff-queue header) {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

body.professional-portal-active.portal-active #professional-overview :where(.business-operations-staff-queue header strong, .business-operations-staff-queue header small) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  line-height: 1.25 !important;
}

@media (max-width: 719px) {
  body.portal-active,
  body.admin-body.active {
    font-size: 12.5px !important;
  }

  body.portal-active :where(.topbar, .portal-topbar, .admin-topbar),
  body.admin-body.active :where(.topbar, .portal-topbar, .admin-topbar) {
    min-height: 48px !important;
    padding: 7px 9px !important;
  }

  body.portal-active :where(.brand img, .portal-brand img, .admin-brand img),
  body.admin-body.active :where(.brand img, .portal-brand img, .admin-brand img) {
    max-width: 132px !important;
    height: 28px !important;
  }

  body.portal-active :where(.brand-copy, .brand-tagline),
  body.admin-body.active :where(.brand-copy, .brand-tagline) {
    display: none !important;
  }

  body.portal-active :where(nav a, nav button, .sidebar a, .sidebar button, .side-nav a, .side-nav button, .portal-menu a, .portal-menu button, .admin-menu a, .admin-menu button, .nav-group a, .nav-group button),
  body.admin-body.active :where(nav a, nav button, .sidebar a, .sidebar button, .side-nav a, .side-nav button, .portal-menu a, .portal-menu button, .admin-menu a, .admin-menu button, .nav-group a, .nav-group button) {
    min-height: 32px !important;
    padding: 6px 7px !important;
  }

  body.portal-active :where(.kpi-strip, .stats-strip, .summary-strip, .dashboard-stats, .admin-kpis, .servicecenter-kpis, .professional-kpis, .customer-kpis),
  body.admin-body.active :where(.kpi-strip, .stats-strip, .summary-strip, .dashboard-stats, .admin-kpis, .servicecenter-kpis, .professional-kpis, .customer-kpis) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.portal-active:has(#portalDashboard:not(.hidden)) :where(.professional-section-nav, .portal-section-nav) {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-inline: 10px !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
  }

  body.portal-active:has(#portalDashboard:not(.hidden)) :where(.professional-section-nav::-webkit-scrollbar, .portal-section-nav::-webkit-scrollbar) {
    display: none !important;
  }

  body.portal-active:has(#portalDashboard:not(.hidden)) :where(.professional-section-nav .portal-nav-links, .portal-section-nav .portal-nav-links) {
    width: max-content !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  body.professional-portal-active.portal-active #professional-overview :where(.owner-comparison-kpis, .business-core-grid) {
    grid-template-columns: 1fr !important;
  }

  body.professional-portal-active.portal-active #professional-overview :where(.professional-role-widget-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.professional-portal-active.portal-active #professional-overview :where(.owner-organization-shortcuts) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.professional-portal-active.portal-active #professional-overview :where(.owner-organization-shortcuts a) {
    padding: 8px 9px !important;
  }

  body.professional-portal-active.portal-active #professional-overview :where(.professional-regie-brand) {
    grid-template-columns: 40px minmax(0, 1fr) !important;
  }

  body.professional-portal-active.portal-active #professional-overview :where(.business-operations-staff-queue article) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.professional-portal-active.portal-active #professional-overview :where(.business-operations-staff-queue nav) {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }
}

/* POS module: compact, readable layout inside the portal shell. */
body.professional-portal-active.portal-active #professional-pos :where(.pos-register-shell) {
  display: grid !important;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr) minmax(280px, 0.62fr) !important;
  gap: 12px !important;
  align-items: start !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-register-left, .pos-ticket-panel, .pos-register-right) {
  display: grid !important;
  gap: 10px !important;
  min-width: 0 !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-branch-banner, .pos-terminal-card, .pos-session-form, .pos-scan-form, .pos-product-manage-form, .pos-ticket-panel, .pos-status-list, .pos-benefit-form, .pos-register-toolbar) {
  border: 1px solid var(--pf24-line, #d9e3ee) !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: var(--pf24-ink, #102033) !important;
  box-shadow: none !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-branch-banner, .pos-terminal-card, .pos-session-form, .pos-scan-form, .pos-product-manage-form, .pos-status-list, .pos-benefit-form, .pos-register-toolbar) {
  padding: 10px !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-branch-banner) {
  display: grid !important;
  grid-template-columns: minmax(150px, 0.9fr) minmax(0, 1.4fr) !important;
  gap: 10px !important;
  align-items: center !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-branch-banner span, .pos-register-toolbar span, .pos-ticket-head span, .pos-terminal-card span, .pos-status-list span) {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-register-toolbar, .pos-ticket-head) {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

body.professional-portal-active.portal-active #professional-pos :where(small, .pos-status-list small, .pos-product-button span) {
  color: var(--pf24-muted, #5b6c7d) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}

body.professional-portal-active.portal-active #professional-pos :where(strong, h4, b) {
  color: var(--pf24-ink, #102033) !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-branch-banner div, .pos-pay-actions, .compact-terminal-actions) {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-branch-banner b, .pos-ticket-head > b, .pos-register-toolbar > b, .pos-terminal-card > b) {
  display: inline-flex !important;
  width: fit-content !important;
  align-items: center !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  background: #fff4e8 !important;
  color: #8a4500 !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-benefit-grid) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-benefit-grid .wide, .pos-product-channels) {
  grid-column: 1 / -1 !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-product-groups, .pos-product-grid, .pos-stat-grid) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(116px, 1fr)) !important;
  gap: 8px !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-product-groups button, .pos-product-button, .pos-pay-actions button, .pos-stat-grid article) {
  min-width: 0 !important;
  border: 1px solid var(--pf24-line, #d9e3ee) !important;
  border-radius: 9px !important;
  background: #f8fbfd !important;
  color: var(--pf24-ink, #102033) !important;
  padding: 8px !important;
  text-align: left !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-product-button) {
  display: grid !important;
  gap: 3px !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-ticket-lines) {
  display: grid !important;
  gap: 6px !important;
  margin: 8px 0 !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-ticket-lines span, .pos-status-list span) {
  display: grid !important;
  gap: 2px !important;
  padding: 7px 8px !important;
  border: 1px solid var(--pf24-line, #d9e3ee) !important;
  border-radius: 8px !important;
  background: #f8fbfd !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-product-channels) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 10px !important;
  border: 1px solid var(--pf24-line, #d9e3ee) !important;
  border-radius: 10px !important;
}

body.professional-portal-active.portal-active #professional-pos :where(.pos-product-channels legend) {
  padding: 0 4px !important;
  color: var(--pf24-ink, #102033) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

@media (max-width: 1100px) {
  body.professional-portal-active.portal-active #professional-pos :where(.pos-register-shell) {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 640px) {
  body.professional-portal-active.portal-active #professional-pos :where(.pos-branch-banner, .pos-benefit-grid, .pos-product-channels) {
    grid-template-columns: 1fr !important;
  }
}

/* Portal logo fallback: prevents broken image alt text in PWA/headless/mobile shells. */
body.portal-active[data-shell-brand="platform"] :where(.portal-topbar .brand),
body.admin-body.active :where(.topbar .brand) {
  min-width: 190px !important;
  min-height: 44px !important;
  background: url("assets/profix24-logo-wordmark.png?v=20260822a") left center / auto 42px no-repeat !important;
}

body.portal-active[data-shell-brand="platform"] :where(.portal-topbar .brand img),
body.admin-body.active :where(.topbar .brand img) {
  opacity: 0 !important;
}

body.portal-active[data-shell-brand="company"] :where(.portal-topbar .brand) {
  background: none !important;
}

body.portal-active[data-shell-brand="company"] :where(.portal-topbar .brand img) {
  opacity: 1 !important;
}

body.field-workapp-active.workapp-entry.portal-active:has(#portalDashboard:not(.hidden)) :where(.topbar, .portal-topbar, .portal-page-footer, .app-powered-footer),
body.field-workapp-active.workapp-entry.portal-active :where(.topbar, .portal-topbar, .portal-page-footer, .app-powered-footer) {
  display: none !important;
}

body.field-workapp-active.workapp-entry.portal-active :where(.admin-shell, .portal-shell, #portalDashboard) {
  min-height: 100dvh !important;
  padding: 0 !important;
}

/* Release UI sweep: trend cards must stay readable for finance and compact staff dashboards. */
body.admin-body.active :where(.trend-dashboard) {
  display: grid !important;
  gap: 10px !important;
  margin: 10px 0 14px !important;
}

body.admin-body.active :where(.trend-head h3, .trend-head p) {
  margin: 0 !important;
  color: var(--pf24-ink, #102033) !important;
}

body.admin-body.active :where(.trend-grid) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
  gap: 10px !important;
  align-items: stretch !important;
}

body.admin-body.active :where(.trend-card) {
  min-width: 0 !important;
  width: 100% !important;
  display: grid !important;
  gap: 8px !important;
  align-content: start !important;
  padding: 10px !important;
  border: 1px solid var(--pf24-line, #d9e3ee) !important;
  border-radius: 10px !important;
  background: var(--pf24-card, #fff) !important;
  color: var(--pf24-ink, #102033) !important;
  text-align: left !important;
  white-space: normal !important;
}

body.admin-body.active :where(.trend-card-head, .trend-compare-grid) {
  min-width: 0 !important;
}

body.admin-body.active :where(.trend-card-head) {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

body.admin-body.active :where(.trend-card-head span, .trend-card-head strong, .trend-compare-grid span, .trend-compare-grid strong) {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  line-height: 1.25 !important;
}

body.admin-body.active :where(.trend-compare-grid) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

@media (max-width: 720px) {
  body.admin-body.active :where(.trend-grid) {
    grid-template-columns: 1fr !important;
  }
}