/* TOP20 Wszech Czasów - V2.4. Korekta oryginalnego nagłówka.
   Działa na wszystkich podstronach. Nie modyfikuje zasady wyliczania terminów.
   Bazuje na istniejącym app.css i top20-editorial.css, bez nowych szablonów. */

@media (min-width:1001px) {
  .site-header .site-header__inner {
    gap: 10px;
    min-height: 76px;
  }
  .site-header .brand {width: 132px; flex:0 0 132px}
  .site-header .broadcast-countdown {
    flex: 0 0 236px;
    min-width: 0;
    min-height: 54px;
    padding: 7px 9px;
    gap: 7px;
    grid-template-columns: 104px minmax(0,1fr);
    border-radius: 12px;
  }
  .site-header .broadcast-countdown__intro {display:block; padding-right: 7px}
  .site-header .broadcast-countdown__intro span{font-size:.64rem}
  .site-header .broadcast-countdown__intro strong{font-size:.63rem;line-height:1.3}
  .site-header .broadcast-countdown__clock{gap:2px}
  .site-header .broadcast-countdown__clock > span{min-width:22px}
  .site-header .broadcast-countdown__clock b{font-size:.91rem}
  .site-header .broadcast-countdown__clock i{font-size:.8rem}
  .site-header .broadcast-countdown__clock small{font-size:.48rem}
  .site-header .main-nav{gap:0; min-width:0; margin-left:auto}
  .site-header .main-nav > a,
  .site-header .nav-more > button {
    padding:0 8px;
    min-height:42px;
    font-size:.84rem;
    border-radius:8px;
    white-space:nowrap;
  }
  .site-header .main-nav > .nav-home {display:none}
  .site-header .nav-submit__long {display:none}
  .site-header .header-actions{gap:7px; flex:0 0 auto}
  .site-header .status-chip{padding:8px 10px; font-size:.7rem; gap:7px}
  .site-header .header-actions .button{min-height:42px; padding:0 13px; font-size:.83rem}
  .site-header .nav-toggle{display:none}
}

/* Przy średnich szerokościach zachowujemy istotne akcje (Głosowanie, Słuchaj)
   zamiast ściskać sześć pozycji nawigacji w jednym wierszu. */
@media (min-width:1001px) and (max-width:1180px){
  .site-header .status-chip{display:none}
  .site-header .broadcast-countdown {flex-basis:214px;grid-template-columns:93px minmax(0,1fr)}
  .site-header .brand{width:125px;flex-basis:125px}
  .site-header .main-nav > a,.site-header .nav-more > button{padding-inline:7px}
}

/* Układ telefon/tablet: pierwszy wiersz - logo, odsłuch i menu.
   Drugi - czytelny termin audycji; nawigacja rozwija się poniżej nagłówka. */
@media (max-width:1000px){
  .site-header .site-header__inner {
    display:flex; flex-wrap:wrap; align-items:center;
    gap:8px; padding:8px 0 9px; min-height:0;
  }
  .site-header .brand {order:1;width:115px;flex:0 0 115px}
  .site-header .header-actions {order:2;display:flex;align-items:center;margin-left:auto;gap:0}
  .site-header .header-actions .status-chip {display:none}
  .site-header .header-actions .button {
    display:inline-flex; min-height:40px; width:auto; padding:0 13px;
    font-size:.82rem; white-space:nowrap; border-radius:9px;
  }
  .site-header .header-actions .button::before {content:none!important}
  .site-header .nav-toggle {order:3;display:block;margin-left:0;width:40px;height:40px;border-radius:9px;flex:0 0 40px}
  .site-header .broadcast-countdown {
    order:4;flex:1 1 100%;width:100%;max-width:none;min-width:0;
    min-height:39px; padding:5px 10px; border-radius:7px;
    display:flex;justify-content:space-between;align-items:center; gap:10px;
  }
  .site-header .broadcast-countdown__intro {
    display:flex;align-items:baseline;min-width:0;gap:8px;padding:0;border:0;
  }
  .site-header .broadcast-countdown__intro span {flex:0 0 auto;font-size:.66rem;white-space:nowrap}
  .site-header .broadcast-countdown__intro strong {
    margin:0;font-size:.68rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;
  }
  .site-header .broadcast-countdown__clock{flex:0 0 auto;gap:3px}
  .site-header .broadcast-countdown__clock > span{min-width:22px}
  .site-header .broadcast-countdown__clock b{font-size:.82rem}
  .site-header .broadcast-countdown__clock small{font-size:.42rem;margin-top:1px}
  .site-header .countdown-seconds,.site-header .countdown-seconds-separator{display:none!important}
  .site-header .broadcast-countdown__note {display:none}
  .site-header .broadcast-countdown--unset .broadcast-countdown__intro {display:flex}
  .site-header .main-nav {
    position:absolute;top:100%;left:12px;right:12px;
    order:5;display:none;margin:0;padding:10px;
    max-height:calc(100dvh - 115px);overflow:auto;
    border-radius:10px;background:#171515;border:1px solid var(--line);box-shadow:var(--shadow);
  }
  .site-header .main-nav.is-open{display:grid;gap:2px}
  .site-header .main-nav > a,
  .site-header .nav-more > button {
    display:flex;align-items:center;justify-content:flex-start;
    min-height:44px;width:100%;padding:0 12px;white-space:normal;
    font-size:.91rem;
  }
  .site-header .main-nav > .nav-home{display:flex}
  .site-header .nav-submit__long{display:inline}
  .site-header .nav-more__menu {position:static;margin-top:6px;box-shadow:none}
}

@media (max-width:440px){
  .site-header .brand {width:100px;flex-basis:100px}
  .site-header .header-actions .button {min-height:38px;padding:0 10px;font-size:.78rem}
  .site-header .nav-toggle {width:38px;height:38px;flex-basis:38px}
  .site-header .broadcast-countdown {gap:5px;padding:5px 7px}
  .site-header .broadcast-countdown__intro {gap:5px}
  .site-header .broadcast-countdown__intro span{font-size:.6rem}
  .site-header .broadcast-countdown__intro strong{font-size:.62rem}
  .site-header .broadcast-countdown__clock{gap:2px}
  .site-header .broadcast-countdown__clock > span{min-width:17px}
  .site-header .broadcast-countdown__clock b{font-size:.72rem}
  .site-header .broadcast-countdown__clock small{font-size:.39rem}
  .site-header .broadcast-countdown__clock i{font-size:.7rem}
}

.site-header a:focus-visible,
.site-header button:focus-visible {outline:2px solid #ff7777; outline-offset:2px}
/* Bardzo wąskie telefony: pełny termin zamiast uciętej godziny. */
@media (max-width:350px) {
  .site-header .broadcast-countdown {flex-wrap:wrap; row-gap:2px;}
  .site-header .broadcast-countdown__intro {flex:1 1 100%;}
  .site-header .broadcast-countdown__intro strong {white-space:normal;overflow:visible;text-overflow:clip;font-size:.64rem;}
  .site-header .broadcast-countdown__clock {flex:1 1 100%;justify-content:flex-start;}
  .site-header .broadcast-countdown--unset .broadcast-countdown__intro{flex:1 1 100%}
}