/* ============= Yama Les – Styles ============= */

/* Grid voor overzicht */
.yama-lessen-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:20px;
  margin:20px 0;
}

/* Kaart */
.yama-lesson-card{
  background:#fff;
  border:1px solid #eee;
  border-radius:16px;
  padding:14px;
  box-shadow:0 2px 10px rgba(0,0,0,.03);
  transition:transform .06s ease, box-shadow .12s ease;
}
.yama-lesson-card:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 18px rgba(0,0,0,.06);
}
.yama-lesson-card img{
  width:100%;
  height:auto;
  border-radius:12px;
  display:block;
}
.lesson-title{ margin:.6em 0; }
.lesson-title a{ color:#318277; text-decoration:none; }
.lesson-title a:hover{ text-decoration:underline; }
.lesson-meta{ color:#666; margin:.2em 0 .8em; font-size:.95em; }
.lesson-excerpt{ color:#333; }

/* Detailpagina */
.yama-lesson--detail .yama-lesson-image{
  border-radius:16px;
  max-width:100%;
  height:auto;
  display:block;
}
.yama-lesson-title{
  margin:.6em 0 .4em;
}
.yama-lesson-facts{
  list-style:none;
  padding:0;
  margin:1em 0;
}
.yama-lesson-facts li{
  margin:.25em 0;
}

/* Notices / meldingen */
.yama-notice{
  padding:.8em 1em;
  margin:1em 0;
  border-radius:8px;
  background:#f0f7ff;
}
.yama-notice--ok{ background:#eefaf1; }
.yama-notice--warn{ background:#fff4f0; }

/* Reserveer-knop */
.yama-lesson-button{
  display:inline-block;
  padding:.8em 1.2em;
  border-radius:999px;
  text-decoration:none;
  background:#6b3180;   /* paars */
  color:#fff;
  font-weight:600;
  transition:transform .05s ease, box-shadow .12s ease, opacity .12s ease;
  box-shadow:0 4px 12px rgba(0,0,0,.08);
  border:0;
  cursor:pointer;
}
.yama-lesson-button:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(0,0,0,.12);
}
.yama-lesson-button:disabled{
  opacity:.6;
  cursor:not-allowed;
}

/* Kleine helpers */
.yama-lesson-actions{ margin-top:1rem; }

/* Responsive tweaks */
@media (max-width: 480px){
  .yama-lessen-grid{ gap:14px; }
  .yama-lesson-card{ padding:12px; }
  .lesson-title{ font-size:1.05rem; }
  .yama-lesson-button{ width:100%; text-align:center; }
}