/* Obsessive / PANDA ST Mega Menu - v1.4, 2026-10-28
   Scope: tylko desktopowe menu #top_extra, bez zmian mobile/header i bez zmian modułów.
   Wyrównanie paneli działa przez zmienne CSS ustawiane przez obsessive-megamenu-v1.4.js.
*/
@media screen and (min-width: 992px) {
  /* Pasek główny pozostaje taki jak obecnie. Nie zmieniamy jego układu. */
  #top_extra.obs-header-mega-v2 {
    --obs-mega-accent: #e91e63;
    --obs-mega-text: #171717;
    --obs-mega-muted: #6a6a6a;
    --obs-mega-line: #ededed;
    --obs-mega-width: 100vw;
    --obs-mega-left: 0px;
    position: relative;
    z-index: 400;
    border-bottom: 1px solid #f1f1f1;
  }

  /* Boxed megamenu i ograniczone kontenery nie mogą ucinać dropdownów. */
  #top_extra.obs-header-mega-v2 .wide_container,
  #top_extra.obs-header-mega-v2 .boxed_megamenu,
  #top_extra.obs-header-mega-v2 .st_mega_menu_container,
  #top_extra.obs-header-mega-v2 .st_mega_menu_container > .container,
  #top_extra.obs-header-mega-v2 #top_extra_container,
  #top_extra.obs-header-mega-v2 #st_mega_menu_wrap,
  #top_extra.obs-header-mega-v2 .st_mega_menu > .ml_level_0 {
    overflow: visible !important;
  }

  /* Każdy panel otwiera się dokładnie od lewego do prawego brzegu przeglądarki,
     niezależnie od tego, czy "Bielizna" i "Dodatki" mają różne szerokości w PANDA. */
  #top_extra.obs-header-mega-v2 .st_mega_menu > .ml_level_0 > .stmenu_sub {
    position: absolute !important;
    left: var(--obs-mega-left) !important;
    right: auto !important;
    width: var(--obs-mega-width) !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 35px max(26px, calc((100vw - 1320px) / 2)) 39px !important;
    background: #fff !important;
    color: var(--obs-mega-text);
    border: 0 !important;
    border-top: 1px solid var(--obs-mega-line) !important;
    border-radius: 0 !important;
    box-shadow: 0 22px 45px rgba(0, 0, 0, .10) !important;
    max-height: min(73vh, 760px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #d8d8d8 transparent;
    text-align: left;
    z-index: 405;
  }

  /* Bootstrap rows - wyważone rozstawienie już zdefiniowanych kolumn. */
  #top_extra.obs-header-mega-v2 .st_mega_menu > .ml_level_0 > .stmenu_sub > .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
    justify-content: space-between;
    column-gap: 28px;
  }
  #top_extra.obs-header-mega-v2 .st_mega_menu > .ml_level_0 > .stmenu_sub > .row > [class*="col-"] {
    flex-grow: 1;
    max-width: none;
    min-width: 0;
  }

  /* Tytuły sekcji i zwykłe linki w kategoriach / multi-level.
     Nie zmieniamy zagnieżdżenia ani kolejności kategorii. */
  #top_extra.obs-header-mega-v2 .stmenu_sub .ma_level_1,
  #top_extra.obs-header-mega-v2 .stmenu_sub a.ma_level_1,
  #top_extra.obs-header-mega-v2 .stmenu_sub .megamenu-title {
    color: var(--obs-mega-text);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .005em;
    line-height: 1.5;
  }
  #top_extra.obs-header-mega-v2 .stmenu_sub .ma_level_2,
  #top_extra.obs-header-mega-v2 .stmenu_sub .ma_level_3,
  #top_extra.obs-header-mega-v2 .stmenu_sub .ma_item {
    font-size: 13.5px;
    font-weight: 400;
    line-height: 1.7;
    color: #575757;
    transition: color .18s ease;
  }
  #top_extra.obs-header-mega-v2 .stmenu_sub a:hover,
  #top_extra.obs-header-mega-v2 .stmenu_sub a:focus-visible {
    color: var(--obs-mega-accent) !important;
  }
  #top_extra.obs-header-mega-v2 .stmenu_sub a:focus-visible {
    outline: 1px solid var(--obs-mega-accent);
    outline-offset: 3px;
  }
  #top_extra.obs-header-mega-v2 .stmenu_sub .ml_level_1 {
    margin-bottom: 12px;
  }
  #top_extra.obs-header-mega-v2 .stmenu_sub .ml_level_2,
  #top_extra.obs-header-mega-v2 .stmenu_sub .ml_level_3 {
    margin-bottom: 4px;
  }

  /* Cienka kreska na aktywnym elemencie nawigacji – subtelny fashion accent. */
  #top_extra.obs-header-mega-v2 .st_mega_menu > .ml_level_0 > .ma_level_0 {
    transition: color .2s ease;
  }
  #top_extra.obs-header-mega-v2 .st_mega_menu > .ml_level_0:hover > .ma_level_0,
  #top_extra.obs-header-mega-v2 .st_mega_menu > .ml_level_0:focus-within > .ma_level_0 {
    color: var(--obs-mega-accent);
  }
}

/* Tablet/telefon: całe zachowanie menu mobilnego PANDA zostaje bez zmian. */
@media (prefers-reduced-motion: reduce) {
  #top_extra.obs-header-mega-v2 .stmenu_sub a { transition: none !important; }
}
