/* Variables CSS del Design System Wellpass v2.1, tomadas de tokens.json (tema claro + oscuro). */
:root{--orange-50:#fff4ef;--orange-100:#fde4d8;--orange-200:#fbc6ad;--orange-300:#f69c77;--orange-400:#f0733f;--orange-500:#e94e1c;--orange-600:#c93f12;--orange-700:#9f320f;--orange-800:#7a260c;--orange-900:#4a170a;--terracotta:#c03b28;--terracotta-soft:#f8ddd7;--blush:#fce9e3;--espresso:#1e0701;--white:#ffffff;--sand-25:#fffaf7;--sand-50:#fdf3ee;--sand-100:#f6e7e0;--sand-200:#ecd8cf;--sand-400:#9d7e72;--sand-500:#8f7166;--sand-600:#7d6056;--sand-700:#6b4f45;--cocoa-700:#4a2c21;--cocoa-800:#361b11;--cocoa-850:#2a130b;--cocoa-950:#160500;--wine:#7a1e2c;--wine-soft:#f6dfe2;--apricot:#f5a66f;--apricot-soft:#fdebdc;--lagoon:#1e6b6b;--lagoon-soft:#dcefed;--sage:#5c7357;--sage-soft:#e6ede3;--bg:#ffffff;--surface:#ffffff;--surface-raised:#ffffff;--surface-sunken:#f7f6f5;--surface-tint:#fff4ef;--surface-brand:#e94e1c;--surface-inverse:#1e0701;--border:#ece8e6;--border-strong:#8f8582;--text:#1e0701;--text-muted:#6b625f;--text-subtle:#736a67;--text-inverse:#fce9e3;--text-accent:#d2440f;--on-brand:#ffffff;--action:#e94e1c;--action-hover:#d94616;--action-pressed:#c93f12;--on-action:#ffffff;--action-soft:#fff1eb;--on-action-soft:#c93f12;--link:#d2440f;--focus-ring:#e94e1c;--selected-ring:#e94e1c;--success:#0f766e;--success-soft:#e3f3f0;--warning:#8a5300;--warning-soft:#fff3dc;--danger:#b42318;--danger-soft:#fdecea;--info:#1f5f8b;--info-soft:#e6f0f7;--rating:#e94e1c;--rating-empty:#d9c4bb;--scrim:rgba(30, 7, 1, 0.56);--glass:rgba(255, 250, 247, 0.14);--glass-border:rgba(255, 250, 247, 0.28);--font-display:Outfit, "Avenir Next", system-ui, sans-serif;--font-sans:"DM Sans", "Helvetica Neue", system-ui, sans-serif;--font-serif:"Instrument Serif", Georgia, serif;--space-0:0px;--space-0_5:2px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;--radius-xs:6px;--radius-sm:10px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;--radius-2xl:40px;--radius-pill:999px;--shadow-xs:0 1px 2px rgba(30, 7, 1, 0.06);--shadow-sm:0 2px 8px rgba(30, 7, 1, 0.06), 0 1px 2px rgba(30, 7, 1, 0.04);--shadow-md:0 8px 24px rgba(30, 7, 1, 0.08), 0 2px 6px rgba(30, 7, 1, 0.04);--shadow-lg:0 16px 40px rgba(30, 7, 1, 0.12), 0 4px 12px rgba(30, 7, 1, 0.06);--shadow-xl:0 32px 64px rgba(30, 7, 1, 0.16);--shadow-cta:0 8px 20px rgba(233, 78, 28, 0.32);--shadow-focus:0 0 0 2px #ffffff, 0 0 0 4px #e94e1c;--gradient-brasa:radial-gradient(120% 140% at 8% 0%, #fce4da 0%, #e99876 22%, #e65023 52%, #d3644c 100%);--gradient-amanecer:linear-gradient(180deg, #e64e24 0%, #ef875a 52%, #fadacc 100%);--gradient-arcilla:linear-gradient(90deg, #a6391f 0%, #d5654d 30%, #e99b83 52%, #f8d3c7 74%, #fff7f3 100%);--gradient-pulso:radial-gradient(60% 90% at 46% 50%, #fce9e1 0%, #f4c6ac 30%, #ef8854 62%, #d9472f 88%, #e13a22 100%);--gradient-cta:linear-gradient(100deg, #ef5f2b 0%, #e94e1c 100%);--gradient-glow:radial-gradient(50% 60% at 50% 70%, rgba(240, 115, 63, 0.85) 0%, rgba(233, 78, 28, 0.35) 45%, rgba(30, 7, 1, 0) 100%);--gradient-blush:linear-gradient(180deg, #ffffff 0%, #fdf1ec 100%);--gradient-scrim:linear-gradient(180deg, rgba(30, 7, 1, 0) 35%, rgba(30, 7, 1, 0.8) 100%);--control-sm:36px;--control-md:44px;--control-lg:52px;--icon-sm:16px;--icon-md:20px;--icon-lg:24px;--app-bar:56px;--bottom-nav:72px;--screen-margin:20px;--container-max:1200px;--opacity-disabled:0.4;--opacity-muted:0.64;}
[data-theme=dark]{--bg:#1e0701;--surface:#2a130b;--surface-raised:#361b11;--surface-sunken:#160500;--surface-tint:#3d1e13;--surface-brand:#e94e1c;--surface-inverse:#fce9e3;--border:#4a2c21;--border-strong:#8f7166;--text:#fce9e3;--text-muted:#d4b8ad;--text-subtle:#b0938a;--text-inverse:#1e0701;--text-accent:#f69c77;--on-brand:#ffffff;--action:#f0733f;--action-hover:#f58a5e;--action-pressed:#f69c77;--on-action:#1e0701;--action-soft:#4a2112;--on-action-soft:#f69c77;--link:#f69c77;--focus-ring:#f69c77;--selected-ring:#f0733f;--success:#5eead4;--success-soft:#163a35;--warning:#f5b544;--warning-soft:#3a2a0c;--danger:#ff8a7a;--danger-soft:#3d1512;--info:#8cc4ec;--info-soft:#14293a;--rating:#f0733f;--rating-empty:#5a3b30;--scrim:rgba(0, 0, 0, 0.64);--glass:rgba(255, 250, 247, 0.10);--glass-border:rgba(255, 250, 247, 0.22);--shadow-xs:0 1px 2px rgba(0, 0, 0, 0.4);--shadow-sm:0 2px 8px rgba(0, 0, 0, 0.45);--shadow-md:0 8px 24px rgba(0, 0, 0, 0.5);--shadow-lg:0 16px 40px rgba(0, 0, 0, 0.6);--shadow-xl:0 32px 64px rgba(0, 0, 0, 0.7);--shadow-cta:0 8px 24px rgba(240, 115, 63, 0.28);--shadow-focus:0 0 0 2px #1e0701, 0 0 0 4px #f69c77;}

/* Wellpass — estilos de componentes. Todo valor sale de tokens.css (variables --*). */
body { margin: 0; font-family: var(--font-sans); font-size: 16px; line-height: 24px; background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; }
.wp-root, .wp-root * { box-sizing: border-box; }
.wp-icon { flex: none; display: inline-block; vertical-align: middle; }
.wp-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.wp-focusable:focus-visible, .wp-btn:focus-visible, .wp-iconbtn:focus-visible, .wp-chip:focus-visible, .wp-seg__opt:focus-visible, .wp-date:focus-visible, .wp-spot:focus-visible, .wp-slot:focus-visible, .wp-nav__item:focus-visible, .wp-switch input:focus-visible + .wp-switch__track, .wp-check input:focus-visible + .wp-check__box, .wp-list:focus-visible, .wp-venue:focus-visible, .wp-disc:focus-visible, .wp-star:focus-visible { outline: none; box-shadow: var(--shadow-focus); }

/* ---------- Button ---------- */
.wp-btn { font-family: var(--font-display); font-weight: 600; display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); border: 1.5px solid transparent; border-radius: var(--radius-pill); cursor: pointer; white-space: nowrap; transition: background-color .15s ease, transform .1s ease, box-shadow .15s ease; text-decoration: none; }
.wp-btn:active:not(:disabled) { transform: scale(.98); }
.wp-btn:disabled { opacity: var(--opacity-disabled); cursor: not-allowed; }
.wp-btn--sm { height: var(--control-sm); padding: 0 var(--space-4); font-size: 14px; line-height: 18px; }
.wp-btn--md { height: var(--control-md); padding: 0 var(--space-5); font-size: 16px; line-height: 20px; }
.wp-btn--lg { height: var(--control-lg); padding: 0 var(--space-6); font-size: 16px; line-height: 20px; }
.wp-btn--block { display: flex; width: 100%; }
.wp-btn--primary { background: var(--action); color: var(--on-action); }
.wp-btn--primary:hover:not(:disabled) { background: var(--action-hover); }
.wp-btn--primary:active:not(:disabled) { background: var(--action-pressed); }
.wp-btn--gradient { background: var(--gradient-cta); color: #ffffff; box-shadow: var(--shadow-cta); }
.wp-btn--tonal { background: var(--action-soft); color: var(--on-action-soft); }
.wp-btn--tonal:hover:not(:disabled) { background: var(--orange-200); color: var(--orange-800); }
.wp-btn--outline { background: transparent; color: var(--text); border-color: var(--border-strong); }
.wp-btn--outline:hover:not(:disabled) { background: var(--surface-sunken); }
.wp-btn--ghost { background: transparent; color: var(--text-accent); }
.wp-btn--ghost:hover:not(:disabled) { background: var(--action-soft); }
.wp-btn--dark { background: var(--espresso); color: var(--blush); border-color: var(--border); }
.wp-btn--dark:hover:not(:disabled) { background: var(--cocoa-800); }
.wp-btn--light { background: var(--blush); color: var(--espresso); }
.wp-btn--light:hover:not(:disabled) { background: var(--white); }
.wp-btn--danger { background: transparent; color: var(--danger); border-color: var(--danger); }
.wp-spinner { width: 16px; height: 16px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: wp-spin .8s linear infinite; }
@keyframes wp-spin { to { transform: rotate(360deg); } }

/* ---------- IconButton ---------- */
.wp-iconbtn { position: relative; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 50%; cursor: pointer; flex: none; color: var(--text); }
.wp-iconbtn--sm { width: var(--control-sm); height: var(--control-sm); }
.wp-iconbtn--md { width: var(--control-md); height: var(--control-md); }
.wp-iconbtn--surface { background: var(--surface); box-shadow: var(--shadow-sm); border: 1px solid var(--border); }
.wp-iconbtn--ghost { background: transparent; }
.wp-iconbtn--ghost:hover { background: var(--surface-sunken); }
.wp-iconbtn--tonal { background: var(--action-soft); color: var(--on-action-soft); }
.wp-iconbtn--primary { background: var(--action); color: var(--on-action); }
.wp-iconbtn--glass { background: rgba(255, 250, 247, 0.92); color: var(--espresso); backdrop-filter: blur(8px); }
.wp-iconbtn__dot { position: absolute; top: 9px; right: 10px; width: 8px; height: 8px; border-radius: 50%; background: var(--orange-500); box-shadow: 0 0 0 2px var(--surface); }

/* ---------- Logo ---------- */
.wp-logo { display: inline-block; flex: none; }

/* ---------- Chip ---------- */
.wp-chip { display: inline-flex; align-items: center; gap: var(--space-2); height: var(--control-sm); padding: 0 var(--space-4); border-radius: var(--radius-pill); border: 1.5px solid transparent; background: var(--surface-sunken); color: var(--text); font-family: var(--font-display); font-weight: 500; font-size: 14px; line-height: 18px; cursor: pointer; white-space: nowrap; transition: background-color .15s ease, border-color .15s ease; }
.wp-chip:hover { background: var(--border); }
.wp-chip--sm { height: 30px; padding: 0 var(--space-3); font-size: 13px; }
.wp-chip.is-selected { background: var(--action); border-color: var(--action); color: var(--on-action); font-weight: 600; }
.wp-chip--glass { background: var(--glass); border-color: var(--glass-border); color: #fff7f3; backdrop-filter: blur(10px); }
.wp-chip--glass:hover { background: rgba(255, 250, 247, 0.22); }
.wp-chip--glass.is-selected { background: var(--orange-600); border-color: var(--orange-600); color: #ffffff; }
.wp-chiprow { display: flex; flex-wrap: wrap; gap: var(--space-2); }

/* ---------- Badge ---------- */
.wp-badge { display: inline-flex; align-items: center; gap: var(--space-1); height: 24px; padding: 0 10px; border-radius: var(--radius-pill); font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 600; white-space: nowrap; }
.wp-badge--lg { height: 28px; padding: 0 var(--space-3); font-size: 13px; }
.wp-badge--brand { background: var(--action-soft); color: var(--on-action-soft); }
.wp-badge--neutral { background: var(--surface-sunken); color: var(--text-muted); box-shadow: inset 0 0 0 1px var(--border); }
.wp-badge--success { background: var(--success-soft); color: var(--success); }
.wp-badge--warning { background: var(--warning-soft); color: var(--warning); }
.wp-badge--danger { background: var(--danger-soft); color: var(--danger); }
.wp-badge--info { background: var(--info-soft); color: var(--info); }
.wp-badge--dark { background: var(--surface-inverse); color: var(--text-inverse); }
.wp-badge--light { background: rgba(255, 250, 247, 0.94); color: var(--espresso); }
.wp-badge--wine { background: var(--wine-soft); color: var(--wine); }
.wp-badge--apricot { background: var(--apricot-soft); color: #7a3a0e; }
.wp-badge--lagoon { background: var(--lagoon-soft); color: var(--lagoon); }
.wp-badge--sage { background: var(--sage-soft); color: #44573f; }
.wp-badge--outline { background: transparent; color: var(--text-accent); box-shadow: inset 0 0 0 1.5px var(--selected-ring); }

/* ---------- PointsTag ---------- */
.wp-pts { display: inline-flex; align-items: center; gap: 4px; height: 28px; padding: 0 10px; border-radius: var(--radius-pill); background: var(--surface-sunken); color: var(--text); font-family: var(--font-display); font-weight: 600; font-size: 13px; line-height: 16px; box-shadow: inset 0 0 0 1px var(--border); white-space: nowrap; font-variant-numeric: tabular-nums; }
.wp-pts.is-selected { background: var(--action-soft); color: var(--on-action-soft); box-shadow: none; }
.wp-pts--lg { height: 36px; padding: 0 14px; font-size: 15px; }

/* ---------- Switch & Checkbox ---------- */
.wp-switch { display: flex; align-items: center; gap: var(--space-3); cursor: pointer; }
.wp-switch input, .wp-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.wp-switch__text { flex: 1; min-width: 0; }
.wp-switch__label { display: block; font-weight: 600; font-size: 15px; line-height: 20px; color: var(--text); }
.wp-switch__desc { display: block; font-size: 13px; line-height: 18px; color: var(--text-subtle); }
.wp-switch__meta { font-family: var(--font-display); font-weight: 600; font-size: 13px; color: var(--text-accent); white-space: nowrap; }
.wp-switch__track { position: relative; width: 48px; height: 28px; border-radius: var(--radius-pill); background: var(--border-strong); transition: background-color .15s ease; flex: none; }
.wp-switch__track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 22px; height: 22px; border-radius: 50%; background: var(--white); box-shadow: 0 1px 3px rgba(30, 7, 1, 0.3); transition: transform .18s ease; }
.wp-switch input:checked + .wp-switch__track { background: var(--action); }
.wp-switch input:checked + .wp-switch__track::after { transform: translateX(20px); }
.wp-switch input:disabled + .wp-switch__track { opacity: var(--opacity-disabled); }
.wp-check { display: inline-flex; align-items: flex-start; gap: var(--space-3); cursor: pointer; font-size: 15px; line-height: 22px; color: var(--text); }
.wp-check__box { flex: none; width: 22px; height: 22px; margin-top: 0; border-radius: var(--radius-xs); border: 1.5px solid var(--border-strong); background: var(--surface); display: inline-flex; align-items: center; justify-content: center; color: transparent; transition: all .15s ease; }
.wp-check input:checked + .wp-check__box { background: var(--action); border-color: var(--action); color: var(--on-action); }

/* ---------- SegmentedControl ---------- */
.wp-seg { display: inline-flex; gap: var(--space-1); padding: 4px; border-radius: var(--radius-pill); background: var(--surface-sunken); box-shadow: inset 0 0 0 1px var(--border); }
.wp-seg--block { display: flex; }
.wp-seg--block .wp-seg__opt { flex: 1; }
.wp-seg__opt { height: 32px; padding: 0 var(--space-4); border: 0; border-radius: var(--radius-pill); background: transparent; color: var(--text-muted); font-family: var(--font-display); font-weight: 500; font-size: 14px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px; white-space: nowrap; }
.wp-seg__opt.is-selected { background: var(--action); color: var(--on-action); font-weight: 600; box-shadow: var(--shadow-xs); }
.wp-seg__count { font-size: 12px; opacity: .85; }

/* ---------- DateStrip ---------- */
.wp-dates { display: flex; gap: var(--space-2); overflow-x: auto; padding: 8px 4px 14px; scrollbar-width: none; }
.wp-date { flex: none; width: 48px; height: 64px; border-radius: var(--radius-pill); border: 1.5px solid var(--border); background: var(--surface); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; cursor: pointer; color: var(--text); font-family: var(--font-display); box-shadow: var(--shadow-xs); }
.wp-date__wd { font-size: 12px; line-height: 14px; color: var(--text-subtle); font-family: var(--font-sans); }
.wp-date__d { font-size: 18px; line-height: 22px; font-weight: 600; }
.wp-date__note { font-size: 10px; line-height: 12px; font-weight: 600; }
.wp-date.is-selected { height: 76px; background: var(--action); border-color: var(--action); color: var(--on-action); box-shadow: var(--shadow-cta); }
.wp-date.is-selected .wp-date__wd { color: var(--on-action); opacity: .9; }
.wp-date:disabled { opacity: var(--opacity-disabled); cursor: not-allowed; }
.wp-dates { align-items: center; }

/* ---------- SpotPicker ---------- */
.wp-spots { display: flex; flex-direction: column; gap: var(--space-3); }
.wp-spots__front { text-align: center; font-size: 11px; line-height: 14px; letter-spacing: .08em; font-weight: 600; color: var(--text-subtle); background: var(--surface-sunken); border-radius: var(--radius-xs); padding: 6px; }
.wp-spots__grid { display: grid; gap: var(--space-2); }
.wp-spot { aspect-ratio: 1 / 1.1; border-radius: var(--radius-sm); border: 1.5px solid var(--border-strong); background: var(--surface); color: var(--text); font-family: var(--font-display); font-weight: 600; font-size: 15px; cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; }
.wp-spot::after { content: ""; width: 14px; height: 3px; border-radius: 2px; background: currentColor; opacity: .5; }
.wp-spot.is-taken { background: var(--surface-sunken); border-color: var(--border); color: var(--text-subtle); cursor: not-allowed; text-decoration: line-through; }
.wp-spot.is-selected { background: var(--action); border-color: var(--action); color: var(--on-action); }
.wp-spots__legend { display: flex; gap: var(--space-4); font-size: 12px; color: var(--text-muted); }
.wp-spots__legend span { display: inline-flex; align-items: center; gap: 6px; }
.wp-spots__sw { width: 12px; height: 12px; border-radius: 3px; border: 1.5px solid var(--border-strong); background: var(--surface); }
.wp-spots__sw--sel { background: var(--action); border-color: var(--action); }
.wp-spots__sw--taken { background: var(--surface-sunken); border-color: var(--border); }

/* ---------- TextField / Search / Code ---------- */
.wp-field { display: flex; flex-direction: column; gap: 6px; }
.wp-field__label { font-size: 14px; line-height: 20px; font-weight: 500; color: var(--text); }
.wp-field__control { display: flex; align-items: center; gap: var(--space-2); height: var(--control-md); padding: 0 14px; border-radius: var(--radius-md); border: 1.5px solid var(--border-strong); background: var(--surface); color: var(--text-subtle); transition: border-color .15s ease, box-shadow .15s ease; }
.wp-field__control:focus-within { border-color: var(--focus-ring); box-shadow: 0 0 0 3px var(--action-soft); }
.wp-field__control input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 15px; color: var(--text); }
.wp-field__control input::placeholder { color: var(--text-subtle); }
.wp-field__help { font-size: 13px; line-height: 18px; color: var(--text-subtle); display: flex; gap: 6px; align-items: center; }
.wp-field.is-error .wp-field__control { border-color: var(--danger); }
.wp-field.is-error .wp-field__help { color: var(--danger); }
.wp-field.is-disabled { opacity: var(--opacity-disabled); }
.wp-field--glass .wp-field__label { color: #fff7f3; }
.wp-field--glass .wp-field__control { background: var(--glass); border-color: var(--glass-border); color: rgba(255, 247, 243, 0.8); backdrop-filter: blur(10px); }
.wp-field--glass .wp-field__control input { color: #fff7f3; }
.wp-field--glass .wp-field__control input::placeholder { color: rgba(255, 247, 243, 0.78); }
.wp-field--glass .wp-field__help { color: rgba(255, 247, 243, 0.85); }
.wp-search { display: flex; align-items: center; gap: var(--space-3); height: 52px; padding: 0 20px; border-radius: var(--radius-pill); background: var(--surface); box-shadow: 0 0 0 1px var(--border), 0 4px 16px rgba(30, 7, 1, 0.08); color: var(--text); }
.wp-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 15px; color: var(--text); }
.wp-search input::placeholder { color: var(--text-subtle); }
.wp-search:focus-within { box-shadow: 0 0 0 2px var(--focus-ring), 0 4px 16px rgba(30, 7, 1, 0.08); }
.wp-code { display: flex; gap: var(--space-2); width: 100%; max-width: 400px; }
.wp-code input { flex: 1 1 0; min-width: 0; width: 56px; max-width: 56px; height: 64px; border-radius: var(--radius-sm); border: 1.5px solid var(--border-strong); background: var(--surface); text-align: center; font-family: var(--font-display); font-size: 26px; font-weight: 600; color: var(--text); outline: 0; caret-color: var(--action); }
.wp-code input:focus { border-color: var(--action); box-shadow: 0 0 0 3px var(--action-soft); }
.wp-code.is-error input { border-color: var(--danger); }

/* ---------- Cards ---------- */
.wp-card { background: var(--surface); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); border: 1px solid var(--border); }
.wp-venue { width: 168px; flex: none; padding: 0; text-align: left; cursor: pointer; display: flex; flex-direction: column; gap: 10px; font: inherit; color: var(--text); background: transparent; border: 0; border-radius: var(--radius-lg); }
.wp-venue__img { position: relative; width: 100%; aspect-ratio: 1 / 1; border-radius: var(--radius-lg); overflow: hidden; background: var(--surface-sunken) center / cover no-repeat; }
.wp-venue__img .wp-badge { position: absolute; top: 10px; left: 10px; }
.wp-venue__body { padding: 0 2px; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.wp-venue__row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); }
.wp-venue__name { font-family: var(--font-display); font-weight: 600; font-size: 15px; line-height: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.wp-venue__loc { display: flex; align-items: center; gap: 4px; min-width: 0; font-size: 13px; line-height: 18px; color: var(--text-muted); }
.wp-venue__loc > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wp-venue__price { margin-top: 2px; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--text); }
.wp-venue__rate { flex: none; display: inline-flex; align-items: center; gap: 3px; color: var(--text); font-size: 13px; line-height: 18px; font-weight: 500; }
.wp-disc { position: relative; display: block; width: 220px; height: 160px; border-radius: var(--radius-2xl); overflow: hidden; border: 0; padding: 0; cursor: pointer; background: var(--surface-tint) center / cover no-repeat; text-align: left; flex: none; }
.wp-disc--lg { width: 300px; height: 240px; }
.wp-disc::after { content: ""; position: absolute; inset: 0; background: var(--gradient-scrim); }
.wp-disc__label { position: absolute; z-index: 1; left: 20px; bottom: 16px; font-family: var(--font-display); font-weight: 600; font-size: 22px; line-height: 26px; color: #ffffff; }
.wp-disc--lg .wp-disc__label { font-size: 28px; line-height: 32px; }
.wp-disc__meta { position: absolute; z-index: 1; right: 16px; top: 16px; }

/* SlotRow */
.wp-slot { width: 100%; display: flex; align-items: center; gap: var(--space-3); padding: 12px 14px; border-radius: var(--radius-md); border: 1.5px solid var(--border); background: var(--surface); text-align: left; cursor: pointer; font: inherit; color: var(--text); box-shadow: var(--shadow-xs); }
.wp-slot:hover:not(:disabled) { border-color: var(--border-strong); }
.wp-slot.is-selected { border-color: var(--selected-ring); box-shadow: 0 0 0 3px var(--action-soft); }
.wp-slot:disabled { opacity: var(--opacity-disabled); cursor: not-allowed; }
.wp-slot__icon { width: 36px; height: 36px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--surface-sunken); color: var(--text-muted); flex: none; }
.wp-slot.is-selected .wp-slot__icon { background: var(--action-soft); color: var(--on-action-soft); }
.wp-slot__text { flex: 1; min-width: 0; }
.wp-slot__title { display: block; font-weight: 600; font-size: 15px; line-height: 20px; }
.wp-slot__time { display: block; font-size: 13px; line-height: 18px; color: var(--text-subtle); }
.wp-slot__check { width: 22px; height: 22px; border-radius: 50%; background: var(--action); color: var(--on-action); display: inline-flex; align-items: center; justify-content: center; flex: none; }

/* ReservationCard */
.wp-resv { padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-3); border-radius: var(--radius-lg); background: var(--surface); border: 1.5px solid var(--border); box-shadow: var(--shadow-sm); }
.wp-resv--active { border-color: var(--selected-ring); box-shadow: var(--shadow-md); }
.wp-resv__head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); }
.wp-resv__title { margin: 0; font-family: var(--font-display); font-weight: 600; font-size: 18px; line-height: 24px; }
.wp-resv__sub { font-size: 13px; line-height: 18px; color: var(--text-subtle); }
.wp-resv__rule { height: 1px; background: var(--border); }
.wp-resv__meta { display: flex; flex-direction: column; gap: 6px; font-size: 14px; line-height: 20px; color: var(--text-muted); }
.wp-resv__meta span { display: flex; align-items: center; gap: var(--space-2); }
.wp-resv__meta strong { color: var(--text); font-weight: 600; }
.wp-resv__meta .wp-icon { color: var(--text-accent); }
.wp-resv__actions { display: flex; gap: var(--space-2); }
.wp-resv__actions .wp-btn { flex: 1; }

/* PlanCard */
.wp-plan { position: relative; display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-6); border-radius: var(--radius-xl); background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow-md); color: var(--text); min-width: 240px; }
.wp-plan--featured { background: var(--orange-600); border-color: transparent; color: #ffffff; box-shadow: var(--shadow-cta); }
.wp-plan__name { font-family: var(--font-display); font-weight: 600; font-size: 18px; line-height: 24px; display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); }
.wp-plan__price { font-family: var(--font-display); font-weight: 700; font-size: 40px; line-height: 44px; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.wp-plan__period { font-size: 18px; font-weight: 500; letter-spacing: 0; }
.wp-plan__rule { height: 1px; background: currentColor; opacity: .18; }
.wp-plan__desc { font-size: 14px; line-height: 20px; opacity: .9; margin: 0; }
.wp-plan__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); font-size: 14px; line-height: 20px; }
.wp-plan__list li { display: flex; gap: var(--space-2); align-items: flex-start; }
.wp-plan--featured .wp-plan__desc, .wp-plan--featured .wp-plan__list { font-size: 15px; font-weight: 500; opacity: 1; }

/* StatCard */
.wp-stat { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-5); border-radius: var(--radius-lg); min-width: 200px; }
.wp-stat__head { display: flex; align-items: center; justify-content: space-between; font-family: var(--font-display); font-weight: 600; font-size: 15px; }
.wp-stat__value { font-family: var(--font-display); font-weight: 600; font-size: 48px; line-height: 52px; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.wp-stat__desc { font-size: 13px; line-height: 18px; margin: 0; }
.wp-stat--brand { background: var(--orange-600); color: #ffffff; }
.wp-stat--brand .wp-stat__desc { font-size: 14px; font-weight: 500; }
.wp-stat--dark { background: var(--espresso); color: var(--blush); box-shadow: inset 0 0 0 1px var(--border); }
.wp-stat--dark .wp-stat__desc { color: #d4b8ad; }
.wp-stat--tint { background: var(--surface-tint); color: var(--text); }
.wp-stat--tint .wp-stat__desc { color: var(--text-muted); }
.wp-stat--surface { background: var(--surface); color: var(--text); border: 1px solid var(--border); box-shadow: var(--shadow-sm); }
.wp-stat--surface .wp-stat__desc { color: var(--text-muted); }

/* ListItem / SectionHeader */
.wp-list { width: 100%; display: flex; align-items: center; gap: var(--space-3); padding: 14px 4px; border: 0; border-bottom: 1px solid var(--border); background: transparent; text-align: left; font: inherit; color: var(--text); cursor: pointer; }
.wp-list:last-child { border-bottom: 0; }
.wp-list__lead { width: 40px; height: 40px; border-radius: var(--radius-sm); display: inline-flex; align-items: center; justify-content: center; flex: none; font-family: var(--font-display); font-weight: 700; font-size: 17px; background: var(--action-soft); color: var(--on-action-soft); }
.wp-list__lead--lagoon { background: var(--lagoon); color: #ffffff; }
.wp-list__lead--sage { background: var(--sage); color: #ffffff; }
.wp-list__lead--wine { background: var(--wine); color: #ffffff; }
.wp-list__lead--brand { background: var(--action); color: var(--on-action); }
.wp-list__lead--neutral { background: var(--surface-sunken); color: var(--text-muted); }
.wp-list__text { flex: 1; min-width: 0; }
.wp-list__title { display: block; font-weight: 600; font-size: 16px; line-height: 22px; }
.wp-list__sub { display: block; font-size: 13px; line-height: 18px; color: var(--text-subtle); }
.wp-list__trail { color: var(--text-subtle); font-size: 14px; display: inline-flex; align-items: center; gap: var(--space-2); }
.wp-sec { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-3); }
.wp-sec__title { margin: 0; font-family: var(--font-display); font-weight: 600; font-size: 17px; line-height: 22px; color: var(--text); }
.wp-sec__sub { display: block; font-size: 13px; line-height: 18px; color: var(--text-subtle); font-family: var(--font-sans); font-weight: 400; margin-top: 2px; }
.wp-sec__action { border: 0; background: none; padding: 0; cursor: pointer; display: inline-flex; align-items: center; gap: 2px; font-family: var(--font-display); font-weight: 600; font-size: 13px; color: var(--text-accent); white-space: nowrap; }
.wp-eyebrow { font-family: var(--font-sans); font-size: 12px; line-height: 16px; letter-spacing: .08em; font-weight: 600; text-transform: uppercase; color: var(--text-accent); }

/* Alert */
.wp-alert { display: flex; gap: var(--space-3); padding: 14px var(--space-4); border-radius: var(--radius-md); font-size: 14px; line-height: 20px; }
.wp-alert__icon { flex: none; margin-top: 0; }
.wp-alert__body { flex: 1; min-width: 0; color: var(--text); }
.wp-alert__title { display: block; font-weight: 600; margin-bottom: 2px; }
.wp-alert__text { color: var(--text-muted); }
.wp-alert__action { margin-top: var(--space-3); }
.wp-alert--brand { background: var(--surface-tint); }
.wp-alert--brand .wp-alert__icon, .wp-alert--brand .wp-alert__title { color: var(--text-accent); }
.wp-alert--info { background: var(--info-soft); }
.wp-alert--info .wp-alert__icon, .wp-alert--info .wp-alert__title { color: var(--info); }
.wp-alert--success { background: var(--success-soft); }
.wp-alert--success .wp-alert__icon, .wp-alert--success .wp-alert__title { color: var(--success); }
.wp-alert--warning { background: var(--warning-soft); }
.wp-alert--warning .wp-alert__icon, .wp-alert--warning .wp-alert__title { color: var(--warning); }
.wp-alert--danger { background: var(--danger-soft); }
.wp-alert--danger .wp-alert__icon, .wp-alert--danger .wp-alert__title { color: var(--danger); }
.wp-alert--dashed { box-shadow: inset 0 0 0 1.5px var(--orange-200); background-image: none; }

/* CapacityBar */
.wp-cap { display: flex; flex-direction: column; gap: 6px; }
.wp-cap__row { display: flex; justify-content: space-between; font-size: 12px; line-height: 16px; color: var(--text-subtle); }
.wp-cap__row strong { font-weight: 600; font-variant-numeric: tabular-nums; }
.wp-cap__track { height: 6px; border-radius: var(--radius-pill); background: var(--surface-sunken); box-shadow: inset 0 0 0 1px var(--border); overflow: hidden; }
.wp-cap__fill { height: 100%; border-radius: inherit; }
.wp-cap--success .wp-cap__fill { background: var(--success); }
.wp-cap--success strong { color: var(--success); }
.wp-cap--warning .wp-cap__fill { background: var(--orange-500); }
.wp-cap--warning strong { color: var(--text-accent); }
.wp-cap--danger .wp-cap__fill { background: var(--danger); }
.wp-cap--danger strong { color: var(--danger); }

/* Rating */
.wp-rating { display: inline-flex; gap: var(--space-2); }
.wp-star { border: 0; background: none; padding: 2px; cursor: pointer; color: var(--rating-empty); border-radius: 6px; line-height: 0; }
.wp-star.is-on { color: var(--rating); }
.wp-rating--ro .wp-star { cursor: default; padding: 0; }

/* ResultState */
.wp-result { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--space-3); padding: var(--space-6) var(--space-5); }
.wp-result__halo { width: 96px; height: 96px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-2); }
.wp-result__core { width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.wp-result--brand .wp-result__halo { background: var(--gradient-pulso); }
.wp-result--brand .wp-result__core { background: var(--surface); color: var(--text-accent); box-shadow: var(--shadow-md); }
.wp-result--success .wp-result__halo { background: var(--success-soft); }
.wp-result--success .wp-result__core { background: var(--success); color: var(--surface); }
.wp-result--danger .wp-result__halo { background: var(--danger-soft); }
.wp-result--danger .wp-result__core { background: var(--danger); color: var(--surface); }
.wp-result--warning .wp-result__halo { background: var(--warning-soft); }
.wp-result--warning .wp-result__core { background: var(--warning); color: var(--surface); }
.wp-result__title { margin: 0; font-family: var(--font-display); font-weight: 600; font-size: 24px; line-height: 30px; color: var(--text); }
.wp-result__desc { margin: 0; max-width: 300px; font-size: 15px; line-height: 22px; color: var(--text-muted); }
.wp-result__actions { display: flex; flex-direction: column; gap: var(--space-2); width: 100%; max-width: 320px; margin-top: var(--space-3); }

/* PageDots */
.wp-dots { display: inline-flex; align-items: center; gap: 6px; }
.wp-dots span { width: 8px; height: 8px; border-radius: var(--radius-pill); background: var(--border-strong); transition: width .2s ease; }
.wp-dots span.is-on { width: 24px; background: var(--action); }
.wp-dots--light span { background: rgba(255, 250, 247, 0.5); }
.wp-dots--light span.is-on { background: #ffffff; }

/* AppBar */
.wp-appbar { display: flex; align-items: center; gap: var(--space-3); min-height: var(--app-bar); padding: 6px var(--screen-margin); background: var(--bg); color: var(--text); }
.wp-appbar--transparent { background: transparent; }
.wp-appbar__lead { flex: 1; min-width: 0; display: flex; align-items: center; gap: var(--space-3); }
.wp-appbar__title { margin: 0; font-family: var(--font-display); font-weight: 600; font-size: 17px; line-height: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wp-appbar__sub { font-size: 12px; line-height: 16px; color: var(--text-subtle); }
.wp-appbar__actions { display: flex; gap: var(--space-2); }
.wp-appbar__step { font-family: var(--font-display); font-weight: 600; font-size: 13px; color: var(--text-accent); }

/* BottomNav */
.wp-nav { display: flex; align-items: flex-start; justify-content: space-around; height: var(--bottom-nav); padding: 8px var(--space-2) 0; background: var(--surface); border-top: 1px solid var(--border); }
.wp-nav__item { display: inline-flex; flex-direction: column; align-items: center; gap: 4px; min-width: 64px; padding: 4px 6px; border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--text-muted); cursor: pointer; font-family: var(--font-sans); font-weight: 500; font-size: 11px; line-height: 14px; }
.wp-nav__item .wp-icon { color: var(--text-muted); }
.wp-nav__item.is-active { color: var(--text-accent); font-weight: 600; }
.wp-nav__item.is-active .wp-icon { color: var(--action); }

/* Overlays */
.wp-overlay { position: fixed; inset: 0; z-index: 50; display: flex; background: var(--scrim); }
.wp-overlay--contained { position: absolute; }
.wp-overlay--sheet { align-items: flex-end; }
.wp-overlay--dialog { align-items: center; justify-content: center; padding: var(--space-6); }
.wp-sheet { width: 100%; background: var(--surface-raised); color: var(--text); border-radius: var(--radius-xl) var(--radius-xl) 0 0; padding: 10px var(--space-6) var(--space-6); box-shadow: var(--shadow-lg); }
.wp-sheet__grab { width: 40px; height: 4px; border-radius: 2px; background: var(--border-strong); margin: 0 auto var(--space-4); opacity: .6; }
.wp-sheet__head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-3); }
.wp-sheet__title { margin: 0; font-family: var(--font-display); font-weight: 600; font-size: 20px; line-height: 26px; }
.wp-sheet__sub { font-size: 13px; line-height: 18px; color: var(--text-subtle); }
.wp-dialog { width: 100%; max-width: 340px; background: var(--surface-raised); color: var(--text); border-radius: var(--radius-lg); padding: var(--space-6); box-shadow: var(--shadow-lg); display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--space-2); position: relative; }
.wp-dialog__icon { width: 56px; height: 56px; border-radius: 50%; background: var(--action-soft); color: var(--on-action-soft); display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-2); }
.wp-dialog__title { margin: 0; font-family: var(--font-display); font-weight: 600; font-size: 20px; line-height: 26px; }
.wp-dialog__desc { margin: 0; font-size: 14px; line-height: 20px; color: var(--text-muted); }
.wp-dialog__body { width: 100%; margin-top: var(--space-2); }
.wp-dialog__actions { width: 100%; display: flex; flex-direction: column; gap: var(--space-2); margin-top: var(--space-4); }
.wp-dialog__close { position: absolute; top: 10px; right: 10px; }

/* DataTable */
.wp-table-wrap { overflow-x: auto; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface); }
.wp-table { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 20px; color: var(--text); font-variant-numeric: tabular-nums; }
.wp-table th { background: var(--surface-inverse); color: var(--text-inverse); font-family: var(--font-display); font-weight: 600; font-size: 13px; text-align: left; padding: 10px 14px; white-space: nowrap; }
.wp-table td { padding: 10px 14px; border-top: 1px solid var(--border); }
.wp-table tbody tr:nth-child(even) td { background: var(--surface-sunken); }
.wp-table--dense td { padding: 6px 14px; }
.wp-table .is-num { text-align: right; }
.wp-table caption { caption-side: bottom; text-align: left; padding: 8px 14px; font-size: 12px; color: var(--text-subtle); }

/* Preview helpers (solo para las tarjetas de preview) */
.wp-pv { padding: var(--space-5); display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
.wp-pv--col { flex-direction: column; align-items: stretch; }
.wp-pv--phone { max-width: 390px; }