/** Shopify CDN: Minification failed

Line 123:0 Unexpected "}"

**/
/* Container */
.personalization {
  display: grid;
  gap: var(--padding-md, 12px);
  margin-block: var(--padding-md, 12px);
}

/* Titel schlanker */
.perso__title {
  margin: 0 0 6px 0;
  font-weight: 500;          /* weniger fett */
  font-size: clamp(20px, 2.4vw, 22px);  /* kleiner, responsiv */
  line-height: 1.4;
  color: #000000;               /* Farbe */
  letter-spacing: 0.2px;     /* wirkt ruhiger */
}

/* Segmented Toggle */
.perso__toggle {
  display: inline-flex;
  align-items: center;
  background: #f5f5f5;
  border-radius: 999px;
  padding: 4px;
  gap: 4px;
  border: 1px solid #eee;
  width: max-content;
}
.perso__tab {
  border: 0;
  background: transparent;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 13px;
  line-height: 1;
  cursor: pointer;

  /* verhindert blau auf iOS/Android */
  -webkit-appearance: none;
  appearance: none;
  color: inherit;
  -webkit-tap-highlight-color: transparent;
}

.perso__tab.is-active {
  background: #fff;
  box-shadow: 0 0 0 1px #e5e7eb inset;
}

.perso__tab:focus,
.perso__tab:active {
  outline: none;
  background: #fff;
  color: #111;
}

/* Symbols */
.perso__symbols {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 2px 0 6px 0;
  border: 0;
  padding: 0;
}
.perso__legend {
  font-size: 12px;
  color: #6b7280;
  margin: 0 8px 0 0;
}
.symbol-option { display: inline-flex; align-items: center; }
.symbol-option input { position: absolute; opacity: 0; pointer-events: none; }
.symbol-chip {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 36px; height: 36px; padding: 0 12px;
  border: 1px solid #e5e7eb; border-radius: 999px;
  font-size: 16px; line-height: 1; cursor: pointer; user-select: none; background:#fff;
}
.symbol-option input:checked + .symbol-chip { border-color: #111; }

/* "Kein Symbol" neutraler Look */
.symbol-chip.symbol-none {
  font-size: 13px;
  color: #6b7280;
  background-color: #f9fafb;
  border-style: dashed;
}
.symbol-option input:checked + .symbol-chip.symbol-none {
  border-color: #111;
  background-color: #f3f4f6;
  color: #111;
}

/* Felder */
.perso__label {
  font-size: 13px;
  margin: 8px 0 4px 0;
  display: inline-block;
  color: var(--color-foreground, #111);
}
.perso__fieldrow {
  display: flex;
  align-items: center;
  gap: 4px;
}
.perso__input {
  flex: 1 1 auto;
  width: 100%;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 16px !important;        /* iOS-Zoom verhindern */
  line-height: 1.4;                  /* sauber, verhindert Rieseneffekt */
  outline: none;
  background: #fff;
  -webkit-text-size-adjust: 100%;    /* Safari/iOS Zoom aus */
}
}
.perso__input:focus { border-color: #111; }
.perso__counter {
  font-size: 12px;
  color: #6b7280;
  white-space: nowrap;
  min-width: auto;       /* feste Mindestbreite raus */
  margin-left: -2px;     /* leicht näher ans Feld ran */
}
.perso__hint { font-size: 12px; color: #6b7280; margin-top: 4px; }

/* Mobile spacing tweak */
@media (max-width: 749px) {
  .personalization { gap: 10px; }
  .symbol-chip { height: 34px; min-width: 34px; }
}