/*
Theme Name: AI BREZ ŠUMA
Theme URI: https://aibrezsuma.si
Author: Andrej Sinkovič (Nexus)
Description: Lastna tema portala AI BREZ ŠUMA. Faza 2: ogrodje brez CGP. Barve in pisave so CSS spremenljivke (:root), CGP se zamenja na enem mestu.
Version: 0.2.0
Requires PHP: 8.1
Text Domain: aibs
*/

/* ===== CGP tokeni (faza 5 zamenja samo ta blok) ===== */
:root {
	--barva-ozadje: #ffffff;
	--barva-ozadje-2: #f4f4f4;      /* kartice, okvirji */
	--barva-besedilo: #161616;
	--barva-besedilo-2: #5c5c5c;    /* meta, podnaslovi */
	--barva-crta: #d9d9d9;
	--barva-poudarek: #161616;      /* gumbi (CGP: barva znamke) */
	--barva-poudarek-besedilo: #ffffff;
	--barva-temno: #161616;         /* temna sekcija (newsletter) */
	--barva-temno-besedilo: #ffffff;
	--barva-opozorilo: #8a5a00;     /* testna vsebina, opombe */
	--barva-opozorilo-ozadje: #fff4d6;
	--pisava-naslov: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--pisava-besedilo: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--pisava-mono: ui-monospace, "Cascadia Mono", Consolas, monospace;
	--radij: 0px;
	--sirina: 1120px;
	--sirina-besedilo: 720px;
	--razmik: 24px;
	--glava-visina: 64px;
}

/* ===== Osnova ===== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	font-family: var(--pisava-besedilo);
	font-size: 17px;
	line-height: 1.55;
	color: var(--barva-besedilo);
	background: var(--barva-ozadje);
}
img, video, iframe { max-width: 100%; }
img { height: auto; display: block; }
a { color: inherit; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
h1, h2, h3, h4 { font-family: var(--pisava-naslov); line-height: 1.15; margin: 0 0 .5em; font-weight: 600; letter-spacing: -0.01em; }
h1 { font-size: clamp(30px, 4.5vw, 46px); }
h2 { font-size: clamp(24px, 3vw, 32px); }
h3 { font-size: 21px; }
h4 { font-size: 17px; }
p, ul, ol, table, blockquote, pre { margin: 0 0 1.1em; }
ul, ol { padding-left: 1.3em; }
hr { border: 0; border-top: 1px solid var(--barva-crta); margin: var(--razmik) 0; }
pre, code, kbd { font-family: var(--pisava-mono); font-size: .92em; }
pre { white-space: pre-wrap; word-break: break-word; background: var(--barva-ozadje-2); padding: 16px; border: 1px solid var(--barva-crta); border-radius: var(--radij); }
table { border-collapse: collapse; width: 100%; font-size: .95em; }
th, td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--barva-crta); vertical-align: top; }
th { font-weight: 600; }
button, .gumb { font: inherit; cursor: pointer; }
:focus-visible { outline: 2px solid var(--barva-poudarek); outline-offset: 2px; }
.preskoci { position: absolute; left: -9999px; top: 0; background: var(--barva-temno); color: var(--barva-temno-besedilo); padding: 8px 12px; z-index: 100; }
.preskoci:focus { left: 8px; top: 8px; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.ovoj { width: 100%; max-width: var(--sirina); margin: 0 auto; padding: 0 16px; }
.ovoj-besedilo { max-width: var(--sirina-besedilo); }
.odsek { padding: calc(var(--razmik) * 1.5) 0; border-top: 1px solid var(--barva-crta); }
.odsek-naslov { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--barva-besedilo-2); margin: 0 0 16px; font-weight: 600; display: flex; justify-content: space-between; gap: 16px; align-items: baseline; }
.odsek-naslov a { font-weight: 400; letter-spacing: 0; text-transform: none; font-size: 15px; }
.meta { color: var(--barva-besedilo-2); font-size: 14px; }
.meta a { color: inherit; }
.rubrika { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; font-weight: 600; }
.podnaslov { font-size: 20px; color: var(--barva-besedilo-2); margin: 0 0 1em; line-height: 1.4; }

/* Gumbi */
.gumb { display: inline-block; padding: 10px 18px; border: 1px solid var(--barva-poudarek); background: var(--barva-poudarek); color: var(--barva-poudarek-besedilo); text-decoration: none; border-radius: var(--radij); line-height: 1.2; }
.gumb:hover { opacity: .88; }
.gumb-obroba { background: transparent; color: var(--barva-besedilo); border-color: var(--barva-besedilo); }
.gumb-majhen { padding: 6px 12px; font-size: 14px; }
.temno .gumb { background: var(--barva-temno-besedilo); color: var(--barva-temno); border-color: var(--barva-temno-besedilo); }

/* ===== Glava: ena vrstica, nikoli se ne prelomi ===== */
.glava { border-bottom: 1px solid var(--barva-crta); background: var(--barva-ozadje); position: sticky; top: 0; z-index: 50; }
.glava .ovoj { display: flex; align-items: center; gap: 12px; height: var(--glava-visina); white-space: nowrap; }
.logotip { font-family: var(--pisava-naslov); font-weight: 700; letter-spacing: .02em; text-decoration: none; font-size: 18px; flex: 0 0 auto; }
.glavni-meni { flex: 1 1 auto; min-width: 0; display: flex; justify-content: center; }
.glavni-meni ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 22px; overflow: hidden; }
.glavni-meni a { text-decoration: none; font-size: 15px; padding: 6px 0; }
.glavni-meni .current-menu-item > a, .glavni-meni .trenutno > a { text-decoration: underline; }
.glava-desno { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.gumb-iskanje, .gumb-meni { background: none; border: 1px solid transparent; padding: 6px 8px; display: inline-flex; align-items: center; gap: 6px; font-size: 15px; color: inherit; }
.gumb-iskanje:hover, .gumb-meni:hover { border-color: var(--barva-crta); }
.gumb-meni { display: none; }
@media (max-width: 900px) {
	.glavni-meni { display: none; }
	.gumb-meni { display: inline-flex; }
	.glava .ovoj { gap: 8px; }
	.gumb-newsletter { display: none; }
}
.meni-mobilni { display: none; border-bottom: 1px solid var(--barva-crta); background: var(--barva-ozadje); }
.meni-mobilni[data-odprto="1"] { display: block; }
.meni-mobilni ul { list-style: none; margin: 0; padding: 8px 16px 16px; display: flex; flex-direction: column; }
.meni-mobilni a { display: block; padding: 10px 0; text-decoration: none; border-bottom: 1px solid var(--barva-crta); }
.meni-mobilni li:last-child a { border-bottom: 0; }

/* Iskanje: prekrivno polje */
.iskanje { position: fixed; inset: 0; background: rgba(0,0,0,.5); display: none; align-items: flex-start; justify-content: center; padding-top: 12vh; z-index: 90; }
.iskanje[data-odprto="1"] { display: flex; }
.iskanje-polje { background: var(--barva-ozadje); width: min(680px, calc(100% - 32px)); padding: 20px; border-radius: var(--radij); }
.iskanje-polje form { display: flex; gap: 8px; }
.iskanje-polje input[type="search"] { flex: 1; font: inherit; font-size: 18px; padding: 10px 12px; border: 1px solid var(--barva-besedilo); border-radius: var(--radij); min-width: 0; }
.iskanje-polje .meta { margin-top: 10px; display: flex; justify-content: space-between; }
.iskanje-polje .meta button { background: none; border: 0; text-decoration: underline; color: inherit; padding: 0; }

/* ===== Noga ===== */
.noga { border-top: 1px solid var(--barva-crta); margin-top: calc(var(--razmik) * 2); padding: calc(var(--razmik) * 1.5) 0; font-size: 14px; color: var(--barva-besedilo-2); }
.noga .ovoj { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 24px; }
.noga ul { list-style: none; margin: 0; padding: 0; }
.noga li { margin: 0 0 6px; }
.noga strong { color: var(--barva-besedilo); display: block; margin-bottom: 8px; }
@media (max-width: 700px) { .noga .ovoj { grid-template-columns: 1fr; } }

/* ===== Domov ===== */
.hero { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; padding: calc(var(--razmik) * 1.5) 0; }
.hero-slika { background: var(--barva-ozadje-2); aspect-ratio: 16 / 10; display: flex; align-items: center; justify-content: center; color: var(--barva-besedilo-2); border: 1px solid var(--barva-crta); overflow: hidden; font-size: 14px; }
.hero-slika img { width: 100%; height: 100%; object-fit: cover; }
.hero h1, .hero h2 { margin-top: 8px; }
.hero .dejanja { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin-top: 12px; }
@media (max-width: 800px) { .hero { grid-template-columns: 1fr; } }
.kaj-je-to { font-size: clamp(20px, 2.4vw, 26px); line-height: 1.4; max-width: 860px; margin: 0; }

/* Mreža kartic */
.mreza { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
@media (max-width: 900px) { .mreza { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .mreza { grid-template-columns: 1fr; } }

/* Kartica */
.kartica { border: 1px solid var(--barva-crta); background: var(--barva-ozadje); padding: 18px; border-radius: var(--radij); display: flex; flex-direction: column; gap: 8px; position: relative; }
.kartica .rubrika { color: var(--barva-besedilo-2); }
.kartica h3 { margin: 0; font-size: 19px; }
.kartica h3 a { text-decoration: none; }
.kartica h3 a::after { content: ""; position: absolute; inset: 0; }
.kartica p { margin: 0; }
.kartica .meta { margin-top: auto; padding-top: 8px; display: flex; justify-content: space-between; gap: 8px; }
.kartica:hover { border-color: var(--barva-besedilo); }

/* Vrstica (Zapisi) */
.vrstice { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--barva-crta); }
.vrstica { display: grid; grid-template-columns: 90px 1fr auto; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--barva-crta); align-items: baseline; }
.vrstica .datum { color: var(--barva-besedilo-2); font-size: 14px; font-variant-numeric: tabular-nums; }
.vrstica h3 { margin: 0; font-size: 19px; font-weight: 500; }
.vrstica h3 a { text-decoration: none; }
.vrstica h3 a:hover { text-decoration: underline; }
.vrstica .meta { white-space: nowrap; }
@media (max-width: 600px) { .vrstica { grid-template-columns: 1fr; gap: 4px; } .vrstica .meta { white-space: normal; } }
.mesec { margin: 28px 0 8px; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--barva-besedilo-2); }

/* ===== Članek ===== */
.clanek-glava { padding: calc(var(--razmik) * 1.5) 0 var(--razmik); max-width: 820px; }
.clanek-glava .rubrika { color: var(--barva-besedilo-2); margin-bottom: 8px; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.clanek-glava .deck { font-size: 21px; color: var(--barva-besedilo-2); line-height: 1.4; }
.clanek-telo { max-width: var(--sirina-besedilo); }
.clanek-telo h2 { font-size: 24px; margin-top: 1.6em; padding-top: .6em; border-top: 1px solid var(--barva-crta); }
.clanek-telo > h2:first-child { border-top: 0; margin-top: 0; padding-top: 0; }
.clanek-telo img { margin: 1em 0; }
.clanek-telo figure { margin: 1.2em 0; }
.clanek-telo figcaption { font-size: 14px; color: var(--barva-besedilo-2); }
.clanek-telo blockquote { border-left: 3px solid var(--barva-besedilo); padding-left: 16px; margin-left: 0; color: var(--barva-besedilo-2); }
.video { aspect-ratio: 16 / 9; background: var(--barva-ozadje-2); margin: var(--razmik) 0; max-width: 820px; border: 1px solid var(--barva-crta); }
.video iframe { width: 100%; height: 100%; border: 0; display: block; }
.naslovna { margin: 0 0 var(--razmik); max-width: 820px; }
.oznaka-pregled { border: 1px solid var(--barva-crta); padding: 12px 16px; font-size: 14px; color: var(--barva-besedilo-2); margin: var(--razmik) 0; max-width: var(--sirina-besedilo); display: flex; gap: 8px 16px; flex-wrap: wrap; }
.oznaka-pregled strong { color: var(--barva-besedilo); font-weight: 600; }
.oznaka-test { display: inline-block; background: var(--barva-opozorilo-ozadje); color: var(--barva-opozorilo); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; padding: 3px 8px; font-weight: 600; border-radius: var(--radij); }
.opozorilo { background: var(--barva-opozorilo-ozadje); color: var(--barva-opozorilo); border: 1px solid var(--barva-opozorilo); padding: 12px 16px; margin: 0 0 var(--razmik); font-size: 15px; max-width: 820px; }
.sosednji { display: flex; justify-content: space-between; gap: 16px; padding-top: var(--razmik); border-top: 1px solid var(--barva-crta); margin-top: calc(var(--razmik) * 1.5); font-size: 15px; max-width: 820px; }
.sosednji a { text-decoration: none; }
.sosednji a:hover { text-decoration: underline; }
.stevilke { list-style: none; padding: 0; }
.stevilke li { display: grid; grid-template-columns: 1fr auto; gap: 4px 16px; padding: 10px 0; border-bottom: 1px solid var(--barva-crta); }
.stevilke .vrednost { font-weight: 600; font-variant-numeric: tabular-nums; }
.stevilke .vir { grid-column: 1 / -1; font-size: 14px; color: var(--barva-besedilo-2); }
.viri { list-style: none; padding: 0; }
.viri li { padding: 8px 0; border-bottom: 1px solid var(--barva-crta); font-size: 15px; }
.viri .tip { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--barva-besedilo-2); margin-left: 8px; }
.polje { margin: 0 0 1.2em; }
.polje dt { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--barva-besedilo-2); font-weight: 600; margin-bottom: 4px; }
.polje dd { margin: 0; }
.okvir { border: 1px solid var(--barva-besedilo); padding: 16px 20px; margin: var(--razmik) 0; max-width: 820px; }
.okvir .rubrika { margin-bottom: 6px; }
.okvir p:last-child { margin-bottom: 0; }

/* ===== Predvajalnik zvoka ===== */
.predvajalnik { border: 1px solid var(--barva-crta); padding: 16px; margin: var(--razmik) 0; max-width: 820px; background: var(--barva-ozadje-2); }
.predvajalnik .vrsta1 { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.predvajalnik button { background: var(--barva-ozadje); border: 1px solid var(--barva-crta); padding: 8px 12px; border-radius: var(--radij); font-size: 14px; line-height: 1; color: inherit; }
.predvajalnik button:hover { border-color: var(--barva-besedilo); }
.predvajalnik .predvajaj { background: var(--barva-poudarek); color: var(--barva-poudarek-besedilo); border-color: var(--barva-poudarek); font-weight: 600; padding: 10px 16px; min-width: 110px; }
.predvajalnik .hitrosti { display: inline-flex; border: 1px solid var(--barva-crta); background: var(--barva-ozadje); }
.predvajalnik .hitrosti button { border: 0; border-left: 1px solid var(--barva-crta); padding: 8px 10px; }
.predvajalnik .hitrosti button:first-child { border-left: 0; }
.predvajalnik .hitrosti button[aria-pressed="true"] { background: var(--barva-besedilo); color: var(--barva-ozadje); }
.predvajalnik .cas { font-variant-numeric: tabular-nums; font-size: 14px; color: var(--barva-besedilo-2); min-width: 86px; }
.predvajalnik .prenesi { margin-left: auto; font-size: 14px; }
.predvajalnik progress { width: 100%; height: 6px; margin: 12px 0 4px; accent-color: var(--barva-besedilo); display: block; }
.predvajalnik .opomba { font-size: 13px; color: var(--barva-besedilo-2); margin: 8px 0 0; }
.predvajalnik details { margin-top: 10px; font-size: 15px; }
.predvajalnik summary { cursor: pointer; }
.predvajalnik .transkript { margin-top: 8px; white-space: pre-wrap; }
@media (max-width: 600px) { .predvajalnik .prenesi { margin-left: 0; } }

/* ===== Kopiraj / prenesi ===== */
.kopirni-blok { border: 1px solid var(--barva-crta); margin: var(--razmik) 0; max-width: 820px; }
.kopirni-blok .glava-bloka { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--barva-crta); background: var(--barva-ozadje-2); flex-wrap: wrap; }
.kopirni-blok .glava-bloka .rubrika { color: var(--barva-besedilo-2); }
.kopirni-blok .dejanja { display: flex; gap: 8px; flex-wrap: wrap; }
.kopirni-blok .dejanja button, .kopirni-blok .dejanja a { background: var(--barva-ozadje); border: 1px solid var(--barva-crta); padding: 6px 10px; font-size: 14px; color: inherit; text-decoration: none; border-radius: var(--radij); }
.kopirni-blok .dejanja button:hover, .kopirni-blok .dejanja a:hover { border-color: var(--barva-besedilo); }
.kopirni-blok pre { margin: 0; border: 0; background: transparent; padding: 14px; font-size: 15px; }
.gumb-kopiraj[data-kopirano="1"] { background: var(--barva-besedilo) !important; color: var(--barva-ozadje) !important; border-color: var(--barva-besedilo) !important; }

/* ===== Knjižnica AI v praksi: filtri ===== */
.filtri { display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: center; margin: 0 0 16px; font-size: 14px; }
.filtri .oznaka-filtra { color: var(--barva-besedilo-2); min-width: 72px; }
.filtri a { text-decoration: none; border: 1px solid var(--barva-crta); padding: 4px 10px; border-radius: var(--radij); }
.filtri a[aria-current="true"] { background: var(--barva-besedilo); color: var(--barva-ozadje); border-color: var(--barva-besedilo); }
.koraki { counter-reset: korak; list-style: none; padding: 0; }
.koraki li { counter-increment: korak; display: grid; grid-template-columns: 32px 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--barva-crta); }
.koraki li::before { content: counter(korak); font-weight: 600; color: var(--barva-besedilo-2); }

/* ===== Pravila ===== */
.pravila { display: grid; grid-template-columns: 240px 1fr; gap: 40px; padding: calc(var(--razmik) * 1.5) 0; }
.pravila-meni ul { list-style: none; margin: 0; padding: 0; position: sticky; top: calc(var(--glava-visina) + 16px); }
.pravila-meni a { display: block; padding: 8px 0; text-decoration: none; border-bottom: 1px solid var(--barva-crta); font-size: 15px; }
.pravila-meni a[aria-current="page"] { font-weight: 600; }
.pravila-meni .rubrika { color: var(--barva-besedilo-2); margin-bottom: 8px; }
@media (max-width: 800px) { .pravila { grid-template-columns: 1fr; gap: 16px; } .pravila-meni ul { position: static; display: flex; flex-wrap: wrap; gap: 6px; } .pravila-meni a { border: 1px solid var(--barva-crta); padding: 4px 10px; font-size: 14px; } }
.posodobljeno { margin-top: var(--razmik); padding-top: 12px; border-top: 1px solid var(--barva-crta); font-size: 14px; color: var(--barva-besedilo-2); }

/* ===== Newsletter sekcija ===== */
.temno { background: var(--barva-temno); color: var(--barva-temno-besedilo); padding: calc(var(--razmik) * 2) 0; margin-top: calc(var(--razmik) * 1.5); }
.temno a { color: inherit; }
.temno .odsek-naslov { color: inherit; opacity: .7; }
.vpis { display: grid; grid-template-columns: 1.2fr 1fr; gap: 32px; align-items: start; }
@media (max-width: 800px) { .vpis { grid-template-columns: 1fr; } }
.vpis h2 { margin-top: 0; }
.vpis-obrazec { display: flex; flex-direction: column; gap: 12px; }
.vpis-obrazec .vrsta { display: flex; gap: 8px; }
.vpis-obrazec input[type="email"] { flex: 1; font: inherit; padding: 10px 12px; border: 1px solid currentColor; background: transparent; color: inherit; border-radius: var(--radij); min-width: 0; }
.vpis-obrazec input[type="email"]::placeholder { color: inherit; opacity: .6; }
.vpis-obrazec label.soglasje { display: flex; gap: 10px; font-size: 14px; align-items: flex-start; line-height: 1.4; }
.vpis-obrazec label.soglasje input { margin-top: 3px; flex: 0 0 auto; }
.vpis-obrazec .meta { opacity: .75; color: inherit; }
.skrito { position: absolute; left: -9999px; }
.obvestilo { padding: 12px 16px; border: 1px solid currentColor; margin: 0 0 16px; font-size: 15px; }

/* ===== Projekti ===== */
.projekt .stanje { font-size: 12px; letter-spacing: .06em; text-transform: uppercase; border: 1px solid var(--barva-crta); padding: 2px 8px; display: inline-block; }
.projekt .povezave { display: flex; gap: 14px; font-size: 14px; flex-wrap: wrap; }
.projekt .povezave a { position: relative; z-index: 1; }

/* ===== Seznam (arhivi) ===== */
.arhiv-glava { padding: calc(var(--razmik) * 1.5) 0 var(--razmik); max-width: 820px; }
.arhiv-glava .podnaslov { margin-bottom: 0; }
.paginacija { display: flex; gap: 8px; margin: var(--razmik) 0; font-size: 15px; flex-wrap: wrap; }
.paginacija .page-numbers { border: 1px solid var(--barva-crta); padding: 6px 12px; text-decoration: none; }
.paginacija .current { background: var(--barva-besedilo); color: var(--barva-ozadje); border-color: var(--barva-besedilo); }
.prazno { color: var(--barva-besedilo-2); padding: var(--razmik) 0; }
.osebi { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width: 700px) { .osebi { grid-template-columns: 1fr; } }
.kolofon th { width: 220px; color: var(--barva-besedilo-2); font-weight: 400; }

/* Gutenberg osnove v vsebini */
.wp-block-image img { height: auto; }
.alignwide { max-width: var(--sirina); }