/* ============================================================================
   Videótanár – cikk-rendszer stílus (a videotanar.com színvilágához illesztve)
   kék #1bb1dc · zöld #19ab3f · narancs #f66329 · szöveg #413e66
   ============================================================================ */
:root{
  /* A korábbi kék helyett zöld (kérésre minden kék elem zöld lett). */
  --c-kek:#19ab3f; --c-kek-sotet:#0f7a2b;
  --c-zold:#19ab3f; --c-zold-sotet:#0f7a2b;
  --c-narancs:#f66329;
  --c-piros:#d90718; --c-piros-sotet:#b00512;
  --c-szoveg:#413e66; --c-halvany:#7b7996;
  --c-bg:#f5f8fd; --c-vonal:#e2e6ef;
  --c-arnyek:0 3px 14px rgba(65,62,102,.10);
  --c-arnyek-eros:0 8px 26px rgba(65,62,102,.18);
}

/* --- Cikk-olvasó ---------------------------------------------------------- */
.cikk-container{ max-width:960px; margin:0 auto; padding:100px 15px 60px; }
.cikk-doboz{ background:#fff; border:1px solid var(--c-vonal); border-radius:14px; box-shadow:var(--c-arnyek); padding:30px 34px; color:var(--c-szoveg); font-family:'Open Sans',Arial,sans-serif; font-size:16px; line-height:1.7; }
.cikk-fejlec{ border-bottom:3px solid var(--c-zold); padding-bottom:14px; margin-bottom:20px; }
.cikk-fejlec h1{ color:var(--c-piros); font-family:'Montserrat',Arial,sans-serif; font-weight:700; font-size:30px; margin:0 0 8px; }
.cikk-meta{ display:flex; gap:18px; flex-wrap:wrap; color:var(--c-halvany); font-size:14px; font-weight:600; }
.cikk-meta .megtekintes{ color:#000; }
.cikk-meta .megtekintes .szam{ color:var(--c-piros); font-weight:800; }
.cikk-akciok{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:6px 0 20px; }
.cikk-akcio-vissza{ display:inline-flex; align-items:center; gap:6px; background:var(--c-zold); color:#fff !important; text-decoration:none !important; font-family:Helvetica,Arial,sans-serif; font-size:14px; font-weight:bold; padding:6px 12px; border-radius:4px; box-shadow:0 1px 2px rgba(0,0,0,.2); transition:background-color .2s ease; }
.cikk-akcio-vissza:hover{ background:var(--c-zold-sotet); color:#fff !important; }
.cikk-borito{ width:100%; max-height:460px; object-fit:cover; border-radius:10px; margin:0 0 20px; border:1px solid var(--c-vonal); }
.cikk-bevezeto{ font-size:18px; font-weight:600; color:var(--c-zold-sotet); margin:0 0 18px; }
/* A cikk törzsszövege ugyanazzal a betűtípussal, mint a bevezető (előszöveg):
   a beillesztett tartalom saját betűtípusát is felülírjuk, hogy egységes legyen. */
/* ▼▼▼ ITT ÁLLÍTHATÓ a cikk törzsszövegének térközlése ▼▼▼
   - SORKÖZ (sorok közötti távolság):        a lenti  line-height  érték
        kisebb szám = sűrűbb sorok (pl. 1.3),  nagyobb = lazább (pl. 1.7)
   - BEKEZDÉS-TÁVOLSÁG (paragrafusok között): a .cikk-szoveg p  utáni  margin  értéke
        kisebb szám = kisebb térköz (pl. 4px), nagyobb = nagyobb térköz (pl. 16px) */
.cikk-szoveg{ font-size:16px; line-height:1.45; font-family:'Open Sans',Arial,sans-serif; }
.cikk-szoveg p{ margin:0 0 8px; }
/* ▲▲▲ eddig tart az állítható rész ▲▲▲ */
.cikk-szoveg, .cikk-szoveg p, .cikk-szoveg span, .cikk-szoveg div,
.cikk-szoveg li, .cikk-szoveg td, .cikk-szoveg font{ font-family:'Open Sans',Arial,sans-serif !important; }
.cikk-szoveg img{ max-width:100%; height:auto; border-radius:8px; }
.cikk-szoveg a{ color:var(--c-kek-sotet); }

/* Szekciócímek + zöld vonal */
.cikk-szekcio{ color:var(--c-narancs); font-family:'Montserrat',Arial,sans-serif; font-weight:700; font-size:20px; margin:30px 0 16px; padding-bottom:8px; border-bottom:2px solid var(--c-zold); }

.cikk-csatolmanyok{ list-style:none; padding:0; margin:0; }
.cikk-csatolmanyok li{ margin:0 0 8px; }
.cikk-csatolmanyok a{ display:inline-block; background:#eafff5; border:1px solid #cdeed7; border-radius:8px; padding:8px 14px; font-weight:600; color:var(--c-szoveg); text-decoration:none; }
.cikk-csatolmanyok a:hover{ border-color:var(--c-zold); color:var(--c-zold-sotet); }

.cikk-galeria{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; }
.cikk-galeria a{ display:block; cursor:zoom-in; }
.cikk-galeria img{ width:100%; height:130px; object-fit:cover; border-radius:8px; border:1px solid var(--c-vonal); }

.cikk-videok{ margin:6px 0; }
.cikk-video-keret{ position:relative; padding-bottom:56.25%; height:0; margin-bottom:16px; border-radius:10px; overflow:hidden; box-shadow:var(--c-arnyek); }
.cikk-video-keret iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }

.cikk-vissza{ margin-top:24px; }
.cikk-gomb{ display:inline-block; background:var(--c-kek); color:#fff !important; padding:10px 20px; border-radius:8px; font-weight:700; text-decoration:none !important; }
.cikk-gomb:hover{ background:var(--c-kek-sotet); }

/* --- Képnézegető (lightbox) ---------------------------------------------- */
.clb{ display:none; position:fixed; inset:0; z-index:99999; background:rgba(20,18,40,.92); align-items:center; justify-content:center; padding:30px; }
.clb.nyitva{ display:flex; }
.clb-tartalom{ margin:0; max-width:92vw; max-height:88vh; text-align:center; }
.clb-kep{ max-width:92vw; max-height:82vh; object-fit:contain; border:3px solid #fff; border-radius:6px; background:#fff; box-shadow:0 6px 30px rgba(0,0,0,.5); }
.clb-szamlalo{ color:#fff; font-weight:700; margin-top:12px; font-size:15px; }
.clb-bezar{ position:absolute; top:16px; right:26px; background:none; border:none; color:#fff; font-size:46px; line-height:1; cursor:pointer; }
.clb-bezar:hover{ color:var(--c-narancs); }
.clb-nyil{ position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.14); border:none; color:#fff; font-size:40px; width:60px; height:84px; cursor:pointer; border-radius:8px; }
.clb-nyil:hover{ background:var(--c-kek); }
.clb-elozo{ left:18px; } .clb-kovetkezo{ right:18px; }
@media (max-width:640px){ .clb-nyil{ width:46px; height:66px; font-size:30px; } .clb-elozo{ left:6px; } .clb-kovetkezo{ right:6px; } .clb-bezar{ top:8px; right:12px; } }

/* ============================================================================
   ADMIN felület (cikk-admin) – letisztult, a videotanar színeivel
   ============================================================================ */
.ca-body{ background:var(--c-bg); font-family:'Open Sans',Arial,sans-serif; color:var(--c-szoveg); margin:0; }
.ca-keret{ max-width:1080px; margin:0 auto; padding:24px 18px 60px; }
.ca-fejlec{ display:flex; align-items:center; justify-content:space-between; gap:16px; background:#fff; border:1px solid var(--c-vonal); border-radius:12px; box-shadow:var(--c-arnyek); padding:14px 20px; margin-bottom:22px; }
.ca-fejlec .cim{ font-family:'Montserrat',Arial,sans-serif; font-weight:700; font-size:20px; color:var(--c-kek-sotet); }
.ca-fejlec .trikolor{ height:4px; }

.ca-cimsor{ border-left:5px solid var(--c-zold); padding-left:14px; margin:0 0 20px; }
.ca-cimsor h1{ color:var(--c-narancs); font-family:'Montserrat',Arial,sans-serif; font-size:24px; margin:0; font-weight:700; }

.ca-gomb{ display:inline-block; background:var(--c-kek); color:#fff !important; padding:9px 16px; border-radius:8px; font-weight:700; font-size:14px; border:none; cursor:pointer; text-decoration:none !important; font-family:inherit; line-height:1.2; box-sizing:border-box; text-align:center; }
.ca-gomb:hover{ background:var(--c-kek-sotet); }
.ca-gomb.zold{ background:var(--c-zold); } .ca-gomb.zold:hover{ background:var(--c-zold-sotet); }
.ca-gomb.narancs{ background:var(--c-narancs); } .ca-gomb.narancs:hover{ background:#d94e18; }
.ca-gomb.halvany{ background:#fff; color:var(--c-kek-sotet) !important; border:1px solid var(--c-kek); }
.ca-gomb.halvany:hover{ background:#eaf7fc; }

.ca-racs{ display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:16px; }
.ca-csempe{ display:flex; flex-direction:column; align-items:center; gap:10px; background:#fff; border:1px solid var(--c-vonal); border-radius:12px; box-shadow:var(--c-arnyek); padding:22px 16px; text-align:center; color:var(--c-szoveg); font-weight:700; text-decoration:none; }
.ca-csempe:hover{ border-color:var(--c-kek); color:var(--c-kek-sotet); box-shadow:var(--c-arnyek-eros); }
.ca-csempe .ikon{ font-size:30px; }

.ca-urlap{ background:#fff; border:1px solid var(--c-vonal); border-radius:12px; box-shadow:var(--c-arnyek); padding:22px 24px; max-width:760px; }
.ca-urlap label{ display:block; font-weight:700; margin:14px 0 6px; color:var(--c-kek-sotet); }
.ca-urlap input[type=text],.ca-urlap input[type=password],.ca-urlap input[type=date],.ca-urlap input[type=file],.ca-urlap textarea,.ca-urlap select{ width:100%; padding:10px 12px; border:1px solid var(--c-vonal); border-radius:8px; font-size:15px; font-family:inherit; box-sizing:border-box; }
.ca-urlap textarea{ min-height:200px; resize:vertical; }
.ca-urlap .ca-gomb{ min-width:130px; }

.ca-uzenet{ padding:12px 16px; border-radius:8px; margin-bottom:16px; font-weight:700; }
.ca-uzenet.siker{ background:#eafff5; color:var(--c-zold-sotet); border:1px solid #cdeed7; }
.ca-uzenet.hiba{ background:#fdeaea; color:#c0392b; border:1px solid #f3c9c9; }

table.ca-tabla{ width:100%; border-collapse:collapse; background:#fff; box-shadow:var(--c-arnyek); border-radius:12px; overflow:hidden; }
table.ca-tabla th{ background:var(--c-kek); color:#fff; text-align:left; padding:10px 12px; font-size:14px; }
table.ca-tabla td{ padding:10px 12px; border-bottom:1px solid var(--c-vonal); font-size:14px; }
table.ca-tabla tr:hover td{ background:var(--c-bg); }
table.ca-tabla .ca-gomb{ min-width:120px; }

.ca-vissza{ display:flex; align-items:center; justify-content:space-between; gap:12px; background:#eafff5; border:1px solid #cdeed7; border-radius:10px; padding:10px 16px; margin-bottom:18px; }
.ca-vissza a{ font-weight:700; color:var(--c-zold-sotet); text-decoration:none; }
.ca-vissza a:hover{ color:var(--c-narancs); }
.ca-vissza a.ki{ color:var(--c-narancs); }

/* média-kezelő (képek/videók/csatolmányok) */
.ca-kepek{ display:flex; flex-wrap:wrap; gap:14px; }
.ca-kep{ position:relative; width:170px; background:#fff; border:1px solid var(--c-vonal); border-radius:10px; box-shadow:var(--c-arnyek); padding:8px; text-align:center; }
.ca-kep img{ width:100%; height:120px; object-fit:cover; border-radius:6px; border:1px solid var(--c-vonal); }
.ca-sorszam{ position:absolute; top:4px; left:4px; background:var(--c-zold); color:#fff; font-weight:800; font-size:13px; padding:1px 8px; border-radius:6px; }
.ca-mgombok{ display:flex; gap:5px; justify-content:center; margin-top:8px; }
.ca-mgombok form{ margin:0; }
.ca-mgombok button{ border:1px solid var(--c-vonal); background:#fff; border-radius:6px; cursor:pointer; width:40px; height:32px; font-size:13px; color:var(--c-kek-sotet); }
.ca-mgombok button:hover:not([disabled]){ background:#eaf7fc; }
.ca-mgombok button[disabled]{ opacity:.35; cursor:default; }
.ca-mgombok button.torol{ color:var(--c-narancs); }

.ca-lista{ display:flex; flex-direction:column; gap:12px; max-width:820px; }
.ca-sor{ position:relative; display:flex; align-items:center; gap:14px; background:#fff; border:1px solid var(--c-vonal); border-radius:10px; box-shadow:var(--c-arnyek); padding:10px 12px 10px 40px; }
.ca-sor .thumb img{ width:120px; height:68px; object-fit:cover; border-radius:6px; border:1px solid var(--c-vonal); display:block; }
.ca-sor .jobb{ flex:1; display:flex; align-items:center; gap:10px; flex-wrap:wrap; min-width:0; }
.ca-sor .mod{ display:flex; gap:6px; flex:1; min-width:220px; margin:0; }
.ca-sor .mod input[type=text]{ flex:1; min-width:0; padding:8px 10px; border:1px solid var(--c-vonal); border-radius:8px; font-size:14px; }

.ca-lapozo{ display:flex; gap:6px; flex-wrap:wrap; margin:14px 0; }
.ca-lapozo a,.ca-lapozo span{ min-width:36px; text-align:center; padding:7px 10px; border:1px solid var(--c-vonal); border-radius:7px; font-weight:700; color:var(--c-kek-sotet); background:#fff; text-decoration:none; }
.ca-lapozo a:hover{ background:#eaf7fc; }
.ca-lapozo .aktiv{ background:var(--c-kek); color:#fff; border-color:var(--c-kek); }