/* 🌍 BODY */
body{
  margin:0;
  font-family:Arial;
  background:#ffffff;
  color:#111;
  padding:15px;
}

/* TITLE */
h1{
  text-align:center;
  color:#dc2626;
}

/* 📦 CARD */
.card{
  background:#fff1f2;
  border:1px solid #fecaca;
  border-radius:12px;
  padding:15px;
  margin:15px 0;
}

/* PACKAGE NAME */
.card h2{
  margin:0;
  color:#dc2626;
}

/* STATUS */
.status{
  font-size:14px;
  margin:5px 0 10px;
  color:#16a34a;
}

/* SECTION TITLE */
.section-title{
  margin-top:10px;
  font-weight:bold;
  color:#dc2626;
}

/* 👤 TRAVELLER */
.traveller{
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr 1fr;
  gap:5px;
  background:#ffe4e6;
  padding:8px;
  margin-top:5px;
  border-radius:8px;
  font-size:13px;
}

/* 💰 TOTAL */
.total{
  margin-top:10px;
  font-size:18px;
  font-weight:bold;
  color:#dc2626;
}

/* ❌ EMPTY */
.empty{
  text-align:center;
  margin-top:80px;
}

.empty img{
  width:80px;
  opacity:0.7;
}

.empty h2{
  color:#dc2626;
}

.empty a{
  display:inline-block;
  margin-top:10px;
  padding:10px 20px;
  background:#dc2626;
  color:white;
  text-decoration:none;
  border-radius:10px;
}

/* 📱 MOBILE */
@media(max-width:500px){
  .traveller{
    grid-template-columns:1fr 1fr;
  }
}

.box{
  background:#fff;
  padding:10px;
  border-radius:10px;
  margin-top:10px;
  border:1px solid #f87171;
}

.hotel{
  background:#fff5f5;
  padding:10px;
  border-radius:10px;
  margin-top:8px;
  border:1px solid #fca5a5;
}

.img{
  width:100%;
  height:120px;
  object-fit:cover;
  border-radius:8px;
  margin-top:5px;
}

/* PROFILE IMAGE (Guide + Driver) */
.profile{
  width:80px;
  height:100px;
  object-fit:cover;
  border-radius:8px;
  margin-bottom:5px;
  border:2px solid #ef4444;
}

/* CAB IMAGE FULL */
.wide-img{
  width:100%;
  height:120px;
  object-fit:cover;
  border-radius:10px;
  margin-bottom:5px;
}

/* BOX */
.box{
  background:#fff;
  padding:10px;
  border-radius:10px;
  margin-top:10px;
  border:1px solid #f87171;
}

/* HOTEL */
.hotel{
  background:#fff5f5;
  padding:10px;
  border-radius:10px;
  margin-top:8px;
  border:1px solid #fca5a5;
}

/* 🔵 SVG BADGE */
.badge-svg{
  display:inline-flex;
  align-items:center;
}

.badge-svg svg{
  width:16px;
  height:16px;
}

/* 👨 GUIDE NAME */
.guide-name{
  display:flex;
  align-items:center;
  gap:6px;
  font-weight:bold;
  margin-top:5px;
}

/* 📞 PHONE */
.guide-phone{
  font-size:14px;
  color:#555;
}

/* 📷 PROFILE (PASSPORT SIZE LOOK) */
.profile{
  width:80px;
  height:100px;
  object-fit:cover;
  border-radius:8px;
  border:2px solid #ef4444;
  margin-bottom:5px;
}

/* 🏨 HOTEL CARD */
.hotel{
  background:#ffe4e6;
  color:#111;
  padding:10px;
  border-radius:10px;
  margin-bottom:10px;
}

/* 🖼️ HOTEL IMAGE */
.hotel-img{
  width:100%;
  height:150px;
  object-fit:cover;
  border-radius:8px;
  margin-bottom:8px;
}
.day-box{
background:#1e293b;
padding:10px;
border-radius:10px;
margin-bottom:10px;
color:white;
}

.day-box.done{
background:#2b0000;
border:1px solid red;
}


.back-btn{
  position:fixed;
  top:12px;
  left:10px;
  width:36px;
  height:36px;
  border-radius:50%;
  border:none;
  background:rgba(0,0,0,0.6);
  color:#fff;
  font-size:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:9999;
  backdrop-filter: blur(6px);
  box-shadow:0 2px 6px rgba(0,0,0,0.2);
  cursor:pointer;
}