/* trip-info — Reisehandbuch-Webansicht.
   Farbwelt & Typografie 1:1 aus dem PDF-Skill, aber responsiv (rem statt mm). */

@font-face { font-family:'Fraunces'; src:url('/static/fonts/fraunces-latin-400-normal.woff2') format('woff2'); font-weight:400; font-display:swap; }
@font-face { font-family:'Fraunces'; src:url('/static/fonts/fraunces-latin-600-normal.woff2') format('woff2'); font-weight:600; font-display:swap; }
@font-face { font-family:'Fraunces'; src:url('/static/fonts/fraunces-latin-700-normal.woff2') format('woff2'); font-weight:700; font-display:swap; }
@font-face { font-family:'Fraunces'; src:url('/static/fonts/fraunces-latin-900-normal.woff2') format('woff2'); font-weight:900; font-display:swap; }
@font-face { font-family:'Fraunces'; src:url('/static/fonts/fraunces-latin-400-italic.woff2') format('woff2'); font-weight:400; font-style:italic; font-display:swap; }
@font-face { font-family:'Outfit'; src:url('/static/fonts/outfit-latin-300-normal.woff2') format('woff2'); font-weight:300; font-display:swap; }
@font-face { font-family:'Outfit'; src:url('/static/fonts/outfit-latin-400-normal.woff2') format('woff2'); font-weight:400; font-display:swap; }
@font-face { font-family:'Outfit'; src:url('/static/fonts/outfit-latin-500-normal.woff2') format('woff2'); font-weight:500; font-display:swap; }
@font-face { font-family:'Outfit'; src:url('/static/fonts/outfit-latin-600-normal.woff2') format('woff2'); font-weight:600; font-display:swap; }
@font-face { font-family:'Outfit'; src:url('/static/fonts/outfit-latin-700-normal.woff2') format('woff2'); font-weight:700; font-display:swap; }

:root{
  --ink:#22303A; --paper:#FBF7EF; --sand:#F2E7D5; --sand2:#EAD9BC;
  --blue:#0E3A53; --blue2:#155A79; --teal:#2A7F8E; --terra:#D9714E; --terra2:#C05B3A;
  --gold:#E3A857; --muted:#6B7A85; --line:#E3D8C4; --paid:#1F7A4D;
  --nav-h:3.75rem;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:1rem;}
body{font-family:'Outfit',sans-serif;color:var(--ink);background:var(--paper);
  font-size:1rem;line-height:1.55;-webkit-font-smoothing:antialiased;}

h1,h2,h3,h4{font-family:'Fraunces',serif;color:var(--blue);letter-spacing:-.01em;}
a{color:var(--blue2);}
.kicker{font-size:.72rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--terra);}
.kicker a{color:inherit;text-decoration:none;}
.muted{color:var(--muted);}
.small{font-size:.83rem;}
.lead{color:#3d4d59;margin:0 0 1rem;}
.sec{font-weight:900;font-size:1.6rem;margin:0 0 .75rem;}
code{font-family:ui-monospace,Menlo,monospace;font-size:.9em;background:var(--sand);
  border-radius:.3rem;padding:.05rem .35rem;}

/* ---------- Karten & Bausteine ---------- */
.card{background:#fff;border:1px solid var(--line);border-radius:1rem;
  padding:1rem 1.1rem;box-shadow:0 1px 0 rgba(34,48,58,.04);margin-bottom:.9rem;}
.card-head{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:.5rem;}
.card-head h3,.card-head h4{font-size:1.15rem;font-weight:700;}
.tag{display:inline-block;font-size:.66rem;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:#fff;background:var(--teal);border-radius:99px;padding:.15rem .6rem;}
.tag.terra{background:var(--terra);} .tag.blue{background:var(--blue);}
.tag.gold{background:var(--gold);color:var(--blue);} .tag.teal{background:var(--teal);}
.badge{display:inline-block;background:var(--sand);border-radius:99px;
  padding:.1rem .55rem;font-size:.76rem;font-weight:600;color:var(--blue2);}
.tags{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.5rem;}
.callout{background:var(--sand);border-left:3px solid var(--gold);border-radius:.5rem;
  padding:.7rem .9rem;font-size:.92rem;margin-top:.7rem;}
.callout.small{font-size:.84rem;padding:.5rem .75rem;}
.callout p+p{margin-top:.4rem;}
.notice{background:var(--sand);border-radius:.5rem;padding:.7rem .9rem;margin:.6rem 0;}
.notice.error{border-left:3px solid var(--terra2);}

.kv{width:100%;border-collapse:collapse;margin-top:.4rem;}
.kv td{padding:.28rem 0;vertical-align:top;font-size:.92rem;}
.kv td:first-child{color:var(--muted);width:34%;padding-right:.7rem;}

[data-copy]{cursor:pointer;border-bottom:1px dashed var(--teal);}
[data-copy].copied::after{content:" ✓ kopiert";color:var(--paid);font-size:.75em;font-weight:600;}

.btn{display:inline-block;background:var(--blue);color:#fff;text-decoration:none;
  font-weight:600;border-radius:.6rem;padding:.55rem 1rem;font-size:.95rem;border:none;cursor:pointer;}
.btn-row{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;margin:.6rem 0;}
.gps{font-size:.85rem;color:var(--muted);}
.btn-ghost{background:none;border:1px solid var(--line);border-radius:.5rem;
  padding:.3rem .7rem;font-size:.83rem;color:var(--blue2);cursor:pointer;font-family:inherit;}
.btn-ghost.danger,button.danger{color:#fff;background:var(--terra2);border:none;}
button.danger{border-radius:.6rem;padding:.55rem 1rem;font-weight:600;cursor:pointer;font-family:inherit;}

/* ---------- Topbar ---------- */
.topbar{background:linear-gradient(165deg,#0B2E43 0%,var(--blue) 45%,var(--blue2) 100%);
  color:#fff;padding:calc(env(safe-area-inset-top) + 1.2rem) 1.2rem 1.2rem;}
.topbar-inner{max-width:64rem;margin:0 auto;display:flex;justify-content:space-between;
  align-items:flex-start;gap:1rem;}
.topbar .kicker{color:#F6D9A0;}
.topbar h1{color:#fff;font-weight:900;font-size:2rem;line-height:1.05;margin:.2rem 0 .3rem;}
.topbar-dates{color:#DCEAF0;font-size:.9rem;font-weight:300;}
.pdf-btn{background:rgba(246,217,160,.15);border:1px solid rgba(246,217,160,.55);color:#F6D9A0;
  border-radius:.6rem;padding:.4rem .8rem;text-decoration:none;font-weight:600;font-size:.85rem;white-space:nowrap;}

/* ---------- Layout ---------- */
.trip-main{max-width:64rem;margin:0 auto;padding:1rem 1rem calc(var(--nav-h) + 2.5rem);}
.section{padding-top:1.2rem;}
.section:target{scroll-margin-top:.5rem;}
.cards-2col{display:grid;grid-template-columns:1fr;gap:.9rem;margin-bottom:.9rem;}
@media(min-width:700px){.cards-2col{grid-template-columns:1fr 1fr;}}

/* ---------- Heute-Karte ---------- */
.today-card{background:linear-gradient(170deg,var(--blue) 0%,var(--blue2) 70%,var(--teal) 100%);
  color:#EAF2F5;border-radius:1.2rem;padding:1.2rem 1.3rem;box-shadow:0 4px 16px rgba(11,46,67,.25);}
.today-kicker{font-size:.72rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:#F6D9A0;}
.today-big{font-family:'Fraunces',serif;font-weight:900;font-size:1.7rem;color:#fff;margin:.3rem 0;}
.today-line{margin:.35rem 0;font-size:.95rem;}
.today-line a{color:#F6D9A0;}
.today-line .muted{color:#B7CBD6;}
.today-sub{font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:#F6D9A0;margin:.9rem 0 .2rem;}
.today-todos ul{list-style:none;margin-top:.3rem;}
.today-todos li{padding:.3rem 0;border-top:1px solid rgba(246,217,160,.25);font-size:.92rem;}
.today-card .callout{background:rgba(246,217,160,.14);border-left-color:var(--gold);
  color:#fff;}
.today-flight{margin:.6rem 0;}
.tf-route{display:flex;align-items:center;gap:.8rem;}
.tf-code{font-family:'Fraunces',serif;font-weight:900;font-size:2rem;color:#fff;}
.tf-arrow{color:#F6D9A0;font-size:1.3rem;}
.due{display:inline-block;margin-left:.4rem;font-size:.75rem;color:#F6D9A0;}

/* ---------- Flüge ---------- */
.flight-no{font-size:1rem;}
.flight-no strong{font-family:'Fraunces',serif;font-weight:900;color:var(--blue);font-size:1.15rem;}
.flight-route{display:flex;align-items:center;gap:1rem;margin:.6rem 0;}
.flight-route .apt{text-align:center;}
.flight-route .code{font-family:'Fraunces',serif;font-weight:900;font-size:1.6rem;color:var(--blue);line-height:1;}
.flight-route .city{font-size:.75rem;color:var(--muted);}
.flight-route .time{font-weight:700;font-size:1.05rem;margin-top:.15rem;}
.flight-route .mid{flex:1;text-align:center;color:var(--teal);position:relative;}
.flight-route .mid::before{content:"";position:absolute;left:0;right:0;top:50%;
  border-top:2px dashed var(--teal);opacity:.5;}
.flight-route .mid{font-size:1.2rem;}

/* ---------- Adresse / Anreise ---------- */
.address{font-size:1.05rem;font-weight:600;}
.route-steps{margin:.6rem 0 .6rem 1.3rem;}
.route-steps li{margin:.4rem 0;font-size:.94rem;}
.qr-block{display:flex;align-items:center;gap:.9rem;margin-top:.7rem;}
.qr-block img{width:6rem;height:6rem;}

/* ---------- Guide / Prosa ---------- */
.factrow{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem;margin:0 0 1rem;}
@media(min-width:700px){.factrow{grid-template-columns:repeat(4,1fr);}}
.fact{background:#fff;border:1px solid var(--line);border-radius:.8rem;padding:.7rem;text-align:center;}
.fact .v{font-family:'Fraunces',serif;font-weight:900;font-size:1.3rem;color:var(--teal);}
.fact .l{font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
.prose-block{margin:1.2rem 0;}
.prose-block h3{font-size:1.3rem;font-weight:700;margin:.2rem 0 .5rem;}
.prose-block p{margin:.6rem 0;hyphens:auto;}
@media(min-width:800px){.prose-block p{max-width:44rem;}}

/* ---------- POI-Karten ---------- */
.poi-card h4{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem;
  font-size:1.05rem;font-weight:700;margin-bottom:.3rem;}
.poi-card .km{font-family:'Outfit';font-size:.76rem;font-weight:700;color:var(--terra);white-space:nowrap;}
.poi-card p{font-size:.92rem;color:#3d4d59;}

/* ---------- Entfernungen ---------- */
.dist-card{padding:1rem 1.1rem .8rem;}
.dist-row{margin:.45rem 0;}
.dist-label{font-size:.85rem;font-weight:600;}
.dist-track{position:relative;background:var(--sand);border-radius:99px;height:1.15rem;
  margin-top:.15rem;overflow:hidden;}
.dist-bar{height:100%;border-radius:99px;min-width:.3rem;}
.dist-value{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);
  font-size:.72rem;font-weight:700;color:var(--blue);}
.cat-beach{background:var(--teal);} .cat-culture{background:var(--blue2);} .cat-transfer{background:var(--terra);}
.dist-legend{display:flex;gap:1rem;flex-wrap:wrap;margin-top:.7rem;font-size:.76rem;color:var(--muted);}
.dist-legend i{display:inline-block;width:.7rem;height:.7rem;border-radius:99px;margin-right:.3rem;vertical-align:-.05rem;}

/* ---------- Events ---------- */
.event-card h4{font-size:1.05rem;}
.event-desc{font-size:.92rem;color:#3d4d59;margin-top:.4rem;}
.qr-block a{word-break:break-all;}

/* ---------- Restaurants ---------- */
.resto-list{display:grid;grid-template-columns:1fr;gap:.7rem;}
@media(min-width:700px){.resto-list{grid-template-columns:1fr 1fr;}}
.resto-card{margin-bottom:0;}
.resto-head{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem;}
.resto-head h4{font-size:1.05rem;font-weight:700;}
.resto-meta{display:flex;gap:.5rem;align-items:baseline;white-space:nowrap;}
.rating{color:var(--terra2);font-weight:700;font-size:.85rem;}
.resto-card .km{font-size:.76rem;font-weight:700;color:var(--terra);}
.resto-sub{font-size:.82rem;color:var(--muted);margin:.15rem 0 .35rem;}
.resto-why{font-size:.92rem;}

/* ---------- Finanzen ---------- */
.fin-tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem;margin-bottom:.9rem;}
@media(min-width:700px){.fin-tiles{grid-template-columns:repeat(4,1fr);}}
.fin-tile{background:#fff;border:1px solid var(--line);border-radius:.8rem;padding:.7rem;text-align:center;}
.fin-tile .v{font-family:'Fraunces',serif;font-weight:900;font-size:1.1rem;color:var(--blue);}
.fin-tile.paid .v{color:var(--paid);} .fin-tile.open .v{color:var(--terra2);}
.fin-tile .l{font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
.table-card{padding:.4rem .6rem;overflow-x:auto;}
table.fin{width:100%;border-collapse:collapse;}
table.fin th{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:#fff;
  background:var(--blue);text-align:left;padding:.5rem .6rem;}
table.fin th.r{text-align:right;}
table.fin td{padding:.5rem .6rem;border-bottom:1px solid var(--line);font-size:.9rem;vertical-align:top;}
table.fin .r{text-align:right;}
table.fin .amount{font-weight:600;white-space:nowrap;}
table.fin tr.sum td{background:var(--sand);font-weight:700;border-top:2px solid var(--blue);
  font-family:'Fraunces',serif;}
.status{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;border-radius:99px;padding:.12rem .5rem;white-space:nowrap;}
.status-paid{background:#E2F2E9;color:var(--paid);}
.status-due{background:#F9E4DC;color:var(--terra2);}
.status-deposit{background:var(--sand);color:var(--blue2);}
.status-refund_expected{background:#E3EEF2;color:var(--teal);}

@media(max-width:600px){
  table.fin thead{display:none;}
  table.fin,table.fin tbody,table.fin tr,table.fin td,table.fin tfoot{display:block;width:100%;}
  table.fin tbody tr{border:1px solid var(--line);border-radius:.7rem;margin:.5rem 0;
    padding:.5rem .6rem;background:#fff;}
  table.fin td{border:none;padding:.15rem 0;}
  table.fin td.r{text-align:left;}
  table.fin td.amount{font-size:1.05rem;}
  table.fin tfoot tr.sum{display:flex;justify-content:space-between;align-items:center;
    border-radius:.7rem;margin:.4rem 0;padding:.2rem .6rem;}
}

/* ---------- Quellen ---------- */
.sources{margin-top:2rem;border-top:1px solid var(--line);padding-top:1rem;}
.sources h3{font-size:.95rem;margin-bottom:.4rem;}
.sources ul{list-style:none;}
.sources li{font-size:.83rem;margin:.2rem 0;}

/* ---------- Bottom-Nav ---------- */
.bottom-nav{position:fixed;bottom:0;left:0;right:0;display:flex;background:#fff;
  border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom);
  box-shadow:0 -2px 12px rgba(34,48,58,.08);z-index:10;}
.bottom-nav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:.1rem;
  padding:.5rem 0 .45rem;text-decoration:none;color:var(--muted);font-size:.68rem;
  font-weight:600;letter-spacing:.03em;}
.bottom-nav a .ico{font-size:1.15rem;line-height:1;}
.bottom-nav a.active{color:var(--terra);}
@media(min-width:900px){
  .bottom-nav{top:0;bottom:auto;left:auto;right:0;width:7.5rem;flex-direction:column;
    height:100vh;border-top:none;border-left:1px solid var(--line);justify-content:center;gap:.5rem;}
  .bottom-nav a{flex:0 0 auto;padding:.8rem 0;}
  .trip-main{padding-right:8.5rem;}
  .topbar{padding-right:8.5rem;}
}

/* ---------- Auth-/Admin-Seiten ---------- */
.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1.5rem;}
.auth-card{background:#fff;border:1px solid var(--line);border-radius:1.2rem;
  padding:2rem 1.8rem;max-width:26rem;width:100%;box-shadow:0 4px 24px rgba(34,48,58,.08);}
.auth-card h1{font-size:1.8rem;font-weight:900;margin:.3rem 0 .7rem;}
.auth-card form{display:flex;flex-direction:column;gap:.5rem;margin-top:.8rem;}
.auth-card label,.invite-form label{font-size:.85rem;font-weight:600;color:var(--blue2);}
.auth-card input,.invite-form input[type=text],.invite-form input[type=email]{
  font-family:inherit;font-size:1rem;padding:.6rem .7rem;border:1px solid var(--line);
  border-radius:.6rem;background:var(--paper);}
.auth-card button,.invite-form button[type=submit]:not(.danger){
  margin-top:.6rem;background:var(--blue);color:#fff;border:none;border-radius:.6rem;
  padding:.7rem;font-family:inherit;font-size:1rem;font-weight:600;cursor:pointer;}
.list-wrap{max-width:34rem;width:100%;}
.trip-cards{display:flex;flex-direction:column;gap:.7rem;margin-top:1rem;}
.trip-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
  border-radius:1rem;padding:1rem 1.1rem;text-decoration:none;color:var(--ink);}
.trip-card strong{font-family:'Fraunces',serif;font-size:1.2rem;color:var(--blue);}

.admin-page{max-width:64rem;margin:0 auto;padding:1.5rem 1rem 3rem;}
.admin-head{display:flex;justify-content:space-between;align-items:flex-start;
  gap:1rem;margin-bottom:1.2rem;}
.admin-head h1{font-size:1.7rem;font-weight:900;}
.admin-table{width:100%;border-collapse:collapse;}
.admin-table th{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
  text-align:left;padding:.4rem .5rem;border-bottom:2px solid var(--blue);}
.admin-table td{padding:.5rem;border-bottom:1px solid var(--line);font-size:.9rem;vertical-align:top;}
.invite-form{display:flex;flex-direction:column;gap:.4rem;max-width:26rem;}
.invite-form .check{display:flex;gap:.5rem;align-items:center;font-weight:400;color:var(--ink);}
.invite-created{border-left:4px solid var(--gold);}
.invite-link{display:block;margin-top:.5rem;padding:.6rem;word-break:break-all;font-size:.85rem;}
.danger-zone{border-color:#EFC7B8;}
.danger-zone h3{color:var(--terra2);}