/* =========================================================================
   Fallen-Profil (Design "Kamerafalle", 2026-09): Kopf mit Unterstrich-Tabs,
   weisses Papier, Haarlinien, Playfair fuer Werte. Gilt fuer die fuenf
   Profil-Seiten (trap_detail, settings, schedule, visit_add, trap_edit),
   die alle includes/trap_nav.php einbinden; das laedt diese Datei und
   oeffnet den .tp-page-Rahmen.
   ========================================================================= */
body:has(.tp-page), body.bg-light:has(.tp-page) { background:var(--paper) !important; }
.tp-page { max-width:1200px; margin:0 auto; padding-top:16px; color:var(--ink); }
.tp-page a:not(.tp-btn) { color:var(--ink); text-decoration:none; }
.tp-page a:not(.tp-btn):hover { color:var(--earth); text-decoration:underline; }

/* Kopf */
.tp-crumb { font-size:13px; color:var(--muted); display:flex; gap:8px; }
.tp-page .tp-crumb a { color:var(--muted); }
.tp-head { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 16px; margin-top:10px; }
.tp-head h1 { font-family:var(--serif); font-weight:500; font-size:44px; line-height:1.1; margin:0; }
.tp-id { font-size:15px; color:var(--muted); letter-spacing:.02em; }
.tp-tag { font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; border:1px solid var(--hairline);
          color:var(--muted); border-radius:4px; padding:4px 8px; align-self:center; }
.tp-tag.active { color:var(--forest); border-color:var(--forest-soft); }
.tp-tag.maintenance { color:var(--earth); border-color:var(--earth-soft); }

/* Tabs */
.tp-tabs { display:flex; gap:28px; margin-top:24px; border-bottom:1px solid var(--hairline); overflow-x:auto; scrollbar-width:none; }
.tp-page .tp-tabs a.tp-tab { display:flex; gap:8px; align-items:center; padding:0 0 12px; border-bottom:2px solid transparent;
          font-size:14px; font-weight:600; color:var(--muted); white-space:nowrap; text-decoration:none; }
.tp-page .tp-tabs a.tp-tab:hover { color:var(--ink); text-decoration:none; }
.tp-page .tp-tabs a.tp-tab.active { color:var(--ink); border-bottom-color:var(--ink); }
.tp-count { background:var(--earth); color:#fff; font-size:11px; padding:2px 6px; border-radius:4px; line-height:1.3; }
.tp-count[hidden] { display:none; }

/* Hinweis-Leiste fuer Ausstehendes */
.tp-banner { margin-top:24px; border:1px solid var(--earth-soft); padding:16px 20px; display:flex; flex-wrap:wrap;
             gap:12px 24px; align-items:center; justify-content:space-between; }
.tp-banner > div { min-width:0; flex:1 1 400px; }
.tp-banner-t { font-weight:600; font-size:14px; }
.tp-banner-s { font-size:13px; color:var(--muted); margin-top:4px; line-height:1.6; }
.tp-linkbtn { background:none; border:0; padding:0; font-size:13px; font-weight:600; cursor:pointer; text-decoration:underline; color:var(--ink); }
.tp-linkbtn.earth { color:var(--earth); }
.tp-page .alert { margin-top:24px; margin-bottom:0; }

/* Kennzahlen-Streifen */
.tp-stats { margin-top:24px; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(160px,100%),1fr)); gap:1px;
            background:var(--hairline); border:1px solid var(--hairline); }
.tp-stat { background:var(--paper); padding:18px 20px; }
.tp-eyebrow { font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
.tp-eyebrow.earth, .tp-earth { color:var(--earth); }
.tp-stat-v { font-family:var(--serif); font-size:26px; margin-top:6px; line-height:1.25; }
.tp-stat-s { font-size:13px; color:var(--muted); margin-top:2px; }

/* Spalten */
.tp-cols { display:flex; flex-wrap:wrap; gap:32px 48px; margin-top:32px; align-items:flex-start; }
.tp-cols.tight { gap:32px; margin-top:40px; }
.tp-main { flex:2 1 560px; min-width:0; display:flex; flex-direction:column; gap:40px; }
.tp-main.flow { display:block; }
.tp-aside { flex:1 1 280px; min-width:0; display:flex; flex-direction:column; gap:28px; }
.tp-aside.sticky { position:sticky; top:88px; }
.tp-aside.spaced { gap:40px; }
.tp-narrow { max-width:720px; margin-top:32px; }
.tp-medium { max-width:880px; margin-top:32px; }
.tp-end { height:40px; }

/* Abschnitts-Koepfe */
.tp-sec-h { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:8px 16px;
            border-bottom:1px solid var(--hairline); padding-bottom:12px; }
.tp-sec-h > div { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 14px; }
.tp-sec-h.flat { border-bottom:0; }
.tp-page h2.tp-h2 { font-family:var(--serif); font-weight:500; font-size:24px; margin:0; }
.tp-page h2.tp-h2.lg { font-size:28px; }
.tp-meta { font-size:13px; color:var(--muted); }
.tp-lead { font-size:14px; color:var(--muted); margin:6px 0 12px; }
.tp-page a.tp-more { font-size:14px; font-weight:600; }
.tp-section + .tp-section { margin-top:48px; }

/* Grosse Werte + Schluessel/Wert-Zeilen */
.tp-bigvals { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(110px,100%),1fr)); gap:24px; padding:24px 0; }
.tp-bv-k { font-size:12px; color:var(--muted); }
.tp-bv-v { font-family:var(--serif); font-size:28px; margin-top:4px; line-height:1.2; overflow-wrap:anywhere; }
.tp-kvgrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr)); column-gap:32px; font-size:14px; }
.tp-kvlist { font-size:14px; }
.tp-kv { display:flex; justify-content:space-between; gap:12px; padding:10px 0; border-top:1px solid var(--hairline); }
.tp-kv > span:first-child { color:var(--muted); flex:0 0 auto; }
.tp-kv > span:last-child { text-align:right; min-width:0; overflow-wrap:anywhere; }
.tp-sn { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12px; color:var(--muted); }
.tp-empty { font-size:14px; color:var(--muted); padding:16px 0; }

/* Meldungen */
.tp-msgs { overflow-x:auto; }
.tp-msgs-in { min-width:560px; font-size:14px; font-variant-numeric:tabular-nums; }
.tp-msg { display:grid; grid-template-columns:1.6fr 1fr 1.1fr .8fr .8fr .8fr; gap:12px; padding:12px; align-items:center; }
.tp-msg.head { font-size:12px; color:var(--muted); }
.tp-run { display:grid; grid-template-columns:1.6fr .9fr .9fr 1fr 1.6fr; gap:12px; padding:10px 12px; align-items:center; font-size:14px; }
.tp-run.head { font-size:12px; color:var(--muted); }
.tp-run.row { border-top:1px solid var(--hairline); }
.tp-bad { color:#b3261e; }
.tp-msg.row { border-top:1px solid var(--hairline); cursor:pointer; }
.tp-msg.row:hover, .tp-msg.row.sel { background:var(--hairline-2); }
.tp-msg.row.sel > span:first-child { font-weight:600; }
.tp-sig { display:flex; align-items:flex-end; gap:2px; height:14px; }
.tp-sig i { display:block; width:4px; background:#DAD6CE; }
.tp-sig i.on { background:var(--ink); }
.tp-sig em { font-style:normal; font-size:12px; color:var(--muted); margin-left:8px; white-space:nowrap; }
.tp-pics { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(180px,100%),1fr)); gap:16px; margin-top:12px; }
.tp-pics img, .tp-ph { width:100%; aspect-ratio:3/2; object-fit:cover; background:var(--hairline-2); display:block; }
.tp-ph { display:flex; align-items:center; justify-content:center; font-size:12px; color:var(--muted); }
.tp-cap { font-size:12px; color:var(--muted); margin-top:6px; overflow-wrap:anywhere; }
.tp-selpics { border-top:1px solid var(--hairline); padding-top:16px; margin-top:4px; }

/* Besuche (Uebersicht) */
.tp-visit { display:flex; flex-wrap:wrap; gap:6px 24px; padding:14px 0; border-bottom:1px solid var(--hairline); font-size:14px; }
.tp-visit-d { flex:0 0 110px; font-variant-numeric:tabular-nums; }
.tp-visit-ok { flex:0 0 120px; font-weight:600; }
.tp-visit-ok.bad { color:var(--earth); }
.tp-visit-t { flex:1 1 240px; min-width:0; line-height:1.55; }
.tp-visit-t .tp-note { color:var(--muted); margin-top:4px; }
.tp-visit-t .pill { margin-top:6px; }
.tp-visit-x { display:flex; gap:12px; align-items:flex-start; }
.tp-visit-x img { width:96px; height:64px; object-fit:cover; display:block; }

/* Karte + Setup */
.tp-map { aspect-ratio:4/3; width:100%; margin-top:16px; background:var(--hairline-2); }
.tp-map.wide { aspect-ratio:16/7; }
.tp-row-sb { display:flex; justify-content:space-between; gap:12px; font-size:13px; margin-top:10px; flex-wrap:wrap; }
.tp-setup { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(120px,100%),1fr)); gap:12px; margin-top:16px; }
.tp-setup-i { position:relative; }
.tp-setup-i.first { grid-column:1 / -1; }
.tp-setup-i img { width:100%; aspect-ratio:3/2; object-fit:cover; display:block; background:var(--hairline-2); }
.tp-setup-i button { position:absolute; top:6px; right:6px; width:28px; height:28px; border:0; background:rgba(255,255,255,.9);
                     font-size:16px; line-height:1; cursor:pointer; color:var(--ink); }

/* Einstellungs-Zeilen: links Beschriftung, rechts Bedienung */
.tp-field { display:flex; flex-wrap:wrap; gap:16px 40px; padding:24px 0; border-top:1px solid var(--hairline); }
.tp-field-l { flex:1 1 220px; min-width:0; }
.tp-field-c { flex:2 1 340px; min-width:0; }
.tp-field-c.chips { display:flex; flex-wrap:wrap; gap:8px; align-content:flex-start; }
.tp-field-name { display:flex; align-items:center; gap:8px; font-weight:600; font-size:15px; }
.tp-dot { width:7px; height:7px; border-radius:50%; background:var(--earth); display:none; }
.tp-field.changed .tp-dot { display:inline-block; }
.tp-hint { font-size:13px; color:var(--muted); margin-top:6px; line-height:1.55; text-wrap:pretty; }
.tp-was { margin-top:10px; font-size:13px; color:var(--earth); display:none; gap:10px; flex-wrap:wrap; align-items:center; }
.tp-field.changed .tp-was { display:flex; }
.tp-field.readonly .tp-field-c { opacity:.45; pointer-events:none; }
.tp-row { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px 24px; padding:18px 0; border-top:1px solid var(--hairline); }
.tp-row-l { font-weight:600; font-size:15px; min-width:0; }
.tp-row-l small { display:block; font-weight:400; font-size:13px; color:var(--muted); margin-top:4px; line-height:1.55; text-wrap:pretty; }
.tp-block { padding:18px 0; border-top:1px solid var(--hairline); }

/* Stufenregler: − Wert +, darunter Balken */
.tp-step { display:flex; align-items:center; gap:12px; }
.tp-step button { width:44px; height:44px; flex:none; border:1px solid var(--hairline); background:var(--paper); font-size:20px; cursor:pointer; color:var(--ink); }
.tp-step button:disabled { opacity:.3; cursor:default; }
.tp-step-v { flex:1; text-align:center; font-family:var(--serif); font-size:30px; font-variant-numeric:tabular-nums; }
.tp-bars { display:flex; gap:3px; height:30px; align-items:flex-end; margin-top:14px; }
.tp-bars button { flex:1; height:100%; display:flex; align-items:flex-end; padding:0; border:0; background:transparent; cursor:pointer; min-width:0; }
.tp-bars button span { display:block; width:100%; height:40%; background:#DAD6CE; }
.tp-bars button.was span { height:70%; background:var(--earth-soft); }
.tp-bars button.on span { height:100%; background:var(--ink); }
.tp-ends { display:flex; justify-content:space-between; gap:12px; font-size:12px; color:var(--muted); margin-top:8px; }

/* Chips + Ja/Nein-Schalter */
.tp-chip { min-height:44px; padding:0 16px; border:1px solid var(--hairline); background:var(--paper); color:var(--ink);
           border-radius:4px; font-size:14px; font-weight:500; cursor:pointer; }
.tp-chip.wide { min-width:96px; font-weight:600; }
.tp-chip.num { min-width:64px; padding:0 12px; }
.tp-chip.was { border-color:var(--earth-soft); }
.tp-chip.on { background:var(--ink); border-color:var(--ink); color:#fff; }
.tp-chip:disabled { opacity:.3; cursor:default; }
.tp-seg { display:flex; }
.tp-seg button { min-height:44px; width:96px; border:1px solid var(--hairline); background:var(--paper); color:var(--ink);
                 font-size:14px; font-weight:600; cursor:pointer; }
.tp-seg.wide button { width:120px; }
.tp-seg button + button { border-left:0; }
.tp-seg button.on { background:var(--ink); border-color:var(--ink); color:#fff; }
.tp-seg button.on.danger { background:var(--earth); border-color:var(--earth); }

/* Eingaben */
.tp-input { display:block; width:100%; box-sizing:border-box; min-height:44px; border:1px solid var(--hairline); border-radius:4px;
            padding:0 12px; font:inherit; font-size:15px; font-weight:400; background:var(--paper); color:var(--ink); min-width:0; }
textarea.tp-input { padding:12px; line-height:1.6; resize:vertical; }
textarea.tp-input.mono { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:13px; line-height:1.7; padding:14px 16px; }
select.tp-input { padding:0 10px; }
.tp-input:focus { outline:none; border-color:var(--ink); }
.tp-label { display:flex; flex-direction:column; gap:8px; font-size:13px; font-weight:600; min-width:0; }
.tp-label > small { font-weight:400; color:var(--muted); font-size:12px; }
.tp-grid2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); gap:20px 24px; margin-top:20px; }
.tp-grid4 { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr)); gap:20px 24px; margin-top:20px; }
.tp-small { font-size:12px; color:var(--muted); margin-top:6px; }

/* Erweitert (Skript/JSON) */
.tp-adv { border-top:1px solid var(--hairline); padding-top:20px; margin-top:32px; }
.tp-adv summary { font-size:14px; cursor:pointer; list-style:none; display:flex; gap:8px; }
.tp-adv summary::-webkit-details-marker { display:none; }
.tp-adv summary b { font-weight:600; }
.tp-adv summary span { color:var(--muted); }
.tp-adv pre { margin:14px 0 0; padding:16px; border:1px solid var(--hairline); font-size:13px; line-height:1.6; overflow-x:auto; }
.tp-adv textarea { margin-top:14px; }

/* Klebende Aktionsleiste */
.tp-actionbar { position:sticky; bottom:0; z-index:5; background:var(--paper); border-top:1px solid var(--hairline); margin-top:40px;
                padding:16px 0 20px; display:flex; flex-wrap:wrap; gap:12px 24px; align-items:center; justify-content:space-between; }
.tp-actionbar > div:first-child { min-width:0; flex:1 1 260px; }
.tp-ab-t { font-size:14px; font-weight:600; }
.tp-ab-s { font-size:13px; color:var(--muted); margin-top:2px; }
.tp-ab-btns { display:flex; gap:12px; }
.tp-btn { min-height:44px; padding:0 20px; border:1px solid var(--ink); background:transparent; color:var(--ink); font-size:14px;
          font-weight:600; cursor:pointer; display:inline-flex; align-items:center; text-decoration:none; }
.tp-page a.tp-btn:hover { color:var(--ink); text-decoration:none; background:var(--hairline-2); }
.tp-btn.primary { background:var(--ink); color:#fff; letter-spacing:.02em; padding:0 22px; }
.tp-btn.quiet { border-color:var(--hairline); background:var(--paper); }
.tp-btn.earth { border-color:var(--earth); color:var(--earth); background:var(--paper); }
.tp-btn.earth.fill { background:var(--earth); color:#fff; border:0; }
.tp-btn:disabled { opacity:.35; cursor:default; }

/* Seitliche Kaesten */
.tp-box { border:1px solid var(--hairline); padding:20px; }
.tp-box.pending { border-color:var(--earth-soft); }
.tp-box-v { font-family:var(--serif); font-size:22px; margin-top:10px; line-height:1.3; }
.tp-box-s { font-size:13px; color:var(--muted); margin-top:12px; line-height:1.6; }
.tp-sum { display:grid; grid-template-columns:1fr 1fr; gap:18px 16px; margin-top:16px; }
.tp-sum .tp-bv-v { font-size:24px; margin-top:2px; }
.tp-warns { display:flex; flex-direction:column; gap:12px; }
.tp-warn { font-size:13px; line-height:1.6; border-top:1px solid var(--hairline); padding-top:10px; }
.tp-note-s { font-size:13px; color:var(--muted); line-height:1.6; }

/* Zeitplan-Tagesleiste */
.tp-day { position:relative; height:36px; background:var(--hairline-2); margin-top:16px; overflow:hidden; }
.tp-day span { position:absolute; top:0; bottom:0; min-width:3px; background:var(--ink); }
.tp-day-axis { display:flex; justify-content:space-between; font-size:12px; color:var(--muted); margin-top:6px; font-variant-numeric:tabular-nums; }
.tp-sentence { font-family:var(--serif); font-size:24px; }

@media (max-width:720px) {
  .tp-head h1 { font-size:34px; }
  .tp-tabs { gap:20px; }
  .tp-aside.sticky { position:static; }
}

/* Original backups (NEF) in the message gallery */
.tp-frbar { display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:10px; }
.tp-frbar #frTools { display:inline-flex; flex-wrap:wrap; gap:12px; align-items:center; }
.tp-frbar #frTools[hidden] { display:none; }
.tp-pics.selecting .tp-pic { cursor:pointer; }
.tp-pics.selecting .tp-pic img { opacity:.75; }
.tp-pics .tp-pic.chosen img { opacity:1; outline:3px solid var(--ink); outline-offset:-3px; }
.tp-frbadge { display:inline-block; font-size:11px; margin-top:4px; padding:1px 6px; border:1px solid var(--hairline); color:var(--muted); }
.tp-frbadge.queued { border-color:var(--earth-soft); color:var(--earth); }
.tp-frbadge.stored { border-color:var(--forest); color:var(--forest); }
.tp-frbadge.missing, .tp-frbadge.failed { border-color:#B03A2E; color:#B03A2E; }
.tp-frstored { margin-top:20px; }
.tp-frstored ul { list-style:none; padding:0; margin:8px 0 0; }
.tp-frstored li { padding:6px 0; border-top:1px solid var(--hairline); display:flex; gap:12px; flex-wrap:wrap; }
.tp-h3 { font-size:14px; font-weight:600; margin:0; }

/* Standort (#453): the other cameras at the same site */
.tp-siblings { font-size:.85rem; color:var(--muted, #6b6b6b); margin:-4px 0 10px; }
.tp-siblings a { color:inherit; text-decoration:underline; }
.tp-tag.archived { color:var(--muted, #6b6b6b); }
.tp-tag.test { color:#0b6b8a; border-color:#9fd0df; }