/*
 * Pločica firme — hex pozadina + beli vektorski logo.
 * Dimenzije su preuzete iz postojećeg klasičnog dizajna da se izgled ne promeni:
 *   standard/premium : 225x225 kvadrat (raster koji menjamo je bio merkle-225-225.png)
 *   mini             : 27x27 sa marginama (iz legacy.css: .oglas-mini img)
 */

.st-tile {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #333;
	overflow: hidden;
	line-height: 1;
}

.st-tile img {
	display: block;
	width: 70%;
	height: auto;
	max-width: 100%;
	max-height: 80%;
	object-fit: contain;
	margin: 0;
}

.st-tile-link {
	display: block;
}

/*
 * Dimenzije MORAJU da prate originalna pravila iz legacy.css, jer kartica ima
 * fiksnu visinu (381px) — previsoka pločica je prelije i razvali float layout:
 *
 *   .listing-oglas-standard      { height: 381px; width: 225px; }
 *   .listing-oglas-standard img  { width: 225px; height: 225px; margin-bottom: 14px; }
 *   .listing-oglas-premium       { height: 381px; width: 470px; }
 *   .listing-oglas-premium img   { width: 470px; height: 255px; margin-bottom: 14px; }
 *
 * Premium NIJE kvadrat — 470x255. I `margin-bottom: 14px` je taj vazduh između
 * pločice i naslova pozicije; bez njega naslov naleže na pločicu.
 *
 * Koristimo aspect-ratio (ne fiksne px) jer kartice u media query-jima prelaze
 * na procentualne širine.
 */
.st-tile--standard,
.st-tile--premium {
	width: 100%;
	margin-bottom: 14px;
}

.st-tile--standard {
	aspect-ratio: 225 / 225;
}

.st-tile--premium {
	aspect-ratio: 470 / 255;
}

/* Mini — mala pločica levo, iste dimenzije i margine kao stari <img>. */
.st-tile--mini {
	width: 27px;
	height: 27px;
	flex: 0 0 27px;
	margin: 12px 11px 0 11px;
}

/*
 * Postojeće pravilo iz legacy.css (`.oglas-mini img { width:27px; height:27px;
 * margin:12px 11px 0 }`) bi pogodilo i logo UNUTAR pločice i razvalilo ga.
 * Zato ga eksplicitno gasimo za img unutar pločice.
 */
.oglas-mini .st-tile img {
	width: 84%;
	height: auto;
	margin: 0;
}

/* Fallback: inicijali kad firma nema ni SVG ni raster. */
.st-tile--fallback .st-tile__initials {
	color: #fff;
	font-family: 'msr7', 'museo_sans_rounded700', Arial, sans-serif;
	font-weight: 700;
	letter-spacing: 0.02em;
}

.st-tile--standard.st-tile--fallback .st-tile__initials,
.st-tile--premium.st-tile--fallback .st-tile__initials {
	font-size: 56px;
}

.st-tile--mini.st-tile--fallback .st-tile__initials {
	font-size: 11px;
}