/* RadarČeska — Desktop Variant B v2.2.0
   Final approved desktop direction.
   Desktop only (>= 821 px). Mobile intentionally untouched. */

@media (min-width:821px){

  /* =========================================================
     1) TOP SHELL — no shared grey/white slab
     ========================================================= */
  .top-shell{
    top:14px;
    left:18px;
    right:18px;
    pointer-events:none;
  }

  .brand-row{
    position:relative;
    display:flex;
    align-items:center;
    gap:7px;
    width:100%;
    min-height:44px;
    pointer-events:none;
  }

  .brand,
  .brand-row .layer-chips,
  .brand-row .top-menu,
  .brand-row .search-wrap,
  .rc-desktop-search-toggle-v220{
    pointer-events:auto;
  }

  /* Logo: slightly smaller mark, stronger wordmark. */
  .brand{
    flex:0 0 auto;
    height:42px;
    gap:8px;
    margin-right:4px;
    text-shadow:0 1px 9px rgba(255,255,255,.92);
  }

  .brand-mark{
    width:34px;
    height:34px;
    filter:drop-shadow(0 2px 8px rgba(30,88,77,.12));
  }

  .brand-text{
    font-size:18px;
    line-height:1;
    font-weight:800;
    letter-spacing:-.035em;
    color:#20373b;
  }

  .brand-domain{
    font-size:.72em;
    font-weight:760;
    color:#789095;
  }

  /* Main modes are individual pills only — no outer strip. */
  .brand-row .layer-chips{
    display:flex;
    flex:0 1 auto;
    align-items:center;
    gap:5px;
    margin:0;
    padding:0;
    max-width:none;
    overflow:visible;
    scrollbar-width:none;
  }

  .brand-row .layer-chips::-webkit-scrollbar{
    display:none;
  }

  .brand-row .layer-chip{
    height:38px;
    min-width:0;
    padding:0 12px;
    gap:0;
    border:1px solid rgba(38,67,72,.09);
    border-radius:12px;
    background:rgba(255,255,255,.80);
    color:#334c51;
    box-shadow:0 4px 15px rgba(30,52,57,.065);
    backdrop-filter:blur(12px) saturate(1.04);
    -webkit-backdrop-filter:blur(12px) saturate(1.04);
    font-size:13px;
    line-height:1;
    font-weight:760;
    letter-spacing:-.015em;
    transition:background-color .15s ease,border-color .15s ease,color .15s ease,transform .08s ease,box-shadow .15s ease;
  }

  .brand-row .layer-chip .chip-icon{
    display:none;
  }

  .brand-row .layer-chip:hover{
    transform:translateY(-1px);
    background:rgba(255,255,255,.94);
    border-color:rgba(48,78,83,.14);
    box-shadow:0 6px 18px rgba(30,52,57,.085);
  }

  .brand-row .layer-chip.is-active{
    color:#24594f;
    background:rgba(224,239,235,.94);
    border-color:rgba(62,113,102,.18);
    box-shadow:0 4px 14px rgba(36,83,74,.075);
  }

  .brand-row .layer-chip.is-coming{
    opacity:.80;
  }

  /* Source status is still updated by core but is no longer a desktop header item. */
  .brand-row #sourcePill{
    display:none;
  }

  /* Search is represented by one bubble. Input opens only on demand. */
  .rc-desktop-search-toggle-v220{
    flex:0 0 auto;
    margin-left:auto;
    width:40px;
    height:40px;
    padding:0;
    display:grid;
    place-items:center;
    border:1px solid rgba(38,67,72,.10);
    border-radius:12px;
    background:rgba(255,255,255,.82);
    color:#41595e;
    box-shadow:0 4px 15px rgba(30,52,57,.065);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    cursor:pointer;
    transition:.15s ease;
  }

  .rc-desktop-search-toggle-v220:hover,
  .rc-desktop-search-toggle-v220[aria-expanded="true"]{
    background:rgba(255,255,255,.96);
    color:#24594f;
    border-color:rgba(62,113,102,.18);
    transform:translateY(-1px);
  }

  .rc-desktop-search-toggle-v220 svg{
    width:18px;
    height:18px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.9;
    stroke-linecap:round;
  }

  .brand-row .search-wrap{
    position:absolute;
    top:48px;
    right:48px;
    z-index:45;
    width:330px;
    max-width:min(330px,calc(100vw - 80px));
    height:42px;
    margin:0;
    border-radius:13px;
    background:rgba(255,255,255,.965);
    border-color:rgba(40,68,73,.11);
    box-shadow:0 12px 34px rgba(24,49,54,.14);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-6px) scale(.985);
    transform-origin:top right;
    transition:opacity .14s ease,transform .14s ease,visibility .14s ease;
  }

  .top-shell.is-desktop-search-open .search-wrap{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0) scale(1);
  }

  .brand-row .search-icon{
    width:16px;
    height:16px;
    margin-left:13px;
  }

  .brand-row .search-input{
    padding:0 13px 0 9px;
    font-size:12.5px;
  }

  .brand-row .search-suggestions{
    top:49px;
    border-radius:13px;
    box-shadow:0 16px 42px rgba(25,49,54,.16);
  }

  /* Burger remains the last control on the right. */
  .brand-row .top-menu{
    flex:0 0 auto;
    justify-self:auto;
    width:40px;
    height:40px;
    margin-left:1px;
    border-radius:12px;
    background:rgba(255,255,255,.82);
    border-color:rgba(38,67,72,.10);
    box-shadow:0 4px 15px rgba(30,52,57,.065);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }

  .brand-row .top-menu:hover{
    background:rgba(255,255,255,.96);
  }

  /* =========================================================
     2) WEATHER SUBSECTIONS — compact individual pills
        Živě / Radar / Výhled / Teplota / Srážky / Mraky / Vítr / Bouřky
     ========================================================= */
  #weatherViewNav.rc-desktop-weather-nav-v220{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    width:max-content;
    max-width:calc(100vw - 120px);
    min-height:0;
    margin-top:8px;
    padding:0;
    gap:5px;
    overflow:visible;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    pointer-events:auto;
  }

  #weatherViewNav.rc-desktop-weather-nav-v220 .weather-view-tab{
    flex:0 0 auto;
    min-width:0;
    width:auto;
    height:34px;
    padding:0 11px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(38,67,72,.085);
    border-radius:11px;
    background:rgba(255,255,255,.78);
    color:#40575c;
    box-shadow:0 3px 12px rgba(30,52,57,.055);
    text-align:center;
    transition:background-color .14s ease,border-color .14s ease,color .14s ease,transform .08s ease;
  }

  #weatherViewNav.rc-desktop-weather-nav-v220 .weather-view-tab:hover{
    transform:translateY(-1px);
    background:rgba(255,255,255,.94);
    border-color:rgba(49,78,83,.13);
  }

  #weatherViewNav.rc-desktop-weather-nav-v220 .weather-tab-symbol,
  #weatherViewNav.rc-desktop-weather-nav-v220 .weather-tab-copy small{
    display:none;
  }

  #weatherViewNav.rc-desktop-weather-nav-v220 .weather-tab-copy{
    display:block;
    min-width:0;
  }

  #weatherViewNav.rc-desktop-weather-nav-v220 .weather-tab-copy b{
    display:block;
    margin:0;
    font-size:11.5px;
    line-height:1;
    font-weight:780;
    letter-spacing:-.01em;
    color:inherit;
    white-space:nowrap;
  }

  #weatherViewNav.rc-desktop-weather-nav-v220 .weather-view-tab.is-active{
    color:#205c50;
    background:rgba(222,239,234,.94);
    border-color:rgba(57,112,100,.18);
    box-shadow:0 3px 12px rgba(37,82,73,.06);
  }

  #weatherViewNav.rc-desktop-weather-nav-v220 .weather-view-tab.is-active:after{
    content:none;
  }

  /* Other mode navs stay independent, but line up visually below row one. */
  #trafficViewNav,
  #trainViewNav{
    margin-top:8px;
  }

  /* =========================================================
     3) RIGHT MAP TOOLS — individual bubbles only
     ========================================================= */
  .map-actions{
    z-index:72;
    right:18px;
    top:50%;
    bottom:auto;
    transform:translateY(-44%);
    display:flex;
    flex-direction:column;
    gap:7px;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
  }

  .map-actions .map-action{
    width:42px;
    height:42px;
    min-width:42px;
    min-height:42px;
    padding:0;
    border:1px solid rgba(38,67,72,.10);
    border-radius:13px;
    background:rgba(255,255,255,.88);
    color:#395258;
    box-shadow:0 5px 17px rgba(30,52,57,.075);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }

  .map-actions .map-action:hover{
    transform:translateY(-1px);
    background:rgba(255,255,255,.98);
    border-color:rgba(49,78,83,.15);
    box-shadow:0 7px 20px rgba(30,52,57,.10);
  }

  .map-actions .map-action svg{
    width:19px;
    height:19px;
  }

  .map-actions .map-zoom-action{
    font-size:22px;
    font-weight:580;
  }

  /* Text must not turn right toolbar items into wide pills. */
  .map-actions #touristMapBtn .tourist-map-state,
  .map-actions #touristPlannerBtn .tourist-planner-state{
    display:none;
  }

  .map-actions #touristMapBtn,
  .map-actions #touristPlannerBtn{
    width:42px;
    min-width:42px;
    height:42px;
    border-radius:13px;
  }

  .map-actions #touristMapBtn[aria-pressed="true"],
  .map-actions #touristPlannerBtn[aria-pressed="true"],
  .map-actions #touristPlannerBtn.is-active{
    color:#275d52;
    background:rgba(221,238,233,.96);
    border-color:rgba(65,112,102,.18);
  }

  /* =========================================================
     4) PLANNER — approved B feel, compact desktop dock
     ========================================================= */
  .rc-tourist-planner-v211{
    left:18px;
    top:128px;
    bottom:auto;
    width:352px;
    max-width:352px;
    max-height:calc(100vh - 250px);
    border:1px solid rgba(45,68,72,.10);
    border-radius:17px;
    background:rgba(249,251,250,.965);
    box-shadow:0 14px 38px rgba(28,48,52,.13),0 2px 8px rgba(28,48,52,.045);
    backdrop-filter:blur(18px) saturate(1.05);
    -webkit-backdrop-filter:blur(18px) saturate(1.05);
  }

  .rc-tourist-planner-v211 .rc-tourist-planner-v211-head{
    min-height:50px;
    padding:7px 8px 7px 13px;
  }

  .rc-tourist-planner-v211 .rc-tourist-planner-v211-title strong{
    font-size:12.8px;
    font-weight:780;
  }

  .rc-tourist-planner-v211 .rc-tourist-planner-v211-title small{
    font-size:8.5px;
  }

  .rc-tourist-planner-v211 .rc-tourist-planner-v211-body{
    padding:9px 10px 10px;
    max-height:calc(100vh - 310px);
    overflow:auto;
    scrollbar-width:thin;
  }

  .rc-tourist-planner-v211 .rc-tourist-planner-v211-mode{
    min-height:36px;
    font-size:10px;
  }

  .rc-tourist-planner-v211 .rc-tourist-planner-v211-step{
    min-height:32px;
    margin:7px 1px 5px;
    font-size:9.7px;
  }

  .rc-tourist-planner-v211 .rc-tourist-planner-v211-stat{
    min-height:45px;
  }

  .rc-tourist-planner-v211 .rc-tourist-planner-v211-stat strong{
    font-size:12px;
  }

  .rc-tourist-planner-v211 .rc-tourist-planner-v211-actions{
    gap:5px;
    margin-top:6px;
  }

  .rc-tourist-planner-v211 .rc-tourist-planner-v211-action{
    min-height:36px;
    border-radius:9px;
    font-size:9px;
  }

  .rc-tourist-planner-v211 .rc-tourist-planner-v211-iconbtn{
    width:34px;
    height:34px;
    border-radius:10px;
  }

  /* =========================================================
     5) BURGER utilities added by final B runtime
     ========================================================= */
  .main-menu-nav .rc-menu-utility-v220{
    border-top:1px solid rgba(25,63,70,.07);
  }

  .main-menu-nav .rc-menu-utility-v220 + .rc-menu-utility-v220{
    border-top:0;
  }

  .main-menu-nav .rc-menu-coming-v220{
    opacity:.68;
    cursor:default;
  }

  .main-menu-nav .rc-menu-coming-v220 em{
    font-size:9px;
    font-style:normal;
    color:#819398;
  }
}

/* Wider desktops get only a tiny bit more breathing room. */
@media (min-width:1500px){
  .brand-row .layer-chip{
    padding-left:13px;
    padding-right:13px;
    font-size:13.2px;
  }

  #weatherViewNav.rc-desktop-weather-nav-v220 .weather-view-tab{
    padding-left:12px;
    padding-right:12px;
  }

  #weatherViewNav.rc-desktop-weather-nav-v220 .weather-tab-copy b{
    font-size:11.8px;
  }

  .rc-tourist-planner-v211{
    width:360px;
    max-width:360px;
  }
}