.container .btn-inside {
    background-color: #A1FDD6;
    color: #2b003e;
    border: none;
    padding: 10px 20px 10px 20px;
    font-size: 1.2rem;
    font-weight: normal;
    text-decoration-line: none;
    text-decoration-style: solid;
    text-decoration-thickness: auto;
    margin-top: 10px;
    
}

.container .btn-inside:hover {
  background-color: #FED3E5;
  display: block;
}

.container .btn-inside{
  appearance: none;
  -webkit-appearance: none;
}

/* Lenyíló menü */
/* Saját szín változó – itt tudod a márkaszínt állítani */
.pretty-select { --brand:#110011; }

/* Wrapper az egyedi nyílhoz */
.select-wrap{
  position:relative;
  width:min(420px,100%);
}

/* A natív nyíl eltüntetése és a stílus */
.pretty-select{
  

  width:100%;
  padding:.7rem 2.6rem .7rem .9rem;
  border:.1px solid var(--brand);
  border-radius:1px;
  background:#A1FDD6;
  color:##110011;           /* sötétszürke szöveg */
  font-size:1rem;
  line-height:1.2;
  cursor:pointer;

  transition:border-color .2s, box-shadow .2s, background-color .2s;
  margin: 10px;
}




/* Letiltott állapot */
.pretty-select:disabled{
  opacity:.6;
  cursor:not-allowed;
}



/* (Opcionális) az opciók megjelenése – támogatás böngészőtől függ */
.pretty-select option{
  color:#111827;
}
.pretty-select option:checked{
  background:#ede9fe; /* lila árnyalat */
  font-weight:600;
}

/* lenyíló menü vége */

.cards-wrap {
    max-width: 720px;
    margin: 0 auto;
    padding: 1rem
}

.cards-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem
}


/* Konténer: NEM forog, csak a perspektívát adja */
.lc-card{
  position:relative;
  width:100%;
  min-height:180px;
  margin:0;
  border:1px solid #ddd;
  border-radius:16px;
  overflow:hidden;                 /* szélek ne látszódjanak */
  perspective:1000px;
  -webkit-perspective:1000px;
}

/* Belső: EZ forog */
.lc-card-inner{
  position:relative;
  width:100%;
  min-height:180px;
  padding:1.2rem;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.25rem;
  line-height:1.5;
  transform-style:preserve-3d;
  -webkit-transform-style:preserve-3d;
  transition:transform .5s ease;
  will-change: transform;
}

/* A flip animáció ideiglenes tiltásához */
.lc-card.no-anim .lc-card-inner {
  transition: none !important;
}

/* Flip állapot csak az innerre hasson */
.lc-card.flipped .lc-card-inner{
  transform:rotateY(180deg);
}

/* Két oldal – csak az egyik legyen látható egyszerre */
.lc-face{
  position:absolute;
  inset:0;
  padding:1.2rem;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;                 /* ne látszódjon át a másik oldal */
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  transform:rotateY(0deg);         /* fontos iOS-en a frontnak is legyen transform */
  line-height: 1.35;
  overflow-wrap: break-word; word-break: normal;
}

/* Ebben a blokkban folyik a szöveg + képlet normálisan */
.lc-text{
  max-width: 92%;
  text-align: left;
  line-height: 1.35;
  overflow-wrap: break-word;  /* szebben tör, mint 'anywhere' */
  word-break: normal;
}

.lc-text mjx-container { overflow: visible; }

.lc-face mjx-container { overflow: visible; }

.lc-front{
  z-index:2;                       /* elöl */
  transform:rotateY(0deg);
}

.lc-back{
  z-index:1;
  transform:rotateY(180deg);
}

.lc-wrap{max-width:720px;margin:0 auto;padding:1rem}
.lc-title{margin:.2rem 0 1rem 0;font-size:1.5rem;font-weight:700}

.progress {
    margin-top: .5rem;
    color: #555;
}

.done.hidden {
    display: none;
}

/* --- gombok --- */
.lc-btn-row{
  display:flex; gap:.6rem; justify-content:center; margin-top:1rem;
}
.lc-btn{
  border:none; padding:.8rem 1.2rem; border-radius:12px;
  cursor:pointer; font-size:1rem; line-height:1;
  transition:transform .05s ease, filter .15s ease;
}
.lc-btn:active{ transform:translateY(1px); }
.lc-btn:focus{ outline:2px solid #60a5fa; outline-offset:2px; }

.lc-ok{ background:#22c55e; color:#fff; }
.lc-no{ background:#ef4444; color:#fff; }

/* csak az egyik face legyen látható az állapottól függően */
.lc-card:not(.flipped) .lc-back { visibility: hidden; }
.lc-card.flipped .lc-front { visibility: hidden; }

/* (emlékeztető – a flip alapjai maradjanak) */
.lc-card .lc-card-inner { transition: transform .5s ease; transform-style: preserve-3d; }
.lc-back { transform: rotateY(180deg); }

/* frissítés közben mindkét oldal rejtve legyen, hogy még véletlen se villanjon */
.lc-card.updating .lc-face { visibility: hidden !important; }



@media (max-width:599px){
  .lc-card{min-height:160px}
  .lc-card-inner{min-height:160px;font-size:1.1rem}
  .lc-btn{ width:48%; }
}