/* ==========================================================================
   imotigreece-design — Имоти: карта, листинг (архив), единичен layout
   Спецификация: design/DESIGN.md §4 (Property Card, Spec Table), §5, §6, §7, §8
   Само var(--ig-*) — без hardcoded цветове (изключение: rgba върху бяло/черно).
   Зарежда се след темата и ERE (priority 999) → при равна специфичност печели.
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. Неутрализиране на брандовото оранжево в контекст „имоти"
   Темата g5-beyot и ERE дефинират :root токени с оранжево (#fb6a19 / #FE6A00):
   --g5-color-accent, --g5-color-link, --ere-color-accent и производните им
   (баджове, рейтинг, owl-nav, info лента). Презаписваме ги само в имотните
   контексти, за да не пипаме останалата част от сайта.
   -------------------------------------------------------------------------- */
body.post-type-archive-property,
body.single-property,
body[class*="tax-property-"],
.ere-property-wrap,
.ere-property,
.ere__single-property {
	--g5-color-accent: var(--ig-primary);
	--g5-color-accent-foreground: var(--ig-text-on-dark);
	--g5-color-accent-lighten: var(--ig-primary-light);
	--g5-color-link: var(--ig-link);
	--g5-color-link-hover: var(--ig-link-hover);
	--ere-color-accent: var(--ig-primary);
	--ere-color-accent-foreground: var(--ig-text-on-dark);
	--ere-loop-property-badge-bg-color: var(--ig-primary);
	--ere-loop-property-badge-color: var(--ig-text-on-dark);
	--ere-loop-property-status-bg-color: var(--ig-primary);
	--ere-loop-property-status-color: var(--ig-text-on-dark);
	--ere-rating-color: var(--ig-accent-dark);
}

/* --------------------------------------------------------------------------
   1. Карта на имот — .ere-item-wrap > .property-inner
   -------------------------------------------------------------------------- */
.ere-property .ere-item-wrap { width: auto; max-width: none; float: none; margin-bottom: 0; }

.ere-property-wrap .ere-property .property-inner {
	position: relative;
	background-color: var(--ig-surface-card);
	border: 1px solid var(--ig-border);
	border-radius: var(--ig-radius);
	overflow: hidden;
	box-shadow: var(--ig-shadow-1);
	transition: transform var(--ig-t-slow) ease, box-shadow var(--ig-t-slow) ease;
}

.ere-property-wrap .ere-property .ere-item-wrap:hover .property-inner,
.ere-property-wrap .ere-property .ere-item-wrap:focus-within .property-inner {
	transform: translateY(-3px);
	box-shadow: var(--ig-shadow-3);
}

/* Снимка: 4:3 (архив/подобни) · 3:2 (портфолио на начална) */
.ere-property-wrap .ere-property .property-image {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background-color: var(--ig-surface-alt);
}

body.home .ere-property-wrap .ere-property .property-image { aspect-ratio: 3 / 2; }

.ere-property-wrap .ere-property .property-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 600ms var(--ig-ease);
}

.ere-property-wrap .ere-property .ere-item-wrap:hover .property-image img { transform: scale(1.04); }

/* Затъмняване при hover — студено, не оранжево */
.ere-property-wrap .ere-property .property-image::before { background-color: rgba(18, 26, 32, .35); z-index: 1; }

/* --- Баджове върху снимката --------------------------------------------- */
.ere-property-wrap .ere-property .ere__loop-property-badge { top: 12px; left: 12px; z-index: 3; }
.ere-property-wrap .ere-property .ere__loop-property-badge.ere__lpb-status { right: 12px; left: auto; top: 12px; }
.ere-property-wrap .ere-property .ere__loop-property-badge .ere__loop-property-badge-item { margin-bottom: 6px; }

.ere-property-wrap .ere-property .ere__loop-property-badge .ere__loop-property-badge-item .ere__lpbi-inner {
	display: inline-block;
	padding: 5px 10px;
	font-family: var(--ig-font-body);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ig-text-on-dark);
	background-color: rgba(27, 58, 75, .94);
	border-radius: var(--ig-radius-sm);
}

/* Махаме „лентичката" на баджа — остава чист правоъгълник */
.ere-property-wrap .ere-property .ere__loop-property-badge .ere__loop-property-badge-item .ere__lpbi-inner::after { display: none; }

/* Етикетите от темата (property-label) имат hardcoded оранжев „върх" */
.ere-property .property-label-bg .property-arrow {
	border-left-color: var(--ig-primary);
	border-right-color: var(--ig-primary);
}

/* Етикет „Намалена цена" от ERE (.ere__term-label / .namalena_cena) — теракота */
.ere-property-wrap .ere-property .ere__loop-property-badge .ere__loop-property-badge-item.ere__term-label .ere__lpbi-inner,
.ere-property-wrap .ere-property .ere__loop-property-badge .ere__loop-property-badge-item.namalena_cena .ere__lpbi-inner {
	background-color: var(--ig-accent-dark);
}

/* --- Действия върху снимката (галерия/любими/сравнение) ----------------- */
.ere-property-wrap .ere-property .ere__loop-property-action { gap: 8px; }

/* Иконите върху снимката (галерия/любими/сравнение) — 44×44, не 40×40
   (DESIGN.md §8: минимум 44×44 за всеки интерактивен елемент). */
.ere-property-wrap .ere-property .ere__loop-property_action-item {
	width: 44px;
	height: 44px;
	min-width: 44px;
	background-color: rgba(255, 255, 255, .94);
	color: var(--ig-primary);
	border-radius: var(--ig-radius);
	font-size: 15px;
	transition: background-color var(--ig-t-base) ease, color var(--ig-t-base) ease;
}

.ere-property-wrap .ere-property .ere__loop-property_action-item:focus,
.ere-property-wrap .ere-property .ere__loop-property_action-item:hover {
	background-color: var(--ig-primary);
	color: var(--ig-text-on-dark);
}

.ere-property-wrap .ere-property .ere__loop-property_action-item + .ere__loop-property_action-item { margin-left: 0; }

/* --- Съдържание на картата (мрежа) -------------------------------------- */
.ere-property.property-grid .property-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 0;
}

.ere-property.property-grid .property-item-content {
	padding: 20px 20px 18px;
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}

.ere-property-wrap .ere-property .property-heading { display: flex; flex-direction: column; margin-bottom: 10px; }

/* Цената е най-едрият елемент И стои първа (решение на купувача).
   24 → 26 → 28px по DESIGN.md §8 (виж стълбицата по-долу). Не се свива, за да се
   побере в мрежата: при 3 колони >=1200 картата е ~376px и цената се побира.
   DESIGN.md §4, §7 и §9 го изискват изрично. */
.ere-property-wrap .ere-property .ere__loop-property-price {
	order: -1;
	display: block;
	margin-bottom: 8px;
	font-family: var(--ig-font-display);
	/* DESIGN.md §8 Typography Scaling: цена 1.5rem/24 · 1.625rem/26 · 1.75rem/28.
	   Флуидният --ig-fs-price (clamp(1.5rem, 2vw, 1.75rem)) дава само 25.6px при
	   1280, а §8 иска точно 28px на десктоп — затова тук стойностите са фиксирани
	   по таблицата. */
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: var(--ig-price);
	font-variant-numeric: tabular-nums;
}

.ere-property-wrap .ere-property .ere__loop-property-price .property-price-prefix,
.ere-property-wrap .ere-property .ere__loop-property-price .property-price-postfix {
	font-family: var(--ig-font-body);
	font-size: 12px;
	font-weight: 500;
	color: var(--ig-ink-600);
}

/* Заглавие — Golos Text 17px, макс. 2 реда, НЕ сериф */
.ere-property-wrap .ere-property .property-title {
	margin: 0;
	font-family: var(--ig-font-body);
	font-size: var(--ig-fs-card-title);
	font-weight: 600;
	line-height: 1.35;
	color: var(--ig-ink-950);
	white-space: normal;
	overflow: hidden;
	text-overflow: clip;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.ere-property-wrap .ere-property .property-title a { color: inherit; }

.ere-property-wrap .ere-property .property-title:hover,
.ere-property-wrap .ere-property .property-title a:hover,
.ere-property-wrap .ere-property .property-title a:focus { color: var(--ig-primary); }

/* Локация — 12px 700 UPPERCASE, с икона */
.ere-property-wrap .ere-property .ere__loop-property-location {
	margin-bottom: 12px;
	font-family: var(--ig-font-body);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ig-ink-600);
}

.ere-property-wrap .ere-property .ere__loop-property-location i { color: var(--ig-ink-600); }
.ere-property-wrap .ere-property .ere__loop-property-location a { color: inherit; }

/* Мета ред (тип/агент/дата) */
.ere-property-wrap .ere-property .property-element-inline {
	padding-top: 12px;
	margin-bottom: 12px;
	border-top: 1px solid var(--ig-border-subtle);
	font-family: var(--ig-font-body);
	font-size: var(--ig-fs-meta);
	color: var(--ig-ink-600);
	gap: 12px;
}

.ere-property-wrap .ere-property .property-element-inline a,
.ere-property-wrap .ere-property .property-type-list { color: inherit; }

/* Статистическа лента: БЕЗ оранжево. Темата (6 класа) и ERE (3 класа) я
   оцветяват в оранжево — !important заради по-високата им специфичност.   */
.ere-property .property-inner .ere__loop-property-info {
	background-color: var(--ig-surface-alt) !important;
	color: var(--ig-ink-600) !important;
	border-top: 1px solid var(--ig-border-subtle);
	border-radius: 0;
}

.ere-property .property-inner:hover .ere__loop-property-info,
.ere-property .ere-item-wrap:focus-within .property-inner .ere__loop-property-info { background-color: var(--ig-surface-alt) !important; }

.ere-property-wrap .ere-property .ere__loop-property-info .property-info-inner { padding: 12px 16px; }

/* Пълна ширина и залепена за дъното на картата (равни височини в реда) */
.ere-property.property-grid .property-item-content .ere__loop-property-info { margin: auto -20px -18px; }

.ere-property-wrap .ere-property .ere__loop-property-info .ere__loop-property-info-item i { color: var(--ig-ink-600); }

.ere-property-wrap .ere-property .ere__loop-property-info .ere__lpi-value {
	font-weight: 600;
	color: var(--ig-ink-950);
	font-variant-numeric: tabular-nums;
}

.ere-property-wrap .ere-property .ere__loop-property-info .ere__lpi-label { font-size: 11px; color: var(--ig-ink-600); }
.ere-property-wrap .ere-property .property-excerpt { font-size: var(--ig-fs-body-sm); line-height: 1.6; color: var(--ig-ink-600); }

/* --------------------------------------------------------------------------
   2. Листинг / архив — мрежа 1 / 2 / 3 колони (DESIGN.md §8)

   Картите вървят 1 колона <768 · 2 колони 768–1199 · 3 колони >=1200. Досега
   тук стоеше 4 колони >=1200 — противоречие със §8, което при 270px широка
   карта принуждаваше и цената да падне на 20px, а §4 и основният принцип на
   дизайна искат цената да е най-едрият елемент. Колонният отстъп е 28px по
   §5 (не 20px — причината за нагъстотията отпадна с 4-та колона).
   -------------------------------------------------------------------------- */
.ere-property.property-grid {
	display: grid;
	grid-template-columns: 1fr;
	column-gap: 28px;
	row-gap: 32px;
	/* Нулираме отрицателните отстъпи на ERE (.col-gap-30) */
	margin-left: 0;
	margin-right: 0;
	padding-left: 0;
	padding-right: 0;
}

/* Bootstrap .clearfix::before/::after стават grid items и избутват картите
   с една колона надясно — изключваме ги. */
.ere-property.property-grid::before,
.ere-property.property-grid::after { display: none; content: none; }

@media (min-width: 768px)  { .ere-property.property-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .ere-property.property-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Цената по DESIGN.md §8 — 26px на таблет, 28px на десктоп (тя е най-едрото
   в картата и не се свива, за да се побере в 3-колонната мрежа). */
@media (min-width: 768px) {
	.ere-property-wrap .ere-property .ere__loop-property-price { font-size: 1.625rem; }
}
@media (min-width: 1200px) {
	.ere-property-wrap .ere-property .ere__loop-property-price { font-size: 1.75rem; }
}

/* Мрежата поема подравняването — нулираме ERE колоните и отстъпите */
.ere-property.property-grid .ere-item-wrap {
	width: auto !important;
	max-width: none !important;
	margin-bottom: 0 !important;
	padding-left: 0;
	padding-right: 0;
	float: none !important;
	display: flex;
}

.ere-property.property-list .ere-item-wrap { width: 100% !important; padding-left: 0; padding-right: 0; }

/* --- Архив: контейнер, заглавие, горна лента ---------------------------- */
.ere-archive-property-wrap .ere-archive-property { margin-bottom: 40px; }

.above-archive-property {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 24px;
}

.above-archive-property .ere-heading { margin-bottom: 0; }

/* Заглавието на архива — Display Large (Playfair) */
.ere-archive-property .ere-heading h2,
.post-type-archive-property h1,
.ere-archive-property h1 {
	margin: 0;
	font-family: var(--ig-font-display);
	font-size: var(--ig-fs-display);
	font-weight: 600;
	line-height: var(--ig-lh-display);
	letter-spacing: -0.01em;
	text-transform: none;
	color: var(--ig-ink-950);
}

.ere-archive-property .ere-heading sub {
	font-family: var(--ig-font-body);
	font-size: 40%;
	font-weight: 500;
	color: var(--ig-ink-600);
	vertical-align: middle;
}

/* Оранжевата черта под заглавието на секциите → primary */
.ere-heading::after,
.ere-heading-style2 h2::after { background-color: var(--ig-primary); }

.ere-heading-style2 h2 { font-family: var(--ig-font-body); font-weight: 600; color: var(--ig-ink-950); }

/* --------------------------------------------------------------------------
   3. Единичен имот — двуколонен layout (ляво 7/12 съдържание, дясно 5/12 sticky)
   Реален DOM (проверен в рендиран HTML):
     #primary-content > .container.clearfix
       > .property-info-header.ere__single-property-header-info
       > .single-property-inner > #container > #content > .ere__single-property
   -------------------------------------------------------------------------- */
@media (min-width: 992px) {
	body.single-property #primary-content > .container.clearfix {
		display: grid;
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 28px;
		align-items: start;
	}

	body.single-property #primary-content > .container > .ere__single-property-header-info {
		grid-column: 8 / span 5;
		grid-row: 1;
		position: sticky;
		top: calc(var(--ig-header-h, 80px) + 24px);
	}

	body.single-property #primary-content > .container > .single-property-inner { grid-column: 1 / span 7; grid-row: 1; }

	body.single-property #primary-content > .container > *:not(.ere__single-property-header-info):not(.single-property-inner) { grid-column: 1 / -1; }
}

.single-property-element { margin-bottom: 48px; }

/* --------------------------------------------------------------------------
   4. Спецификации — 2 колони ≥768px → 1 колона <768px (без х-скрол)
   -------------------------------------------------------------------------- */
ul.ere__list-2-col { columns: 2; column-gap: 28px; list-style: none; margin: 0; padding: 0; }

ul.ere__list-2-col li {
	padding: 12px 0;
	border-bottom: 1px solid var(--ig-border-subtle);
	break-inside: avoid;
	overflow: visible;
}

ul.ere__list-2-col li strong,
ul.ere__list-bg-gray strong {
	display: block;
	margin-bottom: 2px;
	font-family: var(--ig-font-body);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .02em;
	color: var(--ig-ink-600);
}

ul.ere__list-2-col li span,
ul.ere__list-2-col li a,
ul.ere__list-bg-gray span { font-size: 15px; font-weight: 400; color: var(--ig-ink-950); }

/* Преглед (Overview) — махаме сивите ивици, слагаме разделители */
ul.ere__list-bg-gray { list-style: none; margin: 0; padding: 0; }

ul.ere__list-bg-gray li,
ul.ere__list-bg-gray li:nth-child(odd) {
	padding: 12px 0;
	background: transparent;
	border-bottom: 1px solid var(--ig-border-subtle);
}

ul.ere__list-bg-gray strong { width: auto; }
ul.ere__list-bg-gray span { display: block; width: auto; }

/* Адресен списък на единичния имот (row/col от Bootstrap) */
.ere__property-address-list { list-style: none; margin: 0; padding: 0; }

.ere__property-address-list .ere__property-location-item {
	padding: 12px 0;
	border-bottom: 1px solid var(--ig-border-subtle);
}

.ere__property-address-list .ere__property-location-item strong {
	font-family: var(--ig-font-body);
	font-size: 13px;
	font-weight: 600;
	color: var(--ig-ink-600);
}

.ere__property-address-list .ere__property-location-item span { font-size: 15px; color: var(--ig-ink-950); }

@media (max-width: 767px) { ul.ere__list-2-col { columns: 1; } }

/* --------------------------------------------------------------------------
   5. Достъпност и движение
   -------------------------------------------------------------------------- */
.ere-property .property-link:focus-visible,
.ere-property .property-title a:focus-visible,
.ere-property .ere__loop-property_action-item:focus-visible,
.ere-property .property-location a:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px var(--ig-focus-ring);
	border-radius: var(--ig-radius-sm);
}

@media (prefers-reduced-motion: reduce) {
	.ere-property .property-inner,
	.ere-property .property-image img { transition: none; }
	.ere-property .ere-item-wrap:hover .property-inner { transform: none; }
	.ere-property .ere-item-wrap:hover .property-image img { transform: none; }
}
