/* ============================================================
   TimesPack — Design v3.0
   Vibrant gradients · Hero enhancements · Auth pages · Mobile polish
   ============================================================ */

:root {

  --purple:          #5b2bbf;

  --purple-2:        #9b7ef5;

  --purple-deep:     #32156f;

  --lavender:        #eee7ff;

  --cyan:            #2e90fa;

  --ink:             #101828;

  --muted:           #667085;

  --success:         #12b76a;

  --bg-gradient:     linear-gradient(180deg, #eee7ff 0%, #f9fafb 30%, #eaf4ff 70%, #ffffff 100%);

}


body {

  background: var(--bg-gradient);

  background-attachment: fixed;

}


nav {

  border-bottom-color: #e4e7ec;

}


.btn {

  background: linear-gradient(135deg, #5b2bbf, #7544dc);

  box-shadow: 0 8px 24px rgba(105,65,198,0.18);

}

.btn:hover {

  background: linear-gradient(135deg, #7544dc, #9a73ef);

}


.panel, .tp-card {

  border-color: #e4e7ec;

  box-shadow: 0 4px 12px rgba(16,24,40,0.04), 0 1px 2px rgba(16,24,40,0.02);

}

.panel:hover, .tp-card:hover {

  box-shadow: 0 12px 32px rgba(16,24,40,0.08), 0 2px 4px rgba(16,24,40,0.04);

}


.full {
 width: 100%;
 text-align: center;
 }


/* ---- Auth Pages ---- */
.auth-shell {

  min-height: auto;

  display: grid;

  grid-template-columns: 1fr 480px;

  gap: 60px;

  align-items: center;

}

.auth-brand h1 {

  font-size: clamp(36px, 5.5vw, 68px);

  line-height: 1.05;

  letter-spacing: -3px;

  margin: 16px 0;

}

.auth-brand h1 em {

  font-style: normal;

  background: linear-gradient(135deg, var(--purple), var(--cyan));

  -webkit-background-clip: text;

  background-clip: text;

  color: transparent;

}

.auth-brand p,
.auth-tp-card > p {

  color: var(--muted);

  line-height: 1.7;

  font-size: 16px;

}

.auth-tp-card {

  margin: 0;

  padding: 36px;

  background: #fff;

  border-radius: var(--radius-2xl, 32px);

  border: 1px solid #e4e7ec;

  box-shadow: 0 20px 48px rgba(16,24,40,0.08);

}

.auth-icon {

  width: 54px;

  height: 54px;

  display: grid;

  place-items: center;

  border-radius: 18px;

  background: linear-gradient(135deg, var(--purple), var(--cyan));

  color: #fff;

  font-weight: 800;

  font-size: 21px;

  margin-bottom: var(--space-md);

}

.auth-switch {

  text-align: center;

  margin-top: 20px;

  font-size: 14px;

  color: var(--muted);

}

.auth-switch a {

  color: var(--purple);

  font-weight: 700;

  text-decoration: none;

}


input:focus, textarea:focus, select:focus {

  border-color: var(--purple-2);

  box-shadow: 0 0 0 4px var(--lavender);

}


/* ---- Booking Map ---- */
.booking-map {

  border-radius: var(--radius-xl);

  overflow: hidden;

  box-shadow: 0 8px 32px rgba(105,65,198,0.12);

  border: 1px solid #e4e7ec;

}


/* ---- Quote Card ---- */
.quote-tp-card {

  background: var(--lavender);

  border: 1px solid #e8dfff;

}


/* ---- Mobile Bottom Tabs ---- */
.mobile-tabs {

  display: none;

}


@media (max-width: 860px) {

  main {

    padding: var(--space-lg) 16px 100px;

  }


  .auth-shell {

    display: block;

    min-height: auto;

  }

  .auth-brand {

    display: none;

  }

  .auth-tp-card {

    padding: 28px;

    margin: 8px auto;

    border-radius: 24px;

  }


  .mobile-tabs {

    display: flex;

    position: fixed;

    z-index: 80;

    left: 8px;

    right: 8px;

    bottom: 8px;

    height: 64px;

    background: rgba(255,255,255,0.95);

    backdrop-filter: blur(20px);

    -webkit-backdrop-filter: blur(20px);

    border: 1px solid #e4e7ec;

    border-radius: 20px;

    box-shadow: 0 8px 32px rgba(16,24,40,0.12);

    align-items: center;

    justify-content: space-around;

    padding: 4px 8px;

  }

  .mobile-tabs a {

    color: var(--muted);

    font-size: 10px;

    text-decoration: none;

    text-align: center;

    font-weight: 700;

    min-width: 44px;

  }

  .mobile-tabs a span {

    display: block;

    color: var(--purple);

    font-size: 20px;

    margin-bottom: 2px;

  }

  .mobile-tabs .tab-main {

    margin-top: -28px;

  }

  .mobile-tabs .tab-main span {

    width: 50px;

    height: 50px;

    display: grid;

    place-items: center;

    border-radius: 16px;

    background: linear-gradient(135deg, var(--purple), var(--purple-2));

    color: #fff;

    box-shadow: 0 10px 28px rgba(105,65,198,0.35);

  }


  footer {
 display: none;
 }

}


/* TimesPack Premium Purple marketplace finish */
.tp-food-public-main{
  background:
    radial-gradient(circle at 8% 0%, rgba(117,68,220,.13), transparent 28%),
    radial-gradient(circle at 92% 8%, rgba(91,43,191,.10), transparent 24%),
    #eee7ff!important;
}
.tp-food-subnav{
  background:rgba(255,255,255,.96);
  border-bottom:1px solid rgba(91,43,191,.12);
  box-shadow:0 3px 18px rgba(50,21,111,.07);
}
.tp-food-hero{
  background:
    radial-gradient(circle at 85% 20%, rgba(154,115,239,.30), transparent 30%),
    linear-gradient(118deg,#32156f 0%,#4b1fa5 48%,#7544dc 100%);
  box-shadow:0 12px 32px rgba(50,21,111,.18);
}
.tp-food-search{
  box-shadow:0 8px 28px rgba(50,21,111,.14);
}
.tp-food-search button{
  background:linear-gradient(135deg,#5b2bbf,#7544dc);
  box-shadow:0 6px 16px rgba(91,43,191,.25);
}
.tp-food-filterbar,
.tp-food-benefits{
  border:1px solid rgba(91,43,191,.10);
  box-shadow:0 8px 24px rgba(50,21,111,.07);
}
.tp-food-dish-card,
.tp-food-restaurant-card,
.tp-food-empty{
  border:1px solid rgba(91,43,191,.08);
  box-shadow:0 8px 24px rgba(50,21,111,.07);
}
.tp-food-dish-card:hover,
.tp-food-restaurant-card:hover{
  border-color:rgba(91,43,191,.20);
  box-shadow:0 12px 30px rgba(50,21,111,.12);
  transform:translateY(-2px);
}
.tp-food-location span,
.tp-food-section-head>div>span,
.tp-food-dish-copy span,
.tp-food-meta span:first-child{
  color:#5b2bbf;
}
.tp-food-logo-placeholder{
  background:linear-gradient(135deg,#e5d9ff,#f7f4ff);
  border:1px solid rgba(91,43,191,.10);
}