/*
Theme Name: Lični Oglasi Rose
Theme URI: https://licnioglasi.rs
Author: licnioglasi.rs
Description: Moderna tema za sajt ličnih oglasa i upoznavanja. Bledo roze pozadina, izbor kategorija za početnu u meniju „Lični oglasi“, 20 oglasa po strani (/strana-2/), oznaka „Premium oglas“ (automatski ili ručno po oglasu), bez prikaza datuma i 18+ obaveštenje pri prvoj poseti. Prilagođena mobilnim telefonima.
Version: 1.2.0
Requires at least: 5.8
Tested up to: 6.6
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: licnioglasi
*/

:root {
	--lo-blush: #F9DCE5;
	--lo-blush-2: #F3C9D7;
	--lo-bar: #F6D3DE;
	--lo-petal: #FFF6F9;
	--lo-ink: #3B1C2A;
	--lo-ink-soft: #7A5566;
	--lo-rasp: #B42F66;
	--lo-rasp-dark: #8E2251;
	--lo-gold: #C8962E;
	--lo-line: rgba(180, 47, 102, 0.18);
	--lo-serif: "Fraunces", Georgia, "Times New Roman", serif;
	--lo-sans: "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; overflow-x: hidden; overflow-x: clip; }

body.lo-theme {
	margin: 0;
	min-height: 100vh;
	color: var(--lo-ink);
	font: 400 16px/1.6 var(--lo-sans);
	background-color: var(--lo-blush);
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
	overflow-x: clip;
}

.lo-theme img { max-width: 100%; height: auto; }
.lo-theme a { color: var(--lo-rasp); }
.lo-theme :focus-visible { outline: 3px solid var(--lo-rasp); outline-offset: 2px; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}
.skip-link:focus {
	position: fixed !important;
	top: 8px; left: 8px; z-index: 100000;
	width: auto; height: auto; clip: auto;
	padding: .7rem 1rem;
	background: var(--lo-petal); color: var(--lo-ink);
	border-radius: 10px;
}

.lo-wrap {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding-left: max(14px, env(safe-area-inset-left));
	padding-right: max(14px, env(safe-area-inset-right));
}
@media (min-width: 600px) { .lo-wrap { padding-left: 24px; padding-right: 24px; } }
.lo-wrap--text { max-width: 800px; }

/* Datumi se nigde ne prikazuju */
.posted-on, .entry-date, .entry-meta time, time.published, time.updated { display: none !important; }

/* ---------- Slika zaglavlja: preko cele širine, na vrhu ---------- */
.lo-hero { width: 100%; margin: 0; padding: 0; line-height: 0; background: var(--lo-blush-2); }
.lo-hero a { display: block; }
.lo-hero__img {
	display: block;
	width: 100% !important;
	max-width: none !important;
	height: auto !important;
	margin: 0;
}

/* ---------- Zaglavlje: logo preko cele širine, bez menija ---------- */
.lo-header {
	position: relative;
	width: 100%;
	margin: 0;
	padding: 0;
	background: var(--lo-bar);
	border-bottom: 1px solid var(--lo-line);
}
.wp-custom-logo .lo-header { background: #fff; }
.lo-header__bar { width: 100%; margin: 0; padding: 0; }
.lo-brand { width: 100%; margin: 0; padding: 0; line-height: 0; }
.lo-brand .custom-logo-link { display: block; width: 100%; margin: 0 auto; max-width: 1200px; }
.lo-brand .custom-logo {
	display: block;
	width: 100% !important;
	max-width: none !important;
	height: auto !important;
	max-height: none !important;
	margin: 0;
}
.lo-brand__title {
	margin: 0;
	padding: 16px max(14px, env(safe-area-inset-left));
	font: 600 24px/1.1 var(--lo-serif);
	letter-spacing: -0.01em;
	text-align: center;
}
.lo-brand__title a { color: var(--lo-ink) !important; text-decoration: none; }

/* ---------- Naslovi ---------- */
.lo-section-title {
	margin: 0 0 12px;
	color: var(--lo-ink);
	font: 600 22px/1.2 var(--lo-serif);
	letter-spacing: -0.01em;
}
@media (min-width: 900px) { .lo-section-title { font-size: 28px; } }
.lo-section-title--ads { margin-top: 26px; }

.lo-listing-head { padding: 24px 0 4px; }
.lo-listing-title { margin: 0; font: 600 clamp(26px, 6vw, 40px)/1.15 var(--lo-serif); letter-spacing: -0.015em; }
.lo-listing-desc { color: var(--lo-ink-soft); max-width: 65ch; }

/* ---------- Kategorije ---------- */
.lo-cats { display: block !important; padding: 20px 0 0; }
.lo-cats__grid {
	list-style: none;
	margin: 0; padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
}
.lo-cats__grid li { margin: 0; padding: 0; list-style: none; }
@media (min-width: 600px) { .lo-cats__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; } }
@media (min-width: 900px) { .lo-cats__grid { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; } .lo-cats { padding-top: 32px; } }

.lo-cat {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	height: 100%;
	min-height: 50px;
	padding: 10px 12px;
	background: var(--lo-petal);
	border: 1.5px solid var(--lo-line);
	border-radius: 14px;
	color: var(--lo-rasp-dark) !important;
	font: 700 15px/1.25 var(--lo-sans);
	text-decoration: none !important;
}
.lo-cat:hover { border-color: var(--lo-rasp); }
.lo-cat__name { overflow-wrap: anywhere; }
.lo-cat__count {
	flex-shrink: 0;
	padding: 1px 8px;
	border-radius: 999px;
	background: var(--lo-blush);
	color: var(--lo-ink-soft);
	font-size: 12px;
	font-weight: 500;
}
.lo-cat.is-current { background: var(--lo-rasp); border-color: var(--lo-rasp); color: #fff !important; }
.lo-cat.is-current .lo-cat__count { background: rgba(255, 255, 255, .22); color: #fff; }

/* ---------- Mreža oglasa ---------- */
.lo-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin: 0 0 28px;
}
@media (min-width: 720px) { .lo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; } }
@media (min-width: 1080px) { .lo-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; } }

.lo-card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	margin: 0;
	overflow: hidden;
	background: var(--lo-petal);
	border: 1px solid var(--lo-line);
	border-radius: 16px;
}
.lo-card--premium { border: 2px solid var(--lo-gold); box-shadow: 0 0 0 3px rgba(200, 150, 46, .15); }

.lo-card__media {
	position: relative;
	display: block;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--lo-blush-2);
}
.lo-card__media img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: none;
	object-fit: cover;
}
.lo-card__noimg {
	display: block;
	width: 100%; height: 100%;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23B42F66' fill-opacity='.3' d='M12 21s-7.5-4.6-9.5-9.2C1.1 8.4 3.2 5 6.6 5c2 0 3.4 1.1 4.4 2.5C12 6.1 13.4 5 15.4 5c3.4 0 5.5 3.4 4.1 6.8C19.5 16.4 12 21 12 21z'/%3E%3C/svg%3E") center / 38% no-repeat;
}

.lo-card__body {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 10px 10px 12px;
}
.lo-card__title {
	flex: 1;
	margin: 0;
	font: 600 15px/1.3 var(--lo-serif);
	overflow-wrap: anywhere;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.lo-card__title a { color: var(--lo-ink) !important; text-decoration: none !important; }
@media (min-width: 720px) {
	.lo-card__body { padding: 14px 14px 16px; gap: 12px; }
	.lo-card__title { font-size: 17px; }
}

/* Oznaka Premium – gornji desni ugao slike */
.lo-badge {
	position: absolute;
	top: 8px; right: 8px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 5px 9px 5px 7px;
	border-radius: 999px;
	background: var(--lo-gold);
	color: #fff;
	font: 700 11px/1 var(--lo-sans);
	letter-spacing: .01em;
	white-space: nowrap;
	box-shadow: 0 3px 10px rgba(110, 66, 8, .3);
	pointer-events: none;
}
.lo-badge svg { width: 13px; height: 13px; flex-shrink: 0; }
@media (min-width: 720px) {
	.lo-badge { top: 10px; right: 10px; font-size: 13px; padding: 6px 11px 6px 8px; gap: 5px; }
	.lo-badge svg { width: 15px; height: 15px; }
}

/* ---------- Dugmad (roze, zaobljena) ---------- */
.lo-btn,
a.lo-btn,
button.lo-btn,
input.lo-btn {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 10px 16px !important;
	margin: 0;
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--lo-rasp) !important;
	background-image: none !important;
	color: #fff !important;
	font: 700 15px/1.1 var(--lo-sans) !important;
	text-align: center;
	text-decoration: none !important;
	text-transform: none !important;
	box-shadow: none !important;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	transition: background-color .15s ease;
}
.lo-btn:hover, .lo-btn:focus-visible, a.lo-btn:visited:hover { background: var(--lo-rasp-dark) !important; color: #fff !important; }
a.lo-btn:visited { color: #fff !important; }
.lo-btn--ghost, a.lo-btn--ghost {
	background: transparent !important;
	color: var(--lo-ink) !important;
	border: 1.5px solid var(--lo-line) !important;
}
.lo-btn--ghost:hover, a.lo-btn--ghost:hover { background: var(--lo-blush) !important; color: var(--lo-ink) !important; }
.lo-card__btn { width: 100%; }
@media (max-width: 400px) {
	.lo-card__btn { font-size: 13px !important; padding: 9px 6px !important; min-height: 40px; }
}

/* ---------- Paginacija ---------- */
.lo-pagination ul.page-numbers {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin: 0 0 40px;
	padding: 0;
}
.lo-pagination li { margin: 0; list-style: none; }
.lo-pagination li > .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px; height: 44px;
	padding: 0 14px;
	background: var(--lo-petal);
	border: 1px solid var(--lo-line);
	border-radius: 999px;
	color: var(--lo-ink) !important;
	font-weight: 700;
	text-decoration: none !important;
}
.lo-pagination li > a.page-numbers:hover { border-color: var(--lo-rasp); color: var(--lo-rasp) !important; }
.lo-pagination li > .current { background: var(--lo-rasp); border-color: var(--lo-rasp); color: #fff !important; }
.lo-pagination li > .dots { background: transparent; border-color: transparent; }

/* ---------- Pojedinačni oglas ---------- */
.lo-single { display: grid; gap: 16px; padding: 16px 0 32px; }
.lo-single__back { margin: 0; }
.lo-single__back a { color: var(--lo-rasp-dark) !important; font-weight: 700; text-decoration: none; }
.lo-single__media {
	position: relative;
	margin: 0;
	overflow: hidden;
	border-radius: 20px;
	background: var(--lo-blush-2);
}
.lo-single__media img { display: block; width: 100%; height: auto; }
.lo-single__cats { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; padding: 0; }
.lo-single__cats a {
	display: inline-block;
	padding: 5px 12px;
	border-radius: 999px;
	background: var(--lo-petal);
	border: 1px solid var(--lo-line);
	color: var(--lo-rasp-dark) !important;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
}
.lo-single__title { margin: 0 0 14px; font: 600 clamp(26px, 6.5vw, 42px)/1.15 var(--lo-serif); letter-spacing: -0.015em; overflow-wrap: anywhere; }
@media (min-width: 900px) {
	.lo-single { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 24px 44px; align-items: start; padding-top: 24px; }
	.lo-single__back { grid-column: 1 / -1; }
	.lo-single__media { position: sticky; top: 84px; }
	.lo-single--noimg { grid-template-columns: minmax(0, 1fr); max-width: 800px; }
}

.lo-content { font-size: 17px; max-width: 68ch; overflow-wrap: break-word; }
.lo-content > *:first-child { margin-top: 0; }
.lo-content h2, .lo-content h3 { font-family: var(--lo-serif); font-weight: 600; line-height: 1.25; }
.lo-content img, .lo-content figure { max-width: 100%; height: auto; border-radius: 14px; }
.lo-content iframe { max-width: 100%; }

/* ---------- Stranice i prazno stanje ---------- */
.lo-page { padding: 24px 0 40px; }
.lo-page__title { margin: 0 0 16px; font: 600 clamp(26px, 6vw, 38px)/1.15 var(--lo-serif); letter-spacing: -0.015em; }
.lo-empty {
	margin: 16px 0 40px;
	padding: 28px 18px;
	text-align: center;
	background: var(--lo-petal);
	border: 1px dashed var(--lo-line);
	border-radius: 18px;
}
.lo-empty--404 { margin-top: 32px; }

/* ---------- Komentari ---------- */
.lo-comments { max-width: 800px; padding-bottom: 40px; }
.lo-comment-list, .lo-comment-list .children { list-style: none; margin: 0; padding: 0; }
.lo-comment-list .children { padding-left: 16px; }
.lo-comment { padding: 14px; margin-bottom: 10px; background: var(--lo-petal); border: 1px solid var(--lo-line); border-radius: 16px; }
.lo-comment__head { display: flex; align-items: center; gap: 10px; }
.lo-comment__head img { border-radius: 50%; }
.lo-comment__wait { color: var(--lo-ink-soft); font-size: 14px; }
.lo-comments input[type="text"], .lo-comments input[type="email"], .lo-comments input[type="url"], .lo-comments textarea {
	width: 100%;
	padding: 12px 14px;
	font: inherit;
	font-size: 16px;
	background: var(--lo-petal);
	border: 1.5px solid var(--lo-line);
	border-radius: 12px;
}

/* ---------- Podnožje ---------- */
.lo-footer {
	padding: 26px 0 calc(26px + env(safe-area-inset-bottom, 0px));
	background: var(--lo-petal);
	border-top: 1px solid var(--lo-line);
	color: var(--lo-ink-soft);
	font-size: 14px;
}
.lo-footer__nav { list-style: none; display: flex; flex-wrap: wrap; gap: 6px 20px; margin: 0 0 12px; padding: 0; }
.lo-footer__nav a { color: var(--lo-ink) !important; font-weight: 500; text-decoration: none; }
.lo-footer__note { margin: 0; }

/* ---------- 18+ obaveštenje ---------- */
.lo-gate {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 999999;
	align-items: center;
	justify-content: center;
	padding: 16px;
	background: rgba(59, 28, 42, .6);
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
}
.lo-gate-on .lo-gate { display: flex; }
.lo-gate-on body { overflow: hidden; }
.lo-gate__box {
	width: 100%;
	max-width: 420px;
	max-height: calc(100vh - 32px);
	overflow-y: auto;
	padding: 28px 20px 20px;
	text-align: center;
	color: var(--lo-ink);
	background: var(--lo-petal);
	border-radius: 24px;
	box-shadow: 0 30px 80px rgba(59, 28, 42, .35);
	animation: lo-gate-in .35s ease-out both;
}
.lo-gate__mark {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 72px; height: 72px;
	margin: 0 auto 14px;
	border-radius: 50%;
	background: var(--lo-rasp);
	color: #fff;
	font: 600 24px/1 var(--lo-serif);
	box-shadow: 0 0 0 8px var(--lo-blush);
}
.lo-gate__title { margin: 0 0 8px; color: var(--lo-ink); font: 600 22px/1.2 var(--lo-serif); }
.lo-gate__text { margin: 0; color: var(--lo-ink-soft); font-size: 15px; line-height: 1.5; }
.lo-gate__actions { display: flex; flex-direction: column; gap: 10px; margin-top: 20px; }
.lo-gate__actions .lo-btn { width: 100%; min-height: 50px; font-size: 16px !important; }
.lo-gate__terms { margin: 14px 0 0; font-size: 13px; }
.lo-gate__terms a { color: var(--lo-ink-soft) !important; }
@keyframes lo-gate-in { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; }
}