/* =========================
   Alap változók
   ========================= */
.wpv-tematika{
  --wpv-text-color:#25273E;
  --wpv-icon-color:#25273E;

  --wpv-bg:#ffffff;
  --wpv-head-bg:#ffffff;
  --wpv-head-bg-open:#ffffff;
  --wpv-head-b:#e6e6ed;
  --wpv-muted:#25273E;
  --wpv-radius:0px;
  --wpv-gap:16px;
  --wpv-row-b:#e6e6ed;
}

.wpv-tematika *{ box-sizing:border-box; }

.wpv-tematika .acc-item{ margin:0; }
.wpv-tematika .acc-item + .acc-item{ margin-top:var(--wpv-gap); }

.wpv-tematika summary::-webkit-details-marker{ display:none; }
.wpv-tematika summary::marker{ content:""; }

/* =========================
   Szakasz fejléc
   ========================= */
.wpv-tematika .acc-head{
  appearance:none;
  -webkit-appearance:none;
  background:var(--wpv-head-bg);
  border:1px solid var(--wpv-head-b);
  color:var(--wpv-text-color);
  border-radius:var(--wpv-radius);
  width:100%;
  text-align:left;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 16px;

  line-height:1.35;
  font-weight:600;
  cursor:pointer;
  transition:border-color .2s ease, background-color .2s ease;

  flex-wrap:wrap;
}

.wpv-tematika .acc-item[open] > .acc-head{
  background:var(--wpv-head-bg-open);
}

.wpv-tematika .acc-item:hover > .acc-head{
  border-color:#c2c2d2;
}

.wpv-tematika .acc-title{
  font-size:16px;
  font-weight:600;
  color:var(--wpv-text-color);
  flex:1 1 auto;
  min-width:0;
}

/* =========================
   Fejléc meta (lecke / idő)
   ========================= */
.wpv-tematika .acc-right{
  margin-left:auto;
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.wpv-tematika .acc-meta{
  font-size:13px;
  color:var(--wpv-text-color);
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}

.wpv-tematika .acc-meta-item{
  display:inline-flex;
  align-items:center;
  gap:6px;
  justify-content:flex-end;
}

.wpv-tematika .acc-meta-lessons{ min-width:76px; }


/* =========================
   Panel és leckesorok
   ========================= */
.wpv-tematika .acc-panel{
  border:1px solid var(--wpv-row-b);
  border-top:none;
  background:var(--wpv-bg);
}

.wpv-tematika .lesson-row{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  padding:10px 16px;
  border-top:1px solid var(--wpv-row-b);
}

.wpv-tematika .lesson-title{
  font-size:15px;
  color:var(--wpv-text-color);
}

.wpv-tematika .lesson-len{
  font-size:13px;
  color:var(--wpv-text-color);
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-variant-numeric:tabular-nums;
}

/* =========================
   Felső összegzés
   ========================= */
.wpv-tematika .wpv-tematika-summary{
  margin:8px 0 16px;
  font-size:14px;
  font-weight:700;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.wpv-tematika .wpv-sum-item{
  display:inline-flex;
  align-items:center;
  gap:6px;
}

/* =========================
   Theme ütközések ellen
   ========================= */
.wpv-tematika .wpv-sum-item::before,
.wpv-tematika .wpv-sum-item::after,
.wpv-tematika .wpv-sum-text::before,
.wpv-tematika .wpv-sum-text::after,
.wpv-tematika .acc-meta-item::before,
.wpv-tematika .acc-meta-item::after{
  content:none !important;
}

/* =========================
   Ikonok (mask + színezhető)
   ========================= */
.wpv-tematika .wpv-meta-icon,
.wpv-tematika .acc-meta-icon,
.wpv-tematika .acc-icon{
  width:16px;
  height:16px;
  flex:0 0 16px;
  background-color:var(--wpv-icon-color);

  -webkit-mask-repeat:no-repeat;
  -webkit-mask-position:center;
  -webkit-mask-size:contain;
  mask-repeat:no-repeat;
  mask-position:center;
  mask-size:contain;
}

.wpv-tematika .acc-head .acc-icon{
  -webkit-mask-image:url("ikon-plusz.svg");
  mask-image:url("ikon-plusz.svg");
}

.wpv-tematika .acc-item[open] > .acc-head .acc-icon{
  -webkit-mask-image:url("ikon-minusz.svg");
  mask-image:url("ikon-minusz.svg");
}

.wpv-tematika .wpv-icon-module{
  -webkit-mask-image:url("modul.svg");
  mask-image:url("modul.svg");
}

.wpv-tematika .wpv-icon-lesson{
  -webkit-mask-image:url("lecke.svg");
  mask-image:url("lecke.svg");
}

.wpv-tematika .wpv-icon-time{
  -webkit-mask-image:url("ido.svg");
  mask-image:url("ido.svg");
}

/* =========================
   Mobil törések
   ========================= */
@media (max-width:640px){
  .wpv-tematika .acc-meta{ gap:6px; }
}

@media (max-width:360px){
  .wpv-tematika .acc-right{ width:100%; }
  .wpv-tematika .acc-meta{
    white-space:normal;
    flex-wrap:wrap;
    font-size:12px;
  }
  .wpv-tematika .acc-meta-lessons{ min-width:0; }
}

/* =========================
   Mini shortcode
   ========================= */
.wpv-tematika-mini{
  --wpv-mini-text-color:#25273E;
  --wpv-mini-icon-color:#25273E;
  --wpv-mini-font-size:14px;
  --wpv-mini-icon-size:16px;

  color:var(--wpv-mini-text-color);
  font-size:var(--wpv-mini-font-size);
  font-weight:700;
  display:inline-flex;
  gap:10px;
  flex-wrap:wrap;
}

.wpv-tematika-mini .wpv-sum-item{
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.wpv-tematika-mini .wpv-meta-icon{
  width:var(--wpv-mini-icon-size) !important;
  height:var(--wpv-mini-icon-size) !important;
  flex:0 0 var(--wpv-mini-icon-size) !important;
  background-color:var(--wpv-mini-icon-color);

  -webkit-mask-repeat:no-repeat;
  -webkit-mask-position:center;
  -webkit-mask-size:100% 100%;
  mask-repeat:no-repeat;
  mask-position:center;
  mask-size:100% 100%;
}

.wpv-tematika-mini .wpv-icon-lesson{
  -webkit-mask-image:url("lecke.svg");
  mask-image:url("lecke.svg");
}

.wpv-tematika-mini .wpv-icon-time{
  -webkit-mask-image:url("ido.svg");
  mask-image:url("ido.svg");
}

.wpv-tematika-mini .wpv-icon-attachment{
  -webkit-mask-image:url("ikon-melleklet.svg");
  mask-image:url("ikon-melleklet.svg");
}

.wpv-tematika-mini .wpv-icon-quiz{
  -webkit-mask-image:url("ikon-kviz.svg");
  mask-image:url("ikon-kviz.svg");
}

.wpv-tematika-mini .wpv-sum-item::before,
.wpv-tematika-mini .wpv-sum-item::after{
  content:none !important;
}