/* Admin konzola: na namizju uporabi celotno razpoložljivo širino zaslona,
   vendar noben notranji flex element ne sme razširiti strani čez viewport. */
@media (min-width: 768px) {
  main.max-w-7xl:has(aside nav) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow-x: clip;
  }

  /* Stari admin layout uporablja negativne horizontalne margine, ki so po
     raztegu glavnega main elementa povzročile širino večjo od viewporta. */
  main.max-w-7xl:has(aside nav) > div:has(> aside nav) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
    overflow-x: clip;
  }

  /* Flex vsebina na desni mora imeti min-width: 0. Brez tega lahko široki
     grafi ali tabele določijo minimalno širino celotnega dashboarda in ga
     potisnejo čez desni rob zaslona. */
  main.max-w-7xl:has(aside nav) > div:has(> aside nav) > aside {
    flex: 0 0 18rem !important;
    width: 18rem !important;
    max-width: 18rem !important;
  }

  main.max-w-7xl:has(aside nav) > div:has(> aside nav) > main {
    flex: 1 1 0% !important;
    width: auto !important;
    max-width: calc(100% - 18rem) !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow-x: hidden;
  }

  /* Novejše admin strani imajo dodatni 1500 px omejevalnik. Odstranimo ga samo
     znotraj admin pogleda, zato modali in javne strani ohranijo svoje širine. */
  main.max-w-7xl:has(aside nav) [class~="max-w-[1500px]"] {
    max-width: none !important;
  }
}

/* Na večjih zaslonih admin ostane nekoliko bolj kompakten. */
@media (min-width: 1100px) {
  main.max-w-7xl:has(aside nav) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    zoom: 0.9;
  }
}

/* Admin sidebar: sekcije so namenoma prikazane kot čist, odprt seznam namesto
   zbirke kartic. Hierarhijo ohranimo z ločilnimi črtami, zamikom in tanko
   navpično vodilno črto pri odprti sekciji. */
main.max-w-7xl:has(aside nav) [data-admin-nav-group] {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

main.max-w-7xl:has(aside nav) [data-admin-nav-group] + [data-admin-nav-group] {
  margin-top: 0.25rem !important;
  padding-top: 0.35rem !important;
  border-top: 1px solid rgb(241 245 249) !important;
}

main.max-w-7xl:has(aside nav) [data-admin-nav-group] > button {
  padding: 0.65rem 0.5rem !important;
  border-radius: 0.5rem !important;
  background: transparent !important;
}

main.max-w-7xl:has(aside nav) [data-admin-nav-group] > button:hover {
  background: rgb(248 250 252) !important;
}

main.max-w-7xl:has(aside nav) [data-admin-nav-group-content] {
  margin-left: 0.5rem !important;
  padding-left: 0.65rem !important;
  padding-right: 0 !important;
  padding-bottom: 0.45rem !important;
  border-left: 2px solid rgb(241 245 249);
}

main.max-w-7xl:has(aside nav) [data-admin-nav-group-content] > button,
main.max-w-7xl:has(aside nav) [data-admin-nav-group-content] > div > button {
  border-radius: 0.55rem !important;
  box-shadow: none !important;
}

/* Urejevalnik gajbic: glavni naslovni panel naj bo ena sama mirna barva.
   Tailwind gradient odstranimo neposredno, brez posega v ostale admin strani. */
main.max-w-7xl:has(aside nav) .bg-gradient-to-r.from-orange-900.via-slate-900.to-slate-950,
.bg-gradient-to-r.from-orange-900.via-slate-900.to-slate-950 {
  background: rgb(15 23 42) !important;
  background-image: none !important;
  background-color: rgb(15 23 42) !important;
}

/* Časovna os prihodnjih dostav: na telefonu filter postane kompaktna mreža.
   Tako noben zapis ne more širiti kartice oziroma strani čez viewport. */
@media (max-width: 639px) {
  .space-y-6 > .flex.flex-col.justify-between.gap-4.bg-white {
    min-width: 0 !important;
    overflow: hidden !important;
  }

  .space-y-6 > .flex.flex-col.justify-between.gap-4.bg-white > .flex.items-center.gap-1.bg-slate-100 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    align-self: stretch !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .space-y-6 > .flex.flex-col.justify-between.gap-4.bg-white > .flex.items-center.gap-1.bg-slate-100 > button {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    text-align: center !important;
  }

  .space-y-6 > .flex.flex-col.justify-between.gap-4.bg-white > .flex.items-center.gap-1.bg-slate-100 > button:last-child {
    grid-column: 1 / -1 !important;
  }
}