/* Weiche Formen fuer das Kunden-Web.
 *
 * Die Seiten bringen jeweils eigene Stilbloecke mit, die nach dieser Datei
 * geladen werden, und Tailwind haengt seine Utilities zur Laufzeit an.
 * Damit die Rundungen trotzdem ueberall gleich ankommen, setzen die Regeln
 * hier ``border-radius`` bewusst mit !important -- und ausschliesslich das.
 *
 * Drei Stufen: Felder, Knoepfe, Karten. Wer die Formen aendern will, dreht
 * nur an diesen drei Werten.
 */
:root {
  --cb-rund-feld: 10px;
  --cb-rund-knopf: 12px;
  --cb-rund-karte: 16px;
}

/* ---------- Felder ---------- */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),
select,
textarea {
  border-radius: var(--cb-rund-feld) !important;
}

/* ---------- Knoepfe ---------- */
button,
input[type="submit"],
input[type="button"],
.btn-primary,
.btn-ghost,
.link-back,
.home-button,
.bestellen-button,
.sidebar-chat-send {
  border-radius: var(--cb-rund-knopf) !important;
}

/* Kleine runde Knoepfe: Hilfe-Fragezeichen und Entfernen-Kreuz. */
.field-help,
.remove-btn {
  border-radius: 999px !important;
}

/* ---------- Sprachumschalter ---------- */
.cb-lang-switcher {
  border-radius: var(--cb-rund-feld) !important;
}
.cb-lang-option {
  border-radius: 7px !important;
}

/* ---------- Karten ---------- */
.home-input-group,
.product-item,
.field-tip {
  border-radius: var(--cb-rund-karte) !important;
}
.product-img {
  border-radius: var(--cb-rund-feld) !important;
}
.chat-msg {
  border-radius: 14px !important;
}

/* ---------- Zusammengesetzte Felder ---------- */
/* Menge: Die Gruppe ist rund, die Teile darin nicht -- sonst entstehen
   Kerben zwischen Minus, Zahl und Plus. */
.qty-group {
  border-radius: var(--cb-rund-feld) !important;
  overflow: hidden;
}
.qty-group > input,
.qty-group > button {
  border-radius: 0 !important;
}

/* Eingabe + Hinzufuegen: auf breiten Bildschirmen ein Stueck, deshalb
   nur die Aussenecken runden. Auf dem Handy stehen beide untereinander
   und bekommen ihre vollen Rundungen von oben. */
@media (min-width: 769px) {
  .home-input {
    border-radius: var(--cb-rund-feld) 0 0 var(--cb-rund-feld) !important;
  }
  .home-input-group:not(.checkout-group) .home-button {
    border-radius: 0 var(--cb-rund-knopf) var(--cb-rund-knopf) 0 !important;
  }
}

/* Portal auf dem Handy: Profil, Bestellungen und Chat stehen als ein Block
   unter den Artikeln und werden dort zur Karte. Auf dem Desktop ist
   derselbe Block eine am Rand klebende Seitenleiste und bleibt eckig. */
@media (max-width: 1200px) {
  .home-container3 {
    border-radius: var(--cb-rund-karte) !important;
    border: 1px solid var(--line, #e5e5e5);
    overflow: hidden;
  }
}