/* Reservas en 4 pasos (día → hora → personas → datos): el componente de Rusty con los colores de Psyko. */

/* desplegable (<details class="rs-toggle">): cerrado muestra solo el botón */
.rs-toggle > summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:10px;
  background:var(--pink-btn); color:#fff; font-weight:700; font-size:17px; letter-spacing:0.02em; padding:18px 16px 16px; border-radius:999px;
  box-shadow:0 10px 30px rgba(229,12,126,0.35); transition:background .2s, color .2s, box-shadow .2s;
}
.rs-toggle > summary::-webkit-details-marker{display:none;}
.rs-toggle .rs-chev{width:20px; height:20px; transition:transform .25s; margin-top:-2px;}
.rs-toggle .rs-when-open{display:none;}
.rs-toggle[open] > summary{background:rgba(255,255,255,0.07); color:var(--text); box-shadow:none; margin-bottom:14px;}
.rs-toggle[open] .rs-when-open{display:inline;}
.rs-toggle[open] .rs-when-closed{display:none;}
.rs-toggle[open] .rs-chev{transform:rotate(180deg);}
.rs-card{background:var(--card); border-radius:26px; padding:18px; box-shadow:0 14px 40px rgba(0,0,0,0.4), inset 0 0 0 1px var(--line);}

/* resumen de lo elegido: cada pastilla vuelve a su paso */
.rs-summary{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:16px;}
.rs-summary[hidden]{display:none;}
.rs-pill{
  border:0; font:inherit; font-size:14px; font-weight:600; padding:9px 12px 7px; border-radius:999px;
  background:rgba(255,255,255,0.06); color:var(--muted); cursor:pointer;
}
.rs-pill.done{background:var(--cyan-tint); color:var(--cyan-neon);}
.rs-pill.current{background:var(--pink-btn); color:#fff;}
.rs-pill:disabled{cursor:default;}

.rs-title{font-family:var(--font-display); font-weight:400; font-size:24px; line-height:1.1; margin:2px 2px 16px;}
.rs-title small{
  display:block; margin-bottom:8px; font-family:var(--font-body); font-size:11px; font-weight:700;
  letter-spacing:0.18em; text-transform:uppercase; color:var(--cyan-neon);
}

/* calendario */
.rs-cal-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px;}
.rs-cal-month{font-weight:600; font-size:17px;}
.rs-nav{
  width:40px; height:40px; border:0; border-radius:50%; background:rgba(255,255,255,0.07);
  color:var(--text); font:inherit; font-size:20px; line-height:1; cursor:pointer;
}
.rs-nav:disabled{opacity:0.3; cursor:default;}
.rs-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:4px; text-align:center;}
.rs-dow{font-size:12px; font-weight:600; color:var(--muted); padding:4px 0;}
.rs-day{
  aspect-ratio:1; border:0; border-radius:50%; background:transparent; color:var(--text);
  font:inherit; font-size:16px; font-weight:600; cursor:pointer; transition:background .15s;
}
.rs-day.today{box-shadow:inset 0 0 0 1.5px rgba(63,208,255,0.6);}
.rs-day[aria-pressed="true"]{background:var(--pink-btn); color:#fff; box-shadow:0 0 16px rgba(229,12,126,0.5);}
.rs-day:disabled{color:rgba(255,255,255,0.2); font-weight:400; cursor:default;}

/* horas y personas */
.rs-group-label{margin:2px 2px 8px; font-size:11px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--cyan-neon);}
.rs-options{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:16px;}
.rs-options.people{grid-template-columns:repeat(5,1fr);}
.rs-opt{
  border:0; font:inherit; font-size:16px; font-weight:600; padding:14px 0 12px; border-radius:999px;
  background:rgba(255,255,255,0.07); color:var(--text); cursor:pointer; transition:background .15s;
}
.rs-opt[aria-pressed="true"]{background:var(--pink-btn); color:#fff;}
.rs-note{font-size:14px; line-height:1.45; color:var(--muted);}
.rs-note a{color:var(--pink-text);}

/* formulario: todo obligatorio salvo comentarios */
.rs-field{margin-bottom:12px;}
.rs-field label{display:block; margin:0 4px 6px; font-size:11px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--cyan-neon);}
.rs-field input, .rs-field textarea{
  width:100%; border:0; outline:none; font:inherit; font-size:16px; color:var(--text);
  background:rgba(255,255,255,0.07); border-radius:16px; padding:15px 16px 13px;
}
.rs-field textarea{min-height:84px; resize:vertical; border-radius:18px;}
.rs-field input:focus, .rs-field textarea:focus{box-shadow:0 0 0 2px var(--pink);}
.rs-field.invalid input{box-shadow:0 0 0 2px #ff6b6b;}
.rs-err{display:none; margin:6px 4px 0; font-size:13px; color:#ff8a8a;}
.rs-field.invalid .rs-err{display:block;}
.rs-check{display:flex; align-items:flex-start; gap:10px; margin:6px 2px 16px; font-size:14px; line-height:1.45; color:var(--muted);}
.rs-check input{flex-shrink:0; width:20px; height:20px; margin-top:0; accent-color:var(--pink);}
.rs-check a{color:var(--pink-text);}
.rs-check.invalid{color:#ff8a8a;}
.rs-hp{position:absolute; left:-9999px; width:1px; height:1px; opacity:0;} /* trampa para bots */
.rs-submit{
  width:100%; border:0; font:inherit; font-size:17px; font-weight:700; padding:17px 16px 15px; border-radius:999px;
  background:var(--pink-btn); color:#fff; cursor:pointer; box-shadow:0 10px 30px rgba(229,12,126,0.35);
}
.rs-submit:disabled{opacity:0.6;}
.rs-back{border:0; background:none; font:inherit; font-size:15px; color:var(--muted); padding:12px 4px 0; cursor:pointer;}
.rs-error{margin-top:12px; font-size:14px; color:#ff8a8a; text-align:center;}

/* confirmación */
.rs-done{text-align:center; padding:8px 4px;}
.rs-done .tick{
  width:64px; height:64px; margin:6px auto 14px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; background:var(--pink-tint); color:var(--pink-text);
  box-shadow:0 0 30px rgba(229,12,126,0.35);
}
.rs-done .tick svg{width:30px; height:30px;}
.rs-done h3{font-family:var(--font-display); font-weight:400; font-size:26px; line-height:1.1;}
.rs-done p{margin-top:10px; font-size:15px; line-height:1.5; color:var(--muted);}
.rs-done p b{color:var(--text); font-weight:600;}
.rs-demo{
  display:inline-block; margin-top:12px; font-size:10px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase;
  padding:5px 10px 4px; border-radius:999px; background:var(--cyan-tint); color:var(--cyan-neon);
}
