/* VIENNA V188 — motion/performance + quick community reports.
   Loaded last on purpose: this file owns only the V188 navigation/report surface. */

:root{
  --v188-accent:#F59A62;
  --v188-accent-strong:#D9703F;
  --v188-ink:#202225;
  --v188-muted:#777b82;
  --v188-line:rgba(32,34,37,.10);
  --v188-card:rgba(255,255,255,.975);
}

/* Quick report FAB: it exists only while navigating. The parent used to be hidden
   by older releases, so V188 re-enables only this child instead of the whole toolbar. */
body.body-nav .ws-app .map-tools{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:none!important;
  top:auto!important;
  right:auto!important;
  left:max(10px,calc(env(safe-area-inset-left) + 8px))!important;
  bottom:max(170px,calc(env(safe-area-inset-bottom) + 166px))!important;
  width:auto!important;
  height:auto!important;
  display:block!important;
  z-index:67!important;
}
body.body-nav .ws-app .map-tools>.map-btn{display:none!important}
body.body-nav .ws-app .map-tools>#quickAlertBtn.nav-report-fab{
  pointer-events:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:7px!important;
  width:auto!important;
  min-width:48px!important;
  height:48px!important;
  padding:4px 12px 4px 5px!important;
  border:1px solid rgba(42,43,47,.10)!important;
  border-radius:17px!important;
  background:rgba(255,255,255,.965)!important;
  color:#24262a!important;
  box-shadow:0 10px 28px rgba(20,21,24,.14)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  font:inherit!important;
  font-size:11px!important;
  font-weight:850!important;
  letter-spacing:-.08px!important;
  overflow:hidden!important;
  transition:transform .14s ease,box-shadow .16s ease,background .16s ease!important;
}
body.body-nav .ws-app #quickAlertBtn.nav-report-fab img{
  width:39px!important;
  height:39px!important;
  flex:0 0 39px!important;
  display:block!important;
  object-fit:contain!important;
  filter:none!important;
}
body.body-nav .ws-app #quickAlertBtn.nav-report-fab:active{transform:scale(.955)!important;box-shadow:0 6px 17px rgba(20,21,24,.12)!important}
body:not(.body-nav) .ws-app #quickAlertBtn.nav-report-fab{display:none!important}

/* Report sheet */
.quick-alert-sheet.quick-alert-v188{z-index:120!important}
.quick-alert-v188 .quick-alert-backdrop{background:rgba(10,11,13,.28)!important;backdrop-filter:blur(2px)!important;-webkit-backdrop-filter:blur(2px)!important}
.quick-alert-v188 .quick-alert-card{
  width:min(520px,calc(100% - 18px))!important;
  max-height:min(82dvh,720px)!important;
  padding:7px 12px max(13px,env(safe-area-inset-bottom))!important;
  border:1px solid var(--v188-line)!important;
  border-radius:24px!important;
  background:var(--v188-card)!important;
  color:var(--v188-ink)!important;
  box-shadow:0 22px 60px rgba(23,24,27,.18)!important;
  overflow:auto!important;
  overscroll-behavior:contain!important;
  scrollbar-width:none;
}
.quick-alert-v188 .quick-alert-card::-webkit-scrollbar{display:none}
.quick-alert-v188 .quick-alert-grab{width:34px!important;height:4px!important;margin:1px auto 8px!important;background:rgba(46,47,50,.13)!important}
.quick-alert-v188 .quick-alert-head{padding:2px 2px 7px!important;align-items:flex-start!important}
.quick-alert-v188 .quick-alert-head small{font-size:7.5px!important;font-weight:900!important;letter-spacing:.16em!important;color:var(--v188-accent-strong)!important}
.quick-alert-v188 .quick-alert-head h3{margin:3px 0 2px!important;font-size:21px!important;line-height:1.05!important;letter-spacing:-.55px!important;color:var(--v188-ink)!important}
.quick-alert-v188 .quick-alert-head p{margin:0!important;font-size:10px!important;line-height:1.35!important;color:var(--v188-muted)!important}
.quick-alert-v188 .quick-alert-close{width:36px!important;height:36px!important;flex:0 0 36px!important;border:1px solid rgba(40,42,45,.08)!important;border-radius:12px!important;background:#f5f5f6!important;color:#555960!important;box-shadow:none!important}
.quick-alert-v188 .quick-alert-section-label{margin:6px 3px 5px;font-size:7px;font-weight:900;letter-spacing:.14em;color:#96999f}
.quick-alert-v188 .quick-alert-grid{margin:0!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:7px!important}
.quick-alert-v188 .quick-alert-grid button{
  min-width:0!important;
  min-height:87px!important;
  padding:8px 5px 7px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:4px!important;
  border:1px solid rgba(36,38,42,.075)!important;
  border-radius:16px!important;
  background:#f7f7f8!important;
  color:#2c2e32!important;
  box-shadow:none!important;
  touch-action:manipulation;
}
.quick-alert-v188 .quick-alert-grid button:active{transform:scale(.965)!important;background:#f0f0f2!important}
.quick-alert-v188 .quick-alert-grid button.sending,.quick-alert-v188 .quick-alert-grid button:disabled{opacity:.55!important;pointer-events:none!important}
.quick-alert-v188 .quick-alert-badge{display:grid!important;place-items:center!important;width:48px!important;height:48px!important;flex:0 0 48px!important}
.quick-alert-v188 .quick-alert-art-shell,.quick-alert-v188 .quick-alert-art-pin{display:block!important;width:48px!important;height:48px!important}
.quick-alert-v188 .quick-alert-art-pin{object-fit:contain!important;filter:none!important}
.quick-alert-v188 .quick-alert-badge-shell{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:#fff;border:1px solid rgba(45,47,50,.07);box-shadow:0 4px 12px rgba(27,29,32,.055)}
.quick-alert-v188 .quick-alert-badge-ring,.quick-alert-v188 .quick-alert-badge-face{display:grid;place-items:center;width:100%;height:100%}
.quick-alert-v188 .quick-alert-badge-icon{display:grid;place-items:center;color:var(--v188-accent-strong)}
.quick-alert-v188 .quick-alert-badge-icon .alert-icon-svg{width:25px!important;height:25px!important}
.quick-alert-v188 .quick-alert-label{display:block!important;min-height:21px;font-size:9px!important;font-weight:820!important;line-height:1.12!important;letter-spacing:-.08px!important;text-align:center!important;color:#36383d!important}
.quick-alert-v188 .quick-alert-more{margin-top:8px;border-top:1px solid rgba(45,47,50,.075);padding-top:2px}
.quick-alert-v188 .quick-alert-more summary{min-height:42px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 4px;list-style:none;cursor:pointer;color:#6f737a;font-size:10px;font-weight:800}
.quick-alert-v188 .quick-alert-more summary::-webkit-details-marker{display:none}
.quick-alert-v188 .quick-alert-more[open] summary svg{transform:rotate(180deg)}
.quick-alert-v188 .quick-alert-secondary{padding-top:2px!important}
.quick-alert-v188 .quick-alert-secondary button{min-height:73px!important}
.quick-alert-v188 .quick-alert-secondary .quick-alert-badge{width:39px!important;height:39px!important;flex-basis:39px!important}
.quick-alert-v188 .quick-alert-secondary .quick-alert-badge-shell{width:38px;height:38px;border-radius:12px}
.quick-alert-v188 .quick-alert-secondary .quick-alert-badge-icon .alert-icon-svg{width:22px!important;height:22px!important}
.quick-alert-v188 .quick-alert-status{min-height:16px!important;padding-top:7px!important;color:#71757c!important;font-size:9px!important;font-weight:750!important;text-align:center!important}

/* Premium alert art on the actual map. Same visual weight as the arrival marker. */
.route-marker.alert-marker .alert-premium-art{display:block!important;width:58px!important;height:58px!important;pointer-events:none!important;filter:drop-shadow(0 7px 10px rgba(12,13,15,.20))}
.route-marker.alert-marker .alert-premium-art img{display:block!important;width:58px!important;height:58px!important;object-fit:contain!important;filter:none!important;transform:none!important}
.route-marker.alert-marker:active .alert-premium-art{transform:scale(.94)}

/* Black mode */
html[data-rairo-theme="black"] body.body-nav .ws-app #quickAlertBtn.nav-report-fab{
  background:rgba(24,23,21,.97)!important;
  color:#fff7f1!important;
  border-color:rgba(255,255,255,.08)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.31)!important;
}
html[data-rairo-theme="black"] .quick-alert-v188 .quick-alert-backdrop{background:rgba(0,0,0,.52)!important}
html[data-rairo-theme="black"] .quick-alert-v188 .quick-alert-card{background:linear-gradient(180deg,#1d1b19,#151412)!important;color:#fff8f3!important;border-color:rgba(255,255,255,.085)!important;box-shadow:0 25px 70px rgba(0,0,0,.46)!important}
html[data-rairo-theme="black"] .quick-alert-v188 .quick-alert-grab{background:rgba(255,255,255,.15)!important}
html[data-rairo-theme="black"] .quick-alert-v188 .quick-alert-head h3{color:#fff8f3!important}
html[data-rairo-theme="black"] .quick-alert-v188 .quick-alert-head p,html[data-rairo-theme="black"] .quick-alert-v188 .quick-alert-section-label,html[data-rairo-theme="black"] .quick-alert-v188 .quick-alert-status{color:#aaa5a0!important}
html[data-rairo-theme="black"] .quick-alert-v188 .quick-alert-close{background:#282522!important;color:#f7eee8!important;border-color:rgba(255,255,255,.08)!important}
html[data-rairo-theme="black"] .quick-alert-v188 .quick-alert-grid button{background:#24211f!important;color:#fff7f1!important;border-color:rgba(255,255,255,.075)!important}
html[data-rairo-theme="black"] .quick-alert-v188 .quick-alert-grid button:active{background:#2c2825!important;border-color:rgba(245,154,98,.28)!important}
html[data-rairo-theme="black"] .quick-alert-v188 .quick-alert-label{color:#f5ede7!important}
html[data-rairo-theme="black"] .quick-alert-v188 .quick-alert-badge-shell{background:#2a2724;border-color:rgba(255,255,255,.07);box-shadow:none}
html[data-rairo-theme="black"] .quick-alert-v188 .quick-alert-more{border-color:rgba(255,255,255,.075)}
html[data-rairo-theme="black"] .quick-alert-v188 .quick-alert-more summary{color:#b8b1ab}

/* Adaptive rendering. These classes are applied by the live frame monitor, not by
   device-name guessing. Under load we remove the expensive glass effects first. */
html.rairo-perf-normal body.body-nav .ws-app :is(.nav-maneuver-top,.nav-street-chip,.nav-panel,.traffic-radar,.nav-voice-popover){backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html.rairo-perf-eco .ws-app :is(.nav-maneuver-top,.nav-street-chip,.nav-panel,.traffic-radar,.nav-voice-popover,.sheet,.destination-confirm,.quick-alert-card,.map-btn){backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html.rairo-perf-eco .ws-app :is(.nav-maneuver-top,.nav-street-chip,.traffic-radar,.nav-panel,.floating-speedo){box-shadow:0 5px 15px rgba(0,0,0,.15)!important}
html.rairo-perf-eco .route-marker.alert-marker .alert-premium-art{filter:none!important}
html.rairo-perf-eco .ws-app *{scroll-behavior:auto!important}

@media(max-width:430px){
  body.body-nav .ws-app .map-tools{bottom:max(162px,calc(env(safe-area-inset-bottom) + 158px))!important}
  body.body-nav .ws-app .map-tools>#quickAlertBtn.nav-report-fab{height:46px!important;padding:4px 10px 4px 4px!important;border-radius:16px!important}
  body.body-nav .ws-app #quickAlertBtn.nav-report-fab img{width:37px!important;height:37px!important;flex-basis:37px!important}
  .quick-alert-v188 .quick-alert-card{left:max(6px,env(safe-area-inset-left))!important;right:max(6px,env(safe-area-inset-right))!important;width:auto!important;padding-inline:9px!important}
  .quick-alert-v188 .quick-alert-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important}
  .quick-alert-v188 .quick-alert-grid button{min-height:80px!important;padding:6px 3px!important;border-radius:14px!important}
  .quick-alert-v188 .quick-alert-badge,.quick-alert-v188 .quick-alert-art-shell,.quick-alert-v188 .quick-alert-art-pin{width:43px!important;height:43px!important;flex-basis:43px!important}
  .quick-alert-v188 .quick-alert-label{font-size:8px!important}
}
@media(max-width:360px){
  body.body-nav .ws-app #quickAlertBtn.nav-report-fab span{display:none!important}
  body.body-nav .ws-app .map-tools>#quickAlertBtn.nav-report-fab{width:46px!important;min-width:46px!important;padding:4px!important;justify-content:center!important}
  .quick-alert-v188 .quick-alert-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
  .quick-alert-v188 .quick-alert-grid button{min-height:67px!important;flex-direction:row!important;justify-content:flex-start!important;padding:6px 8px!important;gap:7px!important}
  .quick-alert-v188 .quick-alert-label{min-height:0!important;text-align:left!important;font-size:9px!important}
}
@media(orientation:landscape) and (max-height:520px){
  body.body-nav .ws-app .map-tools{left:auto!important;right:max(10px,calc(env(safe-area-inset-right) + 8px))!important;bottom:max(12px,env(safe-area-inset-bottom))!important}
  .quick-alert-v188 .quick-alert-card{max-width:min(720px,94vw)!important;max-height:92dvh!important}
  .quick-alert-v188 .quick-alert-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}
@media(prefers-reduced-motion:reduce){
  body.body-nav .ws-app #quickAlertBtn.nav-report-fab,.quick-alert-v188 .quick-alert-grid button,.route-marker.alert-marker .alert-premium-art{transition:none!important}
}