/* =========================================================================
   Mount Lavinia – Gutschein-Geschenkseite + WooCommerce-Wrapper
   Helles Design (Oliv/Creme/Gold). Nutzt die Theme-Variablen aus theme.css.
   ========================================================================= */

.mlgs-page{ background:var(--olive); }

/* Heller Inhalts-Panel unter dem Seitenkopf */
.mlgs-panel{
  background:var(--cream);
  border-radius:22px 22px 0 0;
  max-width:1180px;
  margin:1rem auto 0;
  padding:2.4rem clamp(1rem,4vw,3rem) 3.4rem;
  box-shadow:0 -6px 40px rgba(30,32,18,.18);
}
.mlgs-intro{
  max-width:720px; margin:0 auto 2rem; text-align:center;
  font-family:var(--serif); font-size:clamp(1.05rem,2vw,1.3rem);
  line-height:1.7; color:var(--soft);
}
.mlgs-notice{
  text-align:center; padding:2rem; background:var(--paper);
  border:1px solid var(--parch); border-radius:14px; color:var(--soft);
}

/* Karten-Raster */
.mlgs-cards{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1.6rem; align-items:stretch;
}
@media(max-width:900px){ .mlgs-cards{ grid-template-columns:1fr; max-width:460px; margin:0 auto; } }

.mlgs-card{
  display:flex; flex-direction:column;
  background:var(--card); border:1px solid var(--parch);
  border-radius:16px; overflow:hidden;
  box-shadow:0 6px 22px rgba(30,32,18,.08);
  transition:transform .3s var(--e), box-shadow .3s var(--e);
}
.mlgs-card:hover{ transform:translateY(-4px); box-shadow:0 14px 40px rgba(30,32,18,.16); }
.mlgs-card--feature{ border-color:var(--gold); box-shadow:0 8px 30px rgba(201,151,58,.22); }

/* Bild / Platzhalter */
.mlgs-media{
  height:170px; background-size:cover; background-position:center;
  background-color:var(--olive-pale);
}
.mlgs-media--ph{
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--olive) 0%,var(--olive-dk) 100%);
  position:relative;
}
.mlgs-media--ph::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 30% 20%,rgba(228,184,96,.25),transparent 60%);
}
.mlgs-media--ph span{
  font-family:var(--label); letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold-lt); font-size:.9rem; z-index:1; padding:0 1rem; text-align:center;
}

.mlgs-body{ padding:1.3rem 1.3rem 1.5rem; display:flex; flex-direction:column; gap:.55rem; flex:1; }
.mlgs-title{ font-family:var(--serif); font-size:1.7rem; font-weight:600; color:var(--ink); margin:0; line-height:1.1; }
.mlgs-tag{ font-family:var(--label); letter-spacing:.12em; text-transform:uppercase; font-size:.66rem; color:var(--gold); margin:0; }
.mlgs-desc{ font-size:.92rem; line-height:1.55; color:var(--soft); margin:.2rem 0; }
.mlgs-price{ font-family:var(--serif); font-size:1.5rem; color:var(--olive); font-weight:600; margin:.1rem 0; }
.mlgs-price span{ font-size:.8rem; color:var(--soft); font-weight:400; }

/* Options-Gruppen */
.mlgs-opt{ border:0; margin:.4rem 0 0; padding:0; }
.mlgs-opt legend{ font-family:var(--label); letter-spacing:.08em; text-transform:uppercase; font-size:.64rem; color:var(--soft); margin-bottom:.4rem; padding:0; }

.mlgs-chip{ display:flex; align-items:center; gap:.5rem; padding:.42rem .6rem; border:1px solid var(--parch);
  border-radius:9px; margin-bottom:.35rem; cursor:pointer; font-size:.86rem; color:var(--ink);
  transition:border-color .2s,background .2s; }
.mlgs-chip:hover{ border-color:var(--olive-lt); }
.mlgs-chip:has(input:checked){ border-color:var(--olive); background:rgba(80,85,52,.06); }
.mlgs-chip input{ accent-color:var(--olive); }
.mlgs-chip em{ font-style:normal; color:var(--gold); }

.mlgs-check{ display:flex; align-items:center; gap:.5rem; font-size:.84rem; color:var(--ink); margin-bottom:.3rem; cursor:pointer; }
.mlgs-check em{ font-style:normal; color:var(--gold); margin-left:auto; }
.mlgs-addons{ background:var(--paper); border:1px dashed var(--parch); border-radius:9px; padding:.6rem .7rem; }

/* Betrags-Buttons */
.mlgs-amt-row{ display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:.6rem; }
.mlgs-amt{ flex:1 1 28%; min-width:64px; padding:.5rem .2rem; border:1px solid var(--parch); border-radius:9px;
  background:#fff; color:var(--ink); font-family:var(--sans); font-weight:600; cursor:pointer;
  transition:all .2s var(--e); }
.mlgs-amt:hover{ border-color:var(--gold); }
.mlgs-amt.is-on{ background:var(--olive); color:var(--white); border-color:var(--olive); }
.mlgs-custom{ display:flex; align-items:center; justify-content:space-between; gap:.6rem; font-size:.8rem; color:var(--soft); font-family:var(--label); letter-spacing:.06em; text-transform:uppercase; }
.mlgs-eurfield{ display:inline-flex; align-items:center; gap:.25rem; border:2px solid var(--olive); border-radius:9px; padding:.25rem .55rem; background:#fff; }
.mlgs-eurfield input{ width:76px; border:0; font-size:1.05rem; font-weight:700; color:var(--ink); text-align:right; background:transparent; -moz-appearance:textfield; }
.mlgs-eurfield input:focus{ outline:none; }
.mlgs-eurfield span{ color:var(--soft); font-weight:600; }
.mlgs-hint{ font-size:.72rem; color:var(--soft); margin:.4rem 0 0; }

/* Aktions-Button */
.mlgs-btn{
  margin-top:auto; width:100%; padding:.85rem 1rem; border:0; border-radius:10px;
  background:var(--olive); color:var(--white);
  font-family:var(--label); letter-spacing:.1em; text-transform:uppercase; font-size:.82rem;
  cursor:pointer; transition:background .25s var(--e), transform .1s;
}
.mlgs-btn:hover{ background:var(--olive-dk); }
.mlgs-btn:active{ transform:translateY(1px); }
.mlgs-card--feature .mlgs-btn{ background:var(--gold); color:var(--olive-dk); }
.mlgs-card--feature .mlgs-btn:hover{ background:var(--gold-lt); }

/* Fokus-Sichtbarkeit (Barrierefreiheit) */
.mlgs-card :focus-visible{ outline:3px solid var(--gold); outline-offset:2px; border-radius:6px; }

/* Vertrauens-Zeile */
.mlgs-trust{ list-style:none; display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin:2.6rem auto 0; max-width:900px; padding:0; text-align:center; }
@media(max-width:760px){ .mlgs-trust{ grid-template-columns:repeat(2,1fr); } }
.mlgs-trust li{ display:flex; flex-direction:column; gap:.2rem; }
.mlgs-trust strong{ font-family:var(--serif); font-size:1.05rem; color:var(--olive); }
.mlgs-trust span{ font-size:.78rem; color:var(--soft); }

/* =========================================================================
   WooCommerce-Seiten (Warenkorb / Checkout) im Theme-Rahmen
   ========================================================================= */
.mlgs-wc{ background:var(--olive); min-height:60vh; }
.mlgs-wc-inner{
  background:var(--cream); max-width:1100px; margin:1rem auto 0;
  border-radius:22px 22px 0 0; padding:2rem clamp(1rem,4vw,3rem) 3.4rem;
  box-shadow:0 -6px 40px rgba(30,32,18,.18);
}
.mlgs-wc-inner a{ color:var(--olive); }
.mlgs-wc-inner .button,
.mlgs-wc-inner button.button,
.mlgs-wc-inner .wc-block-components-button{
  background:var(--olive) !important; color:var(--white) !important; border-radius:9px !important;
}
.mlgs-wc-inner .button:hover{ background:var(--olive-dk) !important; }
.mlgs-checkout-fields{ margin:1.4rem 0; padding:1.2rem; background:var(--paper); border:1px solid var(--parch); border-radius:12px; }
.mlgs-checkout-fields h3{ font-family:var(--serif); color:var(--olive); margin:0 0 .6rem; }

/* ---- Lieferoptionen: Hinweise (sofort digital bei Post / Vorbereitung bei Abholung) ---- */
.mlgs-hint{ margin:.55rem 0 0; font-size:.82rem; line-height:1.5; color:var(--olive); background:rgba(80,85,52,.08); border-left:3px solid var(--olive); border-radius:0 8px 8px 0; padding:.55rem .8rem; }
.mlgs-hint-post strong{ color:var(--olive-dk); }
.mlgs-addons-lead{ margin:0 0 .55rem; font-size:.82rem; color:var(--olive); }
.mlgs-hint-pickup{ margin-top:.6rem; background:rgba(228,184,96,.15); border-left-color:var(--gold); }
