/**
 * Garderoba — harmonizacija HivePress-a sa dizajnom teme.
 * Učitava se samo kad je HivePress aktivan, poslije hivepress frontend.css.
 * Cilj: iste boje, tipografija, dugmad, kartice i razmaci kao ostatak sajta.
 */

/* =========================================================
   Layout stranice (submit, account, listings, vendor…)
   ========================================================= */
.hp-page {
  width: min(100% - 2.4rem, var(--maxw));
  margin-inline: auto;
  padding-block: clamp(2.2rem, 1.6rem + 3vw, 4rem);
}
.hp-page__title {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--step-3);
  letter-spacing: -0.01em;
  margin: 0 0 clamp(1.4rem, 1rem + 1.5vw, 2.2rem);
}
.hp-page__header { margin-bottom: 1.8rem; }

/* Layout kolone stranice (sidebar + sadržaj). Ne dira listu oglasa (.hp-grid > .hp-row). */
.hp-page > .hp-row,
.hp-page__columns {
  display: flex; flex-wrap: wrap; gap: clamp(1.2rem, .8rem + 1.6vw, 2rem);
  /*
   * `flex-direction` MORA eksplicitno: na strani oglasa isti element nosi i
   * klasu `.hp-listing--view-page`, kojoj HivePress daje `column`, pa bi se
   * bočna kolona spustila ispod sadržaja.
   */
  flex-direction: row;
  /* Bez ovoga se bočna kolona rasteže do visine sadržaja i ostane prazna bijela kutija. */
  align-items: flex-start;
}
.hp-page__sidebar { flex: 0 0 clamp(215px, 23%, 275px); }
.hp-page__content { flex: 1 1 0; min-width: 0; }
@media (max-width: 47.99em) {
  .hp-page > .hp-row,
  .hp-page__columns { display: block; }
  .hp-page__sidebar { margin-bottom: 1.4rem; }
}

/* =========================================================
   Forme i polja
   ========================================================= */
.hp-form__field { margin-bottom: 1.15rem; }
.hp-field__label,
.hp-form__label {
  display: block;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--step--1);
  color: var(--ink);
  margin-bottom: .4rem;
}
.hp-field__label .hp-field__label-required,
.hp-form__label-required { color: var(--plum); }
.hp-field__description {
  font-size: var(--step--1);
  color: var(--muted);
  margin-top: .35rem;
}

.hp-field--text input,
.hp-field--email input,
.hp-field--url input,
.hp-field--number input,
.hp-field--password input,
.hp-field--search input,
.hp-field--date input,
.hp-form input[type="text"],
.hp-form input[type="email"],
.hp-form input[type="number"],
.hp-form input[type="search"],
.hp-form input[type="url"],
.hp-form input[type="tel"],
.hp-form input[type="password"],
.hp-form textarea,
.hp-form select:not(.hp-field--hidden) {
  width: 100%;
  font: inherit;
  color: var(--ink);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: .7rem .9rem;
  transition: border-color .16s ease, box-shadow .16s ease;
  -webkit-appearance: none;
  appearance: none;
}
.hp-form textarea { min-height: 140px; resize: vertical; line-height: 1.6; }
.hp-form input:focus,
.hp-form textarea:focus,
.hp-form select:focus {
  outline: none;
  border-color: var(--ink);
  box-shadow: 0 0 0 3px var(--plum-soft);
}
.hp-form input::placeholder,
.hp-form textarea::placeholder { color: var(--muted); }

/* select2 (HivePress koristi za dropdowne) */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
  height: auto;
  min-height: 44px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: .35rem .5rem;
  display: flex;
  align-items: center;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--ink);
  line-height: 1.6;
  padding-left: .35rem;
}
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 42px; }
.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--single {
  border-color: var(--ink);
  box-shadow: 0 0 0 3px var(--plum-soft);
}
.select2-dropdown {
  border-color: var(--line);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background: var(--ink);
}
.select2-container--default .select2-search--dropdown .select2-search__field {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: .5rem .6rem;
}

/* Upload slika */
.hp-field--attachment-upload .hp-field__button,
.hp-file-upload .button {
  display: inline-flex;
}

/* =========================================================
   Dugmad — poravnata sa .btn iz teme
   ========================================================= */
.hp-button,
.hp-form__button,
.hp-form button[type="submit"],
button.button.hp-field--submit,
.hp-menu a.button,
a.hp-button,
.button.button--primary,
.button-primary.alt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5ch;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--step-0);
  line-height: 1.2;
  padding: .72em 1.4em;
  border-radius: 999px;
  border: 1px solid transparent;
  background: var(--plum);
  color: #fff;
  cursor: pointer;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
  text-decoration: none;
}
.hp-button:hover,
.hp-form__button:hover,
.hp-form button[type="submit"]:hover,
a.hp-button:hover,
.button-primary.alt:hover { background: var(--plum-deep); color: #fff; transform: translateY(-1px); }

.hp-button--wide,
.hp-form__button--wide { width: 100%; }

/* Sekundarna / outline dugmad */
.hp-button--secondary,
.button.button--large:not(.button-primary):not(.hp-form__button),
a.hp-listing__action,
.hp-button.hp-button--small {
  background: transparent;
  color: var(--ink);
  border-color: var(--line);
}
.hp-button--secondary:hover,
.button.button--large:not(.button-primary):not(.hp-form__button):hover {
  border-color: var(--ink);
  color: var(--ink);
  background: transparent;
}

/* Ikonice unutar dugmadi (Font Awesome) */
.hp-button .hp-icon,
.button .hp-icon { font-size: .9em; }

/* =========================================================
   Widget / filter panel
   ========================================================= */
.hp-widget {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.3rem 1.3rem .3rem;
}
.hp-widget__title,
.hp-widget .widget-title {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--step-1);
  margin: 0 0 1rem;
}
.hp-field--radio ul,
.hp-field--checkboxes ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.hp-field--radio li label,
.hp-field--checkboxes li label {
  display: flex; align-items: center; gap: .55rem;
  font-weight: 400; font-size: var(--step-0); color: var(--ink-soft);
  cursor: pointer; margin: 0;
}

/* --- Kompaktan filter na strani oglasa --- */
.hp-widget--listing-filter,
.hp-widget--vendor-filter {
  padding: 1.1rem 1.1rem .3rem;
  border-radius: var(--radius);
  background:
    linear-gradient(var(--surface), var(--surface)) padding-box,
    linear-gradient(160deg, var(--plum-soft), var(--sand)) border-box;
  border: 1.5px solid transparent;
  box-shadow: var(--shadow);
}
/* Naslovna traka filtera */
.hp-widget--listing-filter::before {
  content: "Filteri";
  display: block;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--step-1);
  color: var(--ink);
  padding-bottom: .7rem;
  margin-bottom: .9rem;
  border-bottom: 1px solid var(--line);
}
/* Radio / checkbox u boji brenda */
.hp-widget--listing-filter input[type="radio"],
.hp-widget--listing-filter input[type="checkbox"] { accent-color: var(--plum); width: 15px; height: 15px; }
.hp-widget--listing-filter li label:hover { color: var(--plum); }
.hp-widget--listing-filter .hp-field--radio li:has(input:checked) label,
.hp-widget--listing-filter .hp-field--checkboxes li:has(input:checked) label { color: var(--plum); font-weight: 700; }
.hp-widget--listing-filter .hp-form__field { margin-bottom: .75rem; }
.hp-widget--listing-filter .hp-field__label,
.hp-widget--listing-filter .hp-form__label { font-size: .78rem; margin-bottom: .3rem; letter-spacing: .02em; text-transform: uppercase; color: var(--muted); }
.hp-widget--listing-filter .hp-field--radio,
.hp-widget--listing-filter .hp-field--checkboxes { max-height: 26rem; overflow-y: auto; }
.hp-widget--listing-filter .hp-field--radio ul,
.hp-widget--listing-filter .hp-field--checkboxes ul { gap: .28rem; }
.hp-widget--listing-filter .hp-field--radio li label,
.hp-widget--listing-filter .hp-field--checkboxes li label {
  font-size: var(--step--1);
  align-items: flex-start;
  line-height: 1.35;
}
.hp-widget--listing-filter .hp-field--radio li label input,
.hp-widget--listing-filter .hp-field--checkboxes li label input { margin-top: .18rem; flex-shrink: 0; }
/* Podkategorije: uvučene, sitnije, sa linijom */
.hp-widget--listing-filter .hp-field--radio ul ul,
.hp-widget--listing-filter .hp-field--checkboxes ul ul {
  margin: .35rem 0 .5rem .55rem;
  padding-left: .7rem;
  border-left: 2px solid var(--plum-soft);
  gap: .3rem;
}
.hp-widget--listing-filter .hp-field--radio ul ul li label { font-size: .8rem; color: var(--muted); }
.hp-widget--listing-filter .hp-field--radio ul ul li label:hover { color: var(--plum); }
.hp-widget--listing-filter .hp-field--text input,
.hp-widget--listing-filter .hp-form input[type="text"],
.hp-widget--listing-filter .hp-form input[type="number"],
.hp-widget--listing-filter .select2-container--default .select2-selection--single {
  padding-top: .45rem; padding-bottom: .45rem; min-height: 38px; font-size: var(--step--1);
}
.hp-widget--listing-filter .hp-form__button { padding: .58em 1.1em; font-size: var(--step--1); }
/* skloni "Filtriraj" naslov ako HivePress ubaci prazan */
.hp-widget--listing-filter .hp-form__messages:empty { display: none; }

/* Sekcije filtera razdvojene linijom, kao poglavlja */
.hp-widget--listing-filter .hp-form__field:not(:last-child) {
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--line);
}

/* Raspon cijene: dva polja jedno pored drugog, sa crticom */
.hp-widget--listing-filter .hp-field--number-range { display: flex; align-items: center; gap: .5rem; }
.hp-widget--listing-filter .hp-field--number-range::before {
  content: "";
  order: 1;
  width: 10px; height: 1px; flex-shrink: 0;
  background: var(--line);
}
.hp-widget--listing-filter .hp-field--number-range input:first-child { order: 0; }
.hp-widget--listing-filter .hp-field--number-range input:last-child { order: 2; }

/*
 * Veličine su vezane za kategoriju (žene / muškarci / djeca imaju različite
 * skale), pa se filter pojavi tek kad se kategorija izabere. Bez objašnjenja
 * to izgleda kao da je filter nestao.
 */
.hp-widget--listing-filter .hp-form__field--radio:has(input[value="0"]:checked)::after {
  content: "Izaberi kategoriju da vidiš filter za veličine.";
  display: block;
  margin-top: .7rem;
  padding: .55rem .7rem;
  background: var(--plum-soft);
  border-radius: var(--radius-xs);
  font-size: .76rem;
  line-height: 1.45;
  color: var(--plum-deep);
}

/* =========================================================
   Rezultati pretrage — mreža kartica (3 → 2 → 1)
   ========================================================= */
.hp-page__content .hp-grid > .hp-row { margin-inline: -.6rem; }
.hp-page__content .hp-grid__item { padding-inline: .6rem; margin-bottom: 1.5rem; display: flex; }

/* HivePress daje 25% (4 u redu) na ≥768px; sa bočnim filterom je pretijesno */
@media (min-width: 48em) {
  .hp-page__content .hp-grid__item { flex-basis: 33.3333% !important; max-width: 33.3333% !important; }
}
@media (max-width: 47.99em) {
  .hp-page__content .hp-grid__item { flex-basis: 50% !important; max-width: 50% !important; }
}
@media (max-width: 30em) {
  .hp-page__content .hp-grid__item { flex-basis: 100% !important; max-width: 100% !important; }
}

/* --- Kartica --- */
.hp-page__content .hp-listing--view-block {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.hp-page__content .hp-listing--view-block:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-hover);
  border-color: transparent;
}

.hp-page__content .hp-listing__header { position: relative; }
.hp-page__content .hp-listing__image {
  aspect-ratio: 3 / 4;
  background: linear-gradient(160deg, var(--sand), var(--plum-soft));
  border-radius: 0;
  margin: 0;
}
.hp-page__content .hp-listing__image img { width: 100%; height: 100%; object-fit: cover; }

/* Oznaka „Istaknuto" preko slike — vodi na listu istaknutih */
.hp-page__content .hp-listing__featured-badge {
  position: absolute; top: .7rem; left: .7rem; z-index: 2;
  display: inline-flex; align-items: center;
  background: rgba(255,255,255,.94);
  color: var(--plum);
  border: 0; border-radius: 999px;
  padding: .3rem .75rem;
  font-size: .68rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  box-shadow: var(--shadow);
  width: auto; height: auto;
}
.hp-page__content .hp-listing__featured-badge:hover { background: var(--plum); color: #fff; }
.hp-page__content .hp-listing__featured-badge .hp-icon { display: none; }

/* Srce ide u gornji desni ugao slike, ne u podnožje */
.hp-page__content .hp-listing--view-block .hp-listing__actions--primary {
  position: absolute; top: .6rem; right: .6rem; z-index: 2;
  margin: 0; display: flex; gap: .3rem;
}
.hp-page__content .hp-listing--view-block .hp-listing__actions--primary .hp-listing__action {
  margin: 0;
  width: 34px; height: 34px;
  display: grid; place-items: center;
  background: rgba(255,255,255,.94);
  border-radius: 50%;
  color: var(--ink-soft);
  box-shadow: var(--shadow);
  font-size: .85rem;
}
.hp-page__content .hp-listing--view-block .hp-listing__actions--primary .hp-listing__action:hover,
.hp-page__content .hp-listing--view-block .hp-listing__actions--primary .hp-listing__action[data-state="active"] { color: var(--clay); }

/* --- Sadržaj kartice --- */
.hp-page__content .hp-listing__content {
  padding: .9rem 1rem .5rem;
  gap: .3rem;
  display: flex; flex-direction: column; flex: 1;
}
.hp-page__content .hp-listing__title {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--step-1);
  line-height: 1.25;
  margin: 0;
}

/* Kategorija kao sitan nadnaslov; datum sakriven (engleski mjesec i suvišan) */
.hp-page__content .hp-listing__details--primary { margin: 0 0 .1rem; order: -1; }
.hp-page__content .hp-listing__created-date { display: none; }
.hp-page__content .hp-listing__categories,
.hp-page__content .hp-listing__categories a {
  font-size: .7rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase;
  color: var(--muted);
}
.hp-page__content .hp-listing__categories a:hover { color: var(--plum); }

/* Atributi kao pilule */
.hp-page__content .hp-listing__attributes--secondary { margin: .45rem 0 0; }
.hp-page__content .hp-listing__attributes--secondary .hp-row {
  display: flex; flex-wrap: wrap; gap: .35rem; margin: 0;
}
.hp-page__content .hp-listing__attributes--secondary [class*="hp-col-"] {
  flex: 0 0 auto; max-width: none; width: auto; padding: 0;
}
.hp-page__content .hp-listing__attributes--secondary .hp-listing__attribute {
  margin: 0;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .26rem .6rem;
  font-size: .74rem;
  line-height: 1.3;
  color: var(--ink-soft);
  white-space: nowrap;
}
.hp-page__content .hp-listing__attributes--secondary .hp-listing__attribute > strong {
  color: var(--muted); font-weight: 400;
}

/* --- Podnožje kartice: cijena --- */
.hp-page__content .hp-listing__footer {
  padding: .8rem 1rem .9rem;
  margin-top: .7rem;
  border-top: 1px solid var(--line);
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
}
.hp-page__content .hp-listing__attributes--primary { display: flex; align-items: baseline; gap: .4rem; margin: 0; min-width: 0; }
.hp-page__content .hp-listing__attribute--price {
  font-family: var(--font-display); font-weight: 700; font-size: var(--step-2); color: var(--ink);
  white-space: nowrap; margin: 0;
}
.hp-page__content .hp-listing__attribute--dostupnost {
  margin: 0;
  font-size: .62rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  white-space: nowrap;
  color: var(--sage);
  background: var(--sage-soft);
  border-radius: 999px;
  padding: .22rem .5rem;
  align-self: center;
}

/* Prodato / rezervisano — klasu dodaje garderoba-core/featured.php */
.hp-page__content .is-reserved .hp-listing__attribute--dostupnost {
  color: var(--clay); background: var(--clay-soft);
}
.hp-page__content .is-sold .hp-listing__attribute--dostupnost {
  color: var(--muted); background: var(--line);
}
.hp-page__content .is-sold .hp-listing__image { filter: grayscale(1); opacity: .6; }
.hp-page__content .is-sold .hp-listing__attribute--price {
  color: var(--muted); text-decoration: line-through;
}

/* Traka „Izdvojeni oglasi" iznad rezultata */
.garderoba-feat__banner {
  background: var(--sand);
  border-radius: var(--radius-sm);
  padding: .85rem 1.1rem;
  margin-bottom: 1.2rem;
  font-size: var(--step--1);
  color: var(--ink-soft);
}
.garderoba-feat__banner strong { color: var(--plum); }
.garderoba-feat__banner a { color: var(--plum); font-weight: 600; text-decoration: underline; }

/* Toolbar iznad rezultata (broj + sortiranje) */
.hp-results__toolbar,
.hp-page__topbar { font-size: var(--step--1); color: var(--muted); margin-bottom: 1.2rem; }
.hp-page__topbar .hp-form--pivot .hp-field__label { font-size: var(--step--1); }
/* „Sortiraj po" select je bio preuzak pa se tekst sjekao */
.hp-page__topbar .hp-form--listing-sort .select2-container { min-width: 150px; }
.hp-page__topbar .hp-form--listing-sort select { min-width: 150px; }

/* =========================================================
   Search forma na stranici oglasa (pill kao u herou)
   ========================================================= */
.hp-form--listing-search {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .5rem .5rem .5rem 1.4rem;
  box-shadow: var(--shadow);
}
.hp-form--listing-search .hp-form__fields {
  display: flex; flex: 1; flex-wrap: wrap; gap: .6rem; align-items: center; min-width: 0;
}
.hp-form--listing-search .hp-form__field { margin: 0; flex: 1 1 160px; min-width: 0; }
.hp-form--listing-search .hp-field--search,
.hp-form--listing-search .hp-field--text {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: .45rem .2rem !important;
  border-radius: 0 !important;
}
.hp-form--listing-search .hp-form__field:not(:first-child) {
  border-left: 1px solid var(--line);
  padding-left: .8rem !important;
}
.hp-form--listing-search .hp-field__label { display: none; }
.hp-form--listing-search .hp-form__footer { margin: 0; }
.hp-form--listing-search .hp-form__button { padding: .72em 1.6em; }
@media (max-width: 767px) {
  .hp-form--listing-search { border-radius: var(--radius); flex-direction: column; align-items: stretch; padding: 1rem; gap: .4rem; }
  .hp-form--listing-search .hp-form__fields { flex-direction: column; gap: .4rem; width: 100%; }
  .hp-form--listing-search .hp-form__field {
    flex: 0 0 auto !important;
    border-left: 0 !important;
    padding-left: .2rem !important;
  }
  .hp-form--listing-search .hp-field--search,
  .hp-form--listing-search .hp-field--text {
    display: block !important;
    width: 100% !important;
    border: 1px solid var(--line) !important;
    border-radius: var(--radius-sm) !important;
    padding: .7rem .9rem !important;
    background: var(--paper) !important;
    text-align: left !important;
  }
  .hp-form--listing-search .hp-form__button { width: 100%; }
}

/* =========================================================
   Kartice oglasa
   ========================================================= */
.hp-listing {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: box-shadow .2s ease, transform .2s ease;
}
.hp-listing:hover { box-shadow: var(--shadow-hover); transform: translateY(-3px); }
.hp-listing__image {
  position: relative;
  aspect-ratio: 4 / 5;
  background: var(--sand);
  margin: 0;
  overflow: hidden;
}
.hp-listing__image img { width: 100%; height: 100%; object-fit: cover; }
.hp-listing__content,
.hp-listing__footer { padding-inline: 1rem; }
.hp-listing__content { padding-top: .9rem; padding-bottom: .5rem; display: flex; flex-direction: column; gap: .3rem; flex: 1; }
.hp-listing__footer { padding-bottom: 1rem; }
.hp-listing__title {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--step-0);
  line-height: 1.3;
  margin: 0;
}
.hp-listing__title a { color: var(--ink); }
.hp-listing__title a:hover { color: var(--plum); }
/* Kategorija + datum ispod naslova — sitno i prigušeno (NIJE cijena) */
.hp-listing__details--primary { display: flex; flex-wrap: wrap; gap: .5rem; align-items: baseline; }
.hp-listing__category,
.hp-listing__category a,
.hp-listing__categories { font-family: var(--font-body); font-weight: 400; font-size: var(--step--1); color: var(--muted); }
.hp-listing__created-date { font-size: .78rem; color: var(--muted); }
/* Cijena — Fraunces, istaknuta */
.hp-listing__attribute--price,
.hp-price {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--step-1);
  color: var(--ink);
}
.hp-listing__details--secondary { color: var(--muted); font-size: var(--step--1); }
.hp-listing__attribute { color: var(--muted); font-size: var(--step--1); margin: 0; }
.hp-listing__badges { position: absolute; top: .7rem; left: .7rem; z-index: 2; display: flex; gap: .4rem; }
.hp-listing__badge {
  background: var(--ink); color: #fff;
  font-size: .72rem; font-weight: 600; letter-spacing: .02em;
  padding: .3em .8em; border-radius: 999px;
}

/* Featured oglas */
.hp-listing--featured { border-color: var(--ink); }

/* =========================================================
   Strana pojedinačnog oglasa — kompaktne karakteristike
   Specifičnost mora nadjačati hivepress/frontend.min.css
   (`.hp-listing--view-page .hp-listing__attributes--primary
     .hp-listing__attribute` = 3 klase) — zato .hp-page prefiks.
   ========================================================= */

/* Blok atributa: bez kartice, tijesan spisak, jedan ispod drugog */
.hp-page .hp-listing--view-page .hp-listing__attributes,
.hp-listing__attributes.hp-widget {
  display: block;
  background: none;
  border: 0;
  border-radius: 0;
  padding: 0;
  margin: 0 0 1rem;
}

/* Pojedinačna karakteristika — sitno, bez sive trake */
.hp-page .hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute,
.hp-page .hp-listing--view-page .hp-listing__attributes--secondary .hp-listing__attribute,
.hp-page .hp-listing--view-page .hp-listing__attributes--ternary .hp-listing__attribute {
  display: block;
  background-color: transparent;
  padding: 0;
  margin: 0 0 .3rem;
  text-align: left;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: var(--step--1);
  line-height: 1.5;
  color: var(--ink-soft);
}

/* "Label:" dio (span) — prigušen */
.hp-page .hp-listing--view-page .hp-listing__attribute > span { color: var(--muted); }

/* Cijena — istaknuta, ali umjerena */
.hp-page .hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute--price {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--step-2);
  color: var(--plum);
  margin-bottom: .5rem;
}

/* Akcije (Piši prodavcu / Prijavi oglas): bez kartice */
.hp-listing__actions.hp-widget,
.hp-listing__actions--primary {
  background: none;
  border: 0;
  border-radius: 0;
  padding: 0;
  margin: 0 0 1.4rem;
}
.hp-page .hp-listing--view-page .hp-listing__actions--primary { display: flex; flex-direction: column; gap: .55rem; align-items: stretch; }
.hp-listing__action--report { font-size: var(--step--1); }

/* Pagination */
.hp-pagination { margin-top: 2rem; }
.hp-pagination__link,
.hp-pagination .page-numbers {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 40px; height: 40px; padding: 0 .5rem;
  border: 1px solid var(--line); border-radius: 999px;
  color: var(--ink-soft); font-weight: 600; font-size: var(--step--1);
}
.hp-pagination .page-numbers.current { background: var(--ink); color: #fff; border-color: var(--ink); }
.hp-pagination .page-numbers:hover { border-color: var(--ink); color: var(--ink); }

/* =========================================================
   Nalog / dashboard meni
   ========================================================= */
.hp-widget--user-account-menu,
.hp-widget--vendor-account-menu { padding: .6rem; }
.hp-menu--user-account ul,
.hp-menu--vendor-account ul {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: .15rem;
}
.hp-menu--user-account li a,
.hp-menu--vendor-account li a {
  display: flex; align-items: center; gap: .6ch;
  padding: .6rem .9rem; border-radius: var(--radius-sm);
  font-weight: 600; font-size: var(--step--1); color: var(--ink-soft);
}
.hp-menu--user-account li a:hover,
.hp-menu--vendor-account li a:hover { background: var(--sand); color: var(--ink); }
.hp-menu--user-account li.hp-menu__item--current a,
.hp-menu--user-account li.current-menu-item a,
.hp-menu--vendor-account li.current-menu-item a { background: var(--ink); color: #fff; }
.hp-menu--user-account li a .hp-icon,
.hp-menu--vendor-account li a .hp-icon { width: 1.1em; text-align: center; opacity: .8; }

/* Mobilno/desktop prebacivanje HivePress widgeta */
@media (min-width: 48em) {
  .hp-button--mobile,
  .hp-widget--mobile { display: none !important; }
}
@media (max-width: 47.99em) {
  .hp-widget--desktop { display: none !important; }
}

/* =========================================================
   Vendor (prodavac) kartica i profil
   ========================================================= */
.hp-vendor {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.4rem;
}
.hp-vendor__image img { border-radius: 50%; }
.hp-vendor__name { font-family: var(--font-display); font-weight: 500; font-size: var(--step-1); }
.hp-vendor__name a { color: var(--ink); }
.hp-vendor--view-page .hp-vendor__image img { width: 96px; height: 96px; object-fit: cover; }

/* Blok prodavca na strani oglasa */
.hp-listing__vendor .hp-vendor { box-shadow: none; }

/* =========================================================
   Poruke / chat
   ========================================================= */
.hp-messages__item,
.hp-chat__message {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: .8rem 1rem;
  background: var(--surface);
}
.hp-chat__message--sent { background: var(--sand); }
.hp-messages__item--unread { border-color: var(--ink); }

/* =========================================================
   Poruke o statusu forme
   ========================================================= */
.hp-form__messages:empty { display: none; }
.hp-form__messages {
  border-radius: var(--radius-sm);
  padding: .85rem 1rem;
  margin-bottom: 1rem;
  font-size: var(--step--1);
}
.hp-form__messages--success { background: #ECF3EC; color: #2C5C2C; }
.hp-form__messages--error { background: var(--plum-soft); color: #7A3A32; }

/* Modal (mobilni filteri) */
.hp-modal__content { border-radius: var(--radius); }

/* =========================================================
   Prazno stanje pretrage (HivePress "Nema rezultata")
   ========================================================= */
.hp-no-results {
  text-align: center;
  background: var(--surface);
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  padding: clamp(2rem, 1.5rem + 2vw, 3.2rem) 1.5rem;
  max-width: 560px;
  margin: 1rem auto;
}
.hp-no-results h2 {
  font-family: var(--font-display);
  font-size: var(--step-2);
  margin: 0 0 .4em;
}
.hp-no-results p {
  margin: 0;
  color: var(--muted);
  font-size: var(--step--1);
}

/* =========================================================
   14. Prodavnica prodavca
   ========================================================= */
.shop-hero {
  position: relative;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
}
.shop-hero__cover {
  height: clamp(120px, 8rem + 8vw, 220px);
  background: linear-gradient(120deg, var(--plum) 0%, var(--clay) 100%);
  background-size: cover;
  background-position: center;
}
.shop-hero.has-cover .shop-hero__cover { background-color: var(--sand); }

.shop-hero__body {
  display: flex;
  align-items: flex-end;
  gap: 1.2rem;
  padding: .6rem clamp(1rem, .6rem + 1.6vw, 2rem) clamp(1.1rem, .8rem + 1vw, 1.6rem);
}
.shop-hero__avatar {
  width: 86px; height: 86px; flex-shrink: 0;
  /* U naslovnu sliku ulazi samo avatar — naziv i statistika ostaju ispod nje. */
  margin-top: -44px;
  border-radius: 50%;
  border: 4px solid var(--surface);
  background: var(--surface);
  object-fit: cover;
  display: grid; place-items: center;
  box-shadow: var(--shadow);
}
.shop-hero__avatar--letter {
  background: linear-gradient(135deg, var(--plum), var(--clay));
  color: #fff;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 2.2rem;
  line-height: 1;
}
.shop-hero__text { min-width: 0; padding-bottom: .2rem; }
.shop-hero__name {
  font-family: var(--font-display);
  font-size: var(--step-3);
  line-height: 1.1;
  margin: 0 0 .4rem;
  color: var(--ink);
  letter-spacing: -0.02em;
}

.shop-stats {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .9rem;
  margin: 0;
  padding: 0;
  font-size: var(--step--1);
  color: var(--muted);
}
.shop-stats li { display: inline-flex; align-items: baseline; gap: .3rem; }
.shop-stats li + li::before {
  content: "";
  width: 3px; height: 3px; border-radius: 50%;
  background: var(--line);
  margin-right: .6rem;
}
.shop-stats strong {
  font-family: var(--font-display);
  font-size: var(--step-0);
  font-weight: 700;
  color: var(--plum);
}
.shop-hero__about {
  margin: .7rem 0 0;
  font-size: var(--step--1);
  color: var(--ink-soft);
  max-width: 68ch;
}

@media (max-width: 600px) {
  .shop-hero__body { flex-direction: column; align-items: flex-start; gap: .7rem; }
  .shop-hero__avatar { width: 70px; height: 70px; }
  .shop-hero__avatar--letter { font-size: 1.8rem; }
}

/* Kartica prodavnice na /prodavci/ */
.shop-card__stats {
  margin: .35rem 0 .9rem;
  font-size: var(--step--1);
  color: var(--muted);
}
.shop-card__stats strong { color: var(--plum); font-weight: 700; }
.shop-card__btn {
  display: block;
  text-align: center;
  padding: .55rem 1rem;
  border: 1.5px solid var(--line);
  border-radius: 999px;
  font-size: var(--step--1);
  font-weight: 600;
  color: var(--ink);
  transition: border-color .18s ease, background-color .18s ease, color .18s ease;
}
.shop-card__btn:hover { background: var(--plum-soft); border-color: var(--plum); color: var(--plum); }

.shop-card__stats span { color: var(--muted); font-size: .82em; }

/* Kartica prodavnice: centrirano, ujednačena visina */
.hp-vendor--view-block { text-align: center; }
.hp-vendor--view-block .hp-vendor__name { font-family: var(--font-display); font-size: var(--step-1); margin: .6rem 0 .2rem; }
.hp-vendor--view-block .hp-vendor__name a { color: var(--ink); }
.hp-vendor--view-block .hp-vendor__name a:hover { color: var(--plum); }

/* Instagram prodavca */
.shop-hero__social { margin-left: auto; align-self: center; flex-shrink: 0; }
.shop-ig {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .5rem .95rem;
  border: 1.5px solid var(--line); border-radius: 999px;
  font-size: var(--step--1); font-weight: 600; color: var(--ink);
  transition: border-color .18s ease, color .18s ease, background-color .18s ease;
}
.shop-ig svg { width: 17px; height: 17px; flex-shrink: 0; }
.shop-ig:hover {
  color: #C13584;
  border-color: #C13584;
  background: color-mix(in srgb, #C13584 7%, transparent);
}
/* Na kartici prodavnice (i uz oglas) stoji ispod dugmeta */
.shop-card__btn + .shop-ig {
  margin-top: .5rem;
  padding: .35rem .7rem;
  font-size: .82rem;
}

@media (max-width: 600px) {
  .shop-hero__social { margin-left: 0; align-self: flex-start; }
}

/* =========================================================
   15. Premium prikaz oglasa (promocija)
   ========================================================= */
/*
 * Premium kartica je RANIJE zauzimala dvije kolone sa slikom lijevo, ali je
 * galerija prelazila preko naslova i atributa. Sada je obična kartica sa
 * zlatnom oznakom i okvirom — vidljivost dolazi od toga što premium oglasi
 * idu na VRH kategorije (garderoba-core/promotions.php).
 */
.hp-page__content .is-premium {
  border-color: color-mix(in srgb, var(--clay) 45%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--clay) 18%, transparent), var(--shadow);
}
.hp-page__content .is-premium:hover { border-color: var(--clay); }

.garderoba-premium-badge {
  position: absolute; top: .7rem; left: .7rem; z-index: 2;
  display: inline-flex; align-items: center;
  background: var(--clay); color: #fff;
  border-radius: 999px;
  padding: .3rem .75rem;
  font-size: .68rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  box-shadow: var(--shadow);
}
/* Kad je oglas i istaknut i premium, oznake se slažu jedna ispod druge */
.hp-page__content .hp-listing__header:has(.hp-listing__featured-badge) .garderoba-premium-badge {
  top: 3rem;
}

/* =========================================================
   16. Strana pojedinačnog oglasa
   ========================================================= */
/*
 * Kao u prodavnici odjeće: velika galerija lijevo, a desno sve što kupac
 * čita — naziv, cijena, karakteristike, opis i kontakt. Naslov i opis u
 * desnu kolonu premješta garderoba-core/listing-page.php.
 */
@media (min-width: 48em) {
  .hp-listing--view-page > .hp-page__sidebar {
    flex: 0 0 clamp(320px, 38%, 470px);
    max-width: none;
  }
  .hp-listing--view-page > .hp-page__content {
    flex: 1 1 0;
    max-width: none;
  }
}

.garderoba-listing__title {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--step-2);
  line-height: 1.2;
  letter-spacing: -0.01em;
  margin: 0 0 1rem;
}

.hp-listing--view-page .hp-listing__images {
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--sand);
}
.hp-listing--view-page .hp-listing__images img { width: 100%; height: auto; display: block; }

/* Cijena i karakteristike u desnoj koloni */
.hp-listing--view-page .hp-listing__attributes--primary { margin-bottom: 1.2rem; }

.garderoba-listing__description {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.2rem 1.3rem;
  margin-bottom: 1.2rem;
  line-height: 1.7;
  color: var(--ink-soft);
  font-size: var(--step--1);
}
.garderoba-listing__description h2 {
  font-family: var(--font-display);
  font-size: var(--step-0);
  margin: 0 0 .5rem;
  color: var(--ink);
}
.garderoba-listing__description p:last-child { margin-bottom: 0; }

/* =========================================================
   17. Uslovi kupovine i avatar prodavnice
   ========================================================= */
.shop-terms {
  background: var(--sand);
  border-radius: var(--radius);
  padding: 1.1rem 1.2rem;
  margin-bottom: 1.2rem;
  font-size: var(--step--1);
  line-height: 1.65;
  color: var(--ink-soft);
}
.shop-terms__title {
  font-family: var(--font-display);
  font-size: var(--step-0);
  margin: 0 0 .45rem;
  color: var(--ink);
}
.shop-terms p:last-child { margin-bottom: 0; }

/* Inicijal umjesto sive ikonice čovjeka kad prodavac nema sliku */
.shop-avatar {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--plum), var(--clay));
  color: #fff;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(1.6rem, 1rem + 2vw, 2.6rem);
  line-height: 1;
}
.hp-vendor--view-block .hp-vendor__image { max-width: 110px; margin-inline: auto; }