/* Mein Urlaub: scoped, readable travel planning for web and Android. */
.travel-screen{gap:14px;color:#19394c;--trip-teal:#176c73;--trip-muted:#536a79}
.travel-screen button:focus-visible,.travel-screen summary:focus-visible{outline:3px solid #087ba1;outline-offset:3px}
.travel-screen .travel-hero{min-height:0;grid-template-columns:36px minmax(0,1fr) 66px;align-items:center;padding:16px;background:linear-gradient(110deg,#fff,#eef8f5);box-shadow:none;border-radius:20px}
.travel-screen .travel-hero h1{font-size:28px;color:#17394d;line-height:1.2}
.travel-screen .travel-hero p{font-size:14px;color:var(--trip-muted)}
.travel-screen .travel-kicker{font-size:10px;color:var(--trip-teal);letter-spacing:.12em}
.travel-screen .travel-hero-add{width:66px;height:60px;gap:1px;color:#18394a;background:#ffdc65;border-radius:17px;box-shadow:0 5px 12px #153c4214}
.travel-screen .travel-hero-add small{font-size:13px}
.travel-screen .back-inline{min-height:44px}
.travel-spotlight{display:grid;grid-template-columns:minmax(0,1fr) 150px;align-items:center;gap:20px;min-height:200px;padding:24px;border-radius:22px;background:linear-gradient(90deg,rgba(9,38,53,.94),rgba(13,51,62,.76) 55%,rgba(13,51,62,.38)),url('./countdown-bg-beach.webp') center 55%/cover;color:#fff;box-shadow:0 9px 24px #17394d20;overflow:hidden}
.travel-spotlight-label{color:#ffe394;font-size:11px;letter-spacing:.12em;font-weight:800}
.travel-spotlight h2{margin:8px 0;font-size:26px;line-height:1.2;color:#fff}
.travel-spotlight p{margin:0;font-size:15px;line-height:1.5;color:#f0f8fc}
.travel-spotlight button{display:inline-flex;align-items:center;gap:18px;min-height:44px;margin-top:16px;padding:10px 14px;border:1px solid #ffffff70;border-radius:12px;background:#ffffff17;color:#fff;font-size:14px;font-weight:750}
.travel-spotlight-number{display:grid;justify-items:center;text-align:center;padding:15px 8px;background:#102f4499;border:1px solid #ffffff50;border-radius:20px;backdrop-filter:blur(5px)}
.travel-spotlight-number strong{font-size:62px;line-height:1.1;font-variant-numeric:tabular-nums;color:#ffe28a}
.travel-spotlight-number span{font-size:14px;line-height:1.5}
.travel-spotlight.is-empty{grid-template-columns:1fr}
.travel-screen .travel-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;padding:6px;border-radius:19px;background:#fff;border:1px solid #d5e4e9;box-shadow:0 4px 12px #18384c08}
.travel-screen .travel-tabs button{min-width:0;min-height:88px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:9px 5px;border:0;border-radius:14px;background:transparent;color:#3e5969;text-align:center;white-space:normal}
.travel-screen .travel-tabs button.active{background:linear-gradient(120deg,#193d50,#267879);color:#fff;box-shadow:0 4px 10px #17394d20}
.travel-screen .travel-tabs .icon{width:21px;height:21px}
.travel-screen .travel-tabs strong{font-size:15px;line-height:1.2}
.travel-screen .travel-tabs small{font-size:11px;font-weight:500;line-height:1.2}
.travel-screen .travel-tabs button span{display:inline-block;padding:2px 5px;margin:0 0 0 3px;border-radius:7px;background:#dceeed;color:#285962;font-size:11px}
.travel-screen .travel-tabs button.active span{color:#fff;background:#ffffff26}
.travel-screen .travel-panel{border-radius:20px;border-color:#d5e4e9;box-shadow:0 6px 18px #18384c08}
.travel-screen .travel-panel-intro{padding:17px 18px;background:linear-gradient(110deg,#f2f9f8,#fffdf4);gap:12px}
.travel-screen .travel-panel-intro strong{font-size:18px;color:#19394c;line-height:1.3}
.travel-screen .travel-panel-intro small{font-size:13px;color:var(--trip-muted);line-height:1.5;margin-top:4px}
.travel-screen .my-travel-list{gap:12px;padding:14px}
.travel-screen .travel-card{grid-template-columns:56px minmax(0,1fr) auto;gap:12px;padding:16px;border:1px solid #d6e8e7;border-radius:17px;background:linear-gradient(120deg,#f5fbfa,#fff)}
.travel-screen .travel-card-icon{width:56px;height:56px;border-radius:17px;font-size:29px;background:#e2f0eb}
.travel-screen .travel-card-copy strong{font-size:19px;color:#19394c;line-height:1.25}
.travel-screen .travel-card-copy span{font-size:15px;color:#31566a;line-height:1.4}
.travel-screen .travel-card-copy small{font-size:13px;color:var(--trip-muted);white-space:normal;line-height:1.45;overflow:visible}
.travel-screen .travel-card-copy .travel-card-private{flex-wrap:wrap;gap:3px;margin-top:8px}
.travel-screen .travel-card-countdown{font-size:16px;padding:10px;min-height:50px;background:#e0f0ed;color:#1b6565}
.travel-screen .travel-card-countdown small{font-size:11px;margin-top:4px}
.travel-screen .travel-card-actions{grid-column:2/-1;gap:8px;flex-wrap:wrap}
.travel-screen .travel-card-actions button{min-height:40px;padding:7px 12px;border-radius:10px;background:#e6f2f1;color:#225e68;font-size:13px}
.travel-screen .travel-card-actions button:last-child{color:#9d3d48;background:#fff1f1}
.travel-screen .travel-card.is-past{opacity:1;background:#f8fafb;border-color:#e1e8ed}
.travel-screen .travel-card-past{font-size:12px;color:#536a79}
.travel-screen .travel-add-wide{min-height:46px;font-size:14px;background:#f4faf9;border-color:#88bdb9;color:#24656b;margin-top:0}
.travel-past-trips{border-top:1px solid #e0e9ed}
.travel-past-trips summary{cursor:pointer;padding:18px;color:#476271;font-size:15px;font-weight:750;min-height:52px}
.travel-past-trips summary span{margin-left:6px;padding:3px 8px;border-radius:8px;background:#edf2f5;font-size:13px}
.travel-screen .travel-empty{min-height:190px;padding:22px;gap:9px}
.travel-screen .travel-empty strong{font-size:19px;color:#19394c}
.travel-screen .travel-empty p{font-size:15px;color:var(--trip-muted);line-height:1.5}
.travel-screen .travel-empty button{min-height:44px;font-size:14px;background:var(--trip-teal)}
.travel-screen .community-stay-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:14px}
.travel-screen .community-stay{padding:13px;border:1px solid #deeaed;border-radius:15px;background:#f9fcfc;grid-template-columns:minmax(0,1fr) 44px}
.travel-screen .community-stay-profile{min-height:48px;gap:10px}
.travel-screen .community-stay-profile strong{font-size:16px;line-height:1.3;color:#234858}
.travel-screen .community-stay-profile small{font-size:13px;line-height:1.4;color:var(--trip-muted);white-space:normal}
.travel-screen .community-stay-message{width:44px;height:44px;padding:11px;background:#e4f2f1;color:#21696e;border-color:#c8e2df}
.travel-screen .travel-privacy-note{font-size:12px;line-height:1.5;color:var(--trip-muted);padding:14px 18px}
.travel-calendar-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;padding:18px}
.travel-calendar-sheet{min-width:0}
.travel-calendar-heading{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:4px;margin-bottom:12px}
.travel-calendar-heading h2{font-size:18px;text-align:center;margin:0;color:#19394c}
.travel-calendar-heading button{width:44px;height:44px;border:1px solid #d5e5e7;border-radius:12px;background:#f0f7f7;color:#235e66;font-size:26px}
.travel-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;text-align:center}
.travel-calendar-grid>b{padding:7px 0;font-size:12px;color:#536a79}
.travel-calendar-day{display:grid;place-items:center;min-height:36px;border:2px solid transparent;border-radius:9px;font-size:14px;font-weight:650;font-variant-numeric:tabular-nums}
.travel-calendar-day.has-stay{background:#dbefeb;color:#225c60}
.travel-calendar-day.is-edge{background:#246c70;color:#fff}
.travel-calendar-day.is-today{border-color:#aa7816}
.travel-calendar-legend{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:10px 0;font-size:11px;color:#536a79}
.travel-calendar-legend>span:before{content:'';display:inline-block;width:9px;height:9px;margin-right:5px;background:#246c70;border-radius:3px}
.travel-calendar-legend button{min-height:40px;background:transparent;border:0;color:#21636d;font-size:12px;font-weight:750}
.travel-calendar-sheet .travel-add-wide{width:100%;margin:0}
.travel-calendar-agenda{min-width:0;padding:14px;border-radius:16px;background:#f3f8f8;align-self:start}
.travel-calendar-agenda h3{font-size:15px;margin:0 0 12px;color:#315563}
.travel-screen .travel-calendar-agenda .travel-card{grid-template-columns:40px minmax(0,1fr);padding:12px;gap:8px;margin-top:10px}
.travel-screen .travel-calendar-agenda .travel-card-icon{width:40px;height:40px;font-size:24px}
.travel-screen .travel-calendar-agenda .travel-card-copy strong{font-size:16px}
.travel-screen .travel-calendar-agenda .travel-card-copy span{font-size:14px}
.travel-screen .travel-calendar-agenda .travel-card-countdown,.travel-calendar-agenda .travel-card-past{grid-column:2;justify-self:start}
.travel-agenda-empty{font-size:14px;color:#536a79;line-height:1.5;margin:0;padding:10px 0;grid-column:1/-1}
@media(max-width:600px){
 .travel-screen{gap:11px}
 .travel-screen .travel-hero{padding:12px;gap:8px;grid-template-columns:28px minmax(0,1fr) 54px}
 .travel-screen .travel-hero h1{font-size:25px}
 .travel-screen .travel-hero p{font-size:12px}
 .travel-screen .travel-kicker{font-size:9px}
 .travel-screen .travel-hero-add{width:54px;height:56px}
 .travel-spotlight{grid-template-columns:minmax(0,1fr) 94px;min-height:180px;padding:18px 15px;gap:12px;border-radius:19px}
 .travel-spotlight h2{font-size:23px}
 .travel-spotlight-label{font-size:9px;letter-spacing:.08em}
 .travel-spotlight p{font-size:13px}
 .travel-spotlight button{font-size:12px;gap:8px;padding:8px 10px;margin-top:12px}
 .travel-spotlight-number{padding:14px 5px;border-radius:16px}
 .travel-spotlight-number strong{font-size:46px}
 .travel-spotlight-number span{font-size:12px}
 .travel-screen .travel-tabs{gap:3px;padding:4px}
 .travel-screen .travel-tabs button{min-height:79px;padding:9px 3px}
 .travel-screen .travel-tabs strong{font-size:13px}
 .travel-screen .travel-tabs small{font-size:10px}
 .travel-screen .travel-tabs button span{font-size:10px;padding:2px 4px}
 .travel-screen .travel-panel-intro{padding:15px 13px;gap:9px}
 .travel-screen .travel-panel-intro strong{font-size:17px}
 .travel-screen .travel-panel-intro small{font-size:13px}
 .travel-screen .my-travel-list{padding:10px}
 .travel-screen .travel-card{grid-template-columns:45px minmax(0,1fr);padding:13px;gap:10px}
 .travel-screen .travel-card-icon{width:45px;height:45px;font-size:25px}
 .travel-screen .travel-card-copy strong{font-size:18px}
 .travel-screen .travel-card-copy span{font-size:15px}
 .travel-screen .travel-card-countdown,.travel-screen .travel-card-past{grid-column:2;justify-self:start}
 .travel-screen .travel-card-countdown{display:flex;align-items:center;gap:8px;min-height:40px;font-size:14px;padding:8px 10px}
 .travel-screen .travel-card-countdown small{margin:0;font-size:11px}
 .travel-screen .travel-card-actions{grid-column:2/-1;gap:6px}
 .travel-screen .travel-card-actions button{min-height:44px;padding:8px 10px}
 .travel-screen .community-stay-list{grid-template-columns:1fr;padding:10px}
 .travel-calendar-layout{grid-template-columns:1fr;padding:13px;gap:15px}
 .travel-calendar-day{min-height:38px}
}
@media(prefers-reduced-transparency:reduce){.travel-spotlight-number{background:#173d4d;backdrop-filter:none}}
