.tbm-status { margin: -6px 0 20px; padding: 12px 16px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); color: var(--muted); font-size: .875rem; }
.tbm-status-warn { background: var(--warn-soft); border-color: var(--warn); color: var(--text); }
.tbm-grid { display: grid; grid-template-columns: minmax(0,1fr) 310px; gap: 20px; margin-bottom: 20px; }
#tbmPage > .card { margin-bottom: 20px; }
.tbm-map-card .card-head, .tbm-strikes .card-head { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.tbm-news .card-head { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.tbm-news-list { list-style:none; padding:0; margin:0; }
.tbm-news-list li { border-top:1px solid var(--border); padding:14px 0; }
.tbm-news-list li p { margin:0 0 5px; }
.tbm-news-list li a { font-weight:600; }
#tbmMap { height: 510px; border-radius: 10px; background: var(--surface-2); border: 1px solid var(--border); z-index: 0; }
.tbm-map-loading { padding: 30px; }
.tbm-map-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:12px; }
.tbm-map-card:fullscreen, .tbm-map-card.tbm-fullscreen { display:flex; flex-direction:column; width:100vw; height:100vh; max-width:none; margin:0; padding:16px; box-sizing:border-box; border:0; border-radius:0; background:var(--surface); }
.tbm-map-card.tbm-fullscreen { position:fixed; inset:0; z-index:10000; }
.tbm-map-card:fullscreen #tbmMap, .tbm-map-card.tbm-fullscreen #tbmMap { flex:1; min-height:0; height:auto; }
.tbm-map-card:fullscreen > p:not(#tbmVehicleStatus):not(#tbmMapError):not(#tbmLocationStatus), .tbm-map-card.tbm-fullscreen > p:not(#tbmVehicleStatus):not(#tbmMapError):not(#tbmLocationStatus) { display:none; }
.tbm-fullscreen-open { overflow:hidden; }
.tbm-vehicle-status { padding: 8px 10px; background: var(--surface-2); border-radius: 8px; }
.tbm-live-unavailable { color: var(--warn); }
.tbm-vehicle-marker { background: transparent; border: 0; }
.tbm-vehicle-dot { display:flex; align-items:center; justify-content:center; gap:3px; min-width:36px; height:30px; padding:0 4px; box-sizing:border-box; border:2px solid #fff; border-radius:9px; background:var(--vehicle-color); color:#fff; text-shadow:0 1px 2px #0008; box-shadow:0 1px 5px #0008; font: bold 12px/1 sans-serif; }
.tbm-vehicle-dot small { font-size:8px; color:inherit; }
.tbm-vehicle-marker:focus { outline:3px solid #172033; border-radius:9px; }
.tbm-text-button { background: transparent; border: 0; color: var(--primary); cursor: pointer; font: inherit; font-size:.875rem; padding: 6px; }
.tbm-legend { display:flex; flex-wrap:wrap; gap:18px; margin:14px 0 8px; font-size:.8125rem; }
.tbm-legend span { display:flex; align-items:center; gap:7px; }
.tbm-legend i { display:inline-block; width:25px; border-top:4px solid #128795; }
.tbm-legend .tbm-line-alert { border-top:4px dashed #b45309; }
.tbm-legend .tbm-stop-alert { width:11px; height:11px; border:2px solid #b45309; border-radius:50%; background:#fef3c7; }
.tbm-label { display:block; font-weight:600; font-size:.875rem; margin:22px 0 8px; }
#tbmBusSearch, .tbm-summary-filters select { width:100%; border:1px solid var(--border); border-radius:8px; padding:10px; background:var(--surface-2); color:var(--text); font:inherit; font-size:.875rem; }
.tbm-trams { display:flex; flex-wrap:wrap; gap:8px; }
.tbm-tram { display:flex; gap:7px; align-items:center; border:1px solid var(--border); border-radius:8px; padding:7px 9px; cursor:pointer; }
.tbm-route-badge { display:inline-flex; justify-content:center; align-items:center; min-width:27px; height:26px; padding:0 5px; color:#fff; background:var(--line-color,#007f8b); border-radius:5px; font-weight:700; font-size:.8125rem; text-shadow:0 1px 3px #000a; }
.tbm-bus-tools { display:flex; justify-content:space-between; align-items:center; margin:8px 0; }
.tbm-bus-choices { height:330px; overflow-y:auto; border-block:1px solid var(--border); }
.tbm-bus-choice { display:flex; align-items:center; gap:10px; padding:9px 5px; border-bottom:1px solid var(--border); cursor:pointer; font-size:.875rem; }
.tbm-bus-choice:hover { background:var(--surface-2); }
.tbm-bus-choice input, .tbm-tram input { accent-color:var(--primary); width:16px; height:16px; flex:none; }
.tbm-bus-choice .tbm-route-name { flex:1; }
.tbm-route-count { font-size:.75rem; color:var(--warn); }
.tbm-summary-filters { display:flex; gap:18px; margin:16px 0; }
.tbm-summary-filters label { min-width:250px; font-size:.875rem; font-weight:600; }
.tbm-summary-filters select { display:block; margin-top:7px; }
.tbm-alert { padding:18px 0; border-top:1px solid var(--border); }
.tbm-alert-top { display:flex; justify-content:space-between; gap:18px; color:var(--primary); font-size:.875rem; }
.tbm-tag { color:var(--muted); font-size:.75rem; white-space:nowrap; }
.tbm-alert h3 { font-size:1rem; margin:7px 0; font-weight:650; }
.tbm-alert p { margin:6px 0 10px; }
.tbm-alert details summary { color:var(--primary); font-size:.875rem; cursor:pointer; }
.tbm-message { white-space:pre-wrap; overflow-wrap:anywhere; padding:14px; background:var(--surface-2); border-radius:8px; margin:12px 0; line-height:1.65; font-size:.9375rem; }
#tbmDetailDialog { width:min(760px,90vw); max-height:85vh; overflow-y:auto; padding:24px; border:1px solid var(--border); border-radius:16px; background:var(--surface); color:var(--text); }
#tbmDetailDialog::backdrop { background:rgba(0,0,0,.5); }
.tbm-dialog-head { display:flex; gap:20px; justify-content:space-between; align-items:center; margin-bottom:12px; }
.tbm-dialog-head h2 { font-size:1.3rem; }
.tbm-alert-pin { width:20px; height:20px; border-radius:50%; background:#fef3c7; color:#92400e; border:2px solid #b45309; font:bold 14px/16px system-ui; text-align:center; }
#tbmPage button:focus-visible, #tbmPage input:focus-visible, #tbmPage select:focus-visible, #tbmPage summary:focus-visible { outline:3px solid var(--primary); outline-offset:3px; }
@media(max-width:950px) { .tbm-grid { grid-template-columns:minmax(0,1fr) 270px; } }

/* La carte et la sélection des lignes gardent toute la largeur sur téléphone. */
@media (max-width:899px) {
  .tbm-grid { grid-template-columns:minmax(0,1fr); gap:16px; }
  .tbm-grid > .card { min-width:0; }
  .tbm-map-card .card-head { align-items:flex-start; gap:12px; }
  .tbm-map-actions { width:100%; justify-content:flex-start; gap:8px; }
  .tbm-summary-filters { flex-wrap:wrap; }
  .tbm-summary-filters label { flex:1; min-width:0; }
}

@media (max-width:639px) {
  .rb-centre-ville .topbar-inner { gap:6px; }
  .rb-centre-ville .site-brand { flex:1; min-width:0; gap:6px; font-size:.9375rem; }
  .rb-centre-ville .site-brand > span { overflow:hidden; text-overflow:ellipsis; }
  .rb-centre-ville .updated { flex:none; gap:4px; }
  .rb-centre-ville .theme-toggle, .rb-centre-ville .refresh { flex:none; width:44px; min-height:44px; }
  #tbmPage .card { padding:14px; }
  #tbmPage .card-head { gap:10px; }
  #tbmPage .card-head h2 { font-size:1.125rem; line-height:1.3; }
  .tbm-status { padding:10px 12px; margin-bottom:16px; overflow-wrap:anywhere; }
  .tbm-map-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  #tbmPage .tbm-text-button { min-height:44px; padding:8px; border:1px solid var(--border); border-radius:8px; background:var(--surface-2); }
  .tbm-map-actions .tbm-text-button { height:100%; font-size:.8125rem; padding:8px 4px; }
  #tbmMap { height:360px; height:clamp(280px,50svh,400px); }
  .tbm-legend { gap:8px 16px; }
  .tbm-legend span { min-width:0; }
  .tbm-legend i, .tbm-route-badge, .tbm-route-count { flex:none; }
  .tbm-trams { margin-top:12px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
  .tbm-tram { min-height:44px; justify-content:center; padding:8px 4px; }
  #tbmBusSearch, .tbm-summary-filters select { min-height:44px; font-size:1rem; min-width:0; }
  .tbm-bus-choices { height:264px; }
  .tbm-bus-choice { min-height:44px; }
  .tbm-bus-choice .tbm-route-name { min-width:0; overflow-wrap:anywhere; }
  .tbm-bus-tools { gap:8px; }
  .tbm-summary-filters { flex-direction:column; gap:12px; }
  .tbm-alert-top { flex-direction:column; gap:4px; }
  .tbm-tag { white-space:normal; }
  #tbmPage .tbm-alert, #tbmPage .tbm-sources, .tbm-news-list { overflow-wrap:anywhere; }
  #tbmDetailDialog { width:calc(100% - 24px); max-width:none; max-height:85dvh; padding:16px; }
  .tbm-dialog-head { align-items:flex-start; gap:10px; }
  .tbm-dialog-head h2 { min-width:0; font-size:1.125rem; }
  .tbm-dialog-head form { flex:none; }
  #tbmPage .tbm-map-card:fullscreen, #tbmPage .tbm-map-card.tbm-fullscreen {
    height:100dvh;
    padding: max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
  }
  #tbmMap .leaflet-control-zoom a { width:44px; height:44px; line-height:44px; }
}