/* Irinas Kerze – zusätzliche Stile */
html { scroll-behavior: smooth; }
body { background:#fbf9f7; color:#1b1c1b; font-family:"DM Sans",sans-serif; }
h1,h2,h3,.font-serif { font-family:"Playfair Display",serif; }

.label-caps { font-size:12px; font-weight:500; letter-spacing:0.14em; text-transform:uppercase; }

.material-symbols-outlined{ font-variation-settings:'FILL' 0,'wght' 300,'GRAD' 0,'opsz' 24; }

/* Buttons */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  padding:.85rem 1.6rem; border-radius:.25rem; cursor:pointer; transition:.25s ease; border:1px solid transparent; }
.btn-primary { background:#30302f; color:#fff; }
.btn-primary:hover { background:#615e59; transform:translateY(-1px); }
.btn-outline { background:transparent; color:#4a463f; border-color:#ccc6bc; }
.btn-outline:hover { background:#f7d8e4; border-color:#f7d8e4; color:#30302f; }
.btn-gold { background:#a1824a; color:#fff; }
.btn-gold:hover { background:#8a6d38; }

.link-underline { position:relative; }
.link-underline::after{ content:""; position:absolute; left:0; bottom:-4px; height:1px; width:0; background:#a1824a; transition:width .3s ease; }
.link-underline:hover::after{ width:100%; }

/* Product card hover */
.product-card img { transition:transform .5s ease; }
.product-card:hover img { transform:scale(1.04); }
.product-card { transition:box-shadow .3s ease, transform .3s ease; }
.product-card:hover { transform:translateY(-4px); }

/* Toast */
#ik-toast { position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(120%);
  background:#30302f; color:#fff; padding:14px 22px; border-radius:8px; font-size:14px;
  box-shadow:0 10px 30px rgba(0,0,0,.2); z-index:9999; transition:transform .35s ease; max-width:90vw; }
#ik-toast.show { transform:translateX(-50%) translateY(0); }

/* Mobile menu */
#ik-mobile-menu { transition:transform .3s ease; }

/* Forms */
.field { width:100%; background:#f5efe9; border:1px solid transparent; border-radius:.25rem;
  padding:.8rem 1rem; font-size:15px; color:#1b1c1b; transition:.2s; }
.field:focus { outline:none; border-color:#a1824a; background:#fff; }
.field::placeholder { color:#9c968c; }
.field-error { border-color:#ba1a1a !important; background:#fff4f3 !important; }

.spinner-badge { animation:pop .3s ease; }
@keyframes pop { 0%{transform:scale(.5)} 100%{transform:scale(1)} }

img.ph-fallback { object-fit:cover; }

/* ---------- Bearbeiten-Modus ---------- */
#ik-editbar { position:fixed; bottom:0; left:0; right:0; z-index:9998; background:#30302f; color:#fff;
  font-family:"DM Sans",sans-serif; font-size:13px; box-shadow:0 -6px 20px rgba(0,0,0,.15); }
.ik-eb-inner { max-width:1280px; margin:0 auto; display:flex; align-items:center; gap:16px; padding:10px 20px; flex-wrap:wrap; }
.ik-eb-brand { font-weight:600; letter-spacing:.05em; }
.ik-eb-toggle { display:flex; align-items:center; gap:8px; cursor:pointer; }
.ik-eb-toggle input { width:16px; height:16px; accent-color:#a1824a; }
.ik-eb-hint { color:#cbc6c0; font-style:italic; }
.ik-eb-spacer { flex:1; }
.ik-eb-link { color:#e7c177; background:none; border:none; cursor:pointer; font-size:13px; text-decoration:none; padding:4px 6px; }
.ik-eb-link:hover { color:#fff; text-decoration:underline; }
body.ik-has-editbar { padding-bottom:60px; }

/* Format-Leiste */
.ik-eb-format { display:flex; align-items:center; gap:6px; padding-left:10px; margin-left:4px; border-left:1px solid rgba(255,255,255,.2); flex-wrap:wrap; }
.ik-eb-sel { background:#413f3d; color:#fff; border:1px solid rgba(255,255,255,.25); border-radius:6px; font-size:12px; padding:4px 6px; cursor:pointer; }
.ik-eb-sel option { color:#1b1c1b; background:#fff; }
.ik-eb-fbtn { background:#413f3d; color:#fff; border:1px solid rgba(255,255,255,.25); border-radius:6px; width:28px; height:28px; cursor:pointer; font-size:13px; line-height:1; display:inline-flex; align-items:center; justify-content:center; }
.ik-eb-fbtn:hover { background:#a1824a; border-color:#a1824a; }
.ik-eb-color { width:28px; height:28px; padding:0; border:1px solid rgba(255,255,255,.25); border-radius:6px; background:none; cursor:pointer; }

.ik-editing [data-edit] { cursor:text; }
.ik-editable { outline:1px dashed rgba(161,130,74,.55); outline-offset:3px; border-radius:2px; transition:background .15s; }
.ik-editable:hover { background:rgba(161,130,74,.08); }
.ik-editable:focus { outline:2px solid #a1824a; background:rgba(161,130,74,.06); }

.ik-editing [data-edit-img] { outline:2px dashed rgba(161,130,74,.7); outline-offset:-2px; }
.ik-img-wrap { position:relative; }
.ik-img-btn { display:none; }
.ik-editing .ik-img-btn { display:inline-block; position:absolute; top:10px; left:10px; z-index:30;
  background:rgba(48,48,47,.9); color:#fff; font-size:12px; font-family:"DM Sans",sans-serif;
  padding:6px 12px; border:none; border-radius:6px; cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.25); }
.ik-editing .ik-img-btn:hover { background:#a1824a; }

/* Highlight-Sektion: Kollektion-Auswahl (nur im Bearbeiten-Modus sichtbar) */
.ik-highlight-pick { display:none; }
.ik-editing .ik-highlight-pick { display:flex; }

/* Frei kuratierbare Container (Foto-Galerie, Produkt-Vitrine): leerer Zustand
   nur im Bearbeiten-Modus sichtbar, sonst für Besucher:innen ausgeblendet */
.ik-empty-zone { display:none; }
.ik-editing .ik-empty-zone { display:block; }

/* Foto-Galerie: Steuerelemente pro Kachel, nur im Bearbeiten-Modus sichtbar */
.ik-ps-remove, .ik-ps-link, .ik-ps-add { display:none; }
.ik-editing .ik-ps-tile { outline:2px dashed rgba(161,130,74,.7); outline-offset:-2px; }
.ik-editing .ik-ps-remove { display:inline-flex; align-items:center; justify-content:center;
  position:absolute; top:8px; right:8px; z-index:20; width:26px; height:26px;
  background:rgba(48,48,47,.9); color:#fff; border:none; border-radius:6px; cursor:pointer;
  box-shadow:0 2px 8px rgba(0,0,0,.25); }
.ik-editing .ik-ps-remove:hover { background:#b3261e; }
.ik-editing .ik-ps-link { display:block; position:absolute; left:8px; right:8px; bottom:8px; z-index:20;
  font-size:11px; padding:4px 6px; border-radius:6px; border:1px solid rgba(255,255,255,.3);
  background:rgba(48,48,47,.9); color:#fff; }
.ik-editing .ik-ps-add { display:flex; }