/* ===========================================================================
   Luxilo — shared UI module (favorites / shortlist + social proof)
   Self-contained. Uses brand vars with fallbacks so it works on every page.
   =========================================================================== */
:root{
  --lux-blue:#0700fb;
  --lux-ink:#0a0a0f;
  --lux-mute:#6b6b76;
  --lux-line:rgba(10,10,15,.10);
  --lux-card:#fff;
  --lux-red:#e23b4e;
  --lux-shadow:0 10px 30px rgba(0,0,0,.14),0 2px 8px rgba(0,0,0,.08);
}

/* ---------- Heart button (shared base) ---------------------------------- */
.lux-fav{
  border:0;background:none;padding:0;margin:0;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  -webkit-tap-highlight-color:transparent;color:var(--lux-ink);
}
.lux-fav svg{width:20px;height:20px;display:block;transition:transform .18s cubic-bezier(.34,1.56,.64,1);}
.lux-fav svg path{fill:none;stroke:currentColor;stroke-width:1.9;transition:fill .18s ease,stroke .18s ease;}
.lux-fav.is-active svg path{fill:var(--lux-red);stroke:var(--lux-red);}
.lux-fav.is-active svg{transform:scale(1.06);}
.lux-fav.lux-pop svg{animation:lux-pop .42s cubic-bezier(.34,1.56,.64,1);}
@keyframes lux-pop{0%{transform:scale(1)}40%{transform:scale(1.35)}100%{transform:scale(1.06)}}

/* Card overlay variant (catalogue) */
.card .card-photo{position:relative;}
.lux-fav--card{
  position:absolute;top:10px;right:10px;z-index:5;
  width:38px;height:38px;border-radius:50%;
  background:rgba(255,255,255,.82);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  box-shadow:0 2px 8px rgba(0,0,0,.16);color:var(--lux-ink);
  transition:transform .2s ease,background .2s ease;
}
.lux-fav--card:hover{transform:scale(1.08);background:#fff;}
.lux-fav--card:active{transform:scale(.94);}
.lux-fav--card svg{width:18px;height:18px;}

/* Booking-card variant (vehicle page): full-width ghost button */
.lux-fav--booking{
  width:100%;margin-top:10px;padding:13px 16px;border-radius:12px;
  border:1px solid var(--lux-line);background:#fff;color:var(--lux-ink);
  font:600 14px/1 inherit;letter-spacing:.01em;justify-content:center;
  transition:border-color .2s ease,background .2s ease,color .2s ease;
}
.lux-fav--booking:hover{border-color:var(--lux-ink);}
.lux-fav--booking.is-active{border-color:var(--lux-red);color:var(--lux-red);background:rgba(226,59,78,.04);}
.lux-fav--booking .lux-fav__label{font-weight:600;}

/* ---------- Header controls (top-left): currency + cart ----------------- */
.lux-hdr{position:absolute;top:28px;left:48px;z-index:11;display:flex;align-items:center;gap:8px;}
@media(max-width:768px){.lux-hdr{top:24px;left:18px;gap:6px;}}
@media(max-width:480px){.lux-hdr{top:18px;left:14px;}}

/* currency selector */
.lux-cur{position:relative;}
.lux-cur-btn{display:inline-flex;align-items:center;gap:3px;height:32px;padding:0 8px 0 11px;cursor:pointer;
  border:1px solid var(--line,rgba(10,10,15,.12));border-radius:999px;background:var(--bg,#fff);
  color:var(--mute,#6b6b76);font:600 12px/1 inherit;letter-spacing:.02em;-webkit-tap-highlight-color:transparent;
  transition:border-color .15s ease,color .15s ease;}
.lux-cur-btn:hover{border-color:var(--ink,#0a0a0f);color:var(--ink,#0a0a0f);}
.lux-cur-code{font-variant-numeric:tabular-nums;}
.lux-cur-btn svg{width:13px;height:13px;}
.lux-cur-menu{position:absolute;top:40px;left:0;min-width:224px;background:#fff;padding:6px;z-index:30;
  border:1px solid var(--line,rgba(10,10,15,.12));border-radius:14px;box-shadow:0 14px 36px rgba(0,0,0,.16);
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .16s ease,transform .16s ease,visibility .16s ease;}
.lux-cur.open .lux-cur-menu{opacity:1;visibility:visible;transform:translateY(0);}
.lux-cur-opt{display:flex;align-items:center;justify-content:space-between;width:100%;gap:10px;padding:9px 10px;
  border:0;background:none;cursor:pointer;border-radius:9px;font:500 13px/1.1 inherit;color:var(--ink,#0a0a0f);text-align:left;}
.lux-cur-opt:hover{background:rgba(7,0,251,.06);}
.lux-cur-name{color:var(--mute,#6b6b76);font-weight:400;}
.lux-cur-opt.active{color:var(--blue,#0700fb);font-weight:600;}
.lux-cur-opt.active .lux-cur-name{color:var(--blue,#0700fb);}
.lux-cur-ck{opacity:0;color:var(--blue,#0700fb);flex:0 0 auto;}
.lux-cur-ck svg{width:15px;height:15px;display:block;}
.lux-cur-opt.active .lux-cur-ck{opacity:1;}
.lux-cur-note{padding:9px 10px 5px;margin-top:4px;border-top:1px solid var(--line,rgba(10,10,15,.10));
  font-size:11px;line-height:1.45;color:var(--mute,#6b6b76);}

/* cart button */
.lux-cart{position:relative;width:34px;height:34px;border-radius:50%;cursor:pointer;
  border:1px solid var(--line,rgba(10,10,15,.12));background:var(--bg,#fff);color:var(--mute,#6b6b76);
  display:inline-flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;
  transition:border-color .15s ease,color .15s ease,transform .12s ease;}
.lux-cart:hover{border-color:var(--ink,#0a0a0f);color:var(--ink,#0a0a0f);}
.lux-cart:active{transform:scale(.94);}
.lux-cart.has-items{color:var(--ink,#0a0a0f);border-color:var(--ink,#0a0a0f);}
.lux-cart svg{width:18px;height:18px;}
.lux-cart__badge{position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;
  background:var(--blue,#0700fb);color:#fff;font:700 11px/18px inherit;text-align:center;box-shadow:0 0 0 2px var(--bg,#fff);}

/* ---------- Backdrop + bottom sheet ------------------------------------- */
.lux-sl-backdrop{
  position:fixed;inset:0;z-index:99990;background:rgba(8,8,14,.46);
  opacity:0;pointer-events:none;transition:opacity .25s ease;backdrop-filter:blur(2px);
}
.lux-sl-backdrop.is-open{opacity:1;pointer-events:auto;}
.lux-sl-sheet{
  position:fixed;left:50%;bottom:0;transform:translate(-50%,100%);
  z-index:99991;width:min(520px,100%);max-height:84vh;
  background:#fff;border-radius:22px 22px 0 0;box-shadow:0 -10px 40px rgba(0,0,0,.22);
  display:flex;flex-direction:column;transition:transform .32s cubic-bezier(.22,1,.36,1);
  font-family:inherit;
}
.lux-sl-sheet.is-open{transform:translate(-50%,0);}
@media(min-width:760px){
  .lux-sl-sheet{bottom:auto;top:50%;transform:translate(-50%,-46%);border-radius:18px;opacity:0;}
  .lux-sl-sheet.is-open{transform:translate(-50%,-50%);opacity:1;}
}
.lux-sl-grip{width:40px;height:4px;border-radius:2px;background:var(--lux-line);margin:10px auto 0;}
@media(min-width:760px){.lux-sl-grip{display:none;}}
.lux-sl-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px 14px;}
.lux-sl-title{font-size:18px;font-weight:700;letter-spacing:-.01em;color:var(--lux-ink);}
.lux-sl-title span{color:var(--lux-mute);font-weight:500;font-size:14px;margin-left:6px;}
.lux-sl-close{border:0;background:none;cursor:pointer;color:var(--lux-mute);width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;line-height:1;transition:background .15s ease;}
.lux-sl-close:hover{background:var(--lux-line);color:var(--lux-ink);}
.lux-sl-list{overflow-y:auto;padding:0 14px;flex:1;-webkit-overflow-scrolling:touch;}
.lux-sl-item{display:flex;align-items:center;gap:14px;padding:12px 8px;border-bottom:1px solid var(--lux-line);}
.lux-sl-item:last-child{border-bottom:0;}
.lux-sl-thumb{width:78px;height:54px;border-radius:9px;background:#f1f1f4 center/cover no-repeat;flex:0 0 auto;}
.lux-sl-meta{flex:1;min-width:0;}
.lux-sl-name{display:block;font-size:14px;font-weight:600;color:var(--lux-ink);text-decoration:none;line-height:1.25;}
.lux-sl-name:hover{color:var(--lux-blue);}
.lux-sl-price{font-size:13px;color:var(--lux-mute);margin-top:3px;}
.lux-sl-price b{color:var(--lux-ink);font-weight:600;}
.lux-sl-remove{border:0;background:none;cursor:pointer;color:var(--lux-mute);width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:0 0 auto;transition:background .15s,color .15s;}
.lux-sl-remove:hover{background:rgba(226,59,78,.1);color:var(--lux-red);}
.lux-sl-remove svg{width:16px;height:16px;fill:currentColor;}
.lux-sl-empty{padding:40px 28px 48px;text-align:center;color:var(--lux-mute);font-size:14px;line-height:1.55;}
.lux-sl-empty svg{width:34px;height:34px;fill:none;stroke:var(--lux-line);stroke-width:1.6;margin:0 auto 14px;display:block;}
.lux-sl-actions{padding:14px 18px calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--lux-line);display:flex;flex-direction:column;gap:8px;}
.lux-sl-send{
  display:flex;align-items:center;justify-content:center;gap:10px;width:100%;
  padding:15px 18px;border:0;border-radius:13px;background:#25D366;color:#fff;cursor:pointer;
  font:700 15px/1 inherit;text-decoration:none;transition:filter .18s ease,transform .12s ease;
}
.lux-sl-send:hover{filter:brightness(1.05);}
.lux-sl-send:active{transform:scale(.99);}
.lux-sl-send svg{width:20px;height:20px;fill:#fff;}
.lux-sl-clear{border:0;background:none;cursor:pointer;color:var(--lux-mute);font:500 13px/1 inherit;padding:6px;text-align:center;transition:color .15s;}
.lux-sl-clear:hover{color:var(--lux-red);}

/* ---------- Toast ------------------------------------------------------- */
.lux-toast{
  position:fixed;left:50%;bottom:90px;transform:translate(-50%,16px);z-index:99995;
  background:var(--lux-ink);color:#fff;padding:11px 18px;border-radius:24px;font-size:13.5px;font-weight:500;
  box-shadow:var(--lux-shadow);opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease;
  display:flex;align-items:center;gap:8px;max-width:90vw;
}
.lux-toast.is-show{opacity:1;transform:translate(-50%,0);}
.lux-toast svg{width:16px;height:16px;fill:none;stroke:#25D366;stroke-width:2.2;}

/* ===========================================================================
   Social proof section (homepage)
   =========================================================================== */
.lux-social{padding:84px 24px;background:#fafafa;border-top:1px solid var(--lux-line);}
.lux-social-in{max-width:1200px;margin:0 auto;}
.lux-social-eyebrow{font-size:11px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--lux-blue);text-align:center;}
.lux-social-title{font-size:clamp(28px,4vw,42px);font-weight:700;letter-spacing:-.025em;color:var(--lux-ink);text-align:center;margin:14px 0 0;}
.lux-social-sub{font-size:15px;color:var(--lux-mute);text-align:center;margin:12px auto 0;max-width:520px;line-height:1.55;}
.lux-rating{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin:26px 0 4px;}
.lux-stars{display:inline-flex;gap:2px;}
.lux-stars svg{width:20px;height:20px;fill:#f5a623;}
.lux-rating-text{font-size:14px;color:var(--lux-ink);font-weight:600;}
.lux-rating-text a{color:var(--lux-blue);text-decoration:none;font-weight:600;}
.lux-rating-text a:hover{text-decoration:underline;}
.lux-tlist{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:46px;}
@media(max-width:880px){.lux-tlist{grid-template-columns:1fr;max-width:520px;margin-left:auto;margin-right:auto;}}
.lux-tcard{background:#fff;border:1px solid var(--lux-line);border-radius:18px;padding:26px;display:flex;flex-direction:column;}
.lux-tstars{display:inline-flex;gap:2px;margin-bottom:14px;}
.lux-tstars svg{width:16px;height:16px;fill:#f5a623;}
.lux-tquote{font-size:15px;line-height:1.62;color:var(--lux-ink);flex:1;}
.lux-tauthor{display:flex;align-items:center;gap:12px;margin-top:20px;}
.lux-tavatar{width:40px;height:40px;border-radius:50%;background:var(--lux-blue);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px;flex:0 0 auto;}
.lux-tname{font-size:14px;font-weight:600;color:var(--lux-ink);}
.lux-tmeta{font-size:12px;color:var(--lux-mute);margin-top:2px;}
.lux-trust{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 28px;margin-top:48px;padding-top:32px;border-top:1px solid var(--lux-line);}
.lux-trust-item{display:flex;align-items:center;gap:9px;font-size:13.5px;font-weight:600;color:var(--lux-ink);}
.lux-trust-item svg{width:17px;height:17px;fill:none;stroke:var(--lux-blue);stroke-width:2;}
