/* ── Elite Booking System — Luxury Frontend CSS v2.0 ── */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;0,700;1,400&family=Raleway:wght@300;400;500;600;700&display=swap');

.eb-plugin *, .eb-plugin *::before, .eb-plugin *::after { box-sizing: border-box; margin: 0; padding: 0; }
.eb-plugin { font-family: 'Raleway', sans-serif; color: #fff; }

/* ── HOME FORM ── */
.eb-home-form-wrap { background: #0a0a0a; padding: 48px 20px; }
.eb-home-form { max-width: 820px; margin: 0 auto; background: rgba(255,255,255,0.03); border: 1px solid rgba(239,195,0,0.3); border-radius: 16px; padding: 36px; }
.eb-trip-toggle { display: flex; gap: 8px; margin-bottom: 28px; }
.eb-toggle-btn { flex: 1; padding: 10px 0; border: 1px solid rgba(239,195,0,0.5); background: transparent; color: #888; border-radius: 50px; font-family: 'Raleway', sans-serif; font-size: 13px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; cursor: pointer; transition: all 0.25s; }
.eb-toggle-btn:hover { border-color: #efc300; color: #efc300; }
.eb-toggle-btn.active { background: #efc300; border-color: #efc300; color: #000; }
.eb-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.eb-field { display: flex; flex-direction: column; gap: 6px; }
.eb-field-full { grid-column: 1 / -1; }
.eb-label { font-size: 11px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; color: #888; }
.eb-input { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); border-radius: 8px; padding: 12px 14px; color: #fff; font-family: 'Raleway', sans-serif; font-size: 14px; transition: border-color 0.25s; width: 100%; }
.eb-input::placeholder { color: #555; }
.eb-input:focus { outline: none; border-color: #efc300; background: rgba(239,195,0,0.05); }
.eb-select { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); border-radius: 8px; padding: 12px 14px; color: #fff; font-family: 'Raleway', sans-serif; font-size: 14px; width: 100%; cursor: pointer; transition: border-color 0.25s; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23efc300' stroke-width='1.5' fill='none'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 36px; }
.eb-select:focus { outline: none; border-color: #efc300; }
.eb-select option { background: #111; color: #fff; }
.eb-waypoint-toggle { margin-top: 10px; }
.eb-link-btn { background: none; border: none; color: rgba(239,195,0,0.7); font-family: 'Raleway', sans-serif; font-size: 13px; cursor: pointer; text-decoration: underline; padding: 0; transition: color 0.2s; }
.eb-link-btn:hover { color: #efc300; }
.eb-submit-btn { display: block; width: 100%; margin-top: 24px; padding: 16px; background: #efc300; color: #000; border: none; border-radius: 8px; font-family: 'Raleway', sans-serif; font-size: 14px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; cursor: pointer; transition: background 0.25s, transform 0.15s; }
.eb-submit-btn:hover { background: #f5d642; transform: translateY(-1px); }
.eb-submit-btn:disabled { background: #555; color: #999; cursor: not-allowed; transform: none; }

/* ── CUSTOM CALENDAR ── */
.eb-cal-wrap { position: relative; }
.eb-cal-trigger { cursor: pointer; }
.eb-calendar { position: absolute; top: calc(100% + 6px); left: 0; z-index: 9999; background: #111; border: 1px solid rgba(239,195,0,0.4); border-radius: 12px; padding: 16px; min-width: 280px; box-shadow: 0 20px 60px rgba(0,0,0,0.7); }
.eb-cal-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.eb-cal-nav { background: none; border: 1px solid rgba(239,195,0,0.3); color: #efc300; width: 30px; height: 30px; border-radius: 50%; cursor: pointer; font-size: 16px; transition: all 0.2s; display: flex; align-items: center; justify-content: center; }
.eb-cal-nav:hover { background: rgba(239,195,0,0.15); }
.eb-cal-month-label { font-family: 'Cormorant Garamond', serif; font-size: 16px; color: #efc300; letter-spacing: 1px; }
.eb-cal-days-header { display: grid; grid-template-columns: repeat(7,1fr); text-align: center; margin-bottom: 8px; }
.eb-cal-days-header span { font-size: 11px; color: #555; font-weight: 600; padding: 4px 0; }
.eb-cal-grid { display: grid; grid-template-columns: repeat(7,1fr); gap: 2px; }
.eb-cal-day { text-align: center; padding: 7px 4px; font-size: 13px; border-radius: 6px; cursor: pointer; transition: all 0.15s; color: #bbb; }
.eb-cal-day:hover { background: rgba(239,195,0,0.2); color: #fff; }
.eb-cal-day.today { border: 1px solid rgba(239,195,0,0.4); color: #efc300; }
.eb-cal-day.selected { background: #efc300; color: #000; font-weight: 700; }
.eb-cal-day.disabled { color: #333; cursor: default; pointer-events: none; }
.eb-cal-day.empty { cursor: default; }

/* ── QUOTES PAGE ── */
.eb-quotes-page { background: #080808; min-height: 100vh; padding: 40px 20px; }
.eb-quotes-layout { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 380px 1fr; gap: 32px; }
.eb-map-card { background: #0d0d0d; border: 1px solid rgba(239,195,0,0.2); border-radius: 12px; overflow: hidden; position: sticky; top: 20px; }
.eb-route-map { width: 100%; height: 280px; }
.eb-journey-summary { padding: 20px; }
.eb-journey-row { display: flex; justify-content: space-between; align-items: flex-start; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,0.06); gap: 12px; }
.eb-journey-row:last-child { border-bottom: none; }
.eb-journey-label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: #555; white-space: nowrap; }
.eb-journey-val { font-size: 13px; color: #ccc; text-align: right; }
.eb-journey-row--highlight .eb-journey-val { color: #efc300; font-weight: 600; }
.eb-section-title { font-family: 'Cormorant Garamond', serif; font-size: 32px; color: #fff; margin-bottom: 24px; letter-spacing: 1px; }
.eb-vehicles-grid { display: flex; flex-direction: column; gap: 20px; }
.eb-loading { text-align: center; padding: 60px 20px; color: #555; }
.eb-spinner { width: 36px; height: 36px; border: 2px solid rgba(239,195,0,0.2); border-top-color: #efc300; border-radius: 50%; animation: eb-spin 0.8s linear infinite; margin: 0 auto 16px; }
@keyframes eb-spin { to { transform: rotate(360deg); } }
.eb-error-msg { color: #e55; font-size: 14px; padding: 20px 0; }

/* ── VEHICLE CARDS ── */
.eb-vehicle-card { background: #0d0d0d; border: 1px solid rgba(239,195,0,0.18); border-radius: 14px; overflow: hidden; transition: border-color 0.25s, transform 0.2s; }
.eb-vehicle-card:hover { border-color: rgba(239,195,0,0.5); transform: translateY(-2px); }
.eb-card-img { width: 100%; height: 200px; overflow: hidden; }
.eb-card-img img { width: 100%; height: 100%; object-fit: cover; }
.eb-card-img--placeholder { display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg,#111 0%,#1a1a1a 100%); }
.eb-car-silhouette { text-align: center; color: rgba(239,195,0,0.3); }
.eb-car-silhouette svg { width: 64px; height: 64px; }
.eb-car-silhouette span { display: block; font-size: 11px; margin-top: 8px; color: #333; }
.eb-card-body { padding: 20px; }
.eb-card-title { font-family: 'Cormorant Garamond', serif; font-size: 22px; color: #fff; margin-bottom: 8px; letter-spacing: 0.5px; }
.eb-card-desc { font-size: 13px; color: #666; line-height: 1.6; margin-bottom: 16px; }
.eb-feature-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 18px; }
.eb-feature-box { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.06); border-radius: 8px; padding: 10px 6px; text-align: center; }
.eb-feature-box svg { color: #efc300; margin-bottom: 4px; }
.eb-feature-box span { display: block; font-size: 11px; color: #888; line-height: 1.3; }
.eb-card-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.eb-pill-btn { padding: 10px 20px; border-radius: 50px; font-family: 'Raleway', sans-serif; font-size: 13px; font-weight: 600; letter-spacing: 0.5px; cursor: pointer; transition: all 0.2s; white-space: nowrap; border: none; }
.eb-pill-gold { background: #efc300; color: #000; }
.eb-pill-gold:hover { background: #f5d642; }
.eb-pill-outline { background: transparent; border: 1px solid rgba(239,195,0,0.5); color: #efc300; }
.eb-pill-outline:hover { background: rgba(239,195,0,0.1); border-color: #efc300; }

/* ── BOOKING FORM ── */
.eb-book-page { background: #080808; min-height: 100vh; padding: 40px 20px; }
.eb-book-layout { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 380px; gap: 32px; align-items: start; }
.eb-booking-form { display: flex; flex-direction: column; gap: 0; }
.eb-form-section { background: #0d0d0d; border: 1px solid rgba(255,255,255,0.06); border-radius: 14px; padding: 28px; margin-bottom: 20px; }
.eb-form-section-title { font-family: 'Cormorant Garamond', serif; font-size: 20px; color: #fff; margin-bottom: 20px; padding-bottom: 12px; border-bottom: 1px solid rgba(239,195,0,0.2); letter-spacing: 0.5px; }
.eb-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.eb-form-row:last-child { margin-bottom: 0; }
.eb-textarea { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); border-radius: 8px; padding: 12px 14px; color: #fff; font-family: 'Raleway', sans-serif; font-size: 14px; resize: vertical; width: 100%; transition: border-color 0.25s; }
.eb-textarea:focus { outline: none; border-color: #efc300; }
.eb-req { color: #efc300; }
.eb-badge { background: rgba(239,195,0,0.15); color: #efc300; font-size: 11px; padding: 2px 8px; border-radius: 50px; font-weight: 600; margin-left: 6px; }
.eb-journey-display { background: rgba(255,255,255,0.03); border-radius: 10px; padding: 16px; margin-bottom: 16px; }
.eb-jd-row { display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,0.05); }
.eb-jd-row:last-child { border-bottom: none; }
.eb-jd-label { font-size: 11px; color: #555; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; }
.eb-jd-val { font-size: 13px; color: #bbb; text-align: right; max-width: 65%; }
.eb-payment-options { display: flex; flex-direction: column; gap: 12px; }
.eb-radio-label { display: flex; align-items: center; gap: 12px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); border-radius: 10px; padding: 14px 16px; cursor: pointer; transition: border-color 0.2s; }
.eb-radio-label:hover { border-color: rgba(239,195,0,0.4); }
.eb-radio { display: none; }
.eb-radio:checked + .eb-radio-box { background: #efc300; border-color: #efc300; }
.eb-radio:checked + .eb-radio-box::after { opacity: 1; }
.eb-radio-box { width: 18px; height: 18px; border: 2px solid #444; border-radius: 50%; flex-shrink: 0; transition: all 0.2s; position: relative; }
.eb-radio-box::after { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 7px; height: 7px; background: #000; border-radius: 50%; opacity: 0; transition: opacity 0.2s; }
.eb-radio-text { display: flex; flex-direction: column; gap: 2px; }
.eb-radio-text strong { font-size: 14px; color: #fff; }
.eb-radio-text small { font-size: 12px; color: #555; }
.eb-checkbox-label { display: flex; align-items: center; gap: 10px; cursor: pointer; font-size: 13px; color: #888; }
.eb-checkbox { display: none; }
.eb-checkbox:checked + .eb-checkbox-box { background: #efc300; border-color: #efc300; }
.eb-checkbox:checked + .eb-checkbox-box::after { opacity: 1; }
.eb-checkbox-box { width: 18px; height: 18px; border: 2px solid #444; border-radius: 4px; flex-shrink: 0; transition: all 0.2s; position: relative; }
.eb-checkbox-box::after { content: '✓'; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 11px; color: #000; opacity: 0; transition: opacity 0.2s; }
.eb-child-age-row { margin-bottom: 12px; }
.eb-child-age-row label { display: block; font-size: 11px; color: #888; margin-bottom: 4px; }

/* ── BOOKING SUMMARY SIDEBAR ── */
.eb-book-summary-col { position: sticky; top: 20px; }
.eb-summary-card { background: #0d0d0d; border: 1px solid rgba(239,195,0,0.3); border-radius: 14px; padding: 24px; }
.eb-summary-title { font-family: 'Cormorant Garamond', serif; font-size: 20px; color: #efc300; margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid rgba(239,195,0,0.2); }
.eb-summary-img { width: 100%; border-radius: 8px; margin-bottom: 14px; }
.eb-summary-vname { font-family: 'Cormorant Garamond', serif; font-size: 20px; color: #fff; margin-bottom: 4px; }
.eb-summary-vtype { font-size: 12px; color: #555; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 16px; }
.eb-summary-rows { border-top: 1px solid rgba(255,255,255,0.06); margin-bottom: 16px; }
.eb-summary-row { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,0.05); font-size: 13px; }
.eb-summary-row span:first-child { color: #555; }
.eb-summary-row span:last-child { color: #ccc; text-align: right; max-width: 65%; }
.eb-summary-price-wrap { display: flex; justify-content: space-between; align-items: center; padding-top: 16px; border-top: 1px solid rgba(239,195,0,0.3); }
.eb-summary-price-label { font-size: 12px; color: #888; text-transform: uppercase; letter-spacing: 1px; }
.eb-summary-price { font-family: 'Cormorant Garamond', serif; font-size: 34px; color: #efc300; font-weight: 600; }

/* ── RESPONSIVE ── */
@media (max-width: 768px) {
  .eb-home-form { padding: 20px; }
  .eb-form-grid { grid-template-columns: 1fr; }
  .eb-field-full { grid-column: 1; }
  .eb-quotes-layout { grid-template-columns: 1fr; }
  .eb-quotes-left { order: 1; }
  .eb-quotes-right { order: 2; }
  .eb-map-card { position: static; }
  .eb-book-layout { grid-template-columns: 1fr; }
  .eb-book-summary-col { order: -1; position: static; }
  .eb-form-row { grid-template-columns: 1fr; }
  .eb-section-title { font-size: 24px; }
  .eb-calendar { min-width: 260px; left: 50%; transform: translateX(-50%); }
}
@media (max-width: 480px) {
  .eb-home-form-wrap { padding: 24px 12px; }
  .eb-trip-toggle { flex-direction: row; }
  .eb-toggle-btn { font-size: 11px; padding: 8px 0; }
  .eb-feature-row { grid-template-columns: repeat(3,1fr); }
}