/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

body.offcanvas-active {
  #brx-header {
    section {
    }
  }
}

.brxe-offcanvas {
  &.brx-open {
    .brx-offcanvas-inner {
      background-color: var(--white);
      padding-top: var(--headerHeight);

      .brxe-nav-menu {
        width: min(1600px);

        .bricks-nav-menu-wrapper {
          --border-color: rgba(0, 0, 0, 0.5);
        }
      }
    }
  }
}

.brx-submenu-toggle {
  width: 100%;
}

:root {
  --pc-accent: #8f2430;
  --pc-muted: #8a8a8a;
  --pc-gap: 16px;
}

.news-feature {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr;
  grid-template-rows: repeat(6, 1fr);
  gap: var(--pc-gap);
  min-height: 640px;
}

.card__media,
.card__body {
  display: contents;
}
.card {
  position: relative;
  display: grid;
  overflow: hidden;
}
.card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.card__cat {
  color: var(--pc-accent);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.card__meta {
  color: var(--pc-muted);
  font-size: 12px;
}
.card__title {
  font-weight: 700;
  line-height: 1.25;
  margin: 0;
}
.card__title a {
  color: inherit;
  text-decoration: none;
}
.card__title a:hover {
  color: var(--pc-accent);
}
.card__excerpt {
  font-size: 14px;
  color: #555;
  line-height: 1.5;
}

.news-feature > .card:nth-child(1) {
  grid-column: 1;
  grid-row: 1 / -1;
}
.news-feature > .card:nth-child(2) {
  grid-column: 2;
  grid-row: 1 / span 3;
}
.news-feature > .card:nth-child(3) {
  grid-column: 2;
  grid-row: 4 / span 3;
}
.news-feature > .card:nth-child(n + 4):nth-child(-n + 9) {
  grid-column: 3;
}
.news-feature > .card:nth-child(4) {
  grid-row: 1;
}
.news-feature > .card:nth-child(5) {
  grid-row: 2;
}
.news-feature > .card:nth-child(6) {
  grid-row: 3;
}
.news-feature > .card:nth-child(7) {
  grid-row: 4;
}
.news-feature > .card:nth-child(8) {
  grid-row: 5;
}
.news-feature > .card:nth-child(9) {
  grid-row: 6;
}

/* 1) HERO */
.news-feature > .card:nth-child(1) {
  height: 100% !important;
  align-self: stretch !important;
  grid-template-columns: 1fr;
  grid-template-areas: "cat" "meta" "title";
  align-content: end;
  row-gap: 4px;
}
.news-feature > .card:nth-child(1) .card__img {
  position: absolute;
  inset: 0;
  aspect-ratio: auto !important;
  width: 100% !important;
  height: 100% !important;
}
.news-feature > .card:nth-child(1) .card__img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}
.news-feature > .card:nth-child(1)::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.85) 0%,
    rgba(0, 0, 0, 0.15) 55%,
    transparent 75%
  );
  pointer-events: none;
}
.news-feature > .card:nth-child(1) .card__cat {
  grid-area: cat;
  position: relative;
  z-index: 2;
  color: #fff;
  padding: 0 20px;
}
.news-feature > .card:nth-child(1) .card__meta {
  grid-area: meta;
  position: relative;
  z-index: 2;
  color: #fff;
  padding: 0 20px;
}
.news-feature > .card:nth-child(1) .card__title {
  grid-area: title;
  position: relative;
  z-index: 2;
  color: #fff;
  font-size: 26px;
  padding: 0 20px 20px;
}
.news-feature > .card:nth-child(1) .card__excerpt {
  display: none;
}

/* 2) MIJLOC (post 2-3) */
.news-feature > .card:nth-child(2),
.news-feature > .card:nth-child(3) {
  background: #fff;
  grid-template-columns: 1fr;
  grid-template-areas: "img" "cat" "meta" "title";
  row-gap: 4px;
  padding: 0 4px 10px;
}
.news-feature > .card:nth-child(2) .card__img,
.news-feature > .card:nth-child(3) .card__img {
  grid-area: img;
  aspect-ratio: 16/10;
  margin-bottom: 4px;
}
.news-feature > .card:nth-child(2) .card__cat,
.news-feature > .card:nth-child(3) .card__cat {
  grid-area: cat;
}
.news-feature > .card:nth-child(2) .card__meta,
.news-feature > .card:nth-child(3) .card__meta {
  grid-area: meta;
}
.news-feature > .card:nth-child(2) .card__title,
.news-feature > .card:nth-child(3) .card__title {
  grid-area: title;
  font-size: 16px;
}
.news-feature > .card:nth-child(2) .card__excerpt,
.news-feature > .card:nth-child(3) .card__excerpt {
  display: none;
}

/* 3) LISTA (post 4-9) */
.news-feature > .card:nth-child(n + 4):nth-child(-n + 9) {
  grid-template-columns: 64px 1fr;
  grid-template-areas: "img cat" "img meta" "img title";
  column-gap: 10px;
  row-gap: 2px;
  align-items: start;
}
.news-feature > .card:nth-child(n + 4):nth-child(-n + 9) .card__img {
  grid-area: img;
  aspect-ratio: 1/1;
}
.news-feature > .card:nth-child(n + 4):nth-child(-n + 9) .card__cat {
  grid-area: cat;
}
.news-feature > .card:nth-child(n + 4):nth-child(-n + 9) .card__meta {
  grid-area: meta;
}
.news-feature > .card:nth-child(n + 4):nth-child(-n + 9) .card__title {
  grid-area: title;
  font-size: 14px;
}
.news-feature > .card:nth-child(n + 4):nth-child(-n + 9) .card__excerpt {
  display: none;
}

/* RESPONSIVE sub 900px */
@media (max-width: 900px) {
  .news-feature {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 0;
  }
  .news-feature > .card {
    grid-column: auto !important;
    grid-row: auto !important;
    height: auto !important;
  }
  .news-feature > .card:nth-child(1) {
    grid-template-columns: 1fr;
    grid-template-areas: "img" "cat" "meta" "title";
    align-content: start;
    row-gap: 4px;
  }
  .news-feature > .card:nth-child(1) .card__img {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16/10 !important;
    margin-bottom: 4px;
  }
  .news-feature > .card:nth-child(1)::after {
    display: none;
  }
  .news-feature > .card:nth-child(1) .card__cat,
  .news-feature > .card:nth-child(1) .card__meta,
  .news-feature > .card:nth-child(1) .card__title {
    position: static;
    color: inherit;
    padding: 0;
  }
  .news-feature > .card:nth-child(1) .card__title {
    font-size: 20px;
  }
  .news-feature > .card:nth-child(n + 2) {
    grid-template-columns: 84px 1fr;
    grid-template-areas: "img cat" "img meta" "img title";
    column-gap: 10px;
    row-gap: 2px;
  }
  .news-feature > .card:nth-child(n + 2) .card__img {
    aspect-ratio: 1/1;
  }
  .news-feature > .card:nth-child(n + 2) .card__title {
    font-size: 14px;
  }
}

/* ORDINE INVERSATA - hero in coloana din mijloc */
.news-feature.news-feature--reverse {
  grid-template-columns: 1fr 1.6fr 1fr;
}
.news-feature.news-feature--reverse > .card:nth-child(1) {
  grid-column: 2;
}
.news-feature.news-feature--reverse > .card:nth-child(2) {
  grid-column: 1;
  grid-row: 1 / span 3;
}
.news-feature.news-feature--reverse > .card:nth-child(3) {
  grid-column: 1;
  grid-row: 4 / span 3;
}

/* ===================== SPORT-GRID ===================== */
.sport-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--pc-gap);
}

/* item 1-2: hero mic, overlay pe imagine, ocupa jumatate din latime fiecare */
.sport-grid > .card:nth-child(-n + 2) {
  grid-column: span 2;
  aspect-ratio: 16/9;
  grid-template-columns: 1fr;
  grid-template-areas: "cat" "meta" "title";
  align-content: end;
  row-gap: 4px;
}
.sport-grid > .card:nth-child(-n + 2) .card__img {
  position: absolute;
  inset: 0;
  aspect-ratio: auto !important;
  width: 100% !important;
  height: 100% !important;
}
.sport-grid > .card:nth-child(-n + 2) .card__img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}
.sport-grid > .card:nth-child(-n + 2)::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.85) 0%,
    rgba(0, 0, 0, 0.15) 55%,
    transparent 75%
  );
  pointer-events: none;
}
.sport-grid > .card:nth-child(-n + 2) .card__cat {
  grid-area: cat;
  position: relative;
  z-index: 2;
  color: #fff;
  padding: 0 20px;
}
.sport-grid > .card:nth-child(-n + 2) .card__meta {
  grid-area: meta;
  position: relative;
  z-index: 2;
  color: #fff;
  padding: 0 20px;
}
.sport-grid > .card:nth-child(-n + 2) .card__title {
  grid-area: title;
  position: relative;
  z-index: 2;
  color: #fff;
  font-size: 22px;
  padding: 0 20px 20px;
}
.sport-grid > .card:nth-child(-n + 2) .card__excerpt {
  display: none;
}

/* item 3-6: card simplu, o coloana fiecare */
.sport-grid > .card:nth-child(n + 3) {
  grid-column: span 1;
  background: #fff;
  grid-template-columns: 1fr;
  grid-template-areas: "img" "cat" "meta" "title";
  row-gap: 4px;
  padding: 0 4px 10px;
}
.sport-grid > .card:nth-child(n + 3) .card__img {
  grid-area: img;
  aspect-ratio: 16/10;
  margin-bottom: 4px;
}
.sport-grid > .card:nth-child(n + 3) .card__cat {
  grid-area: cat;
}
.sport-grid > .card:nth-child(n + 3) .card__meta {
  grid-area: meta;
}
.sport-grid > .card:nth-child(n + 3) .card__title {
  grid-area: title;
  font-size: 15px;
}
.sport-grid > .card:nth-child(n + 3) .card__excerpt {
  display: none;
}

/* RESPONSIVE sub 900px */
@media (max-width: 900px) {
  .sport-grid {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
  .sport-grid > .card {
    grid-column: auto !important;
    height: auto !important;
  }
  .sport-grid > .card:nth-child(-n + 2) {
    aspect-ratio: 16/10;
  }
  .sport-grid > .card:nth-child(n + 3) .card__title {
    font-size: 14px;
  }
}

.single-wrap {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 40px;
  align-items: start;
}

.card__media,
.card__body {
  display: contents;
}
.card {
  position: relative;
  display: grid;
  overflow: hidden;
}
.card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.card__cat {
  color: var(--pc-accent);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.card__meta {
  color: var(--pc-muted);
  font-size: 12px;
}
.card__title {
  font-weight: 700;
  line-height: 1.25;
  margin: 0;
}
.card__title a {
  color: inherit;
  text-decoration: none;
}
.card__title a:hover {
  color: var(--pc-accent);
}
.card__excerpt {
  font-size: 14px;
  color: #555;
  line-height: 1.5;
}

:root {
  --pc-accent: #8f2430;
  --pc-muted: #8a8a8a;
  --pc-gap: 24px;
}

/* ===== ZONA SUS: 2 mici stanga + 1 mare dreapta ===== */
.category-grid {
  display: grid;
  grid-template-columns: 1fr 1.6fr;
  grid-template-rows: repeat(2, auto);
  gap: var(--pc-gap);
  margin-bottom: 32px;
}
.category-grid > .card:nth-child(1) {
  grid-column: 1;
  grid-row: 1;
}
.category-grid > .card:nth-child(2) {
  grid-column: 1;
  grid-row: 2;
}
.category-grid > .card:nth-child(3) {
  grid-column: 2;
  grid-row: 1 / 3;
  height: 100%;
  align-self: stretch;
}
.category-grid > .card:nth-child(n + 4) {
  grid-column: 1 / -1;
}

/* item 1-2: card mic, imagine sus + cat/data/titlu stivuite */
.category-grid > .card:nth-child(-n + 2) {
  background: #fff;
  grid-template-columns: 1fr;
  grid-template-areas: "img" "cat" "meta" "title";
  row-gap: 4px;
}
.category-grid > .card:nth-child(-n + 2) .card__img {
  grid-area: img;
  aspect-ratio: 16/10;
  margin-bottom: 4px;
}
.category-grid > .card:nth-child(-n + 2) .card__cat {
  grid-area: cat;
}
.category-grid > .card:nth-child(-n + 2) .card__meta {
  grid-area: meta;
}
.category-grid > .card:nth-child(-n + 2) .card__title {
  grid-area: title;
  font-size: 15px;
}
.category-grid > .card:nth-child(-n + 2) .card__excerpt {
  display: none;
}

/* item 3: hero mare, overlay pe imagine */
.category-grid > .card:nth-child(3) {
  grid-template-columns: 1fr;
  grid-template-areas: "cat" "meta" "title";
  align-content: end;
  row-gap: 4px;
}
.category-grid > .card:nth-child(3) .card__img {
  position: absolute;
  inset: 0;
  aspect-ratio: auto !important;
  width: 100% !important;
  height: 100% !important;
}
.category-grid > .card:nth-child(3) .card__img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}
.category-grid > .card:nth-child(3)::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.85) 0%,
    rgba(0, 0, 0, 0.15) 55%,
    transparent 75%
  );
  pointer-events: none;
}
.category-grid > .card:nth-child(3) .card__cat {
  grid-area: cat;
  position: relative;
  z-index: 2;
  color: #fff;
  padding: 0 20px;
}
.category-grid > .card:nth-child(3) .card__meta {
  grid-area: meta;
  position: relative;
  z-index: 2;
  color: #fff;
  padding: 0 20px;
}
.category-grid > .card:nth-child(3) .card__title {
  grid-area: title;
  position: relative;
  z-index: 2;
  color: #fff;
  font-size: 24px;
  padding: 0 20px 20px;
}
.category-grid > .card:nth-child(3) .card__excerpt {
  display: none;
}

/* item 4-20: lista - jumatate poza, jumatate continut */
/* item 4-20: simplu, flex - imagine mare stanga, text centrat vertical dreapta */
.category-grid > .card:nth-child(n + 4) {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 24px;
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid #eee;
}
.category-grid > .card:nth-child(n + 4) .card__media {
  display: block !important;
  position: relative;
  flex: 0 0 320px;
  height: 220px; /* <- aici controlezi inaltimea imaginii */
  overflow: hidden;
}
.category-grid > .card:nth-child(n + 4) .card__img {
  position: absolute;
  inset: 0;
}
.category-grid > .card:nth-child(n + 4) .card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.category-grid > .card:nth-child(n + 4) .card__cat {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  background: rgba(0, 0, 0, 0.65);
  color: #fff;
  padding: 4px 10px;
}
.category-grid > .card:nth-child(n + 4) .card__body {
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  flex: 1;
  min-width: 0;
}
.category-grid > .card:nth-child(n + 4) .card__meta {
  margin-bottom: 4px;
}
.category-grid > .card:nth-child(n + 4) .card__title {
  font-size: 18px;
  margin-bottom: 4px;
}
.category-grid > .card:nth-child(n + 4) .card__excerpt {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ===== PAGINARE ===== */
.category-pagination {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 16px;
}
.category-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 10px;
  border-radius: 4px;
  font-size: 14px;
  color: #333;
  text-decoration: none;
}
.category-pagination .page-numbers.current {
  background: var(--pc-accent);
  border-color: var(--pc-accent);
  color: #fff;
}

/* ===== SIDEBAR (identic cu cel din single) ===== */
.single-sidebar-title {
  background: var(--pc-accent);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: 12px 16px;
  margin: 0 0 16px;
}
.single-sidebar-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.sidebar-item {
  display: grid;
  grid-template-columns: 64px 1fr;
  grid-template-areas: "img cat" "img meta" "img title";
  column-gap: 10px;
  row-gap: 2px;
  align-items: start;
}
.sidebar-item-media,
.sidebar-item-body {
  display: contents;
}
.sidebar-item-img {
  grid-area: img;
}
.sidebar-item-img img {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  display: block;
}
.sidebar-item-cat {
  grid-area: cat;
  color: var(--pc-accent);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}
.sidebar-item-date {
  grid-area: meta;
  color: var(--pc-muted);
  font-size: 12px;
}
.sidebar-item-title {
  grid-area: title;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
}
.sidebar-item-title a {
  color: inherit;
  text-decoration: none;
}
.sidebar-item-title a:hover {
  color: var(--pc-accent);
}

/* ===== RESPONSIVE sub 900px ===== */
@media (max-width: 900px) {
  .single-wrap {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .category-grid {
    grid-template-columns: 1fr;
    grid-template-rows: none;
  }
  .category-grid > .card {
    grid-column: 1 !important;
    grid-row: auto !important;
    height: auto !important;
  }
  .category-grid > .card:nth-child(3) {
    aspect-ratio: 16/10;
  }
  .category-grid > .card:nth-child(n + 4) .card__media {
    flex-basis: 120px;
    height: 120px;
  }
  .category-grid > .card:nth-child(n + 4) .card__excerpt {
    display: none;
  }
}

.card__excerpt p,
.card__title p,
.card__meta p,
.card__cat p {
  margin: 0;
}
