/* ═══════════════════════════════════════════
   RESERVATION POPUP — Website Colors
═══════════════════════════════════════════ */

/* Float button — gold/dark like website */
.resv-float-btn{
  position:fixed;bottom:28px;right:20px;z-index:500;
  width:64px;height:64px;border-radius:18px;
  background:linear-gradient(135deg,var(--red),var(--orange));
  box-shadow:0 6px 24px rgba(192,57,43,.45);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  cursor:pointer;border:none;
  transition:transform .2s,box-shadow .2s;
  color:#fff;
}
.resv-float-btn:hover{transform:scale(1.06);box-shadow:0 10px 32px rgba(192,57,43,.6)}
.resv-float-btn:active{transform:scale(.94)}
.resv-float-btn svg{width:24px;height:24px;stroke:#fff;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.resv-float-label{font-size:.42rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;text-align:center;line-height:1.15;color:rgba(255,255,255,.9)}

/* Backdrop */
.resv-backdrop{
  position:fixed;inset:0;z-index:600;
  background:rgba(4,2,2,.82);
  backdrop-filter:blur(6px);
  opacity:0;pointer-events:none;
  transition:opacity .3s;
}
.resv-backdrop.open{opacity:1;pointer-events:all}

/* Popup sheet — website colors */
.resv-popup{
  position:fixed;
  top:50%;left:50%;
  transform:translate(-50%, calc(-50% + 20px));
  z-index:601;
  width:min(480px, 95vw);
  max-height:90svh;
  background:#130a08;
  border:1px solid rgba(201,168,76,.2);
  border-radius:20px;
  display:flex;flex-direction:column;
  overflow:hidden;
  opacity:0;pointer-events:none;
  transition:transform .35s cubic-bezier(.22,1,.36,1), opacity .3s;
}
.resv-popup.open{
  transform:translate(-50%,-50%);
  opacity:1;
  pointer-events:all;
}

/* Header — gold gradient */
.resv-popup-head{
  background:linear-gradient(135deg,rgba(192,57,43,.9),rgba(211,84,0,.8));
  border-bottom:1px solid rgba(201,168,76,.2);
  padding:18px 20px 16px;
  display:flex;align-items:center;justify-content:space-between;
  flex-shrink:0;
}
.resv-popup-title{color:#fff;font-family:'Playfair Display',serif;font-size:1.1rem;font-weight:600}
.resv-popup-sub{color:rgba(255,255,255,.6);font-size:.7rem;margin-top:2px;font-family:'Lato',sans-serif}
.resv-popup-close{
  width:32px;height:32px;border-radius:50%;
  background:rgba(255,255,255,.15);color:#fff;
  font-size:1rem;display:flex;align-items:center;justify-content:center;
  cursor:pointer;border:none;flex-shrink:0;transition:background .2s;
}
.resv-popup-close:hover{background:rgba(255,255,255,.25)}

/* Steps */
.resv-steps{
  display:flex;align-items:center;justify-content:center;gap:0;
  padding:12px 20px;
  border-bottom:1px solid rgba(201,168,76,.12);
  background:rgba(201,168,76,.03);
  flex-shrink:0;
}
.resv-step{display:flex;align-items:center;gap:7px}
.resv-step-dot{
  width:26px;height:26px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:.72rem;font-weight:700;
  background:rgba(255,255,255,.06);color:rgba(201,168,76,.4);
  border:1px solid rgba(201,168,76,.15);
  transition:all .3s;flex-shrink:0;
  font-family:'Lato',sans-serif;
}
.resv-step-dot.active{background:var(--gold);color:var(--bg);border-color:var(--gold)}
.resv-step-dot.done{background:rgba(201,168,76,.2);color:var(--gold);border-color:var(--gold)}
.resv-step-label{font-size:.6rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(201,168,76,.35);font-family:'Lato',sans-serif}
.resv-step-label.active{color:var(--gold)}
.resv-step-line{width:28px;height:1px;background:rgba(201,168,76,.15);margin:0 2px}
.resv-step-line.done{background:rgba(201,168,76,.4)}

/* Body */
.resv-popup-body{overflow-y:auto;padding:20px;flex:1;-webkit-overflow-scrolling:touch}

/* Form fields — website style */
.rp-label{
  font-size:.6rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(201,168,76,.7);margin-bottom:7px;display:block;
  font-family:'Lato',sans-serif;
}
.rp-select,.rp-input,.rp-textarea{
  width:100%;padding:12px 14px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(201,168,76,.2);
  border-radius:10px;
  font-size:.9rem;font-family:'Lato',sans-serif;
  color:#f0ebe4;outline:none;
  transition:border-color .2s,background .2s;
  -webkit-appearance:none;
}
.rp-select:focus,.rp-input:focus,.rp-textarea:focus{
  border-color:var(--gold);background:rgba(201,168,76,.06);
}
.rp-select option{background:#1c0e06;color:#f0ebe4}
.rp-input::placeholder,.rp-textarea::placeholder{color:rgba(138,112,96,.6)}
.rp-textarea{resize:vertical;min-height:80px}
.rp-field{margin-bottom:16px}
.rp-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}

/* Time slots */
.time-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}
.time-slot{
  padding:10px 4px;border-radius:8px;text-align:center;
  border:1px solid rgba(201,168,76,.18);
  font-size:.82rem;font-weight:600;
  color:rgba(237,224,204,.6);
  cursor:pointer;transition:all .2s;
  background:rgba(201,168,76,.04);
  font-family:'Lato',sans-serif;
}
.time-slot:hover{border-color:var(--gold);color:var(--gold);background:rgba(201,168,76,.08)}
.time-slot.selected{background:var(--gold);border-color:var(--gold);color:var(--bg);font-weight:700}

/* Footer bar */
.resv-popup-foot{
  padding:14px 20px;
  border-top:1px solid rgba(201,168,76,.12);
  background:#130a08;flex-shrink:0;
}
.rp-btn{
  width:100%;padding:14px;
  background:linear-gradient(135deg,var(--red),var(--orange));
  color:#fff;border:none;border-radius:50px;
  font-size:.85rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  cursor:pointer;transition:all .3s;
  font-family:'Lato',sans-serif;
  box-shadow:0 4px 18px rgba(192,57,43,.3);
}
.rp-btn:hover{box-shadow:0 6px 24px rgba(192,57,43,.5);transform:translateY(-1px)}
.rp-btn:active{transform:scale(.97)}
.rp-btn:disabled{background:rgba(201,168,76,.2);color:rgba(201,168,76,.4);box-shadow:none;cursor:not-allowed;transform:none}

/* Success */
.resv-success{text-align:center;padding:36px 20px}
.resv-success-icon{font-size:3.2rem;margin-bottom:14px}
.resv-success-title{font-family:'Playfair Display',serif;font-size:1.35rem;font-weight:600;color:var(--gold);margin-bottom:8px}
.resv-success-text{font-size:.85rem;color:var(--muted);line-height:1.75}

/* WHATSAPP FLOAT */
.wa-float{
  position:fixed;bottom:104px;right:20px;z-index:499;
  width:64px;height:64px;border-radius:18px;
  background:#25d366;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 24px rgba(37,211,102,.4);
  color:#fff;transition:transform .2s,box-shadow .2s;
}
.wa-float:hover{transform:scale(1.06);box-shadow:0 8px 28px rgba(37,211,102,.55)}
.wa-float svg{width:30px;height:30px}

/* SOCIAL LINKS */
.social-links{display:flex;gap:10px;margin-top:14px}
.social-link{
  width:36px;height:36px;border-radius:9px;
  border:1px solid var(--border);background:rgba(201,168,76,.06);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold);font-size:.95rem;
  transition:all .2s;
}
.social-link:hover{background:rgba(201,168,76,.15);border-color:var(--gold)}
