/*
Theme Name: Lili képben van
Theme URI: https://lilikepbenvan.hu/
Author: Lili képben van – a csapat
Description: A „Lili képben van” saját blokktémája a Leltár-arculattal: katalóguscédulák, bélyegző, AI-címkék, forrásjelek. Önálló téma, szülőtéma nem kell.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
Version: 0.2.0
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lili
*/

/* ---------- Tokenek ----------
   A cédulák minden módban papírszínűek; sötét módban csak a háttér (asztallap)
   és a rajta lévő szöveg vált. */
:root{
  --lili-paper:#efe6d2; --lili-card:#f7f0e1; --lili-card-line:#d8ccb2; --lili-ink:#1a1714; --lili-ink-2:#4a423a;
  --lili-red:#b23a2a; --lili-red-text:#b23a2a; --lili-mustard:#c8962e; --lili-navy:#1e2a44;
  --lili-ground:#201c18; --lili-ground-2:#2c2621; --lili-ledger:#b9c6d8; --lili-sepia-l:#ecdcba;
  --lili-mono:var(--wp--preset--font-family--mono);
  --lili-grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .45  0 0 0 0 .36  0 0 0 0 .22  0 0 0 .07 0'/></filter><rect width='100%' height='100%' filter='url(%23g)'/></svg>");
}
@media (prefers-color-scheme: dark){
  :root{
    --wp--preset--color--base:#1b1814; --wp--preset--color--contrast:#efe6d2;
    --wp--preset--color--muted:#cfc4ae; --wp--preset--color--line:#4a4137;
    --lili-red-text:#e8907a; color-scheme:dark;
  }
}
body{-webkit-font-smoothing:antialiased}
h1,h2,h3{text-wrap:balance}
:focus-visible{outline:3px solid var(--lili-mustard); outline-offset:2px}

/* ---------- Címkék, sorozatcímke ---------- */
.lili-label,.lili-sorozatcimke{font-family:var(--lili-mono); font-weight:700; font-size:.78rem; letter-spacing:.09em; text-transform:uppercase}
.lili-sorozatcimke{color:var(--lili-red-text)}

/* ---------- Fejléc ---------- */


.lili-header .wp-block-navigation a{color:var(--lili-paper)}
.lili-header .wp-block-navigation .current-menu-item>a{border-bottom:2px solid var(--lili-mustard)}
.lili-header .lili-nav-support a{background:var(--lili-mustard); color:var(--lili-ink)!important}
.is-style-lili-logo,.wp-block-site-title.is-style-lili-logo{display:inline-block; background:var(--lili-paper); color:var(--lili-ink); padding:.35rem .8rem .3rem; transform:rotate(-1.5deg); box-shadow:2px 3px 0 rgba(0,0,0,.35); line-height:1}
.is-style-lili-logo a{text-decoration:none; color:var(--lili-ink)}
@media (max-width:720px){
  .lili-header>.wp-block-group{flex-wrap:wrap; row-gap:.5rem}
  .lili-header .wp-block-navigation{flex-basis:100%; overflow-x:auto; scrollbar-width:none;
    -webkit-mask-image:linear-gradient(90deg,#000 85%,transparent); mask-image:linear-gradient(90deg,#000 85%,transparent)}
  .lili-header .wp-block-navigation__container{flex-wrap:nowrap!important; white-space:nowrap}
  .lili-header .lili-nav-support{order:-1}
}

/* ---------- Cédula (blokkstílus a Csoport blokkhoz is) ---------- */
.lili-cedula,.is-style-lili-cedula{
  --wp--preset--color--contrast:var(--lili-ink); --wp--preset--color--muted:var(--lili-ink-2); --wp--preset--color--base:var(--lili-card); --wp--preset--color--line:var(--lili-card-line);
  --lili-red-text:var(--lili-red);
  position:relative; color:var(--lili-ink); background-color:var(--lili-card); background-image:var(--lili-grain);
  border:1px solid var(--lili-card-line); border-radius:2px;
  box-shadow:0 1px 2px rgba(26,23,20,.14), 0 14px 28px -18px rgba(26,23,20,.55);
  padding:clamp(1.4rem,3vw,2rem) clamp(1.1rem,3vw,1.8rem) clamp(1.3rem,3vw,1.8rem) clamp(2.3rem,5vw,3rem)!important;
}
.lili-cedula::before,.is-style-lili-cedula::before{content:""; position:absolute; left:clamp(1.15rem,2.6vw,1.5rem); top:0; bottom:0; border-left:1.5px solid rgba(178,58,42,.45); pointer-events:none}
.lili-cedula::after,.is-style-lili-cedula::after{content:""; position:absolute; left:0; right:0; top:14px; border-top:1.5px solid rgba(178,58,42,.35); pointer-events:none}
.is-style-lili-kartya{
  --wp--preset--color--contrast:var(--lili-ink); --wp--preset--color--muted:var(--lili-ink-2); --wp--preset--color--base:var(--lili-card); --lili-red-text:var(--lili-red);
  color:var(--lili-ink); background-color:var(--lili-card); background-image:var(--lili-grain); border:1px solid var(--lili-card-line);
  box-shadow:0 1px 2px rgba(26,23,20,.14), 0 14px 28px -18px rgba(26,23,20,.55); padding:1.1rem 1.2rem!important}

/* Leltárkarton-adatsorok: a kék vonal az adatsorok alatt fut, a szöveget nem húzza át */
.lili-adatok{display:grid; grid-template-columns:auto 1fr; column-gap:14px; margin:0; font-family:var(--lili-mono); font-size:.92rem; line-height:1.5}
.lili-adatok dt,.lili-adatok dd{margin:0; padding-block:7px; border-bottom:1.5px solid var(--lili-ledger)}
.lili-adatok dt{font-weight:700; white-space:nowrap}

/* ---------- Bélyegző, AI-címke, forrásjel ---------- */
.lili-belyegzo,.is-style-lili-belyegzo{display:inline-block; font-family:var(--lili-mono); font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--lili-red-text); border:3px double currentColor; border-radius:10px; padding:4px 12px; transform:rotate(-6deg)}
.lili-ai{display:inline-block; background:var(--lili-paper); color:var(--lili-ink); border:1px solid var(--lili-ink); font-family:var(--lili-mono); font-weight:700; font-size:.75rem; letter-spacing:.08em; padding:2px 8px}
.lili-ai--sarok{position:absolute; left:10px; top:10px; transform:rotate(1.5deg); z-index:2; border:0}
.lili-forrasjel{position:absolute; right:10px; top:10px; background:var(--lili-paper); color:var(--lili-red); font-family:var(--lili-mono); font-weight:700; font-size:.85rem; padding:2px 7px; transform:rotate(-3deg); z-index:2}
.lili-cikk sup,.lili-ref{font-family:var(--lili-mono); font-weight:700; color:var(--lili-red-text); font-size:.72em}

/* ---------- Fotó (valódi archív kép) ---------- */
.lili-foto{margin:0; display:grid; gap:.5rem}
.lili-foto__kep{position:relative; border:6px solid var(--lili-paper); box-shadow:2px 3px 0 rgba(0,0,0,.2); background:var(--lili-sepia-l); max-width:100%}
.lili-foto__kep img{display:block; width:100%; height:auto}
.lili-foto figcaption{font-family:var(--lili-mono); font-size:.84rem; color:var(--wp--preset--color--muted)}

/* Kártyák a listákban (lekérdezés blokk) */
.lili-videokartyak .wp-block-post-featured-image{position:relative; border:6px solid var(--lili-paper); box-shadow:2px 3px 0 rgba(0,0,0,.2); background:var(--lili-sepia-l)}
.lili-videokartyak .wp-block-post-featured-image img{aspect-ratio:3/4; object-fit:cover}
.lili-videokartyak .wp-block-post-title a{text-decoration:none}
.lili-videokartyak .wp-block-post-title a:hover{text-decoration:underline; text-decoration-color:var(--lili-red)}

/* ---------- Videó: csak kattintásra töltődik (youtube-nocookie) ---------- */
.lili-video{position:relative; aspect-ratio:9/16; width:100%; max-width:360px; background:var(--lili-ground) center/cover no-repeat; border:6px solid var(--lili-ground); color:var(--lili-paper)}
.lili-video--fekvo{aspect-ratio:16/9; max-width:100%}
.lili-video button{position:absolute; inset:0; width:100%; height:100%; border:0; cursor:pointer; background:linear-gradient(180deg,rgba(32,28,24,.15),rgba(32,28,24,.75)); color:var(--lili-paper); display:grid; place-items:center; align-content:center; gap:.7rem; font:inherit}
.lili-video__play{width:74px; height:74px; border-radius:50%; background:var(--lili-mustard); display:grid; place-items:center}
.lili-video__play::before{content:""; border-left:24px solid var(--lili-ink); border-top:15px solid transparent; border-bottom:15px solid transparent; margin-left:6px}
.lili-video small{font-family:var(--lili-mono); font-size:.72rem; max-width:28ch; text-align:center; color:#e6dcc8}
.lili-video iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
.lili-video--varakozik{display:grid; place-items:center; text-align:center; padding:1.5rem; font-family:var(--lili-mono)}

/* ---------- Ami igaz / Ami rajz, források ---------- */
.lili-igaz{border:2px solid currentColor; padding:1.1rem 1.25rem; display:grid; gap:.5rem}
.lili-forrasok{font-family:var(--lili-mono); font-size:.88rem; display:grid; gap:.35rem; padding-left:1.8em}
.lili-forrasok a{color:var(--lili-red-text)}
.lili-megjegyzes{font-size:.88rem; color:var(--wp--preset--color--muted)}

/* ---------- A héten ---------- */
.lili-het{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px}
.lili-het__nap{--lili-red-text:var(--lili-red); background:var(--lili-card) var(--lili-grain); color:var(--lili-ink); border:1px solid var(--lili-card-line); box-shadow:0 1px 2px rgba(26,23,20,.14); padding:14px; display:grid; gap:6px; align-content:start; text-decoration:none}
.lili-het__nap--ma{outline:3px solid var(--lili-mustard)}
.lili-het__nap .d{font-family:var(--lili-mono); font-weight:700; font-size:.8rem}
.lili-het__nap .s{font-family:var(--lili-mono); font-weight:700; font-size:.74rem; letter-spacing:.08em; text-transform:uppercase; color:var(--lili-red)}
@media (max-width:820px){.lili-het{grid-template-columns:1fr 1fr}}
@media (max-width:460px){.lili-het{grid-template-columns:1fr}}

/* ---------- Szótár ---------- */
.lili-szotar{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:18px}
.lili-szo{display:grid; gap:6px}
.lili-szo__w{font-weight:700; font-size:1.5rem; letter-spacing:.02em}
.lili-szo__gram{font-style:italic; color:var(--lili-red)}
.lili-szo__from{font-family:var(--lili-mono); font-size:.84rem; color:var(--lili-ink-2)}

/* ---------- Űrlap ---------- */
.lili-urlap{display:grid; gap:1rem}
.lili-urlap input,.lili-urlap textarea,.lili-urlap select,.lili-urlap button{box-sizing:border-box; max-width:100%}
.lili-urlap>*{min-width:0}
.lili-urlap label{font-family:var(--lili-mono); font-weight:700; font-size:.88rem; display:block; margin-bottom:.3rem}
.lili-urlap input[type=text],.lili-urlap input[type=email],.lili-urlap textarea,.lili-urlap select{width:100%; font:inherit; font-size:1rem; padding:.6rem .75rem; border:1.5px solid var(--lili-ink); background:#fffaf0; color:var(--lili-ink); border-radius:0}
.lili-urlap textarea{min-height:130px; resize:vertical}
.lili-urlap .lili-pipa{display:flex; gap:.6rem; align-items:flex-start; font-family:inherit; font-weight:400; font-size:.95rem}
.lili-urlap .lili-pipa input{margin-top:.35rem; width:18px; height:18px; flex:none}
.lili-urlap .lili-csapda{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.lili-urlap button{justify-self:start; font-family:var(--lili-mono); font-weight:700; font-size:.95rem; padding:.7rem 1.1rem; border:2px solid var(--lili-ink); background:var(--lili-ink); color:var(--lili-paper); cursor:pointer}
.lili-uzenet{border:2px solid currentColor; padding:.8rem 1rem; font-family:var(--lili-mono); font-size:.9rem}

/* ---------- Sötét sáv, lábléc ---------- */
.lili-sav,.lili-lablec{color:#d9cfbb}
.lili-sav h2,.lili-lablec h3{color:var(--lili-paper)}
.lili-sav .hl{color:var(--lili-mustard)}
.lili-sav .wp-block-button__link{background:var(--lili-mustard); border-color:var(--lili-mustard); color:var(--lili-ink)}
.lili-lablec a{color:var(--lili-paper)}
.lili-lablec h3{font-family:var(--lili-mono); font-size:1rem; letter-spacing:.06em; text-transform:uppercase}

/* ---------- Gomb-változat: körvonalas ---------- */
.wp-block-button.is-style-outline .wp-block-button__link{background:transparent; color:currentColor; border:2px solid currentColor}

/* ---------- Szakaszfej ---------- */
.lili-szakaszfej{border-bottom:1px solid var(--wp--preset--color--line); padding-bottom:.75rem}

/* Táblázat telefonon */
.wp-block-table{overflow-x:auto}
.wp-block-table th{font-family:var(--lili-mono); font-size:.8rem; letter-spacing:.06em; text-transform:uppercase}

@media (prefers-reduced-motion:no-preference){.lili-belyegzo--pop{animation:lili-pop .35s ease-out both}}
@keyframes lili-pop{from{transform:rotate(-6deg) scale(1.6); opacity:0} to{transform:rotate(-6deg) scale(1); opacity:1}}

/* ---------- Logó, ragadós fejléc ---------- */
.lili-logo{display:inline-flex; flex-direction:column; text-decoration:none!important; background:var(--lili-paper); color:var(--lili-ink)!important; padding:.4rem .8rem .3rem; transform:rotate(-1.5deg); box-shadow:2px 3px 0 rgba(0,0,0,.35); line-height:1; font-family:var(--lili-mono)}
.lili-logo b{font-size:1.45rem} .lili-logo span{font-weight:700; font-size:.78rem; letter-spacing:.06em}
.wp-site-blocks>header.wp-block-template-part{position:sticky; top:env(safe-area-inset-top,0px); z-index:20}
.admin-bar .wp-site-blocks>header.wp-block-template-part{top:calc(var(--wp-admin--admin-bar--height,32px) + env(safe-area-inset-top,0px))}
.lili-header{border-bottom:3px solid var(--lili-mustard)}
.lili-email{font-family:var(--lili-mono); background:var(--lili-ground-2); color:var(--lili-paper); padding:3px 8px; user-select:all}
.lead{font-size:1.2rem; color:var(--wp--preset--color--muted); max-width:62ch}

/* ---------- Főoldal ---------- */
.lili-kiemel{color:var(--lili-red-text)}
.lili-portre{position:relative; margin:0 auto; max-width:420px; border:10px solid var(--lili-paper); box-shadow:4px 6px 0 rgba(0,0,0,.25); transform:rotate(1.5deg); background:var(--lili-navy)}
.lili-portre img{display:block; width:100%; height:auto; aspect-ratio:4/5; object-fit:cover}
.lili-portre figcaption{position:absolute; bottom:-30px; right:-6px; background:var(--lili-paper); color:var(--lili-ink); font-family:var(--lili-mono); font-size:.8rem; padding:6px 10px; transform:rotate(-2deg); box-shadow:2px 2px 0 rgba(0,0,0,.2); max-width:85%}
.lili-hos .wp-block-buttons .wp-block-button__link{min-width:12rem; text-align:center}
@media (max-width:480px){.lili-hos .wp-block-buttons>.wp-block-button{flex:1 1 100%} .lili-hos .wp-block-button__link{width:100%}}
.lili-sorozatracs{display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:16px}
.lili-sorozatracs a{text-decoration:none; display:grid; gap:6px}
.lili-sorozatracs .s{font-family:var(--lili-mono); font-weight:700; font-size:.76rem; letter-spacing:.09em; text-transform:uppercase; color:var(--lili-red)}
.lili-sorozatracs .w{font-family:var(--lili-mono); font-size:.8rem; color:var(--lili-ink-2)}
.lili-cimkesor{display:flex; gap:8px; flex-wrap:wrap}
.lili-cimkesor a{font-family:var(--lili-mono); font-weight:700; font-size:.85rem; padding:7px 12px; border:1.5px solid currentColor; text-decoration:none}
.lili-cimkesor a:hover{background:var(--wp--preset--color--contrast); color:var(--wp--preset--color--base)}
.lili-harom{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px}
@media (max-width:760px){.lili-harom{grid-template-columns:1fr}}
.lili-szintek{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px}
.lili-szintek .ar{font-size:2.2rem; font-weight:700; font-variant-numeric:tabular-nums}
.lili-szintek .ar small{font-size:1rem; font-weight:400}
@media (max-width:640px){.lili-szintek{grid-template-columns:1fr}}
.wp-block-columns,.wp-block-column{min-width:0}
.lili-valaszok{list-style:none; margin:0; padding:0; display:grid; gap:10px}
.lili-valaszok a{font-weight:700}

/* Menü: térköz a linkek között, telefonon balról indul */
.lili-header .wp-block-navigation-item__content{padding:.45rem .6rem}
.lili-header .lili-nav-support .wp-block-navigation-item__content{padding:.45rem .9rem}
@media (max-width:720px){
  .lili-header .wp-block-navigation,.lili-header .wp-block-navigation__container{justify-content:flex-start!important}
  .lili-header .wp-block-navigation-item__content{padding:.5rem .55rem; font-size:.86rem}
}
.lili-igaz p{margin:0}