/* Radar Česka V5.7.6 · responsive desktop live + one radar legend + clean scrub UX
   Scope: tablet/small-desktop weather surfaces and desktop radar UX. Mobile <=700px stays V5.7.4. */

/* One radar legend means one radar legend. The old generic model legend was still
   able to render the same dBZ palette while the V5 renderer owned #radarV5Legend. */
#app.radar-engine-v5-active #modelLegend{display:none!important}

/* The floating dBZ-on-hover card duplicated the legend + clicked PointCast and
   also generated point API traffic while the timeline was being scrubbed. */
#app[data-rc-pointer-inspector="off"] .rc-radar-pointer-mark,
#app[data-rc-pointer-inspector="off"] .rc-radar-pointer-card{display:none!important}

/* Keep the factual radar legend compact and visually singular. */
#app.radar-engine-v5-active #radarV5Legend{
  width:218px!important;
  padding:8px 10px 7px!important;
}
#app.radar-engine-v5-active #radarV5Legend small{
  white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
}

/* 701–1100 px used to hide Živě completely. At this width it now behaves like
   a floating mobile-style sheet in the lower-right map corner. */
@media (max-width:1100px) and (min-width:701px){
  .app-shell[data-mode="weather"] .live-feed:not([hidden]){
    display:block!important;
    position:absolute!important;
    z-index:92!important;
    right:78px!important;
    left:auto!important;
    top:auto!important;
    bottom:86px!important;
    width:min(326px,calc(100vw - 32px))!important;
    max-height:min(430px,calc(100dvh - 245px))!important;
    overflow:hidden!important;
    padding:12px!important;
    border:1px solid rgba(20,60,70,.09)!important;
    border-radius:19px!important;
    background:rgba(255,255,255,.965)!important;
    -webkit-backdrop-filter:blur(24px) saturate(145%)!important;
    backdrop-filter:blur(24px) saturate(145%)!important;
    box-shadow:0 20px 52px rgba(27,53,63,.16),0 2px 8px rgba(27,53,63,.05)!important;
  }
  /* Radar legend occupies the first lower-right slot, so Živě sits one level above it. */
  #app.radar-engine-v5-active .live-feed:not([hidden]){bottom:158px!important}

  .app-shell[data-mode="weather"] .live-feed-chip:not([hidden]){
    display:flex!important;
    position:absolute!important;
    z-index:92!important;
    right:78px!important;
    left:auto!important;
    top:auto!important;
    bottom:86px!important;
    align-items:center!important;
    gap:7px!important;
    height:36px!important;
    padding:0 12px!important;
    border:1px solid rgba(20,60,70,.09)!important;
    border-radius:12px!important;
    background:rgba(255,255,255,.96)!important;
    -webkit-backdrop-filter:blur(18px)!important;
    backdrop-filter:blur(18px)!important;
    box-shadow:0 12px 32px rgba(27,53,63,.13)!important;
    color:#284b54!important;
    cursor:pointer!important;
  }
  #app.radar-engine-v5-active .live-feed-chip:not([hidden]){bottom:158px!important}
  .live-feed-chip b{font-size:9px!important}.live-feed-chip em{font-style:normal;display:grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#e9f8f5;color:#147864;font-size:7px;font-weight:850}

  .live-feed-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:10px!important;padding:1px 1px 9px!important}
  .live-feed-head>div{display:grid!important;grid-template-columns:10px auto!important;grid-template-rows:auto auto!important;align-items:center!important;column-gap:8px!important;min-width:0!important}
  .live-feed-head .live-feed-pulse{grid-row:1/3;align-self:center}
  .live-feed-head strong{font-size:13px!important;line-height:1!important;letter-spacing:-.02em!important;color:#173943!important}
  .live-feed-head small{margin-top:4px!important;font-size:7.7px!important;color:#81949a!important;white-space:nowrap!important}
  .live-feed-head button{appearance:none!important;border:0!important;width:28px!important;height:28px!important;display:grid!important;place-items:center!important;padding:0!important;border-radius:9px!important;background:#f4f8f8!important;color:#7f9399!important;font-size:18px!important;line-height:1!important;cursor:pointer!important}
  .live-feed-list{display:grid!important;gap:6px!important;max-height:min(306px,calc(100dvh - 330px))!important;overflow:auto!important;overscroll-behavior:contain!important;scrollbar-width:thin!important;padding-right:1px!important}
  .live-feed-item{appearance:none!important;display:grid!important;grid-template-columns:35px minmax(0,1fr) 15px!important;gap:8px!important;align-items:start!important;width:100%!important;padding:9px 8px!important;border:1px solid rgba(17,56,67,.06)!important;border-radius:12px!important;background:rgba(250,252,253,.94)!important;text-align:left!important;cursor:pointer!important}
  .live-feed-item:first-child{background:rgba(239,249,247,.94)!important;border-color:rgba(11,167,142,.10)!important}
  .live-feed-time{padding-top:2px!important;color:#8a9b9f!important;font-size:7.2px!important;font-weight:760!important;font-variant-numeric:tabular-nums!important}
  .live-feed-copy{min-width:0!important;display:grid!important;gap:3px!important}
  .live-feed-copy strong{font-size:9.5px!important;line-height:1.22!important;color:#294851!important;white-space:normal!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
  .live-feed-copy span{font-size:8px!important;line-height:1.34!important;color:#667d84!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
  .live-feed-arrow{padding-top:5px!important;color:#91a5aa!important;font-size:15px!important;line-height:1!important}
  .live-feed-foot{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;margin-top:8px!important;padding:8px 2px 0!important;border-top:1px solid rgba(17,55,66,.07)!important;color:#8a9ba0!important;font-size:7.1px!important}
  .live-feed-foot a{font-size:7.8px!important;font-weight:850!important;color:#147f6d!important;text-decoration:none!important}
  .live-feed-empty,.live-feed-loading{padding:14px 10px!important;border-radius:11px!important;background:#f8fbfb!important;color:#72878e!important;font-size:8.7px!important;line-height:1.4!important;text-align:center!important}
}

/* On narrow desktop/tablet the single radar legend remains above the timeline.
   Živě automatically occupies the row above it when open. */
@media (max-width:1100px) and (min-width:701px){
  #app.radar-engine-v5-active #radarV5Legend{right:16px!important;bottom:78px!important;width:218px!important}
}
