/* =========================================================================
   Re-volta v3 – układ strony (tylko strony z przerobioną treścią)
   Kontener .rv3-container i kolumna strony (.rv3-page, .rv3-main) są w powloka.css – też nad starą treścią.
   ========================================================================= */

/* Treść z panelem bocznym (filtry). Panel 240–270px, treść reszta; poniżej ~760px
   panel sam spada nad treść (flex-wrap). */
.rv3-layout {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rv3-main-gap);
  padding-top: 18px;
  padding-bottom: var(--rv3-space-14);
  flex: 1;
}
.rv3-layout__aside {
  flex: 1 1 240px;
  max-width: var(--rv3-sidebar);
  min-width: 0;
}
.rv3-layout__main {
  flex: 3 1 460px;
  min-width: 0;
}
/* Treść bez panelu, ale z czytelną szerokością tekstu (forum, opisy, pomoc) */
.rv3-layout__text {
  flex: 1 1 100%;
  max-width: var(--rv3-text-max);
  min-width: 0;
}
.rv3-layout__full {
  flex: 1 1 100%;
  min-width: 0;
}

/* Nagłówek strony: tytuł i licznik po lewej, narzędzia (widok, sortowanie) po prawej */
.rv3-pagehead {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--rv3-space-5);
  margin-bottom: var(--rv3-space-9);
}
.rv3-pagehead__tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--rv3-space-4);
}

/* Siatka kart: auto-fill – 1 czy 3 karty nie rozciągają się na całą szerokość */
.rv3-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(var(--rv3-card-min), 1fr));
  gap: var(--rv3-cards-gap);
}
.rv3-stack {
  display: flex;
  flex-direction: column;
  gap: var(--rv3-cards-gap);
}
/* Sekcje jedna pod drugą */
.rv3-sections {
  display: flex;
  flex-direction: column;
  gap: var(--rv3-space-11); /* 28px – wyraźniej rozdziela panele i paski zajawek */
}

@media (max-width: 640px) {
  .rv3-layout__aside {
    max-width: none;
    flex-basis: 100%;
  }
  /* Lista na telefonie wychodzi poza margines – zdjęcia na całą szerokość, karty bez
     bocznych ramek i zaokrągleń */
  .rv3-bleed {
    margin-left: calc(-1 * var(--rv3-gutter));
    margin-right: calc(-1 * var(--rv3-gutter));
  }
  .rv3-bleed .rv3-card {
    border-radius: 0;
    border-left: none;
    border-right: none;
  }
}