/* vaelo.css — Styles der Tourenverwaltung im WP-Kontext.
   Bewusst ohne <style>-Inline-Blöcke: hier zentral verwaltet,
   im Theme/Rahmen von WordPress eingebunden (Design bleibt
   über CSS anpassbar, wie gewünscht). */

/* box-sizing NUR innerhalb des Plugins (Theme bleibt unberührt) */
.vaelo, .vaelo *, .vaelo *::before, .vaelo *::after { box-sizing: border-box; }

:root {
    --vaelo-brand:  #2f6f4f;
    --vaelo-bg:     #ffffff;
    --vaelo-line:  #ddd8ce;
    --vaelo-danger:#b3402f;
}

.vaelo { max-width: 760px; margin: 0 auto; }

.vaelo table { width:100%; border-collapse:collapse; background:var(--vaelo-bg);
               border:1px solid var(--vaelo-line); border-radius:10px; overflow:hidden; }
.vaelo th, .vaelo td { padding:10px 12px; border-bottom:1px solid var(--vaelo-line);
                       text-align:left; font-size:.92rem; }
.vaelo th { background:#e9e5dc; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; }
.vaelo tr:last-child td { border-bottom:none; }

.vaelo a.btn, .vaelo button { display:inline-block; background:var(--vaelo-brand); color:#fff;
    border:none; border-radius:8px; padding:10px 16px; font-size:.95rem;
    text-decoration:none; cursor:pointer; }
.vaelo a.btn.secondary { background:#6b7f72; }
.vaelo button.danger { background:var(--vaelo-danger); padding:6px 10px; font-size:.8rem; }

.vaelo label { display:block; font-size:.8rem; font-weight:600; margin:12px 0 4px; color:#555; }
.vaelo input, .vaelo select, .vaelo textarea { width:100%; padding:10px;
    border:1px solid var(--vaelo-line); border-radius:8px; font-size:1rem; }
.vaelo textarea { min-height:90px; resize:vertical; }

.vaelo .grid3 { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:10px; }
.vaelo .grid2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px; }
.vaelo .hint  { font-size:.75rem; color:#888; }
.vaelo .error { background:#fdecea; color:var(--vaelo-danger); border:1px solid var(--vaelo-danger);
                border-radius:8px; padding:10px 14px; margin-bottom:12px; }
.vaelo .meta  { color:#777; font-size:.8rem; }
.vaelo .topbar { display:flex; justify-content:space-between; align-items:center; margin:12px 0; }
.vaelo .actions { display:flex; gap:8px; align-items:center; }
.vaelo .card { background:var(--vaelo-bg); border:1px solid var(--vaelo-line);
               border-radius:10px; padding:14px; margin-bottom:12px; }

/* ── Listen als div-Grid: ganze Zeile klickbar, Zebra, nur ✕ ── */
.vaelo .list { border:1px solid var(--vaelo-line); border-radius:10px; overflow:hidden;
               background:var(--vaelo-bg); }
.vaelo .lhead { display:grid; grid-template-columns:var(--cols);
                background:#e9e5dc; font-size:.78rem; text-transform:uppercase;
                letter-spacing:.04em; font-weight:600; color:#555; }
.vaelo .lhead > div, .vaelo .vrow > a > div { padding:10px 12px; }
.vaelo .vrow { position:relative; border-top:1px solid var(--vaelo-line); }
/* Zebra pro BLOCK (.vrow), nicht pro Zeile: mehrzeilige Track-Blöcke
   (Datenzeile + Funktionszeile) behalten gemeinsam eine Farbe */
.vaelo .vrow:nth-child(odd)  { background:#f0f6fd; }   /* sehr helles Blau */
.vaelo .vrow:nth-child(even) { background:#dcebf9; }   /* helles Blau */
.vaelo .vrow:hover { filter:brightness(.97); }
.vaelo .vrow > a, .vaelo .vrow > .rowgrid { display:grid; grid-template-columns:var(--cols);
                   text-decoration:none; color:inherit; align-items:center;
                   min-height:52px; }
.vaelo .vrow > a > div, .vaelo .vrow > .rowgrid > div { min-width:0; overflow:hidden;
                                                        text-overflow:ellipsis;
                                                        font-size:.78rem; }
.vaelo .vrow form.rowdel { position:absolute; right:10px; top:50%;
                           transform:translateY(-50%); margin:0; }
.vaelo .vrow form.rowdel button.danger { background:transparent; color:var(--vaelo-danger);
                                         padding:4px 6px; font-size:1rem; border-radius:6px; }
.vaelo .vrow form.rowdel button.danger:hover { background:#fdecea; }
/* Mini-Icon-Buttons (📋/🗺) in der Wegpunkt-Zeile; Abstand zum ✕-Löschbutton */
.vaelo .vrow .rowacts { display:flex; gap:2px; align-items:center; margin-right:30px; }
.vaelo .vrow .rowacts .iconbtn { cursor:pointer; font-size:0.9rem; line-height:1;
                                 padding:3px 3px; border-radius:6px; }
.vaelo .vrow .rowacts .iconbtn:hover { background:#eaf2fb; }
.vaelo .empty { padding:16px; text-align:center; color:#888; border-top:1px solid var(--vaelo-line); }

@media (max-width:640px) { .vaelo .hide-sm { display:none; } }