.leasing-field{display:flex;flex-direction:column;width:100%;margin-bottom:10px}
.leasing-field input,.leasing-field select{width:100%;padding:5px}
.leasing-row{display:flex;gap:20px}
.produktname-wrapper{display:flex;align-items:center}
.produktname-wrapper input{flex:1;width:100%;padding:8px;margin-right:5px;border:1px solid #ccc;border-radius:4px}
.produktinfo-modal-content input,.produktinfo-modal-content select{width:100%;padding:8px;margin-bottom:15px;border:1px solid #ccc;border-radius:4px}
.modal.filled{background-color:#e0ffe0}
.modal.filled input{border:1px solid #28a745}
.form-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.artikel-group{flex:0 0 55px;max-width:55px}
.preis-group,.vergleichspreis-group{flex:0 0 70px;max-width:70px}
.produktname-group,.input-with-button,#custom-update-text{flex:1}
.form-group{display:flex;flex-direction:column;margin:0}
#artikel,#preis,#vergleichPreisInput{width:100%;text-align:center}
.inline-container{display:flex;align-items:center}
.inline-label{margin-right:5px}
.inline-select{width:auto}
.input-with-button{position:relative;display:flex;width:100%}
.input-with-button input{flex:1;padding-right:35px;box-sizing:border-box}
.input-with-button button.einfuegen-button{position:absolute;right:5px;top:50%;transform:translateY(-50%);border:none;background:transparent;cursor:pointer;font-size:18px;color:#666}
.input-with-button button.einfuegen-button:hover{color:#000}
.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:1000;overflow:auto}
.modal-content{background:#fff;margin:2% auto 0 auto;padding:20px;border-radius:8px;width:90%;max-width:1000px;box-shadow:0 4px 8px rgba(0,0,0,.2)}
.modal label{font-weight:bold;color:#333}
.modal button{padding:8px 16px;margin-left:10px;border:none;border-radius:4px;cursor:pointer;color:#fff}
.absenden-button{background-color:#28a745}
.absenden-button:hover{background-color:#218838}
.schliessen-button{background-color:#dc3545}
.schliessen-button:hover{background-color:#c82333}
.buttons{margin-top:20px;text-align:right}
#sparabo-group,#onlineonly-group{display:inline-block;margin-left:10px}
#marktguru-button{margin-left:auto;background-color:#00AEEF}
#bewertung-fields .preisvergleich-zeile,.preisvergleich-zeile{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:10px}
.bewertung-feld{display:flex;flex-direction:column}
.bewertung-feld.klein{flex:0 0 auto;width:100px;max-width:100px}
.bewertung-feld.gross{flex:1;min-width:100px}
.url-input-container{display:flex;align-items:center}
.url-input-container input[type="url"]{flex:1;min-width:0}
.preis-feld{flex:0 0 70px;max-width:70px}
.url-feld{flex:1 1 auto}
.preis-feld input,.url-feld input{width:100%;padding:8px;box-sizing:border-box}
#artikel-anzahl-checkboxes{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
#artikel-anzahl-checkboxes input[type="radio"]{display:none}
#artikel-anzahl-checkboxes label{padding:6px 12px;border-radius:6px;background-color:#f0f0f0;cursor:pointer;border:1px solid #ccc;transition:all .2s ease;font-size:14px}
#artikel-anzahl-checkboxes input[type="radio"]:checked + label{background-color:#0073aa;color:#fff;border-color:#0073aa}
#gutschein-form label[for="gutscheincode"],#gutschein-form input[type="text"]#gutscheincode{display:inline-block;vertical-align:middle}
#gutschein-form label[for="gutscheincode"]{margin-right:10px}
.datum-uhrzeit{display:flex;align-items:center;gap:10px;margin-top:10px}
.datum-uhrzeit input[type="date"],.datum-uhrzeit input[type="time"]{width:auto;flex:1}
.update-row{display:flex;justify-content:flex-start;align-items:flex-start;gap:10px;margin-bottom:20px}
.deal-field,.compare-field{flex:0 0 120px;max-width:120px;display:flex;flex-direction:column}
.deal-field input,.compare-field input{width:100%;box-sizing:border-box}
.dropdown-content{display:none;position:absolute;background-color:#f9f9f9;min-width:300px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);padding:10px;z-index:1;display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.dropdown-button{background-color:#f7f7f7;border:1px solid #ccd0d4;color:#555;padding:6px 10px;font-size:13px;cursor:pointer;border-radius:3px}
.dropdown-button:hover{background-color:#f1f1f1;border-color:#b4b9be}
.dropdown-item{padding:8px;cursor:pointer;text-align:center}
.dropdown-item:hover{background-color:#ddd}
.custom-info-message{position:fixed;top:20px;right:20px;background:#e8f4fd;border:1px solid #b3d4fc;padding:15px;border-radius:5px;z-index:9999;box-shadow:0 2px 6px rgba(0,0,0,.2)}
#gutscheincode-ablaufdatum-form{display:none;margin-top:10px;display:flex;justify-content:space-between;gap:20px}
.gutscheincode-field{flex:1}
.gutscheincode-field label{display:block;margin-bottom:5px}
#toggle-gutscheincode-ablaufdatum{display:inline-block;margin:10px 0 15px 0;padding:6px 12px;font-size:14px;background-color:#f3f3f3;color:#333;border:1px solid #ccc;border-radius:4px;cursor:pointer;text-align:left}
#toggle-gutscheincode-ablaufdatum:hover{background-color:#e9e9e9;border-color:#bbb}
input.autofilled,select.autofilled,textarea.autofilled{border:2px solid #28a745 !important;background-color:#f1fff5}
#media-upload-button{margin-top:10px}
.age-options{display:flex;flex-wrap:nowrap;gap:6px;margin-top:8px}
.age-options input{position:absolute;opacity:0;width:0;height:0}
.age-option{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 10px;border-radius:8px;border:1px solid #d1d5db;background:#fff;color:#111;font-size:13px;font-weight:600;cursor:pointer;user-select:none;transition:border-color .15s ease,box-shadow .2s ease}
.age-option:hover{box-shadow:0 2px 8px rgba(0,0,0,.06)}
.age-options input:checked + .age-option{border-color:#0073aa;box-shadow:0 0 0 2px rgba(0,115,170,.1);background:#fff;color:#111}
.age-options input.autofilled:checked + .age-option{border-color:#28a745 !important;box-shadow:0 0 0 2px rgba(40,167,69,.15);background:#f1fff5}
.age-chip{display:none !important}


/* =========================
   Modal (leichtgewichtig)
========================= */
.pk-modal{ position:fixed; inset:0; background:rgba(0,0,0,.5); display:none; z-index:100000; }
.pk-modal.is-open{ display:block; }
.pk-modal__content{
  max-width:720px; margin:8vh auto; background:#fff; border-radius:12px; padding:20px 22px;
  box-shadow:0 12px 30px rgba(0,0,0,.2);
}
.pk-modal__title{ margin:0 0 10px; font-size:20px; }
.pk-modal__actions{ display:flex; gap:8px; justify-content:flex-end; margin-top:14px; }
.pk-form .pk-field{ display:flex; flex-direction:column; gap:6px; margin-bottom:10px; }
.pk-grid{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:10px; }
@media (max-width:640px){ .pk-grid{ grid-template-columns:1fr; } }

/* =========================
   Map Wrapper
========================= */
.pk-route__map{
  width:100%;
  border-radius:12px;
  box-shadow:0 8px 16px rgba(0,0,0,.15);
  overflow:hidden;
}

/* =========================
   Liquid Glass Marker – klein (final)
   (Punkt + Label; ersetzt alte Pillen-Marker)
========================= */
.pk-marker{ display:flex; align-items:center; gap:.42rem; background:transparent; }
.pk-marker .dot{
  width:8px; height:8px; border-radius:50%;
  background:#111827;
  box-shadow:0 0 0 2px rgba(0,0,0,.15), 0 1px 6px rgba(0,0,0,.25);
}
.pk-marker .txt{
  font-weight:800; font-size:12px; letter-spacing:.02em; color:#0b1220;
  text-shadow:0 1px 2px rgba(255,255,255,.55);
  padding:.06rem .20rem; border-radius:.25rem;
  background:rgba(255,255,255,.55);
  backdrop-filter: blur(2px);
}

/* Dark-Mode Varianten */
body.dark .pk-marker .dot{
  background:#e5e7eb;
  box-shadow:0 0 0 2px rgba(255,255,255,.08), 0 1px 6px rgba(0,0,0,.55);
}
body.dark .pk-marker .txt{
  color:#e5e7eb;
  background:rgba(0,0,0,.45);
  text-shadow:0 1px 2px rgba(0,0,0,.65);
}