.traffic-management-workspace { background:#f4f7fb; }
.tm-page { min-width:0; display:grid; gap:16px; color:#26364d; }
.tm-basis { display:flex; align-items:center; flex-wrap:wrap; gap:8px 16px; min-height:42px; padding:10px 14px; border-left:3px solid #478dee; background:#eaf3ff; color:#3565a0; font-size:12px; }
.tm-basis span:first-child { display:inline-flex; align-items:center; gap:8px; font-weight:600; }
.tm-basis i { height:16px; border-left:1px solid #b9d3f3; }
.tm-toolbar { display:flex; flex-wrap:wrap; align-items:end; gap:10px; }
.tm-toolbar form { display:flex; flex-wrap:wrap; align-items:end; gap:12px; }
.tm-toolbar label { display:flex; align-items:center; gap:12px; font-size:13px; }
.tm-toolbar input { width:185px; }
.tm-page .btn { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:38px; font-size:13px; }
.tm-page .tm-primary { background:#f17618; color:#fff; }
.tm-page input,.tm-page select { border:1px solid #cfdbeb; border-radius:5px; min-height:38px; padding:8px 10px; background:#fff; color:#2a3b53; max-width:100%; }
.tm-metrics { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; }
.tm-metric { min-width:0; min-height:128px; display:flex; gap:10px; padding:18px 12px; background:#fff; border:1px solid #e0e7f0; border-radius:6px; }
.tm-metric > div { flex:1; min-width:0; }
.tm-metric-icon { width:34px; height:34px; display:flex; align-items:center; justify-content:center; border-radius:50%; flex:0 0 34px; background:#eef3f9; color:#597086; }
.tm-metric h3 { font-size:12px; font-weight:500; line-height:1.5; margin:0 0 8px; overflow-wrap:anywhere; }
.tm-metric strong { display:block; font-size:27px; line-height:1.2; font-weight:650; min-width:0; font-variant-numeric:tabular-nums; }
.tm-metric small { display:block; color:#7b8b9f; font-size:10px; line-height:1.6; margin-top:9px; overflow-wrap:anywhere; }
.tm-metric.tm-orange .tm-metric-icon { background:#fff0e2; color:#ef7519; }
.tm-metric.tm-orange strong { color:#df6208; }
.tm-metric.tm-blue .tm-metric-icon { background:#eaf3ff; color:#2b82ed; }
.tm-metric.tm-blue strong { color:#236fd0; }
.tm-metric.tm-green .tm-metric-icon { background:#e4f5ee; color:#0d9277; }
.tm-metric.tm-amber .tm-metric-icon { background:#fff4e1; color:#cb8107; }
.tm-metric.tm-amber strong { color:#b76e00; }
.tm-band { min-width:0; padding:18px; background:#fff; border-top:1px solid #e6ecf4; border-bottom:1px solid #e6ecf4; }
.tm-section-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-bottom:16px; }
.tm-page h2 { display:flex; align-items:center; gap:8px; font-size:15px; line-height:1.5; margin:0; }
.tm-section-heading > span,.tm-section-heading > div > span { font-size:12px; color:#7b8a9e; }
.tm-section-heading > div > span { display:block; margin-top:6px; }
.tm-alerts { display:grid; grid-template-columns:minmax(110px,.7fr) repeat(3,minmax(0,1fr)); align-items:center; gap:12px; }
.tm-alert { display:flex; align-items:center; gap:12px; padding:12px; min-width:0; min-height:72px; background:#f5f8fc; border-radius:5px; color:#35516f; text-align:left; font:inherit; font-size:12px; }
.tm-alert > span { display:flex; align-items:center; justify-content:center; flex:0 0 34px; width:34px; height:34px; border-radius:50%; background:#fff; }
.tm-alert > div { flex:1; min-width:0; overflow-wrap:anywhere; }
.tm-alert strong { display:block; margin-top:5px; font-size:21px; font-variant-numeric:tabular-nums; }
.tm-alert small { font-size:12px; font-weight:400; }
.tm-alert > .ui-icon { width:15px; height:15px; flex:0 0 15px; }
.tm-alert.tm-amber { color:#a16e19; background:#fff7ed; }
.tm-alert.tm-blue { color:#2878c6; background:#edf5ff; }
.tm-alert.tm-red { color:#be4754; background:#fff1f2; }
.tm-tabs { display:flex; flex-wrap:wrap; gap:4px; border-bottom:1px solid #dce5f0; }
.tm-tabs button { min-height:42px; padding:10px 19px; border-radius:0; background:transparent; border-bottom:2px solid transparent; color:#667b95; font:inherit; font-size:13px; }
.tm-tabs button[aria-current=page] { color:#db6812; border-bottom-color:#ee7d29; font-weight:600; }
.tm-filter-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; }
.tm-filter-grid label { min-width:0; display:flex; flex-direction:column; gap:7px; font-size:12px; color:#61758e; }
.tm-filter-grid select,.tm-filter-grid input { width:100%; min-width:0; font-size:12px; }
.tm-open-day { display:flex; align-items:end; flex-wrap:wrap; gap:12px; }
.tm-open-day label { display:flex; flex-direction:column; gap:7px; min-width:0; flex:1 1 170px; font-size:12px; }
.tm-page .table-wrap { overflow:auto; }
.tm-page table { width:100%; border-collapse:collapse; min-width:1000px; font-size:12px; }
.tm-page th { background:#f5f8fc; color:#60748e; font-size:12px; font-weight:500; white-space:nowrap; }
.tm-page th,.tm-page td { padding:13px 12px; border-bottom:1px solid #e4ebf4; text-align:left; vertical-align:middle; line-height:1.5; }
.tm-page td small { display:block; color:#8794a6; font-size:10px; line-height:1.7; }
.tm-page td:first-child { white-space:nowrap; }
.tm-number { font-variant-numeric:tabular-nums; font-weight:600; }
.tm-sales-number { color:#2679d6; }
.tm-difference { color:#bd5860; }
.tm-muted { color:#8a98aa; }
.tm-source { display:inline-block; margin-right:6px; padding:1px 5px; border-radius:3px; font-size:10px; background:#edf4fc; color:#4a80b5; white-space:nowrap; }
.tm-source.tm-free { background:#fff1e5; color:#b77335; }
.tm-status { display:inline-flex; align-items:center; gap:5px; padding:4px 7px; border-radius:4px; font-size:11px; white-space:nowrap; background:#f0f3f7; color:#7b899a; }
.tm-status .ui-icon { width:12px; height:12px; }
.tm-status.tm-green { background:#e7f7ef; color:#15846b; }
.tm-status.tm-red { background:#fff0f2; color:#bc5260; }
.tm-status.tm-amber { background:#fff5e7; color:#a77625; }
.tm-edit-link { margin-left:10px; }
.tm-pagination { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; padding-top:16px; color:#7a8ba1; font-size:11px; }
.tm-pagination > div { display:flex; align-items:center; gap:7px; }
.tm-pagination select { min-height:32px; padding:5px; font-size:11px; }
.tm-pagination .btn { width:32px; height:32px; min-height:32px; padding:6px; }
.tm-page details > summary { font-weight:500; font-size:13px; cursor:pointer; }
.tm-page details > summary > span { color:#8a98aa; font-size:11px; font-weight:400; margin-left:8px; }
.tm-page details[open] > summary { margin-bottom:16px; }
.tm-group-switch { display:flex; gap:1px; margin-bottom:14px; }
.tm-group-switch button { padding:8px 14px; background:#f2f5f9; color:#6b7d93; font:inherit; font-size:12px; }
.tm-group-switch button[aria-pressed=true] { color:#d26419; background:#fff1e5; }
.tm-detail,.tm-day-editor,.tm-page .traffic-inspection { scroll-margin-top:90px; }
.tm-detail-summary { display:flex; align-items:center; flex-wrap:wrap; gap:20px; padding:14px 0; border-block:1px solid #e9eef6; font-size:12px; }
.tm-detail-summary strong { margin-left:8px; font-size:18px; }
.tm-detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:20px; }
.tm-detail-side { min-width:0; }
.tm-detail-side h3 { font-size:14px; margin:0; }
.tm-detail-side p { color:#7d8a9f; font-size:12px; }
.tm-detail-side table { min-width:550px; }
.tm-detail-side > .btn { margin-top:12px; }
.tm-day-editor .business-entry { padding:0; border:0; }
.tm-page button:focus-visible,.tm-page summary:focus-visible { outline:2px solid #317bd3; outline-offset:2px; }
@media (max-width:1250px) {
  .tm-metric { padding:16px 10px; gap:7px; }
  .tm-metric-icon { display:none; }
  .tm-filter-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:980px) {
  .tm-metrics { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .tm-metric-icon { display:flex; }
  .tm-alerts { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .tm-alerts h2 { grid-column:1/-1; }
  .tm-detail-grid { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  .traffic-management-workspace { padding:14px 12px; }
  .tm-page { gap:12px; }
  .tm-band { padding:14px 12px; }
  .tm-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .tm-metric { min-height:116px; }
  .tm-metric-icon { display:none; }
  .tm-metric strong { font-size:25px; }
  .tm-filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .tm-alerts { grid-template-columns:1fr; }
  .tm-alert { min-height:60px; }
  .tm-alert strong { display:inline-block; margin:0 0 0 12px; font-size:18px; }
  .tm-tabs { gap:0; }
  .tm-tabs button { flex:1 0 50%; padding:9px 6px; }
  .tm-toolbar form { flex:1 1 100%; }
  .tm-toolbar label { flex:1; min-width:0; }
  .tm-toolbar input { flex:1; min-width:0; width:100%; }
  .tm-toolbar > .btn { flex:1; }
  .tm-pagination > div { max-width:100%; }
}