/* ==========================================================================
   EGYVACATIONS — DAY TOUR — timeline, pickup map, what-to-bring
   assets/css/templates/day.css
   Loads on top of tokens -> base -> chrome -> components -> sections.
   ========================================================================== */
/* ---------- 1. STOPS TIMELINE ---------- */
.evd-stops{position:relative;margin-top:var(--sp-6);padding-left:112px}
.evd-stops::before{content:"";position:absolute;left:75px;top:14px;bottom:36px;width:2px;
  background:var(--border-soft)}
.evd-stop{position:relative;padding-bottom:var(--sp-6)}
.evd-stop:last-child{padding-bottom:0}

.evd-stop__time{position:absolute;left:-112px;top:0;width:52px;text-align:right}
.evd-stop__time b{display:block;font-size:var(--fs-sm);font-weight:var(--fw-bold);color:var(--text-heading);
  line-height:1.2}
.evd-stop__time span{display:block;font-size:var(--fs-micro);font-weight:var(--fw-semi);letter-spacing:0;color:var(--text-muted);margin-top:3px}
.evd-stop__dot{position:absolute;left:-44px;top:3px;width:16px;height:16px;border-radius:50%;
  background:var(--surface);border:3px solid var(--action);z-index:1}
.evd-stop--optional .evd-stop__dot{border-color:var(--ev-ocean);border-style:dashed}
.evd-stop--end .evd-stop__dot{background:var(--action)}

.evd-stop__card{display:grid;grid-template-columns:168px 1fr;gap:0;border:1px solid var(--border-soft);
  border-radius:var(--r-lg);overflow:hidden;background:var(--surface);
  transition:box-shadow var(--dur-base) var(--ease)}
.evd-stop__card:hover{box-shadow:var(--shadow-2)}
.evd-stop__card--plain{grid-template-columns:1fr}
.evd-stop__media{position:relative;overflow:hidden;background:var(--surface-sunken);min-height:132px}
.evd-stop__media img{width:100%;height:100%;object-fit:cover;transition:transform var(--dur-slow) var(--ease)}
.evd-stop__card:hover .evd-stop__media img{transform:scale(1.04)}
.evd-stop__body{padding:18px 20px}
.evd-stop__body h3{font-size:1.05rem;font-weight:var(--fw-bold);line-height:var(--lh-tight)}
.evd-stop__body p{font-size:var(--fs-sm);color:var(--text-secondary);margin-top:8px;font-weight:var(--fw-light)}
.evd-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}
.evd-tags span{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:var(--r-sm);
  background:var(--surface-sunken);font-size:var(--fs-micro);font-weight:var(--fw-semi);letter-spacing:0;color:var(--text-secondary)}
.evd-tags svg{width:12px;height:12px;color:var(--ev-ocean)}
.evd-tags .opt{background:color-mix(in srgb,var(--ev-ocean) 10%,var(--surface));color:var(--ev-navy)}
.evd-tags .opt svg{color:var(--ev-ocean)}
@media(max-width:760px){
  .evd-stops{padding-left:0;padding-top:0}
  .evd-stops::before{display:none}
  .evd-stop__time{position:static;width:auto;text-align:left;display:flex;align-items:baseline;gap:9px;
    margin-bottom:9px}
  .evd-stop__time span{margin-top:0}
  .evd-stop__dot{display:none}
}
@media(max-width:560px){.evd-stop__card{grid-template-columns:1fr}.evd-stop__media{aspect-ratio:16/9;min-height:0}}

/* ---------- 2. PICKUP / LOGISTICS ---------- */
.evd-logistics{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;margin-top:var(--sp-6);
  border:1px solid var(--border-soft);border-radius:var(--r-lg);overflow:hidden;background:var(--border-soft)}
.evd-logistics > div{display:flex;gap:14px;padding:20px;background:var(--surface)}
.evd-logistics .ic{width:42px;height:42px;flex:none;border-radius:var(--r-md);background:var(--action);
  display:grid;place-items:center;color:var(--ev-white)}
.evd-logistics .ic svg{width:20px;height:20px}
.evd-logistics dt{font-size:var(--fs-micro);font-weight:var(--fw-bold);letter-spacing:0;color:var(--text-muted)}
.evd-logistics dd{font-size:var(--fs-sm);font-weight:var(--fw-semi);color:var(--text-heading);margin-top:4px}
.evd-logistics dd small{display:block;font-size:var(--fs-xs);font-weight:var(--fw-regular);
  color:var(--text-secondary);margin-top:4px;line-height:1.55}
@media(max-width:640px){.evd-logistics{grid-template-columns:1fr}}

/* ---------- 3. GROUP-SIZE PRICING ---------- */
.evd-tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:var(--sp-6)}
.evd-tier{position:relative;padding:var(--sp-5);border:1.5px solid var(--border-soft);
  border-radius:var(--r-lg);background:var(--surface);text-align:center;
  transition:border-color var(--dur-fast) var(--ease)}
.evd-tier:hover{border-color:var(--ev-sky)}
.evd-tier--best{border-color:var(--accent)}
.evd-tier--best::after{content:"Our pick";position:absolute;top:-10px;left:50%;transform:translateX(-50%);
  padding:3px 12px;border-radius:var(--r-pill);background:var(--accent);color:var(--on-accent);
  font-size:var(--fs-micro);font-weight:var(--fw-bold);letter-spacing:0;white-space:nowrap}
.evd-tier .who{font-size:var(--fs-micro);font-weight:var(--fw-bold);letter-spacing:0;color:var(--text-muted)}
.evd-tier b{display:block;font-size:1.75rem;font-weight:var(--fw-black);color:var(--text-heading);
  letter-spacing:var(--ls-heading);line-height:1;margin-top:10px}
.evd-tier .per{display:block;font-size:var(--fs-micro);color:var(--text-muted);margin-top:6px}
@media(max-width:820px){.evd-tiers{grid-template-columns:repeat(2,1fr);gap:16px}}
@media(max-width:420px){.evd-tiers{grid-template-columns:1fr}}

/* ---------- 4. OPTIONAL ADD-ONS ---------- */
.evd-addons{display:flex;flex-direction:column;gap:10px;margin-top:var(--sp-6)}
.evd-addon{display:flex;align-items:center;gap:16px;padding:16px 20px;border:1px solid var(--border-soft);
  border-radius:var(--r-lg);background:var(--surface)}
.evd-addon .ic{width:38px;height:38px;flex:none;border-radius:var(--r-md);background:rgba(4,120,179,.09);
  display:grid;place-items:center;color:var(--ev-ocean)}
.evd-addon .ic svg{width:18px;height:18px}
.evd-addon .t{flex:1;min-width:0}
.evd-addon b{display:block;font-size:var(--fs-sm);font-weight:var(--fw-bold);color:var(--text-heading)}
.evd-addon span{display:block;font-size:var(--fs-xs);color:var(--text-secondary);margin-top:3px}
.evd-addon .p{font-size:1.05rem;font-weight:var(--fw-black);color:var(--text-heading);
  letter-spacing:var(--ls-heading);white-space:nowrap}
.evd-addon .p em{font-style:normal;font-size:var(--fs-micro);font-weight:var(--fw-regular);color:var(--text-muted)}
@media(max-width:560px){.evd-addon{flex-wrap:wrap}.evd-addon .t{flex:1 1 100%;order:3}}

/* ---------- 5. WHAT TO BRING ---------- */
.evd-bring{display:grid;grid-template-columns:repeat(2,1fr);gap:12px var(--sp-7);margin-top:var(--sp-6)}
.evd-bring li{display:flex;gap:12px;font-size:var(--fs-sm);color:var(--text-secondary)}
.evd-bring svg{width:18px;height:18px;flex:none;color:var(--ev-ocean);margin-top:2px}
@media(max-width:640px){.evd-bring{grid-template-columns:1fr}}


.evd-tier--best{border-color:var(--ev-ocean)}
.evd-tier--best::after{background:var(--ev-navy);color:var(--ev-white)}
.evt-highlights .n{font-size:.75rem}