/*
 * GroupPilot components. Each block names its handoff source (t2/a2/m2/d2.jsx).
 * Catalog: .handoffs/03-design/redesign-v2-screens.md §2.
 */

/* Wordmark (↳ Wordmark) */
.gp-wordmark {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--gp-ink);
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -.3px;
  text-decoration: none;
}

.gp-wordmark .gp-icon {
  color: var(--gp-accent);
}

.gp-wordmark--lg {
  font-size: 16px;
}

/* Keep the wordmark a 40px touch target when it is a link, without changing its look (NFR-02) */
a.gp-wordmark {
  min-height: 40px;
}

/* Icon (↳ I2) */
.gp-icon {
  display: block;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}

.gp-icon--14 { width: 14px; height: 14px; }
.gp-icon--16 { width: 16px; height: 16px; }
.gp-icon--18 { width: 18px; height: 18px; }
.gp-icon--21 { width: 21px; height: 21px; }
.gp-icon--22 { width: 22px; height: 22px; }
.gp-icon--24 { width: 24px; height: 24px; }

/* Avatar (↳ Ava) */
.gp-ava {
  --size: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  background: var(--gp-sunken);
  color: var(--gp-ink2);
  font-size: calc(var(--size) * .34);
  font-weight: 600;
  letter-spacing: .2px;
}

.gp-ava--30 { --size: 30px; }
.gp-ava--32 { --size: 32px; font-size: 12px; }
.gp-ava--36 { --size: 36px; font-size: 13px; }
.gp-ava--38 { --size: 38px; font-size: 13px; }

.gp-ava-ring {
  display: inline-flex;
  flex-shrink: 0;
  padding: 2px;
  border: 2.5px solid var(--belt);
  border-radius: 50%;
}

.gp-ava-ring--edge {
  box-shadow: 0 0 0 1px var(--gp-line2), inset 0 0 0 1px var(--gp-line2);
}

.gp-ava-ring--weiss { --belt: var(--gp-belt-weiss); }
.gp-ava-ring--gelb { --belt: var(--gp-belt-gelb); }
.gp-ava-ring--orange { --belt: var(--gp-belt-orange); }
.gp-ava-ring--gruen { --belt: var(--gp-belt-gruen); }
.gp-ava-ring--blau { --belt: var(--gp-belt-blau); }
.gp-ava-ring--braun { --belt: var(--gp-belt-braun); }
.gp-ava-ring--schwarz { --belt: var(--gp-belt-schwarz); }

/* Icon button (↳ IconBtn) */
.gp-iconbtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--gp-sunken);
  color: var(--gp-ink);
  text-decoration: none;
  cursor: pointer;
}

/* 34 px circle (↳ IconBtn size 34) in a 40 px touch target (NFR-03) */
.gp-iconbtn--34 {
  margin: -3px;
  padding: 3px;
  background-clip: content-box;
}
.gp-iconbtn--32 { width: 32px; height: 32px; background: transparent; color: var(--gp-ink2); }

/* "?" help button (D40, fragments/ui :: hilfe): right end of the nav row or the Heute top bar */
.gp-navrow .gp-hilfe,
.gp-topbar .gp-hilfe {
  margin-left: auto;
}
.gp-topbar .gp-hilfe {
  margin-right: 8px;
}
.gp-hilfe + .gp-navrow__end,
.gp-hilfe + .gp-topbar__end {
  margin-left: 0;
}
/* In the desktop page header it looks like the other header buttons (↳ DBtn icon) */
@media (min-width: 768px) {
  .gp-pagehead .gp-hilfe {
    width: 36px;
    height: 36px;
    border: 1px solid var(--gp-line2);
    border-radius: var(--gp-r-btn-desk);
    background: var(--gp-surface);
  }
  .gp-pagehead .gp-hilfe svg {
    width: 18px;
    height: 18px;
  }
}

/* Primary button (↳ PBtn) */
.gp-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  height: 56px;
  padding: 0 20px;
  border: 1px solid var(--gp-line2);
  border-radius: var(--gp-r-btn);
  background: transparent;
  color: var(--gp-ink);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -.2px;
  text-decoration: none;
  cursor: pointer;
}

.gp-btn--primary {
  border: 0;
  background: var(--gp-primary);
  color: var(--gp-on-primary);
}

.gp-btn--good { background: var(--gp-good); color: var(--gp-on-primary); }
.gp-btn--bad { background: var(--gp-bad); color: var(--gp-on-primary); }

.gp-btn__aside {
  font-weight: 500;
  opacity: .6;
}

.gp-btn[aria-busy="true"],
.gp-dbtn[aria-busy="true"] {
  opacity: .6;
  pointer-events: none;
}

.gp-btn:disabled,
.gp-dbtn:disabled {
  opacity: .45;
  cursor: not-allowed;
}

/* Desktop button (↳ DBtn) */
.gp-dbtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 36px;
  padding: 0 14px;
  border: 1px solid var(--gp-line2);
  border-radius: var(--gp-r-btn-desk);
  background: var(--gp-surface);
  color: var(--gp-ink);
  font-size: 13.5px;
  font-weight: 550;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.gp-dbtn--primary {
  border: 0;
  background: var(--gp-primary);
  color: var(--gp-on-primary);
}

.gp-dbtn--icon {
  width: 36px;
  padding: 0;
}

/* Text link (↳ Login "Passwort vergessen?"), 40 px tall touch target (NFR-03) */
.gp-textlink {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  color: var(--gp-ink2);
  font-size: 14px;
  font-weight: 500;
}

/* Segmented control (↳ Seg) */
.gp-seg {
  display: flex;
  height: 40px;
  padding: 3px;
  border-radius: var(--gp-r-seg);
  background: var(--gp-sunken);
}

.gp-seg--36 { height: 36px; }

.gp-seg__item {
  position: relative;
  isolation: isolate;
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 0;
  border-radius: var(--gp-r-seg-inner);
  background: transparent;
  color: var(--gp-ink2);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
}

.gp-seg__item[aria-checked="true"],
.gp-seg__item[aria-selected="true"],
.gp-seg__item[aria-current="true"] {
  background: var(--gp-surface);
  box-shadow: var(--gp-seg-shadow);
  color: var(--gp-ink);
  font-weight: 600;
}

/* Hit area covers the control's 3px padding: 34px pill, 40px target (NFR-02) */
.gp-seg__item::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -3px 0;
}

.gp-seg__count {
  color: var(--gp-ink3);
  font-weight: 500;
}

/* Switch (↳ Switch) — native checkbox with role="switch" */
.gp-switch {
  position: relative;
  flex-shrink: 0;
  width: 50px;
  height: 30px;
  margin: 0;
  border-radius: 15px;
  background: var(--gp-control-border);
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  transition: background .2s;
}

.gp-switch::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 24px;
  height: 24px;
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--gp-knob-shadow);
  transition: left .2s;
}

.gp-switch:checked {
  background: var(--gp-primary);
}

.gp-switch:checked::after {
  left: 23px;
}

.gp-switchrow {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 40px;
  font-size: 15px;
  cursor: pointer;
}

/* Fields (↳ Login2 field = page, AddSheet field = sheet) */
.gp-field {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  height: 64px;
  padding: 11px 16px;
  border: 1px solid var(--gp-line);
  border-radius: var(--gp-r-btn);
  background: var(--gp-surface);
}

.gp-field:focus-within {
  border-color: var(--gp-primary);
  box-shadow: 0 0 0 .5px var(--gp-primary);
}

.gp-field--sheet {
  height: 60px;
  padding: 9px 14px;
  border: 1.5px solid transparent;
  border-radius: var(--gp-r-control);
  background: var(--gp-bg);
}

.gp-field--sheet:focus-within {
  border-color: var(--gp-primary);
  box-shadow: none;
}

.gp-field__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-width: 0;
}

.gp-field__label {
  font-size: 12px;
  font-weight: 500;
  color: var(--gp-ink3);
}

.gp-field__input {
  width: 100%;
  min-width: 0;
  margin-top: 3px;
  padding: 0;
  border: 0;
  outline: none;
  background: transparent;
  font-size: 17px;
  font-weight: 500;
  letter-spacing: -.2px;
}

.gp-field--sheet .gp-field__input {
  margin-top: 2px;
}

/* Multi-line field (notes) */
.gp-field--area {
  height: auto;
  min-height: 96px;
  align-items: stretch;
}

.gp-field--area .gp-field__input {
  resize: vertical;
  min-height: 60px;
  font-size: 16px;
}

.gp-field__action {
  flex-shrink: 0;
  min-height: 40px;
  padding: 0 4px;
  border: 0;
  background: transparent;
  color: var(--gp-ink2);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
}

/* Validation (screens R6) */
.gp-field[aria-invalid="true"],
.gp-field:has(.gp-field__input[aria-invalid="true"]) {
  border: 1.5px solid var(--gp-bad);
}

.gp-field-error {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  color: var(--gp-bad);
  font-size: 13px;
  font-weight: 500;
}

.gp-stack {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Search field (↳ attendance dock) */
.gp-search {
  display: flex;
  flex: 1;
  align-items: center;
  gap: 8px;
  height: 48px;
  padding: 0 14px;
  border: 1px solid var(--gp-line);
  border-radius: var(--gp-r-control);
  background: var(--gp-surface);
  color: var(--gp-ink3);
}

.gp-search:focus-within {
  border-color: var(--gp-line2);
}

.gp-search__input {
  flex: 1;
  align-self: stretch; /* the whole 48 px field is the input (touch target) */
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--gp-ink);
  font-size: 16px;
}

/* Chip (↳ AddSheet belt chips). The label is the 40px touch target (NFR-02); the visible 38px pill
   of the handoff is drawn by ::before. */
.gp-chip {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  height: 40px;
  padding: 0 14px;
  border: 0;
  background: transparent;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
}

.gp-chip::before {
  content: "";
  position: absolute;
  inset: 1px 0;
  border: 1.5px solid var(--gp-line);
  border-radius: 19px;
  pointer-events: none;
}

.gp-chip[aria-checked="true"]::before,
.gp-chip[aria-pressed="true"]::before,
.gp-chip:has(input:checked)::before {
  border-color: var(--gp-primary);
}
/* Keyboard focus of the (hidden or covering) input is shown on the chip */
.gp-chip:has(input:focus-visible)::before {
  outline: 2px solid var(--gp-ink);
  outline-offset: 2px;
}
/* Input covering the whole chip: the chip is the touch target (instead of a visually hidden input) */
.gp-chip__input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.gp-chip__swatch {
  width: 16px;
  height: 6px;
  border-radius: 2px;
  background: var(--belt);
}

/* Lists (↳ Stats2 rows, Row2, Today2) */
.gp-row {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 14px 0;
  border: 0;
  border-bottom: 1px solid var(--gp-line);
  background: transparent;
  color: inherit;
  text-align: left;
  text-decoration: none;
}

.gp-row:last-child {
  border-bottom: 0;
}

.gp-row--compact {
  padding: 13px 0;
}

.gp-row__main {
  flex: 1;
  min-width: 0;
}

.gp-row__meta {
  margin-top: 2px;
  font-size: 13px;
  color: var(--gp-ink3);
}

.gp-row__chevron {
  color: var(--gp-ink3);
}

.gp-letter {
  padding: 14px var(--gp-page-x) 4px;
  font-size: 13px;
  font-weight: 600;
  color: var(--gp-ink3);
}

.gp-section {
  display: flex;
  align-items: baseline;
  margin: 26px 0 10px;
  font-size: 15px;
  font-weight: 600;
}

.gp-section__count {
  margin-left: 6px;
  color: var(--gp-ink3);
  font-weight: 500;
}

.gp-section__end {
  margin-left: auto;
  font-size: 14px;
  font-weight: 500;
  color: var(--gp-ink2);
}

/* Card (↳ "Später" card, hero card) */
.gp-card {
  padding: 14px 16px;
  border: 1px solid var(--gp-line);
  border-radius: var(--gp-r-card);
  background: var(--gp-surface);
}

.gp-card--hero {
  margin: 18px calc(var(--gp-hero-x) - var(--gp-page-x)) 0;
  padding: 20px;
  border: 0;
  border-radius: var(--gp-r-hero);
  box-shadow: var(--gp-shadow);
}

@media (min-width: 768px) {
  .gp-card { border-radius: var(--gp-r-card-desk); }
}

/* Action list item (↳ MenuSheet item) */
.gp-action {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  height: 56px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--gp-ink);
  font-size: 16px;
  font-weight: 500;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.gp-action__tile {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--gp-bg);
  color: var(--gp-ink2);
}

.gp-action__end {
  margin-left: auto;
  color: var(--gp-ink3);
}

.gp-action--bad,
.gp-action--bad .gp-action__tile {
  color: var(--gp-bad);
}

.gp-divider {
  height: 1px;
  margin: 6px 0;
  border: 0;
  background: var(--gp-line);
}

/* Menu popover (↳ desktop range popover preset list), used for the sidebar user menu */
.gp-menu {
  position: relative;
}

.gp-menu__trigger {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 12px 10px;
  border: 0;
  border-radius: var(--gp-r-btn-desk);
  background: transparent;
  text-align: left;
  cursor: pointer;
  list-style: none;
}

.gp-menu__trigger::-webkit-details-marker {
  display: none;
}

.gp-menu__trigger:hover {
  background: var(--gp-sunken);
}

.gp-menu__name,
.gp-menu__sub {
  display: block;
}

.gp-menu__name {
  font-size: 13.5px;
  font-weight: 600;
}

.gp-menu__sub {
  font-size: 12px;
  color: var(--gp-ink3);
}

.gp-menu__panel {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(100% + 6px);
  z-index: 40;
  padding: 8px;
  border-radius: var(--gp-r-card-desk);
  background: var(--gp-surface);
  box-shadow: var(--gp-shadow), 0 0 0 1px var(--gp-line);
}

.gp-menu__item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: 36px;
  padding: 0 10px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--gp-ink);
  font-size: 13.5px;
  font-weight: 500;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.gp-menu__item:hover,
.gp-menu__item:focus-visible {
  background: var(--gp-sunken);
}

/* Notice / toast (screens §3.3, ↳ "Später" card) */
.gp-notices {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 12px 0;
}

.gp-notice {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 8px 14px 16px;
  border: 1px solid var(--gp-line);
  border-radius: var(--gp-r-card);
  background: var(--gp-surface);
  font-size: 15px;
  font-weight: 500;
}

.gp-notice__text {
  flex: 1;
  min-width: 0;
}

.gp-notice--success > .gp-icon { color: var(--gp-good); }
.gp-notice--warning > .gp-icon { color: var(--gp-warn); }
.gp-notice--error > .gp-icon { color: var(--gp-bad); }
.gp-notice--info > .gp-icon { color: var(--gp-ink2); }

@media (min-width: 768px) {
  .gp-notice { border-radius: var(--gp-r-card-desk-sm); }
}

/* Dialogs: sheet (↳ Sheet) and popover (↳ desktop range popover) — ADR-009 */
.gp-sheet {
  width: 100%;
  max-width: 100%;
  max-height: calc(100vh - 40px);
  margin: auto 0 0;
  padding: 10px var(--gp-page-x) calc(34px + env(safe-area-inset-bottom));
  border: 0;
  border-radius: var(--gp-r-sheet) var(--gp-r-sheet) 0 0;
  background: var(--gp-surface);
  color: var(--gp-ink);
  box-shadow: var(--gp-sheet-shadow);
  overflow-y: auto;
}

.gp-sheet::backdrop,
.gp-popover--modal::backdrop {
  background: var(--gp-scrim);
}

.gp-sheet__grabber {
  width: 38px;
  height: 5px;
  margin: 0 auto 16px;
  border-radius: 3px;
  background: var(--gp-line2);
}

.gp-sheet__head {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}

.gp-sheet__title {
  flex: 1;
}

@media (prefers-reduced-motion: no-preference) {
  .gp-sheet[open] {
    animation: gp-sheet-in .28s cubic-bezier(.2, .9, .3, 1);
  }
}

@keyframes gp-sheet-in {
  from { transform: translateY(24px); opacity: .6; }
  to { transform: none; opacity: 1; }
}

@media (min-width: 768px) {
  .gp-sheet {
    max-width: var(--gp-content-narrow);
    margin: auto auto 0;
  }
}

.gp-popover {
  padding: 18px;
  border: 0;
  border-radius: var(--gp-r-card-desk);
  background: var(--gp-surface);
  color: var(--gp-ink);
  box-shadow: var(--gp-shadow), 0 0 0 1px var(--gp-line);
}

/* Dashed action / empty state (↳ "Nicht dabei? Neu anlegen") */
.gp-dashed {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 52px;
  padding: 14px 16px;
  border: 1.5px dashed var(--gp-line2);
  border-radius: var(--gp-r-control);
  background: transparent;
  color: var(--gp-ink2);
  font-size: 15px;
  font-weight: 500;
  text-align: center;
  text-decoration: none;
}

a.gp-dashed,
button.gp-dashed {
  color: var(--gp-ink);
  cursor: pointer;
}

/* Live dot (↳ .gp-live) */
.gp-live {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gp-accent);
}

@media (prefers-reduced-motion: no-preference) {
  .gp-live {
    animation: gp-pulse 1.8s infinite;
  }
}

@keyframes gp-pulse {
  0% { box-shadow: 0 0 0 0 var(--gp-accent-soft); }
  70% { box-shadow: 0 0 0 8px transparent; }
  100% { box-shadow: 0 0 0 0 transparent; }
}

/* Tally bar (↳ Tally) */
.gp-tally {
  display: flex;
  gap: 3px;
  height: 26px;
}

.gp-tally__seg {
  flex: 1;
  border-radius: var(--gp-r-tally);
  background: var(--gp-sunken);
  transition: background .25s;
}

.gp-tally__seg--on {
  background: var(--gp-primary);
}

/* Key figures (↳ KpiRow) */
.gp-kpis {
  display: grid;
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  margin: 0;
  padding: 16px 0;
  border: 1px solid var(--gp-line);
  border-radius: var(--gp-r-card);
  background: var(--gp-surface);
}

.gp-kpis__item {
  display: flex;
  flex-direction: column-reverse;
  justify-content: flex-end; /* values stay on one line when a label wraps */
  padding: 0 16px;
}

.gp-kpis__item + .gp-kpis__item {
  border-left: 1px solid var(--gp-line);
}

.gp-kpis__label {
  margin-top: 6px;
  font-size: 13px;
  color: var(--gp-ink3);
}

.gp-kpis__value {
  margin: 0;
  font-size: 28px;
  font-weight: 600;
  letter-spacing: -1.2px;
  line-height: 1;
}

.gp-kpis--plain {
  padding: 0;
  border: 0;
  background: transparent;
}

.gp-kpis--plain .gp-kpis__item:first-child {
  padding-left: 0;
}

.gp-confirm__text {
  margin: 8px 0 20px;
}

/* Narrow single-column pages (forms, profile): max width = desktop popover width (screens §3.2) */
.gp-narrow {
  max-width: var(--gp-content-narrow);
}

/* Profile card and action groups (screens §7.1) */
.gp-profile {
  display: flex;
  align-items: center;
  gap: 14px;
}

.gp-actions {
  padding-top: 0;
  padding-bottom: 0;
}

.gp-actions > * + * {
  border-top: 1px solid var(--gp-line);
}

/* Inputs inside fields show focus on the field border (:focus-within), not on the bare input */
.gp-app .gp-field__input:focus-visible,
.gp-app .gp-search__input:focus-visible {
  outline: none;
}

/* Toast region (screens §3.3): fixed above the tab bar or the page's dock */
.gp-toasts {
  position: fixed;
  left: var(--gp-page-x);
  right: var(--gp-page-x);
  bottom: calc(var(--gp-toast-bottom, calc(var(--gp-tabbar-h) + 12px)) + env(safe-area-inset-bottom));
  z-index: 50;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}

.gp-toasts .gp-notice {
  box-shadow: var(--gp-shadow);
  pointer-events: auto;
}

@media (min-width: 768px) {
  .gp-toasts {
    left: auto;
    right: 32px;
    bottom: calc(var(--gp-toast-bottom-desk, 24px));
    width: min(420px, calc(100vw - var(--gp-sidebar-w) - 64px));
  }
}

.gp-tally--dense {
  gap: 2px;
}

/* Row with a trailing action button (screens R4): the row link and the "…" button are siblings */
.gp-rowaction {
  display: flex;
  align-items: center;
  gap: 8px;
  border-bottom: 1px solid var(--gp-line);
}
.gp-rowaction:last-child {
  border-bottom: 0;
}
.gp-rowaction > .gp-row {
  flex: 1;
  min-width: 0;
  border-bottom: 0;
}

/* Desktop entity table (screens R3, ↳ DesktopStats2 table) */
.gp-tabelle-karte {
  overflow: hidden;
  border: 1px solid var(--gp-line);
  border-radius: var(--gp-r-card-desk);
  background: var(--gp-surface);
}
.gp-tabelle {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed; /* never wider than its card: long cells truncate (tablet width next to the sidebar) */
  font-size: 14px;
}
.gp-tabelle td {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.gp-tabelle th {
  padding: 12px 20px;
  border-bottom: 1px solid var(--gp-line);
  color: var(--gp-ink3);
  font-size: 12.5px;
  font-weight: 500;
  text-align: left;
}
.gp-tabelle td {
  height: 46px;
  padding: 0 20px;
  border-bottom: 1px solid var(--gp-line);
}
.gp-tabelle tr:last-child td {
  border-bottom: 0;
}
.gp-tabelle .gp-tabelle__zahl {
  text-align: right;
  white-space: nowrap;
}
.gp-tabelle__haupt {
  width: 34%;
  font-weight: 550;
}
.gp-tabelle__haupt a {
  color: inherit;
  text-decoration: none;
}
.gp-tabelle th.gp-tabelle__aktion,
.gp-tabelle td.gp-tabelle__aktion {
  width: 64px;
  padding-right: 12px;
  overflow: visible; /* keep the focus ring of the "…" button */
}

/* Rows with a 52 px time/date column (↳ "Später" card and "Diese Woche" rows) */
.gp-terminzeile {
  gap: 16px;
}

.gp-terminzeile__spalte {
  flex-shrink: 0;
  width: 52px;
}

.gp-terminzeile__zeit {
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -.4px;
}

.gp-terminzeile__tag {
  font-size: 12px;
  font-weight: 500;
  color: var(--gp-ink3);
}

.gp-terminzeile__zahl {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -.6px;
  line-height: 1.1;
}

.gp-terminzeile__name {
  font-size: 16px;
  font-weight: 550;
  letter-spacing: -.3px;
}

/* Touch devices with the desktop layout (tablets 768–1023 px and up): every target ≥ 40 px (NFR-02, UX-012).
   Mouse and trackpad keep the compact 36 px desktop controls. */
@media (pointer: coarse) {
  .gp-dbtn {
    height: 40px;
  }
  .gp-dbtn--icon,
  .gp-pagehead .gp-hilfe {
    width: 40px;
  }
  .gp-pagehead .gp-hilfe {
    height: 40px;
  }
  .gp-menu__item {
    height: 40px;
  }
  .gp-sidebar__sub .gp-sidebar__link {
    height: 40px;
  }
  .gp-tabelle__haupt a {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
  }
}