/*
 * Mein Konto (inc/seiten/Konto.php, woocommerce/myaccount/*).
 *
 * Alle Bausteine sind Komponenten des Systems (ds.css, 2026.10.02): Section,
 * Container, PageHeader, Panel, Field, Input, Select, Textarea, Checkbox,
 * StatusBadge, Table (--fit), DescriptionList, List/ListRow, EmptyState,
 * Alert, TabBar, Sidebar (--in-page), Input --action, Pagination, Button, IconButton, IconTile. Diese Datei ordnet
 * nur an: Raster, Reihenfolge, Abstände zwischen Komponenten aus Tokens.
 *
 * Ausnahmen, je gekennzeichnet:
 *   - Gegenregeln gegen Fremd-CSS (Wordfence) und das native fieldset, im Host
 *     neutralisiert, wie das System es verlangt.
 *
 * Aufbau:
 *   1. Seite
 *   2. Formulare
 *   3. Abgemeldet
 *   4. Angemeldet: Raster, eine Navigation je Breite
 *   5. Übersicht, Adressen, Bestellung
 *   6. Host-Gegenregeln
 */

/* ─── 1. Seite ─────────────────────────────────────────────────────────── */

.rvt-konto__kopf { margin-bottom: var(--space-9); }
/* Panelköpfe in einer Reihe gleich hoch, mit und ohne IconButton. */
.rvt-konto .rvds-panel__header { min-height: calc(var(--control-height-sm) + 2 * var(--card-padding) + 1px); }

/* Ruhiger Satz unter dem Kopf (Beschreibung der Adressen, Statussatz). */
.rvt-konto-lead { max-width: var(--measure-lead); color: var(--mut); }
.rvt-konto-lead strong { color: var(--fg); font-weight: var(--weight-semibold); }

.rvt-konto-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ─── 2. Formulare ─────────────────────────────────────────────────────── */

.rvt-konto-form { margin: 0; }
.rvt-konto-fields { display: flex; flex-direction: column; gap: var(--field-row-gap); }
/* Formularraster des Systems (.rvds-form-grid, 0.15.0): zwei Spalten ab 616px,
   lange Felder über die ganze Zeile (__wide). Felder fremder Plugins tragen die
   Klasse nicht und nehmen ebenfalls die ganze Zeile, wie bisher. */
.rvt-konto-fields--raster > :not(.rvt-konto-feld--first):not(.rvt-konto-feld--last):not(.rvds-field-group) { grid-column: 1 / -1; }
.rvt-konto-fields__pair {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr));
  gap: var(--field-row-gap) var(--space-7);
}
/* Ein Feld ohne Kantone (Liechtenstein) ist verborgen; rvds-field setzt display. */
.rvt-konto .rvds-field[hidden] { display: none; }
.rvt-konto-feld__fest { color: var(--fg); }
/* Knopf und Nebenlink: Knopf so breit wie sein Text, die Reihe bricht um. */
.rvt-konto-form__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-5) var(--space-8);
}
.rvt-konto-form > * + * { margin-top: var(--space-8); }
/* Formulare bleiben eine Spalte von Feldern (Container form). */
.rvt-konto-formbreite { max-width: var(--container-form); width: 100%; }

/* Passwort anzeigen (rvds-input--action): zwei Glyphen, aria-pressed zeigt die passende. */
.rvt-konto-reveal > svg + svg,
.rvt-konto-reveal[aria-pressed="true"] > svg:first-child { display: none; }
.rvt-konto-reveal[aria-pressed="true"] > svg + svg { display: block; }

/* ─── 3. Abgemeldet ────────────────────────────────────────────────────── */

.rvt-konto-login { display: grid; gap: var(--grid-gap); align-items: start; }
.rvt-konto-login--zwei { grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }

/* ─── 4. Angemeldet: Raster, Sidebar, TabBar ───────────────────────────── */

.rvt-konto-app { display: grid; gap: var(--space-9); align-items: start; }
/* Abstand zwischen den Blöcken einer Ansicht: --view-gap des Systems. */
.rvt-konto-app__content { display: flex; flex-direction: column; gap: var(--view-gap); min-width: 0; }
.rvt-konto-app__abmelden { display: flex; flex-wrap: wrap; gap: var(--space-4); }
.rvt-konto-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: var(--space-3) var(--space-5); }
.rvt-konto__seiten { align-self: center; }

/* Eine Form je Breite: Sidebar ab md, TabBar darunter. */
@media (min-width: 900px) {
  .rvt-konto-app { grid-template-columns: auto minmax(0, 1fr); gap: var(--space-12); }
  .rvt-konto-tabbar,
  .rvt-konto-app__abmelden { display: none; }
}
@media (max-width: 899px) {
  .rvt-konto-app > .rvds-sidebar { display: none; }
  /* Inhalt braucht unten die Höhe der TabBar. */
  body.rvt-hat-tabbar { padding-bottom: calc(var(--tabbar-height) + env(safe-area-inset-bottom)); }
}

/* ─── 5. Übersicht, Adressen, Bestellung ───────────────────────────────── */

.rvt-konto-hallo { font-size: var(--text-17); line-height: var(--leading-snug); color: var(--mut); }
.rvt-konto-hallo strong { color: var(--fg); font-weight: var(--weight-semibold); }
.rvt-konto-hallo a { color: var(--fg); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--line-3); }
.rvt-konto-hallo a:hover { color: var(--gold); text-decoration-color: currentColor; }

/* Karten der Übersicht, Adressen und Bestellung: Grid des Systems (.rvds-grid,
   S-Spuren, 0.15.0), eine einzelne Karte wird nicht über die Zeile gezogen. */
.rvt-konto-grid { align-items: start; }

.rvt-konto-address { font-style: normal; color: var(--mut); }
.rvt-konto-address__extra { display: block; }

/* Textlink mit Pfeil: ein Weg, kein Knopf (Foundations: → in Textlinks,
   3px nach rechts beim Darüberfahren). */
.rvt-konto-link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-13);
  font-weight: var(--weight-medium);
  white-space: nowrap;
  transition: color var(--duration-base), transform var(--duration-base) var(--ease);
}
.rvt-konto-link:hover { transform: translateX(var(--hover-nudge)); }
.rvt-konto-textlink { font-size: var(--text-13); }
@media (prefers-reduced-motion: reduce) { .rvt-konto-link:hover { transform: none; } }

/* Position einer Bestellung: Name und Menge als ein umbrechendes Element. */
.rvt-konto-item { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 2px var(--space-3); }
.rvt-konto-item__name a { color: var(--fg); }
.rvt-konto-item__name a:hover { color: var(--gold); }
.rvt-konto-item__qty { color: var(--mut-2); font-weight: var(--weight-regular); }
.rvt-konto-item__meta { list-style: none; margin: var(--space-1) 0 0; padding: 0; font-size: var(--text-12); font-weight: var(--weight-regular); color: var(--mut-2); }
.rvt-konto-item__meta p { display: inline; margin: 0; }
.rvt-konto-item__meta-label { color: var(--mut); }
.rvt-konto-hinweis { color: var(--mut-2); font-weight: var(--weight-regular); }
.rvt-konto-hinweis p { margin: 0; }

/* ─── 6. Host-Gegenregeln ──────────────────────────────────────────────── */

/* Wordfence lädt im Konto ein Admin-Stylesheet mit
   label { display:inline-block; margin-bottom; font-weight:700 }. */
.rvt-konto label.rvds-field__label,
.rvt-konto label.rvds-checkbox { margin: 0; max-width: none; }
.rvt-konto label.rvds-checkbox { font-weight: var(--weight-regular); }
/* Das native fieldset der Passwortänderung trägt keine eigene Box. */
.rvt-konto-fieldset { margin: 0; border: 0; min-inline-size: 0; }

/* Sortieren der Bestellliste: der SortButton steht rechts über der Tabelle und
   nur dort, wo die Tabelle gestapelt ist und keine Köpfe hat (rvds-table--fit,
   ds.js setzt rvds-table--fit-stacked). Sonst sortiert der Kopf selbst. */
.rvt-konto-sortleiste { display: flex; justify-content: flex-end; margin-bottom: var(--space-5); }
[data-rvds-sort-scope]:not(:has(.rvds-table--fit-stacked)) > .rvt-konto-sortleiste { display: none; }
