/* Tour-App: große Tippflächen, eine Spalte */
.tourapp .kopf-innen { max-width: 640px; }
.tourapp main, .tourapp .inhalt { max-width: 640px; margin: 0 auto; padding: .75rem; }
.ta-kopf { display: flex; align-items: center; gap: .5rem; padding: .7rem .9rem; background: var(--petrol-dunkel); color: #fff;
  position: sticky; top: 0; z-index: 10; padding-top: max(.7rem, env(safe-area-inset-top)); }
.ta-kopf h1 { font-size: 1.05rem; margin: 0; color: #fff; }
.ta-kopf button, .ta-kopf a { color: #fff; background: none; border: 1px solid rgba(255,255,255,.4); min-height: 40px; }
.ta-tage { display: flex; gap: .4rem; margin-bottom: .75rem; }
.ta-tage button { flex: 1; min-height: 44px; }
.ta-schritt { background: var(--karte); border: 1px solid var(--linie); border-radius: var(--radius); padding: .7rem .8rem; margin-bottom: .5rem; }
.ta-schritt.art-klient { border-left: 4px solid var(--petrol); }
.ta-schritt.art-pause { background: var(--gelb-hell); }
.ta-schritt.status-erledigt { border-left-color: var(--gruen); opacity: .8; }
.ta-schritt.status-nicht_angetroffen, .ta-schritt.status-abgebrochen { border-left-color: var(--signal); }
.ta-zeit { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--petrol-dunkel); margin-right: .4rem; }
.ta-name { font-weight: 650; font-size: 1.05rem; }
.ta-zeile { font-size: .9rem; color: var(--tinte-leise); margin-top: .15rem; }
.ta-aktionen { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .6rem; }
.ta-aktionen button, .ta-aktionen a { min-height: 44px; flex: 1 1 auto; }
.ta-status { display: inline-block; font-size: .8rem; font-weight: 600; padding: .15rem .5rem; border-radius: 999px; margin-top: .4rem; }
.ta-status.erledigt { background: #dcefe4; color: var(--gruen); }
.ta-status.nicht_angetroffen, .ta-status.abgebrochen { background: var(--signal-hell); color: var(--signal); }
.ta-abschnitt { margin-top: 1rem; }
.ta-abschnitt h2 { font-size: 1rem; margin: 0 0 .4rem; }
.ta-med { width: 100%; border-collapse: collapse; font-size: .9rem; }
.ta-med th, .ta-med td { border-bottom: 1px solid var(--linie); padding: .35rem .25rem; text-align: center; }
.ta-med th:first-child, .ta-med td:first-child { text-align: left; }
.ta-dialog { width: 100%; max-width: 640px; max-height: 100dvh; margin: auto; }
.ta-dialog .dialog-inhalt { max-height: 92dvh; overflow-y: auto; }
.ta-dialog h3 { font-size: 1rem; margin: 1rem 0 .5rem; }
.ta-keine { width: 100%; min-height: 52px; font-size: 1.05rem; font-weight: 650; border-radius: var(--radius);
  background: #e4f0ea; color: var(--gruen); border: 2px solid var(--gruen); margin-bottom: .75rem; cursor: pointer; }
.ta-keine[aria-pressed="true"] { background: var(--gruen); color: #fff; }
.ta-treffer { display: flex; flex-wrap: wrap; gap: .35rem; margin: .5rem 0; }
.ta-vorschlag { border: 1px solid var(--linie); background: var(--karte); border-radius: 999px; padding: .45rem .8rem; min-height: 40px; cursor: pointer; }
.ta-auswahl { border: 1px solid var(--petrol); border-radius: var(--radius); padding: .6rem; margin: .5rem 0; background: var(--petrol-hell); }
.ta-frage { display: block; font-size: .88rem; margin-top: .45rem; }
.ta-gz { border: 2px solid var(--gelb); border-radius: var(--radius); padding: .6rem; background: var(--gelb-hell); }
.ta-trend { display: flex; flex-direction: column; gap: .25rem; margin: .45rem 0; }
.ta-trend > div { display: flex; gap: .3rem; }
.ta-trend button { flex: 1; min-height: 40px; padding: .3rem; font-size: .9rem; }
.ta-trend button[aria-pressed="true"], .ta-aktionen button[aria-pressed="true"] { background: var(--petrol); color: #fff; border-color: var(--petrol); }
.ta-schritt.art-bericht { border-left: 4px solid var(--gelb); }

/* Kostenerstattung */
.ta-kopf .knopf { padding: .4rem .7rem; display: inline-flex; align-items: center; text-decoration: none; }
.ta-foto { position: relative; min-height: 56px; font-size: 1.05rem; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.ta-datei { position: absolute; inset: 0; opacity: 0; width: 100%; cursor: pointer; }
.ta-beleg-vorschau { display: block; max-width: 100%; max-height: 60vh; margin: 0 auto .5rem; border: 1px solid var(--linie); border-radius: var(--radius); }
#wurzel .ta-abschnitt .knopf-breit + .knopf-breit, .karte-inhalt .knopf-breit + .knopf-breit { margin-top: .5rem; }
.ta-beleg { display: flex; gap: .75rem; align-items: flex-start; }
.ta-beleg img { width: 64px; height: 64px; object-fit: cover; border-radius: 6px; border: 1px solid var(--linie); }
.ta-status.beleg-offen { background: var(--gelb-hell); color: var(--text, inherit); }
.ta-status.beleg-erstattet { background: #dcefe4; color: var(--gruen); }
.ta-status.beleg-abgelehnt { background: var(--signal-hell); color: var(--signal); }
.ta-kopf { flex-wrap: wrap; row-gap: .4rem; }
