/*
 * Aswan Luxor Cruises — v3 package page.
 *
 * The rules classic-egypt-discovery.html adds on top of the shared design
 * system: the route bar, the Egypt map's fly/stay markers, the hotel slider,
 * the seasonal rate table and the add-on checkboxes. Extracted from that
 * mockup as the set difference against base.css, so nothing here is authored
 * and nothing is duplicated.
 *
 * Loaded only on a single package page (see alc_v3_registry()).
 */

  /* ===== package page ===== */
  .route-bar{display:flex; align-items:stretch; gap:0; background:var(--petrol-deep); color:#fff; border-radius:16px; padding:18px 14px; margin-bottom:16px;}
  .rb{flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center; text-align:center; gap:6px; padding:0 4px;}
  .rb .ri{width:44px; height:44px; border-radius:13px; background:rgba(255,255,255,.12); display:inline-flex; align-items:center; justify-content:center; color:#F4CD79; flex:none;}
  .rb .ri .ico{width:20px; height:20px;}
  .rb b{display:block; font-size:.86rem; line-height:1.2;}
  .rb small{display:block; font-size:.66rem; color:#CFE1E7; font-weight:600; line-height:1.3;}
  .rb-link{flex:0 0 74px; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; padding-top:14px; gap:4px; font-size:.58rem; font-weight:700; color:#9FB9C2; text-transform:uppercase; letter-spacing:.05em; text-align:center; position:relative;}
  .rb-link::before{content:""; position:absolute; left:-18px; right:-18px; top:22px; border-top:2px dashed rgba(255,255,255,.2); z-index:0;}
  .rb-link .ico{width:14px; height:14px; position:relative; z-index:1; background:var(--petrol-deep); box-sizing:content-box; padding:0 3px;}
  @media(max-width:860px){ .route-bar{flex-direction:column; align-items:stretch; gap:6px; padding:16px;} .rb{flex-direction:row; text-align:start; align-items:center; gap:12px;} .rb-link{flex-direction:row; padding:4px 0 4px 56px; justify-content:flex-start; gap:6px;} .rb-link::before{left:21px; right:auto; top:-8px; bottom:-8px; border-top:none; border-left:2px dashed rgba(255,255,255,.2);} }
  .facts b{white-space:normal;}
  .hotels{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
  @media(max-width:700px){ .hotels{grid-template-columns:1fr;} }
  .hotel{background:#fff; border:1.5px solid var(--line); border-radius:var(--r); overflow:hidden; display:flex; flex-direction:column;}
  .ht-img{position:relative; height:160px; overflow:hidden;}
  .ht-body{padding:14px 16px 16px; display:flex; flex-direction:column; gap:6px;}
  .ht-body small{font-size:.66rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; color:var(--orange);}
  .ht-body h3{font-size:1rem;}
  .ht-body h3 a:hover{color:var(--petrol);}
  .ht-body p{font-size:.84rem; margin:0;}
  .ht-tags{display:flex; gap:6px; flex-wrap:wrap; margin-top:4px;}
  .addons{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
  @media(max-width:640px){ .addons{grid-template-columns:1fr;} }
  .addon{display:flex; align-items:center; gap:12px; background:#fff; border:1.5px solid var(--line); border-radius:14px; padding:12px 14px; cursor:pointer; transition:border-color .2s, box-shadow .2s, background .2s; position:relative;}
  .addon:hover{border-color:var(--petrol-tint);}
  .addon input{position:absolute; opacity:0; width:0; height:0;}
  .addon .ai{width:38px; height:38px; border-radius:10px; background:var(--petrol-soft); color:var(--petrol); display:inline-flex; align-items:center; justify-content:center; flex:none; transition:background .2s,color .2s;}
  .addon .ai .ico{width:18px; height:18px;}
  .addon b{display:block; font-size:.88rem;}
  .addon small{font-size:.74rem; color:var(--muted); font-weight:600;}
  .addon em{font-style:normal; margin-inline-start:auto; font-weight:800; color:var(--petrol); white-space:nowrap; font-size:.9rem;}
  .addon::after{content:""; width:20px; height:20px; border-radius:6px; border:2px solid var(--line); flex:none; margin-inline-start:6px; background:#fff center/12px no-repeat;}
  .addon:has(input:checked){border-color:var(--petrol); background:var(--petrol-soft); box-shadow:var(--shadow);}
  .addon:has(input:checked) .ai{background:var(--petrol); color:#fff;}
  .addon:has(input:checked)::after{background-color:var(--orange); border-color:var(--orange); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");}
  .addon:has(input:focus-visible){outline:3px solid var(--gold); outline-offset:2px;}
  .sec .revs{grid-template-columns:repeat(3,1fr);}
  @media(max-width:900px){ .sec .revs{grid-template-columns:1fr;} }
  /* marker modes */
  .jp-map .mk-plane,.jp-map .mk-stay,.jp-map .mk-car,.jp-map .mk-train{display:none;}
  .jp-map .boat.car .mk-car{display:block;} .jp-map .boat.car .mk-boat{display:none;}
  .jp-map .boat.train .mk-train{display:block;} .jp-map .boat.train .mk-boat{display:none;}
  .jp-map .boat.fly .mk-plane{display:block;} .jp-map .boat.fly .mk-boat{display:none;}
  .jp-map .boat.stay .mk-stay{display:block;} .jp-map .boat.stay .mk-boat{display:none;}
  .jp-map .day .dl.fly{background:var(--blue-soft); color:var(--royal);}
  /* v2: overview copy */
  .ov-copy{margin-top:16px;}
  .ov-copy p{font-size:.95rem; color:var(--ink-soft); margin-bottom:12px; max-width:70ch;}
  .ov-copy h3{font-size:1.05rem; margin:18px 0 8px;}
  .gtk{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:16px;}
  @media(max-width:700px){ .gtk{grid-template-columns:1fr;} }
  .gtk div{background:#fff; border:1.5px solid var(--line); border-radius:12px; padding:14px;}
  .gtk .ico{width:18px; height:18px; color:var(--petrol); background:var(--petrol-soft); padding:7px; box-sizing:content-box; border-radius:9px; margin-bottom:8px;}
  .gtk b{display:block; font-size:.88rem;}
  .gtk small{font-size:.76rem; color:var(--muted); font-weight:600; line-height:1.4;}
  /* v2: tier switch */
  .tiers{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:16px 0 18px;}
  @media(max-width:560px){ .tiers{grid-template-columns:1fr;} }
  .tier{display:flex; align-items:center; gap:14px; background:#fff; border:2px solid var(--line); border-radius:16px; padding:14px 16px; cursor:pointer; text-align:start; font-family:inherit; transition:border-color .2s, box-shadow .2s, background .2s; position:relative;}
  .tier:hover{border-color:var(--petrol-tint);}
  .tier[aria-selected="true"]{border-color:var(--petrol); background:var(--petrol-soft); box-shadow:var(--shadow);}
  .tier .tn{width:46px; height:46px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; font-weight:800; font-size:.8rem; color:#fff; flex:none;}
  .tier b{display:block; font-size:1rem; color:var(--ink);}
  .tier small{display:block; font-size:.76rem; color:var(--muted); font-weight:600;}
  .tier em{font-style:normal; margin-inline-start:auto; text-align:end; flex:none;}
  .tier em b{font-size:1.15rem; color:var(--petrol); line-height:1.1;}
  .tier em small{font-size:.66rem; text-transform:uppercase; letter-spacing:.06em;}
  .tier{padding-inline-end:46px;}
  .tier .chk{position:absolute; top:50%; transform:translateY(-50%); inset-inline-end:14px; width:20px; height:20px; border-radius:50%; background:var(--orange); color:#fff; display:none; align-items:center; justify-content:center;}
  .tier .chk .ico{width:12px; height:12px; stroke-width:3;}
  .tier[aria-selected="true"] .chk{display:inline-flex;}
  .tier-note{display:flex; align-items:center; gap:10px; font-size:.82rem; color:var(--ink-soft); font-weight:600; margin-bottom:14px;}
  .tier-note .ico{width:16px; height:16px; color:var(--teal);}
  /* v2: dark pricing */
  .pricing{background:var(--petrol-deep); color:#fff; border-radius:20px; padding:28px; margin-top:6px; position:relative; overflow:hidden;}
  .pricing::after{content:""; position:absolute; inset-inline-end:-90px; top:-90px; width:300px; height:300px; border-radius:50%; background:rgba(255,255,255,.05);}
  .pricing .kicker{color:#F4CD79;}
  .pricing .kicker::before{background:#F4CD79;}
  .pricing h3{font-size:1.5rem; color:#fff; margin-bottom:6px;}
  .pricing h3 span{color:#F4CD79;}
  .pricing>p{color:#CFE1E7; font-size:.92rem; margin-bottom:18px;}
  .pr-wrap{overflow-x:auto; border-radius:14px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); position:relative; z-index:1;}
  .pr-t{width:100%; border-collapse:collapse; min-width:560px;}
  .pr-t th{padding:14px 16px; text-align:start; font-size:.66rem; text-transform:uppercase; letter-spacing:.12em; color:#F4CD79; font-weight:800; background:rgba(255,255,255,.06); border-bottom:1px solid rgba(255,255,255,.1);}
  .pr-t th:not(:first-child){text-align:center;}
  .pr-t td{padding:16px; border-bottom:1px solid rgba(255,255,255,.08); vertical-align:middle;}
  .pr-t tr:last-child td{border-bottom:none;}
  .pr-t tr:hover td{background:rgba(255,255,255,.04);}
  .pr-t .sn{display:flex; align-items:center; gap:12px;}
  .pr-t .si{width:36px; height:36px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; flex:none;}
  .pr-t .si .ico{width:16px; height:16px; color:#fff;}
  .pr-t .sn b{display:block; font-size:.95rem;}
  .pr-t .sn small{display:block; font-size:.72rem; color:#9FB9C2; font-weight:600;}
  .pr-t td.pv{text-align:center;}
  .pr-t td.pv b{display:block; font-size:1.25rem; color:#F4CD79; letter-spacing:-.02em; line-height:1.1;}
  .pr-t td.pv small{font-size:.66rem; color:#9FB9C2; font-weight:600;}
  .pr-notes{display:grid; grid-template-columns:1fr 1fr; gap:10px 20px; margin-top:16px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); border-radius:14px; padding:16px 18px; position:relative; z-index:1;}
  @media(max-width:600px){ .pr-notes{grid-template-columns:1fr;} }
  .pr-notes span{display:flex; align-items:center; gap:10px; font-size:.82rem; color:#E6F0F3; font-weight:600;}
  .pr-notes .ni{width:30px; height:30px; border-radius:8px; background:rgba(255,255,255,.1); display:inline-flex; align-items:center; justify-content:center; flex:none; color:#F4CD79;}
  .pr-notes .ni .ico{width:14px; height:14px;}
  .sh-price .sp-row .t4{font-size:.66rem; font-weight:800; color:var(--muted); text-transform:uppercase; letter-spacing:.06em;}
  /* v3: hotels slider */
  .hs-head{display:flex; align-items:center; justify-content:space-between; gap:12px; margin:26px 0 12px;}
  .hs-head h3{font-size:1.05rem;}
  .hs-head h3 span{color:var(--petrol);}
  .hs-nav{display:flex; gap:8px;}
  .hs-nav button{width:40px; height:40px; border-radius:50%; border:1.5px solid var(--line); background:#fff; color:var(--petrol); display:inline-flex; align-items:center; justify-content:center; cursor:pointer; transition:background .2s,border-color .2s;}
  .hs-nav button:hover{background:var(--petrol-soft); border-color:var(--petrol);}
  .hs{display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; padding:4px 4px 8px; margin:0 -4px; -webkit-overflow-scrolling:touch;}
  .hs::-webkit-scrollbar{display:none;}
  .hs .hotel{flex:0 0 calc(50% - 7px); scroll-snap-align:start; min-width:0;}
  @media(max-width:700px){ .hs .hotel{flex-basis:86%;} }
  .hs .ht-img{height:auto; aspect-ratio:25 / 16;} /* owner, 2026-09-13: ratio instead of a fixed height */
  .hs-dots{display:flex; gap:6px; justify-content:center; margin-top:6px;}
  .hs-dots i{width:8px; height:8px; border-radius:50%; background:var(--line); transition:background .2s, transform .2s;}
  .hs-dots i.on{background:var(--orange); transform:scale(1.3);}
  .pricing .hs-head{margin:24px 0 12px; position:relative; z-index:1;}
  .pricing .hs-head h3{color:#fff; font-size:1.05rem;}
  .pricing .hs-head h3 span{color:#F4CD79;}
  .pricing .hs-nav button{background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.2); color:#fff;}
  .pricing .hs-nav button:hover{background:rgba(255,255,255,.18); border-color:#fff;}
  .pricing .hs{position:relative; z-index:1;}
  .pricing .hs .hotel{border-color:transparent;}
  .pricing .hs-dots{position:relative; z-index:1;}
  .pricing .hs-dots i{background:rgba(255,255,255,.2);}
  .pricing .hs-dots i.on{background:#F4CD79;}
  @media(max-width:960px){ .jp-map,.sec .jp-map{position:static !important; top:auto; margin-bottom:16px;} .jp-map svg{max-height:none;} .jp-map .jm-desc{display:block;} }
