/* TAXI FINAL PREMIUM UI - full image fit, compact category icons, original share icons */
:root{
  --taxi-green:#0f7a37;
  --taxi-green2:#21b95e;
  --taxi-gold:#d4a017;
  --taxi-pink:#d40b56;
  --taxi-navy:#10213d;
  --taxi-text:#1f2937;
  --taxi-muted:#667085;
  --taxi-border:#eadfce;
  --taxi-soft:#fffaf0;
}

/* common animation */
@keyframes taxiFadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes taxiFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}

.taxi-final-hero{
  position:relative;
  padding:54px 0 58px;
  background:
    radial-gradient(circle at 92% 4%, rgba(212,160,23,.18), transparent 28%),
    radial-gradient(circle at 4% 96%, rgba(15,122,55,.12), transparent 34%),
    linear-gradient(135deg,#fffdf7 0%,#f4fff2 55%,#fff8de 100%);
  border-bottom:1px solid var(--taxi-border);
  overflow:hidden;
}
.taxi-final-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(560px,680px);
  gap:42px;
  align-items:center;
}
.taxi-final-copy{animation:taxiFadeUp .55s ease both}
.taxi-final-copy h1{
  margin:15px 0 14px;
  font-size:clamp(44px,5vw,76px);
  line-height:1.01;
  letter-spacing:-.065em;
  color:var(--taxi-navy);
  font-weight:950;
}
.taxi-final-copy p{
  margin:0;
  max-width:760px;
  color:var(--taxi-muted);
  line-height:1.72;
  font-size:18px;
  font-weight:750;
}
.taxi-final-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:24px;
}
.taxi-final-actions .lux-btn{
  min-height:54px;
  border-radius:999px;
  padding-inline:22px;
}
.taxi-final-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:13px;
  margin-top:24px;
  max-width:650px;
}
.taxi-final-stats div{
  padding:16px;
  border-radius:24px;
  border:1px solid var(--taxi-border);
  background:linear-gradient(145deg,#fff,#fff8eb);
  box-shadow:0 16px 38px rgba(46,34,16,.08);
}
.taxi-final-stats strong{
  display:block;
  color:var(--taxi-gold);
  font-size:34px;
  line-height:1;
  font-weight:950;
}
.taxi-final-stats span{
  display:block;
  margin-top:5px;
  color:var(--taxi-muted);
  text-transform:uppercase;
  font-size:12px;
  font-weight:950;
}

/* IMPORTANT: uploaded/realistic image always fits fully inside box */
.taxi-final-cover,
.taxi-final-img,
.taxi-detail-final-photo{
  background:#fffaf0;
}
.taxi-final-cover{
  width:100%;
  aspect-ratio:16/9;
  border-radius:36px;
  overflow:hidden;
  border:1px solid rgba(234,223,206,.95);
  box-shadow:0 34px 90px rgba(46,34,16,.20);
  animation:taxiFloat 4s ease-in-out infinite;
}
.taxi-final-cover img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  display:block;
  background:#fffaf0;
}

.taxi-final-main{
  padding-top:28px;
}

/* filter */
.taxi-final-filter{
  display:grid;
  grid-template-columns:1.55fr 1fr 1.35fr 1fr auto;
  gap:13px;
  align-items:end;
  padding:18px;
  border-radius:32px;
  border:1px solid var(--taxi-border);
  background:#fff;
  box-shadow:0 22px 55px rgba(46,34,16,.10);
  margin-bottom:24px;
}
.taxi-final-filter label{
  display:grid;
  gap:7px;
}
.taxi-final-filter span{
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#7b8592;
  font-weight:950;
}
.taxi-final-filter input,
.taxi-final-filter select{
  height:54px;
  border:1px solid var(--taxi-border);
  border-radius:18px;
  padding:0 14px;
  background:#fffdf9;
  color:var(--taxi-navy);
  font-weight:850;
  outline:0;
}
.taxi-final-filter input:focus,
.taxi-final-filter select:focus{
  border-color:var(--taxi-gold);
  box-shadow:0 0 0 4px rgba(212,160,23,.12);
}

/* horizontal icon-only-ish category strip */
.taxi-icon-scroll-section{
  margin:20px 0 30px;
}
.taxi-section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:14px;
  margin-bottom:13px;
}
.taxi-section-head h2{
  margin:8px 0 0;
  font-size:28px;
  color:var(--taxi-navy);
  letter-spacing:-.04em;
}
.taxi-small-link{
  color:var(--taxi-green);
  font-weight:950;
  padding:8px 12px;
  border-radius:999px;
  background:#f2fff1;
}
.taxi-icon-scroll{
  display:flex;
  gap:12px;
  overflow-x:auto;
  padding:4px 4px 14px;
  scroll-snap-type:x mandatory;
}
.taxi-icon-scroll::-webkit-scrollbar{height:7px}
.taxi-icon-scroll::-webkit-scrollbar-track{background:#f6efe5;border-radius:999px}
.taxi-icon-scroll::-webkit-scrollbar-thumb{background:linear-gradient(135deg,var(--taxi-gold),var(--taxi-green));border-radius:999px}
.taxi-icon-scroll a{
  min-width:96px;
  max-width:96px;
  height:92px;
  flex:0 0 auto;
  border-radius:24px;
  border:1px solid var(--taxi-border);
  background:linear-gradient(145deg,#fff,#fff8ec);
  box-shadow:0 15px 34px rgba(46,34,16,.09);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:var(--taxi-navy);
  font-weight:950;
  text-align:center;
  scroll-snap-align:start;
  transition:.22s ease;
}
.taxi-icon-scroll a:hover,
.taxi-icon-scroll a.active{
  transform:translateY(-4px);
  box-shadow:0 26px 54px rgba(46,34,16,.15);
  border-color:rgba(212,160,23,.55);
}
.taxi-icon-scroll i{
  width:42px;
  height:42px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,var(--taxi-green),var(--taxi-green2));
  color:#fff;
  font-size:20px;
}
.taxi-icon-scroll a:nth-child(even) i{
  background:linear-gradient(135deg,var(--taxi-pink),#ff5c9a);
}
.taxi-icon-scroll span{
  font-size:12px;
  line-height:1.1;
}

/* location groups */
.taxi-location-final{
  margin:34px 0;
}
.taxi-location-final-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  margin-bottom:16px;
}
.taxi-location-final-head span{
  color:var(--taxi-gold);
  font-size:12px;
  text-transform:uppercase;
  font-weight:950;
}
.taxi-location-final-head h2{
  margin:5px 0 0;
  color:var(--taxi-navy);
  font-size:31px;
  line-height:1.1;
  letter-spacing:-.045em;
}
.taxi-location-final-head b{
  flex:0 0 auto;
  padding:9px 14px;
  border-radius:999px;
  background:#fbf4e3;
  color:#8f6a08;
}

/* premium listing cards */
.taxi-final-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}
.taxi-final-card{
  overflow:hidden;
  border-radius:32px;
  border:1px solid var(--taxi-border);
  background:#fff;
  box-shadow:0 20px 50px rgba(46,34,16,.11);
  transition:.25s ease;
  animation:taxiFadeUp .55s ease both;
}
.taxi-final-card:hover{
  transform:translateY(-6px);
  box-shadow:0 35px 78px rgba(46,34,16,.18);
}
.taxi-final-img{
  display:block;
  height:190px;
  padding:8px;
  border-bottom:1px solid #f0e4d4;
}
.taxi-final-img img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  display:block;
  border-radius:24px;
  background:#fffaf0;
}
.taxi-final-content{
  padding:16px;
}
.taxi-final-topline{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  margin-bottom:11px;
}
.taxi-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 10px;
  border-radius:999px;
  font-size:11.5px;
  font-weight:950;
  line-height:1;
}
.taxi-pill.type{
  background:#fff3da;
  color:#8f6a08;
}
.taxi-pill.status{
  color:#fff;
}
.taxi-pill.status.active{background:var(--taxi-green)}
.taxi-pill.status.running{background:var(--taxi-gold)}
.taxi-pill.status.inactive{background:#667085}
.taxi-final-content h3{
  margin:0 0 12px;
  color:var(--taxi-navy);
  font-size:20px;
  line-height:1.22;
  letter-spacing:-.025em;
}
.taxi-info-list{
  display:grid;
  gap:8px;
  min-height:86px;
}
.taxi-info-list p{
  display:grid;
  grid-template-columns:22px minmax(0,1fr);
  gap:8px;
  margin:0;
  color:#5f6673;
  font-size:13px;
  line-height:1.45;
  font-weight:750;
}
.taxi-info-list i{
  color:var(--taxi-gold);
}
.taxi-info-list span{
  overflow-wrap:anywhere;
}
.taxi-final-buttons{
  display:grid;
  grid-template-columns:1fr 44px 44px;
  gap:9px;
  margin-top:15px;
}
.taxi-final-buttons a{
  height:44px;
  border-radius:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  font-weight:950;
  transition:.2s ease;
}
.taxi-final-buttons a:hover{
  transform:translateY(-2px);
}
.taxi-final-buttons .call{background:#f1fff3;color:var(--taxi-green)}
.taxi-final-buttons .whatsapp{background:#e8fff1;color:#10a760}
.taxi-final-buttons .details{background:#fff4df;color:#8f6a08}

/* detail page */
.taxi-detail-final-hero{
  padding:22px 0 0;
  background:linear-gradient(135deg,#fffdf7,#f4fff2);
}
.taxi-back-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 14px;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--taxi-border);
  color:var(--taxi-green);
  font-weight:950;
  box-shadow:0 12px 28px rgba(46,34,16,.07);
}
.taxi-detail-final-main{
  padding-top:22px;
}
.taxi-detail-final-grid{
  display:grid;
  grid-template-columns:minmax(360px,480px) minmax(0,1fr);
  gap:26px;
  align-items:start;
}
.taxi-detail-final-photo{
  border-radius:36px;
  overflow:hidden;
  border:1px solid var(--taxi-border);
  box-shadow:0 30px 74px rgba(46,34,16,.16);
  padding:10px;
}
.taxi-detail-final-photo img{
  width:100%;
  height:430px;
  object-fit:contain;
  object-position:center;
  display:block;
  border-radius:28px;
  background:#fffaf0;
}
.taxi-detail-final-panel{
  background:#fff;
  border:1px solid var(--taxi-border);
  border-radius:36px;
  padding:28px;
  box-shadow:0 30px 74px rgba(46,34,16,.14);
}
.taxi-detail-final-top{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.taxi-detail-final-panel h1{
  margin:14px 0 8px;
  color:var(--taxi-navy);
  font-size:clamp(34px,4vw,58px);
  line-height:1.04;
  letter-spacing:-.06em;
}
.taxi-detail-subtitle{
  margin:0 0 20px;
  color:#5f6673;
  line-height:1.6;
  font-weight:760;
}
.taxi-detail-final-info{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin:20px 0;
}
.taxi-detail-final-info div{
  padding:14px;
  border-radius:20px;
  background:linear-gradient(145deg,#fffaf0,#fff);
  border:1px solid var(--taxi-border);
}
.taxi-detail-final-info small{
  display:block;
  color:#7b8592;
  font-size:11px;
  text-transform:uppercase;
  font-weight:950;
  margin-bottom:5px;
}
.taxi-detail-final-info b{
  display:block;
  color:var(--taxi-navy);
  font-size:17px;
  overflow-wrap:anywhere;
}
.taxi-detail-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:20px 0 24px;
}
.taxi-detail-actions a{
  min-height:48px;
  border-radius:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 16px;
  font-weight:950;
}
.taxi-detail-actions .call{background:#f1fff3;color:var(--taxi-green)}
.taxi-detail-actions .whatsapp{background:#e8fff1;color:#10a760}
.taxi-detail-actions .status{background:#fff4df;color:#8f6a08}
.taxi-share-final{
  padding-top:18px;
  border-top:1px solid #f0e4d4;
}
.taxi-share-final h3{
  margin:0 0 12px;
  color:var(--taxi-navy);
  font-size:22px;
}
.taxi-share-icons{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.taxi-share-icons a{
  width:48px;
  height:48px;
  border-radius:18px;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:22px;
  box-shadow:0 14px 30px rgba(46,34,16,.12);
  transition:.2s ease;
}
.taxi-share-icons a:hover{
  transform:translateY(-3px);
}
.taxi-share-icons .wa{background:#25D366}
.taxi-share-icons .fb{background:#1877F2}
.taxi-share-icons .tg{background:#229ED9}
.taxi-share-icons .copy{background:#10213d}

.taxi-empty{
  border-radius:30px;
  background:#fff;
  border:1px solid var(--taxi-border);
  box-shadow:0 20px 50px rgba(46,34,16,.09);
}

/* tablet */
@media(max-width:1180px){
  .taxi-final-hero-grid,
  .taxi-detail-final-grid{
    grid-template-columns:1fr;
  }
  .taxi-final-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .taxi-final-filter{
    grid-template-columns:1fr 1fr;
  }
}

/* mobile */
@media(max-width:760px){
  .taxi-final-hero{
    padding:26px 0 34px;
  }
  .lux-container{
    padding-left:14px !important;
    padding-right:14px !important;
  }
  .taxi-final-hero-grid{
    gap:18px;
  }
  .taxi-final-copy h1{
    font-size:37px;
    line-height:1.03;
    margin:12px 0 10px;
  }
  .taxi-final-copy p{
    font-size:14.5px;
    line-height:1.65;
  }
  .taxi-final-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    margin-top:16px;
  }
  .taxi-final-actions .lux-btn{
    width:100%;
    min-height:50px;
    border-radius:18px;
  }
  .taxi-final-stats{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:16px;
  }
  .taxi-final-stats div{
    border-radius:18px;
    padding:11px 9px;
  }
  .taxi-final-stats strong{
    font-size:25px;
  }
  .taxi-final-stats span{
    font-size:9.5px;
  }
  .taxi-final-cover{
    border-radius:24px;
    box-shadow:0 22px 48px rgba(46,34,16,.16);
    animation:none;
  }
  .taxi-final-filter{
    grid-template-columns:1fr;
    padding:14px;
    border-radius:24px;
    gap:12px;
  }
  .taxi-final-filter input,
  .taxi-final-filter select{
    height:50px;
    border-radius:16px;
  }
  .taxi-final-filter .lux-btn{
    width:100%;
    min-height:50px;
    border-radius:16px;
  }
  .taxi-section-head h2{
    font-size:23px;
  }
  .taxi-icon-scroll a{
    min-width:82px;
    max-width:82px;
    height:82px;
    border-radius:21px;
  }
  .taxi-icon-scroll i{
    width:38px;
    height:38px;
    font-size:18px;
  }
  .taxi-icon-scroll span{
    font-size:11px;
  }
  .taxi-location-final-head{
    align-items:flex-start;
  }
  .taxi-location-final-head h2{
    font-size:22px;
  }
  .taxi-location-final-head b{
    font-size:11px;
  }
  .taxi-final-grid{
    grid-template-columns:1fr;
    gap:14px;
  }
  .taxi-final-card{
    border-radius:26px;
  }
  .taxi-final-img{
    height:210px;
    padding:8px;
  }
  .taxi-final-content{
    padding:16px;
  }
  .taxi-final-topline{
    gap:7px;
  }
  .taxi-pill{
    font-size:11px;
    padding:7px 9px;
  }
  .taxi-final-content h3{
    font-size:20px;
    margin-bottom:12px;
  }
  .taxi-info-list{
    min-height:0;
  }
  .taxi-final-buttons{
    grid-template-columns:1fr 45px 45px;
  }
  .taxi-detail-final-grid{
    grid-template-columns:1fr;
    gap:16px;
  }
  .taxi-detail-final-photo{
    border-radius:26px;
    padding:8px;
  }
  .taxi-detail-final-photo img{
    height:auto;
    aspect-ratio:4/3;
    border-radius:20px;
  }
  .taxi-detail-final-panel{
    border-radius:26px;
    padding:18px;
  }
  .taxi-detail-final-panel h1{
    font-size:31px;
  }
  .taxi-detail-final-info{
    grid-template-columns:1fr;
    gap:10px;
  }
  .taxi-detail-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .taxi-share-icons{
    display:grid;
    grid-template-columns:repeat(4,48px);
  }
}

@media(max-width:380px){
  .taxi-final-stats{
    grid-template-columns:1fr;
  }
  .taxi-share-icons{
    grid-template-columns:repeat(2,48px);
  }
}


/* =========================================================
   FINAL MOBILE ALIGNMENT FIX
   - Search box stays inside background/card
   - Social share icons stay in one horizontal line
   - All mobile elements fit without overflow
   ========================================================= */
@media(max-width:760px){

  html, body{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }

  *, *:before, *:after{
    box-sizing:border-box !important;
  }

  .taxi-final-main,
  .taxi-detail-final-main{
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
  }

  .taxi-final-main.lux-container,
  .taxi-detail-final-main.lux-container,
  main.lux-container{
    padding-left:12px !important;
    padding-right:12px !important;
  }

  /* Search/filter must fit perfectly inside white card */
  .taxi-final-filter{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:11px !important;
    padding:12px !important;
    margin:18px 0 18px !important;
    border-radius:22px !important;
    overflow:hidden !important;
    background:#ffffff !important;
    border:1px solid var(--taxi-border,#eadfce) !important;
    box-shadow:0 16px 36px rgba(46,34,16,.10) !important;
  }

  .taxi-final-filter label{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    display:grid !important;
    gap:6px !important;
    margin:0 !important;
  }

  .taxi-final-filter span{
    display:block !important;
    width:100% !important;
    font-size:10.5px !important;
    line-height:1.2 !important;
  }

  .taxi-final-filter input,
  .taxi-final-filter select,
  .taxi-final-filter button,
  .taxi-final-filter .lux-btn{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:48px !important;
    min-height:48px !important;
    margin:0 !important;
    border-radius:15px !important;
    padding-left:12px !important;
    padding-right:12px !important;
    font-size:13.5px !important;
    line-height:1.2 !important;
  }

  .taxi-final-filter select{
    appearance:auto !important;
  }

  .taxi-final-filter button,
  .taxi-final-filter .lux-btn{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:7px !important;
    padding:0 12px !important;
  }

  /* Category scroll should never stretch page */
  .taxi-icon-scroll-section,
  .taxi-icon-scroll{
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
  }

  .taxi-icon-scroll{
    -webkit-overflow-scrolling:touch !important;
  }

  /* Listing cards full fit */
  .taxi-final-grid,
  .taxi-final-card,
  .taxi-final-content,
  .taxi-info-list,
  .taxi-info-list p{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }

  .taxi-info-list span,
  .taxi-final-content h3,
  .taxi-location-final-head h2{
    overflow-wrap:anywhere !important;
    word-break:normal !important;
  }

  .taxi-final-buttons{
    width:100% !important;
    max-width:100% !important;
    grid-template-columns:minmax(0,1fr) 44px 44px !important;
    gap:8px !important;
  }

  .taxi-final-buttons a{
    min-width:0 !important;
    max-width:100% !important;
  }

  /* Detail page social share icons: single horizontal line */
  .taxi-share-final{
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
  }

  .taxi-share-final h3{
    font-size:19px !important;
    margin-bottom:12px !important;
  }

  .taxi-share-icons{
    width:100% !important;
    max-width:100% !important;
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:8px !important;
    overflow:visible !important;
  }

  .taxi-share-icons a{
    flex:1 1 0 !important;
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    height:48px !important;
    border-radius:16px !important;
    font-size:21px !important;
    display:grid !important;
    place-items:center !important;
  }

  .taxi-detail-actions{
    width:100% !important;
    max-width:100% !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  .taxi-detail-actions a{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }

  .taxi-detail-final-panel,
  .taxi-detail-final-photo{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }

  .taxi-detail-final-info{
    width:100% !important;
    max-width:100% !important;
  }

  .taxi-detail-final-info div{
    min-width:0 !important;
    overflow:hidden !important;
  }

  .taxi-detail-final-info b{
    overflow-wrap:anywhere !important;
  }
}

@media(max-width:380px){
  .taxi-share-icons{
    gap:6px !important;
  }

  .taxi-share-icons a{
    height:44px !important;
    border-radius:14px !important;
    font-size:19px !important;
  }

  .taxi-final-filter{
    padding:10px !important;
  }
}