/* Csomag-kártyák és az árazási váltók -- KÖZÖS a landing #arak szekciójával és az app
   Előfizetések oldalával (spec 5.: "ugyanúgy jelenjenek meg a csomagok, mint a landing
   page-n"). Ezek a szabályok korábban a landing.css-ben éltek; azért kerültek külön fájlba,
   mert az app oldala (index.html) nem tölthetné be az egész landing.css-t anélkül, hogy annak
   oldal-szintű szabályai (hero, szekciók, footer) belenyúlnának a Tabler-alapú felületbe.
   A .lp- prefix megmarad, hogy a landing meglévő markupja változatlanul működjön. */

.lp-price-toggle {
  display: inline-flex;
  background: #eef1f6;
  border-radius: 2rem;
  padding: 4px;
  gap: 4px;
}
.lp-price-toggle button {
  border: 0;
  background: transparent;
  padding: .55rem 1.6rem;
  border-radius: 2rem;
  font-weight: 700;
  font-size: .95rem;
  color: #475067;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}
.lp-price-toggle button.active {
  background: #fff;
  color: var(--tblr-primary);
  box-shadow: 0 2px 8px rgba(28, 50, 90, .12);
}
.lp-price-toggle button.pt-konyvelo.active { color: var(--tblr-green); }

.lp-price {
  position: relative;
  border: 1px solid #e9edf4;
  border-radius: .6rem;
  box-shadow: 0 1px 2px rgba(28, 50, 90, .04);
  transition: transform .15s ease, box-shadow .15s ease;
}
.lp-price-feat { border-color: var(--tblr-primary); box-shadow: 0 18px 40px -20px rgba(32, 107, 196, .5); }
.lp-price-feat-k { border-color: var(--tblr-green); box-shadow: 0 18px 40px -20px rgba(47, 179, 68, .5); }
.lp-plan { font-weight: 700; font-size: 1.05rem; color: #344056; }
.lp-amount { font-size: 2rem; font-weight: 800; letter-spacing: -.02em; margin: .25rem 0; }
.lp-amount span { font-size: .9rem; font-weight: 500; color: #8a93a6; }
/* A fenti általános `.lp-amount span` szabály a mértékegység-feliratnak (pl. "Ft + ÁFA / hó")
   készült, de a szelektor az árcédula NAGY számát (`.lp-amount-value`, szintén egy span) is
   eltalálja -- emiatt maga az összeg (nem csak a felirat) jelent meg halványan, kicsiben. Ez a
   visszaállítás konkrétan a nagy számot érinti, a mértékegység-feliratot nem. */
.lp-amount .lp-amount-value { font-size: 2rem; font-weight: 800; color: inherit; }
.lp-ul { list-style: none; padding: 0; margin: 0 0 1.5rem; }
.lp-ul li { position: relative; padding: .35rem 0 .35rem 1.5rem; color: #475067; font-size: .95rem; }
.lp-ul li::before {
  content: "✓";
  position: absolute; left: 0;
  color: var(--tblr-green);
  font-weight: 700;
}
.lp-ribbon {
  position: absolute; top: -12px; right: 16px;
  background: var(--tblr-primary); color: #fff;
  font-size: .72rem; font-weight: 700;
  padding: .25rem .7rem; border-radius: 2rem;
  box-shadow: 0 6px 14px -6px rgba(32, 107, 196, .8);
}
/* A .lp-ribbon UTÁN kell állnia (azonos specificitás — a később definiált győz), különben a
   könyvelői szalag kéken maradna a zöld helyett. */
.lp-ribbon-k { background: var(--tblr-green); box-shadow: 0 6px 14px -6px rgba(47, 179, 68, .8); }