/* Mein Konto (/konto) – Bestellübersicht wie bei Amazon/eBay: eine Karte je
   Bestellung mit Kopfleiste, Statuszeile, Fortschrittsbalken, Artikeln und Knöpfen */
.konto-seite { background: #f4f4f5; }
.konto-seite [hidden] { display: none !important; }
.konto { max-width: 880px; margin: 0 auto; padding: 28px 16px 64px; color: #18181b; }
.konto h1 { font-size: 1.6rem; font-weight: 800; line-height: 1.2; color: #09090b; }
.konto h2 { font-size: 1.15rem; font-weight: 800; color: #09090b; margin: 0 0 6px; }
.k-leise { color: #71717a; font-size: .92rem; }
.k-klein { color: #71717a; font-size: .82rem; line-height: 1.5; }
.k-karte { background: #fff; border: 1px solid #e4e4e7; border-radius: 14px; padding: 22px 20px; }

/* Knöpfe */
.k-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 11px 18px; border-radius: 10px;
  font: inherit; font-size: .9rem; font-weight: 700; text-decoration: none; cursor: pointer; border: 1.5px solid transparent;
  line-height: 1.2; text-align: center; transition: background .15s, border-color .15s; }
.k-btn-primaer { background: #e8651a; color: #fff; }
.k-btn-primaer:hover { background: #d1550f; }
.k-btn-zweit { background: #fff; color: #18181b; border-color: #d4d4d8; }
.k-btn-zweit:hover { border-color: #18181b; }
.k-btn:disabled { opacity: .6; cursor: progress; }
.k-breit { width: 100%; }

/* Felder */
.k-feld { display: block; font-size: .85rem; font-weight: 600; color: #3f3f46; margin: 0 0 12px; }
.k-feld input, .k-feld select { display: block; width: 100%; margin-top: 6px; padding: 12px 14px; border: 1px solid #d4d4d8; border-radius: 10px;
  font: inherit; font-size: 1rem; font-weight: 400; color: #09090b; background: #fff; }
.k-feld input:focus, .k-feld select:focus { outline: none; border-color: #e8651a; box-shadow: 0 0 0 3px rgba(232, 101, 26, .15); }
.k-code { letter-spacing: .4em; font-weight: 800 !important; font-size: 1.3rem !important; text-align: center; }
.k-meldung { font-size: .9rem; min-height: 1.3em; margin: 10px 0 4px; color: #3f3f46; }
.k-meldung.fehler { color: #dc2626; }
.k-zwei { display: grid; grid-template-columns: 2fr 3fr; gap: 10px; }

/* Anmelden */
.k-login { display: grid; gap: 18px; max-width: 440px; margin: 10px auto 0; }
.k-login-karte { text-align: left; padding: 28px 24px; }
.k-login-karte h1 { margin: 6px 0 4px; }
.k-login-karte .k-leise { margin-bottom: 20px; }
.k-login-symbol { width: 54px; height: 54px; border-radius: 50%; background: #fff3eb; display: grid; place-items: center; font-size: 1.6rem; }
.k-login-karte .k-btn { margin-bottom: 4px; }
.k-login-karte .k-klein { margin-top: 14px; padding-top: 14px; border-top: 1px solid #f4f4f5; }
.k-vorteile { list-style: none; display: grid; gap: 8px; padding: 0 6px; }
.k-vorteile li { display: flex; gap: 10px; align-items: center; color: #52525b; font-size: .9rem; }
.k-vorteile span { width: 32px; height: 32px; border-radius: 9px; background: #fff; border: 1px solid #e4e4e7; display: grid; place-items: center; flex: none; }

/* Kopf, Reiter, Filter */
.k-kopf { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 18px; }
.k-kopf .k-leise { margin-top: 2px; overflow-wrap: anywhere; }
.k-abmelden { color: #71717a; font-size: .88rem; font-weight: 600; text-decoration: none; white-space: nowrap; padding-top: 6px; }
.k-abmelden:hover { color: #09090b; }
.k-tabs { display: flex; gap: 4px; border-bottom: 1px solid #e4e4e7; margin-bottom: 16px; overflow-x: auto; scrollbar-width: none; }
.k-tabs::-webkit-scrollbar { display: none; }
.k-tab { border: none; background: none; font: inherit; font-size: .95rem; font-weight: 700; color: #71717a; padding: 10px 14px 12px;
  border-bottom: 3px solid transparent; margin-bottom: -1px; cursor: pointer; white-space: nowrap; }
.k-tab.aktiv { color: #09090b; border-bottom-color: #e8651a; }
/* Auf schmalen Handys ohne Symbole – sonst passen die drei Reiter nicht nebeneinander */
@media (max-width: 420px) { .k-tab { padding: 10px 8px 12px; } .k-tab-icon, .k-tab-lang { display: none; } }
.k-tab-zahl { display: inline-block; min-width: 22px; padding: 1px 7px; margin-left: 4px; border-radius: 999px; background: #e4e4e7; color: #3f3f46;
  font-size: .75rem; text-align: center; }
.k-tab-zahl:empty { display: none; }
.k-filter { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; margin-bottom: 14px; scrollbar-width: none; }
.k-filter::-webkit-scrollbar { display: none; }
.k-chip { flex: none; border: 1.5px solid #d4d4d8; background: #fff; color: #3f3f46; border-radius: 999px; padding: 7px 14px;
  font: inherit; font-size: .85rem; font-weight: 600; cursor: pointer; }
.k-chip.aktiv { background: #09090b; border-color: #09090b; color: #fff; }
.k-chip span { opacity: .65; margin-left: 4px; }
.k-laden { color: #71717a; text-align: center; padding: 30px 0; }

/* Leer */
.k-leer { text-align: center; padding: 40px 20px; }
.k-leer-symbol { font-size: 2.6rem; margin-bottom: 8px; }
.k-leer .k-leise { max-width: 380px; margin: 0 auto 18px; }

/* Bestellkarte */
.k-bestellung { background: #fff; border: 1px solid #e4e4e7; border-radius: 14px; overflow: hidden; margin-bottom: 16px; }
.k-b-kopf { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; padding: 12px 16px; background: #fafafa;
  border-bottom: 1px solid #e4e4e7; font-size: .82rem; }
.k-b-kopf .k-label { display: block; color: #71717a; font-size: .7rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.k-b-kopf strong { font-weight: 700; color: #18181b; overflow-wrap: anywhere; }
.k-b-nr { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; }
.k-b-nr a { color: #e8651a; font-weight: 700; text-decoration: none; white-space: nowrap; }
.k-b-nr a:hover { text-decoration: underline; }
.k-b-inhalt { padding: 16px; }
.k-status { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 14px; }
.k-status-symbol { font-size: 1.35rem; line-height: 1.2; }
.k-status-titel { font-weight: 800; font-size: 1.05rem; line-height: 1.3; }
.k-status-text { color: #52525b; font-size: .88rem; line-height: 1.45; }
.k-status.ton-fertig .k-status-titel { color: #15803d; }
.k-status.ton-unterwegs .k-status-titel { color: #c2410c; }
.k-status.ton-storno .k-status-titel { color: #b91c1c; }
.k-b-balken { margin: 0 0 16px; padding: 14px 4px 4px; border-top: 1px solid #f4f4f5; }
.k-b-haupt { display: grid; gap: 16px; }
.k-artikel { list-style: none; display: grid; gap: 12px; }
.k-artikel li { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; align-items: center; }
.k-bild { width: 64px; height: 64px; border-radius: 10px; border: 1px solid #e4e4e7; background: #f4f4f5 center / cover no-repeat;
  display: grid; place-items: center; font-size: 1.5rem; overflow: hidden; }
.k-bild img { width: 100%; height: 100%; object-fit: cover; }
.k-artikel-name { font-weight: 600; font-size: .92rem; line-height: 1.35; color: #18181b; text-decoration: none; display: block; overflow-wrap: anywhere; }
a.k-artikel-name:hover { color: #e8651a; }
.k-artikel-info { color: #71717a; font-size: .82rem; }
.k-nochmal { color: #e8651a; font-size: .82rem; font-weight: 700; text-decoration: none; margin-left: 8px; white-space: nowrap; }
.k-aktionen { display: grid; gap: 8px; align-content: start; }
.k-hilfe { margin-top: 2px; text-align: center; font-size: .82rem; }
.k-hilfe a { color: #71717a; }

/* Anfragen (Support) */
.k-anfrage { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 4px 12px; align-items: center; background: #fff; border: 1px solid #e4e4e7;
  border-radius: 14px; padding: 14px 16px; margin-bottom: 10px; text-decoration: none; color: inherit; transition: border-color .15s; }
.k-anfrage:hover { border-color: #e8651a; }
.k-anfrage-symbol { grid-row: span 2; width: 42px; height: 42px; border-radius: 12px; background: #fff3eb; display: grid; place-items: center; font-size: 1.25rem; }
.k-anfrage-text strong { display: block; font-size: .95rem; }
.k-anfrage-text small { display: block; color: #71717a; font-size: .8rem; overflow-wrap: anywhere; }
.k-anfrage-status { justify-self: start; font-size: .78rem; font-weight: 700; padding: 3px 10px; border-radius: 999px; background: #f4f4f5; color: #3f3f46; }
.k-anfrage-status.offen { background: #fff3eb; color: #c2410c; }
.k-anfrage-status.fertig { background: #ecfdf5; color: #15803d; }
#tabAnfragen .k-btn { margin-top: 4px; }

/* Meine Daten */
.k-form { margin-top: 14px; }
.k-form .k-btn { margin-top: 4px; }
.k-loeschen { margin: 14px 4px 0; }
.k-loeschen a { color: #b91c1c; font-weight: 600; }

@media (min-width: 720px) {
  .konto { padding-top: 40px; }
  .k-b-kopf { grid-template-columns: auto auto minmax(0, 1fr); align-items: end; }
  .k-b-nr { grid-column: auto; }
  .k-b-haupt { grid-template-columns: minmax(0, 1fr) 220px; align-items: start; }
  .k-login { grid-template-columns: minmax(0, 1fr) 280px; max-width: 760px; align-items: center; }
  .k-anfrage { grid-template-columns: 42px minmax(0, 1fr) auto; }
  .k-anfrage-symbol { grid-row: auto; }
  .k-anfrage-status { justify-self: end; }
}