/* ===========================================
   cards.css
   Globalna pozadina + izgled svih "kartica"
   (bez shop .product-card)
   =========================================== */

/* --- VARIJABLE: pozadine, radius, sjene --- */
:root {
  /* Pozadina cijele stranice */
  --page-bg: #f6f3f1;

  /* Pozadina kartica / boxeva */
  --card-bg: #ffffff;

  /* Zaobljenje kutova kartica */
  --card-radius: 18px;

  /* Sjena kartica (mekana) */
  --card-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);

  /* Tekst boje (sigurna osnova) */
  --page-text: #2f2f2f;
}

/* --- POZADINA STRANICE --- */
html,
body {
  background: var(--page-bg);
  color: var(--page-text);
}

/* ===========================================
   UNIVERZALNI STIL ZA SVE KARTICE / BOXEVE
   (bez layouta – samo izgled)
   =========================================== */

/* BAZNA KLASA ZA KARTICE
   (možeš ju koristiti na novim elementima) */
.card-surface {
  background: var(--card-bg);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow);
}

/* === POČETNA – FEATURED / CAROUSEL KARTICE === */

/* Kartice u carouselu "Top / Novo / Akcija / Recenzije" */
.feat-card,
.home-review-card {
  background: var(--card-bg);
  border-radius: 14px;
  box-shadow: var(--card-shadow);
}

/* Veća slikovna kartica (hero recenzije / Etsy slike na početnoj) */
.home-review-card.home-review-card--image {
  background: var(--card-bg);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow);
}

/* === RECENZIJE – STRANICA recenzije.html === */

/* Velika kartica web recenzije s naslovom, tekstom i slikom */
.review-card-full {
  background: var(--card-bg);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow);
}

/* Sve pojedinačne kartice u gridu tekstualnih recenzija */
.reviews-page-list > * {
  background: var(--card-bg);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow);
}

/* Kartice sa slikama (Etsy recenzije, društvene mreže) */
.review-image-card {
  background: var(--card-bg);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow);
}

/* === MODALI I POPUPI – KAO KARTICE === */

/* Admin modal u shopu (Dodaj/uredi artikl) – samo izgled, ne layout */
.modal-content {
  background: var(--card-bg);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow);
}

/* Popup "Dodano u košaricu" + "Poklon pakiranje" */
.popup-box {
  background: var(--card-bg);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow);
}



/* === LIGHTBOX UNUTARNJA KUTIJA (da izgleda kao kartica) === */

.lb-wrap,
.review-lb-inner {
  background: var(--card-bg);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow);
}

/* ===========================================
   OPĆE SLIKE U KARTICAMA
   (ne dira layout – samo lijepi rubovi)
   =========================================== */

.card-surface img,
.feat-card img,
.home-review-card img,
.review-card-full img,
.reviews-page-list > * img,
.review-image-card img,
.popup-box img,
.modal-content img {
  border-radius: 12px;
}