/* Radar Česka V5.7.10 · Compact Nav Width
   Width-only refinement over V5.7.9.
   Goals:
   - mobile primary modes stay readable but stop feeling like five wide cards;
   - desktop weather navigation keeps eight equal sections while using roughly
     one former tab less total width;
   - no change to vertical header size, map, PointCube, Živě or rain insight.
*/

/* ---------- DESKTOP: eight equal, materially shorter weather sections ---------- */
@media (min-width:701px){
  /* V5.7.9 used 850px. 744px is ~87.5%, i.e. almost exactly one old
     eight-column cell reclaimed for the map. */
  .weather-view-nav.weather-navigation-v120{
    width:min(744px,calc(100vw - 32px))!important;
    max-width:min(744px,calc(100vw - 32px))!important;
    gap:1px!important;
  }
  .weather-view-nav.weather-navigation-v120 .weather-view-tab{
    flex:1 1 0!important;
    min-width:0!important;
    max-width:none!important;
    width:auto!important;
    padding:3px 5px!important;
    grid-template-columns:18px minmax(0,1fr)!important;
    gap:4px!important;
  }
  .weather-view-nav.weather-navigation-v120 .weather-tab-symbol{
    width:18px!important;
    height:18px!important;
    border-radius:6px!important;
    font-size:8.5px!important;
  }
  .weather-view-nav.weather-navigation-v120 .weather-tab-copy b{
    font-size:8.7px!important;
    letter-spacing:-.01em!important;
  }
}

/* ---------- MOBILE: five lighter, equal-width primary mode cards ---------- */
@media (max-width:700px){
  .layer-chips{
    max-width:min(362px,calc(100vw - 12px))!important;
    gap:3px!important;
    overflow-x:auto!important;
    justify-content:flex-start!important;
  }
  .layer-chip,
  .layer-chip:nth-of-type(n+4),
  .layer-chip:nth-of-type(n+6),
  .rc-mobile-alert-chip{
    flex:0 0 clamp(64px,17.5vw,70px)!important;
    width:clamp(64px,17.5vw,70px)!important;
    min-width:clamp(64px,17.5vw,70px)!important;
    max-width:70px!important;
    padding:2px 3px!important;
    font-size:7.2px!important;
  }
  .layer-chip .chip-icon{
    width:14px!important;
    height:14px!important;
    min-width:14px!important;
  }
}

@media (max-width:370px){
  .layer-chip,
  .layer-chip:nth-of-type(n+4),
  .layer-chip:nth-of-type(n+6),
  .rc-mobile-alert-chip{
    flex-basis:64px!important;
    width:64px!important;
    min-width:64px!important;
    max-width:64px!important;
    font-size:6.9px!important;
  }
  .layer-chip .chip-icon{
    width:13.5px!important;
    height:13.5px!important;
    min-width:13.5px!important;
  }
}
