/* shared: tokens.css */
/* ============================================================================
   TOKENS DE DISEÑO --lp-* (defaults canónicos del sistema de bloques)
   ----------------------------------------------------------------------------
   Capa 1 (este fichero): defaults neutros en :root, emitidos ANTES del CSS
   global / brand kit. Cualquier redefinición posterior (BFMETA_LANDING_CSS_GLOBAL,
   brand kit, :root del tema del builder o .lp-container) gana SIEMPRE a estos
   defaults: misma o mayor especificidad y aparece después en la cascada.
   Valores = fallback dominante cosechado de los 117 bloques (2026-08-02).
   Los tokens específicos de un bloque (--lp-reviews-*, --lp-team-*, …) NO van
   aquí: los define su propio bloque o el editor vía estilos inline.
   ============================================================================ */

/* Guard de accesibilidad: el atributo hidden SIEMPRE oculta, aunque el CSS del
   bloque defina display (flex/grid). Sin esto, overlays con display propio
   (lightbox de gallery, popups, back-to-top…) quedan visibles al cargar. */
[hidden] {
	display: none !important;
}

:root {
	/* Color de marca */
	--lp-primary: #3b82f6;
	--lp-primary-dark: #2563eb;
	--lp-primary-light: #93c5fd;
	--lp-primary-alpha: rgba(59, 130, 246, 0.1);
	--lp-secondary: #8b5cf6;
	--lp-accent: #ec4899;
	--lp-success: #10b981;
	--lp-error: #ef4444;

	/* Texto */
	--lp-text: #1f2937;
	--lp-text-primary: #1f2937;
	--lp-text-secondary: #6b7280;
	--lp-text-tertiary: #9ca3af;
	--lp-text-muted: #6b7280;
	--lp-text-light: #6b7280;
	--lp-text-dark: #1f2937;
	--lp-link-color: var(--lp-primary);
	--lp-link-hover-color: var(--lp-primary-dark);

	/* Fondos y bordes */
	--lp-bg: #ffffff;
	--lp-bg-primary: #ffffff;
	--lp-bg-secondary: #f9fafb;
	--lp-bg-light: #f9fafb;
	--lp-bg-soft: #f9fafb;
	--lp-bg-tertiary: #f3f4f6;
	--lp-border: #e5e7eb;
	--lp-border-color: #e5e7eb;
	--lp-border-dark: #d1d5db;
	--lp-gray-200: #e5e7eb;

	/* Espaciado */
	--lp-space-xs: 8px;
	--lp-space-sm: 12px;
	--lp-space-md: 16px;
	--lp-space-lg: 24px;
	--lp-space-xl: 40px;
	--lp-space-2xl: 60px;
	--lp-space-3xl: 80px;
	--lp-space-4xl: 120px;

	/* Radios */
	--lp-radius: 8px;
	--lp-radius-md: 8px;
	--lp-radius-lg: 12px;
	--lp-radius-xl: 18px;
	--lp-radius-full: 9999px;

	/* Tipografía */
	--lp-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--lp-font-size-xs: 0.75rem;
	--lp-font-size-sm: 0.95rem;
	--lp-font-size-md: 1.05rem;
	--lp-font-weight-bold: 600;
	--lp-font-weight-black: 950;
	--lp-line-height-tight: 1.12;
	--lp-line-height-relaxed: 1.7;

	/* Layout */
	--lp-container: 1200px;
	--lp-container-max: 1200px;
	--lp-container-width: 1200px;
	--lp-max-width: 1200px;

	/* Efectos */
	--lp-shadow-hover: 0 14px 40px rgba(0, 0, 0, 0.10);
	--lp-hover-lift: -3px;
	--lp-hover-scale: 1.04;
	--lp-transition-duration: 0.2s;
}

/* shared: utilities.css */
/* Utilidades compartidas del sistema de bloques */

/* Texto solo para lectores de pantalla */
.lp-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}



:root{--lp-primary:#3b82f6;--lp-primary-dark:#2563eb;--lp-primary-light:#60a5fa;--lp-secondary:#8b5cf6;--lp-secondary-dark:#7c3aed;--lp-secondary-light:#a78bfa;--lp-success:#10b981;--lp-warning:#f59e0b;--lp-danger:#ef4444;--lp-info:#06b6d4;--lp-white:#ffffff;--lp-gray-50:#f9fafb;--lp-gray-100:#f3f4f6;--lp-gray-200:#e5e7eb;--lp-gray-300:#d1d5db;--lp-gray-400:#9ca3af;--lp-gray-500:#6b7280;--lp-gray-600:#4b5563;--lp-gray-700:#374151;--lp-gray-800:#1f2937;--lp-gray-900:#111827;--lp-black:#000000;--lp-font-sans:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;--lp-font-serif:Georgia,Cambria,'Times New Roman',Times,serif;--lp-font-mono:'Courier New',Courier,monospace;--lp-text-xs:0.75rem;--lp-text-sm:0.875rem;--lp-text-base:1rem;--lp-text-lg:1.125rem;--lp-text-xl:1.25rem;--lp-text-2xl:1.5rem;--lp-text-3xl:1.875rem;--lp-text-4xl:2.25rem;--lp-text-5xl:3rem;--lp-space-1:0.25rem;--lp-space-2:0.5rem;--lp-space-3:0.75rem;--lp-space-4:1rem;--lp-space-5:1.25rem;--lp-space-6:1.5rem;--lp-space-8:2rem;--lp-space-10:2.5rem;--lp-space-12:3rem;--lp-space-16:4rem;--lp-radius-sm:0.25rem;--lp-radius:0.5rem;--lp-radius-lg:1rem;--lp-radius-full:9999px;--lp-shadow-sm:0 1px 2px 0 rgba(0,0,0,0.05);--lp-shadow:0 1px 3px 0 rgba(0,0,0,0.1),0 1px 2px 0 rgba(0,0,0,0.06);--lp-shadow-md:0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);--lp-shadow-lg:0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05);--lp-shadow-xl:0 20px 25px -5px rgba(0,0,0,0.1),0 10px 10px -5px rgba(0,0,0,0.04);--lp-transition:all 0.3s ease;--lp-transition-fast:all 0.15s ease;}.lp-container *{box-sizing:border-box;margin:0;padding:0;}.lp-container{width:100%;max-width:1200px;margin:0 auto;padding:0 var(--lp-space-4);font-family:var(--lp-font-sans);font-size:var(--lp-text-base);line-height:1.6;color:var(--lp-gray-900);}.lp-container--narrow{max-width:800px;}.lp-container--wide{max-width:1400px;}.lp-container--full{max-width:100%;}.lp-section{padding:var(--lp-space-16) 0;}.lp-section--sm{padding:var(--lp-space-8) 0;}.lp-section--lg{padding:var(--lp-space-20,5rem) 0;}.lp-section-title{font-size:var(--lp-text-4xl);font-weight:700;line-height:1.2;margin-bottom:var(--lp-space-6);color:var(--lp-gray-900);text-align:center;}.lp-section-subtitle{font-size:var(--lp-text-xl);line-height:1.5;margin-bottom:var(--lp-space-8);color:var(--lp-gray-600);text-align:center;}.lp-h1{font-size:var(--lp-text-5xl);font-weight:800;line-height:1.1;margin-bottom:var(--lp-space-6);color:var(--lp-gray-900);}.lp-h2{font-size:var(--lp-text-4xl);font-weight:700;line-height:1.2;margin-bottom:var(--lp-space-5);color:var(--lp-gray-900);}.lp-h3{font-size:var(--lp-text-3xl);font-weight:600;line-height:1.3;margin-bottom:var(--lp-space-4);color:var(--lp-gray-900);}.lp-text-lead{font-size:var(--lp-text-xl);line-height:1.6;color:var(--lp-gray-700);}.lp-text-muted{color:var(--lp-gray-600);}.lp-text-small{font-size:var(--lp-text-sm);}.lp-btn{display:inline-block;padding:var(--lp-space-3) var(--lp-space-6);font-size:var(--lp-text-base);font-weight:600;text-align:center;text-decoration:none;border:none;border-radius:var(--lp-radius);cursor:pointer;transition:var(--lp-transition);line-height:1.5;}.lp-btn--primary{background-color:var(--lp-primary);color:var(--lp-white);}.lp-btn--primary:hover{background-color:var(--lp-primary-dark);transform:translateY(-2px);box-shadow:var(--lp-shadow-md);}.lp-btn--secondary{background-color:var(--lp-secondary);color:var(--lp-white);}.lp-btn--secondary:hover{background-color:var(--lp-secondary-dark);transform:translateY(-2px);box-shadow:var(--lp-shadow-md);}.lp-btn--outline{background-color:transparent;border:2px solid var(--lp-primary);color:var(--lp-primary);}.lp-btn--outline:hover{background-color:var(--lp-primary);color:var(--lp-white);}.lp-btn--ghost{background-color:transparent;color:var(--lp-primary);}.lp-btn--ghost:hover{background-color:var(--lp-gray-100);}.lp-btn--sm{padding:var(--lp-space-2) var(--lp-space-4);font-size:var(--lp-text-sm);}.lp-btn--lg{padding:var(--lp-space-4) var(--lp-space-8);font-size:var(--lp-text-lg);}.lp-btn--full{width:100%;}.lp-card{background-color:var(--lp-white);border-radius:var(--lp-radius-lg);box-shadow:var(--lp-shadow);padding:var(--lp-space-6);transition:var(--lp-transition);}.lp-card:hover{box-shadow:var(--lp-shadow-lg);transform:translateY(-4px);}.lp-card-title{font-size:var(--lp-text-xl);font-weight:600;margin-bottom:var(--lp-space-3);color:var(--lp-gray-900);}.lp-card-content{color:var(--lp-gray-700);}.lp-grid{display:grid;gap:var(--lp-space-6);}.lp-grid--2{grid-template-columns:repeat(2,1fr);}.lp-grid--3{grid-template-columns:repeat(3,1fr);}.lp-grid--4{grid-template-columns:repeat(4,1fr);}@media (max-width:1024px){.lp-grid--3,.lp-grid--4{grid-template-columns:repeat(2,1fr);}}@media (max-width:640px){.lp-grid--2,.lp-grid--3,.lp-grid--4{grid-template-columns:1fr;}}.lp-text-center{text-align:center;}.lp-text-left{text-align:left;}.lp-text-right{text-align:right;}.lp-mt-4{margin-top:var(--lp-space-4);}.lp-mb-4{margin-bottom:var(--lp-space-4);}.lp-my-4{margin-top:var(--lp-space-4);margin-bottom:var(--lp-space-4);}.lp-mt-8{margin-top:var(--lp-space-8);}.lp-mb-8{margin-bottom:var(--lp-space-8);}.lp-my-8{margin-top:var(--lp-space-8);margin-bottom:var(--lp-space-8);}@media (max-width:640px){:root{--lp-text-5xl:2.25rem;--lp-text-4xl:1.875rem;--lp-text-3xl:1.5rem;}.lp-section{padding:var(--lp-space-8) 0;}}

:root {
	--lp-primary: #c60202;
	--lp-primary-dark: #b20000;
	--lp-primary-light: #ee2a2a;
	--lp-secondary: #8a1515;
	--lp-secondary-dark: #760101;
	--lp-accent: #c9a45c;
	--lp-neutral-dark: #2c241d;
	--lp-neutral-light: #f8f4ee;
	--lp-surface: #f6f2ec;
	--lp-border: #776f68;
	--lp-muted: #5e564f;
	--lp-success: #16A34A;
	--lp-warning: #F59E0B;
	--lp-danger: #DC2626;
	--lp-info: #2563EB;
	--lp-text: #2c241d;
	--lp-text-light: #4a423b;
	--lp-bg: #fbf7f1;
	--lp-font: Inter;
	--lp-font-sans: Inter;
	--lp-font-heading: Playfair Display;
	--lp-font-body: Inter;
	--lp-font-script: 'Merienda', cursive;
	--lp-radius: 8px;
	--lp-section-space: clamp(3rem, 5vw, 4.5rem);
}
body {
	font-family: var(--lp-font-body);
}
h1, h2, h3, h4, h5, h6 {
	font-family: var(--lp-font-heading);
}
button, .lp-btn, input, select, textarea {
	border-radius: var(--lp-radius);
}
@media (max-width: 768px) {
	.lp-hide-mobile {
		display: none !important;
	}
	.lp-hide-desktop {
		display: inherit;
	}
}
@media (min-width: 769px) {
	.lp-hide-mobile {
		display: inherit;
	}
	.lp-hide-desktop {
		display: none !important;
	}
}


.lp-kiosk-catalog {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(32px,5vw,72px) 0;
  background:linear-gradient(180deg,#fbf7f1 0%,#f3eadc 100%);
  color:#2c241d;
  font-family:Georgia,Times New Roman,serif
}
.lp-kiosk-catalog__background {
  position:absolute;
  inset:0;
  z-index:0;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat
}
.lp-kiosk-catalog__background::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(251,247,241,.84) 0%,rgba(243,234,220,.82) 100%)
}
.lp-kiosk-catalog__shell {
  position:relative;
  z-index:1;
  max-width:1280px;
  margin:0 auto;
  padding:0 24px
}
.lp-kiosk-catalog__hero {
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);
  gap:24px;
  align-items:start
}
.lp-kiosk-catalog__intro,.lp-kiosk-catalog__meta {
  background:rgba(255,250,243,.88);
  border:1px solid rgba(152,117,87,.18);
  border-radius:26px;
  box-shadow:0 24px 60px rgba(65,42,27,.08);
  backdrop-filter:blur(8px)
}
.lp-kiosk-catalog__intro {
  padding:32px
}
.lp-kiosk-catalog__eyebrow {
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 14px;
  border-radius:999px;
  background:#f7e4d0;
  color:#8f3a27;
  font:700 12px/1.2 Arial,sans-serif;
  letter-spacing:.08em;
  text-transform:uppercase
}
.lp-kiosk-catalog__title {
  margin:18px 0 12px;
  font-size:clamp(2.2rem,5vw,4.4rem);
  line-height:.95;
  letter-spacing:-.04em
}
.lp-kiosk-catalog__subtitle {
  margin:0;
  max-width:44rem;
  color:#66584a;
  font:400 18px/1.65 Arial,sans-serif
}
.lp-kiosk-catalog__actions {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:24px
}
.lp-kiosk-catalog__button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:50px;
  padding:0 18px;
  border-radius:999px;
  border:1px solid #b9a38b;
  background:#fff4e7;
  color:#2c241d;
  text-decoration:none;
  font:700 15px/1 Arial,sans-serif
}
.lp-kiosk-catalog__button--primary {
  background:#8f3a27;
  border-color:#8f3a27;
  color:#fff
}
.lp-kiosk-catalog__microcopy {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin-top:26px
}
.lp-kiosk-catalog__microcopy-item {
  padding:14px 16px;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(152,117,87,.18)
}
.lp-kiosk-catalog__microcopy-item strong {
  display:block;
  margin-bottom:6px;
  font:700 12px/1.2 Arial,sans-serif;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#7a6856
}
.lp-kiosk-catalog__microcopy-item span {
  display:block;
  font:700 16px/1.3 Arial,sans-serif;
  color:#2c241d
}
.lp-kiosk-catalog__meta {
  padding:24px
}
.lp-kiosk-catalog__meta h3 {
  margin:0 0 10px;
  font-size:24px;
  line-height:1.1
}
.lp-kiosk-catalog__meta p {
  margin:0 0 18px;
  color:#66584a;
  font:400 15px/1.65 Arial,sans-serif
}
.lp-kiosk-catalog__steps {
  display:grid;
  gap:12px
}
.lp-kiosk-catalog__step {
  padding:14px 16px;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(152,117,87,.18)
}
.lp-kiosk-catalog__step strong {
  display:block;
  margin-bottom:4px;
  font:700 15px/1.35 Arial,sans-serif
}
.lp-kiosk-catalog__step>span {
  display:block;
  color:#66584a;
  font:400 14px/1.55 Arial,sans-serif
}
.lp-kiosk-catalog__stage {
  margin-top:24px;
  padding:22px;
  border-radius:28px;
  background:rgba(255,252,247,.74);
  border:1px solid rgba(152,117,87,.18);
  box-shadow:0 24px 60px rgba(65,42,27,.06)
}
.lp-kiosk-catalog__runtime-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:18px
}
.lp-kiosk-catalog__runtime-title {
  margin:0;
  font-size:24px;
  line-height:1.1
}
.lp-kiosk-catalog__runtime-copy {
  margin:6px 0 0;
  color:#66584a;
  font:400 15px/1.6 Arial,sans-serif
}
.lp-kiosk-catalog__badges {
  display:flex;
  flex-wrap:wrap;
  gap:10px
}
.lp-kiosk-catalog__badge {
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(152,117,87,.18);
  color:#5f5143;
  font:700 13px/1.2 Arial,sans-serif
}
.lp-kiosk-catalog__dynamic {
  min-height:280px
}
.lp-kiosk-catalog__placeholder {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px
}
.lp-kiosk-catalog__placeholder-card {
  overflow:hidden;
  border-radius:22px;
  background:#fffdf9;
  border:1px solid rgba(152,117,87,.18);
  box-shadow:0 14px 34px rgba(65,42,27,.08)
}
.lp-kiosk-catalog__placeholder-media {
  display:flex;
  align-items:center;
  justify-content:center;
  height:170px;
  background:linear-gradient(135deg,#f7ddbf 0%,#efd4bd 100%);
  color:#9e5d35;
  font-size:46px
}
.lp-kiosk-catalog__placeholder-body {
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:18px
}
.lp-kiosk-catalog__placeholder-category {
  color:#8e7b68;
  font:700 11px/1.2 Arial,sans-serif;
  letter-spacing:.08em;
  text-transform:uppercase
}
.lp-kiosk-catalog__placeholder-name {
  font-size:24px;
  line-height:1.05
}
.lp-kiosk-catalog__placeholder-desc {
  margin:0;
  color:#66584a;
  font:400 14px/1.6 Arial,sans-serif
}
.lp-kiosk-catalog__placeholder-price {
  margin-top:auto;
  color:#8f3a27;
  font:700 22px/1 Arial,sans-serif
}
.lp-kiosk-catalog__admin-note {
  margin-top:14px;
  padding:14px 16px;
  border-radius:16px;
  background:#fff4cf;
  border:1px solid #f0cf65;
  color:#6f4d00;
  font:700 13px/1.5 Arial,sans-serif
}
.lp-kiosk-catalog__admin-note.is-error {
  background:#ffe8e2;
  border-color:#f2b6a6;
  color:#8b2f1b
}
@media (max-width:1080px) {
  .lp-kiosk-catalog__hero {
    grid-template-columns:1fr
  }
  .lp-kiosk-catalog__placeholder {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}
@media (max-width:680px) {
  .lp-kiosk-catalog__shell {
    padding:0 14px
  }
  .lp-kiosk-catalog__intro,.lp-kiosk-catalog__meta,.lp-kiosk-catalog__stage {
    padding:18px;
    border-radius:20px
  }
  .lp-kiosk-catalog__microcopy,.lp-kiosk-catalog__placeholder {
    grid-template-columns:1fr
  }
  .lp-kiosk-catalog__title {
    font-size:2.4rem
  }
}


/* ============================================================
   SKIN v2 (capa añadida — lógica y layout intactos)
   ============================================================ */
.lp-kiosk-catalog { --lp-skin: 1; }
.lp-kiosk-catalog button:not([class*="close"]),
.lp-kiosk-catalog [class*="btn"]:not([class*="close"]),
.lp-kiosk-catalog [class*="button"]:not([class*="close"]) {
  border-radius: var(--lp-radius-full, 9999px);
  font-weight: 800;
  transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease, border-color 0.16s ease;
}
.lp-kiosk-catalog button:not([class*="close"]):not(:disabled):hover,
.lp-kiosk-catalog [class*="btn"]:not([class*="close"]):hover { transform: translateY(-1px); }
.lp-kiosk-catalog input:not([type="checkbox"]):not([type="radio"]),
.lp-kiosk-catalog select,
.lp-kiosk-catalog textarea {
  border-radius: var(--lp-radius, 10px);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.lp-kiosk-catalog input:focus,
.lp-kiosk-catalog select:focus,
.lp-kiosk-catalog textarea:focus {
  outline: none;
  border-color: var(--lp-primary, #3b82f6);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--lp-primary, #3b82f6) 18%, transparent);
}
.lp-kiosk-catalog [class*="card"],
.lp-kiosk-catalog [class*="item"]:not(li):not([class*="list-item"]) {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* Kiosk Web Ordering */
/* ============================================================================
 * Kiosk / Web Ordering System — CSS
 * ============================================================================
 *
 * Estilos para el sistema de pedidos web / kiosk:
 *   - Bloque dinámico de productos (.lp-products--dynamic)
 *   - Botón flotante de carrito (.kiosk-cart-fab)
 *   - Panel lateral de carrito (.kiosk-cart-panel)
 *   - Checkout: usa clases wizard-v2 de ai_wizard_v2.css
 *   - Página de confirmación (.kiosk-confirmation)
 *   - Modo kiosk (.kiosk-mode)
 *
 * Dependencias: ai_wizard_v2.css (para el checkout modal)
 * ============================================================================ */


/* ============================================================================
 * 1. CSS Custom Properties
 * ============================================================================ */

:root {
	--kiosk-primary: #E63946;
	--kiosk-secondary: #457B9D;
	--kiosk-bg: #F8F9FA;
	--kiosk-text: #1D3557;
	--kiosk-card-bg: #FFFFFF;
	--kiosk-success: #2D6A4F;
	--kiosk-danger: #E63946;
	--kiosk-radius: 12px;
	--kiosk-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	--kiosk-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}


/* ============================================================================
 * 2. Dynamic Products Grid (.lp-products--dynamic)
 * ============================================================================ */

/* --- Categories tabs --- */

.lp-products--dynamic .kiosk-categories {
	display: flex;
	gap: 8px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	padding: 8px 0 16px;
	scrollbar-width: none;
}

.lp-products--dynamic .kiosk-categories::-webkit-scrollbar {
	display: none;
}

.lp-products--dynamic .kiosk-category-btn {
	flex-shrink: 0;
	padding: 8px 20px;
	border: 2px solid transparent;
	border-radius: 999px;
	background: var(--kiosk-card-bg);
	color: var(--kiosk-text);
	font-family: var(--kiosk-font);
	font-size: 0.95rem;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.2s ease;
	white-space: nowrap;
	box-shadow: var(--kiosk-shadow);
}

.lp-products--dynamic .kiosk-category-btn:hover {
	border-color: var(--kiosk-primary);
	color: var(--kiosk-primary);
}

.lp-products--dynamic .kiosk-category-btn.active {
	background: var(--kiosk-primary);
	color: #fff;
	border-color: var(--kiosk-primary);
}

/* --- Product grid --- */

.lp-products--dynamic .kiosk-product-grid,
.lp-products--dynamic .lp-products__grid {
	display: grid;
	grid-template-columns: repeat(var(--lp-products-columns, 3), minmax(0, 1fr));
	gap: 20px;
	padding: 8px 0;
}

/* --- Product card --- */

.lp-products--dynamic .kiosk-product-card,
.lp-products--dynamic .lp-product_card {
	background: var(--kiosk-card-bg);
	border-radius: var(--kiosk-radius);
	box-shadow: var(--kiosk-shadow);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.lp-products--dynamic .kiosk-product-card:hover,
.lp-products--dynamic .lp-product_card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

/* --- Product image --- */

.lp-products--dynamic .kiosk-product-image {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: var(--kiosk-radius) var(--kiosk-radius) 0 0;
	display: block;
}

/* --- Product body --- */

.lp-products--dynamic .kiosk-product-body,
.lp-products--dynamic .lp-product_body {
	padding: 14px 16px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

@media (max-width: 1080px) {
	.lp-products--dynamic .kiosk-product-grid,
	.lp-products--dynamic .lp-products__grid {
		grid-template-columns: repeat(min(2, var(--lp-products-columns, 3)), minmax(0, 1fr));
	}
}

@media (max-width: 680px) {
	.lp-products--dynamic .kiosk-product-grid,
	.lp-products--dynamic .lp-products__grid {
		grid-template-columns: 1fr;
	}
}

/* --- Product name --- */

.lp-products--dynamic .kiosk-product-name {
	font-family: var(--kiosk-font);
	font-size: 1rem;
	font-weight: 600;
	color: var(--kiosk-text);
	margin: 0 0 6px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	line-height: 1.35;
}

/* --- Product description --- */

.lp-products--dynamic .kiosk-product-desc {
	font-family: var(--kiosk-font);
	font-size: 0.85rem;
	color: var(--kiosk-text);
	opacity: 0.7;
	margin: 0 0 10px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	line-height: 1.4;
}

/* --- Product price --- */

.lp-products--dynamic .kiosk-product-price {
	font-family: var(--kiosk-font);
	font-size: 1.2em;
	font-weight: 700;
	color: var(--kiosk-primary);
	margin: auto 0 12px;
}

/* --- Add to cart button --- */

.lp-products--dynamic .kiosk-add-btn {
	display: block;
	width: 100%;
	padding: 12px 16px;
	border: none;
	border-radius: 0 0 var(--kiosk-radius) var(--kiosk-radius);
	background: var(--kiosk-primary);
	color: #fff;
	font-family: var(--kiosk-font);
	font-size: 0.95rem;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.2s ease, transform 0.15s ease;
}

.lp-products--dynamic .kiosk-add-btn:hover {
	background: #cf2f3c;
}

.lp-products--dynamic .kiosk-add-btn:active {
	transform: scale(0.96);
}

.lp-products--dynamic .kiosk-add-btn.kiosk-add-btn--added {
	animation: kioskBtnPop 0.3s ease;
}

/* --- Loading spinner --- */

.lp-products--dynamic .kiosk-loading {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 60px 0;
}

.lp-products--dynamic .kiosk-spinner {
	width: 40px;
	height: 40px;
	border: 4px solid rgba(0, 0, 0, 0.1);
	border-top-color: var(--kiosk-primary);
	border-radius: 50%;
	animation: kioskSpin 0.7s linear infinite;
}

/* --- No products message --- */

.lp-products--dynamic .kiosk-no-products {
	text-align: center;
	padding: 48px 20px;
	color: var(--kiosk-text);
	opacity: 0.55;
	font-family: var(--kiosk-font);
	font-size: 1rem;
}


/* ============================================================================
 * 3. Floating Cart Button (.kiosk-cart-fab)
 * ============================================================================ */

.kiosk-cart-fab {
	position: fixed;
	bottom: 24px;
	left: 50%;
	transform: translateX(-50%);
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 28px;
	border: none;
	border-radius: 999px;
	background: var(--kiosk-primary);
	color: #fff;
	font-family: var(--kiosk-font);
	font-size: 1rem;
	font-weight: 600;
	cursor: pointer;
	box-shadow: 0 4px 20px rgba(230, 57, 70, 0.4);
	z-index: 1000;
	animation: kioskSlideUp 0.4s ease;
	transition: background 0.2s ease, box-shadow 0.2s ease;
}

.kiosk-cart-fab:hover {
	background: #cf2f3c;
	box-shadow: 0 6px 28px rgba(230, 57, 70, 0.55);
}

.kiosk-cart-fab--hidden {
	display: none !important;
}

/* Badge */
.kiosk-cart-fab .kiosk-cart-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 24px;
	height: 24px;
	padding: 0 6px;
	border-radius: 999px;
	background: #fff;
	color: var(--kiosk-primary);
	font-size: 0.8rem;
	font-weight: 700;
	line-height: 1;
}

/* Pulse on add */
.kiosk-cart-fab--pulse {
	animation: kioskPulse 0.5s ease;
}


/* ============================================================================
 * 4. Cart Panel (.kiosk-cart-panel)
 * ============================================================================ */

/* Overlay backdrop */
.kiosk-cart-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1001;
	animation: kioskFadeIn 0.2s ease;
}

/* Panel */
.kiosk-cart-panel {
	position: fixed;
	top: 0;
	right: 0;
	width: 400px;
	height: 100%;
	background: var(--kiosk-card-bg);
	z-index: 1002;
	display: flex;
	flex-direction: column;
	box-shadow: -4px 0 24px rgba(0, 0, 0, 0.15);
	animation: kioskSlideInRight 0.3s ease;
}

/* --- Header --- */

.kiosk-cart-panel .kiosk-cart-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 20px;
	border-bottom: 1px solid #eee;
}

.kiosk-cart-panel .kiosk-cart-title {
	font-family: var(--kiosk-font);
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--kiosk-text);
	margin: 0;
}

.kiosk-cart-panel .kiosk-cart-close {
	width: 36px;
	height: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: none;
	border-radius: 50%;
	background: transparent;
	color: var(--kiosk-text);
	font-size: 1.2rem;
	cursor: pointer;
	transition: background 0.15s ease;
}

.kiosk-cart-panel .kiosk-cart-close:hover {
	background: #f0f0f0;
}

/* --- Items list --- */

.kiosk-cart-panel .kiosk-cart-items {
	flex: 1;
	overflow-y: auto;
	padding: 12px 20px;
}

/* --- Single cart item --- */

.kiosk-cart-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 0;
	border-bottom: 1px solid #f0f0f0;
}

.kiosk-cart-item:last-child {
	border-bottom: none;
}

.kiosk-cart-item .kiosk-cart-item-img {
	width: 60px;
	height: 60px;
	border-radius: 8px;
	object-fit: cover;
	flex-shrink: 0;
}

.kiosk-cart-item .kiosk-cart-item-info {
	flex: 1;
	min-width: 0;
}

.kiosk-cart-item .kiosk-cart-item-label {
	font-family: var(--kiosk-font);
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--kiosk-text);
	margin: 0 0 4px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.kiosk-cart-item .kiosk-cart-item-price {
	font-family: var(--kiosk-font);
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--kiosk-primary);
}

/* Qty controls */
.kiosk-cart-item .kiosk-qty-controls {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	flex-shrink: 0;
}

.kiosk-cart-item .kiosk-qty-btn {
	width: 36px;
	height: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid #ddd;
	border-radius: 8px;
	background: #fff;
	color: var(--kiosk-text);
	font-size: 1.1rem;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.15s ease, border-color 0.15s ease;
}

.kiosk-cart-item .kiosk-qty-btn:hover {
	background: #f5f5f5;
	border-color: #bbb;
}

.kiosk-cart-item .kiosk-qty-value {
	width: 32px;
	text-align: center;
	font-family: var(--kiosk-font);
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--kiosk-text);
}

/* Remove button */
.kiosk-cart-item .kiosk-cart-item-remove {
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: none;
	border-radius: 50%;
	background: transparent;
	color: var(--kiosk-danger);
	font-size: 0.9rem;
	cursor: pointer;
	flex-shrink: 0;
	transition: background 0.15s ease;
}

.kiosk-cart-item .kiosk-cart-item-remove:hover {
	background: #fde8ea;
}

/* --- Empty cart --- */

.kiosk-cart-panel .kiosk-cart-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	flex: 1;
	padding: 40px 20px;
	text-align: center;
	color: var(--kiosk-text);
	opacity: 0.5;
	font-family: var(--kiosk-font);
}

.kiosk-cart-panel .kiosk-cart-empty i {
	font-size: 3rem;
	margin-bottom: 16px;
}

/* --- Footer (totals + confirm) --- */

.kiosk-cart-panel .kiosk-cart-footer {
	position: sticky;
	bottom: 0;
	padding: 16px 20px;
	border-top: 1px solid #eee;
	background: var(--kiosk-card-bg);
}

.kiosk-cart-totals {
	margin-bottom: 14px;
}

.kiosk-cart-totals .kiosk-total-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 4px 0;
	font-family: var(--kiosk-font);
	font-size: 0.9rem;
	color: var(--kiosk-text);
}

.kiosk-cart-totals .kiosk-total-row.kiosk-total-row--grand {
	font-size: 1.15rem;
	font-weight: 700;
	padding-top: 10px;
	margin-top: 6px;
	border-top: 2px solid var(--kiosk-text);
}

.kiosk-cart-confirm-btn {
	display: block;
	width: 100%;
	padding: 14px;
	border: none;
	border-radius: var(--kiosk-radius);
	background: var(--kiosk-primary);
	color: #fff;
	font-family: var(--kiosk-font);
	font-size: 1rem;
	font-weight: 700;
	cursor: pointer;
	transition: background 0.2s ease;
}

.kiosk-cart-confirm-btn:hover {
	background: #cf2f3c;
}


/* ============================================================================
 * 5. Checkout Modal (usa clases wizard-v2 de ai_wizard_v2.css)
 * ============================================================================ */

/*
 * El checkout modal usa las clases estándar del proyecto:
 *   wizard-v2-overlay, wizard-v2-modal, wizard-v2-header, wizard-close-btn,
 *   wizard-v2-content, wizard-step, wizard-v2-footer, wizard-btn primary/secondary,
 *   wizard-form-group, wizard-label, wizard-input
 *
 * Aquí solo definimos estilos específicos del contexto kiosk-checkout.
 */

/* Order type selection cards */
.kiosk-checkout-types {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	padding: 8px 0;
}

.kiosk-checkout-type-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 28px 16px;
	border: 2px solid #e0e0e0;
	border-radius: var(--kiosk-radius);
	background: var(--kiosk-card-bg);
	cursor: pointer;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
	text-align: center;
}

.kiosk-checkout-type-card:hover {
	border-color: var(--kiosk-primary);
}

.kiosk-checkout-type-card.active {
	border-color: var(--kiosk-primary);
	box-shadow: 0 0 0 3px rgba(230, 57, 70, 0.15);
}

.kiosk-checkout-type-card i {
	font-size: 2rem;
	color: var(--kiosk-primary);
}

.kiosk-checkout-type-card span {
	font-family: var(--kiosk-font);
	font-size: 1rem;
	font-weight: 600;
	color: var(--kiosk-text);
}

/* Order summary inside checkout */
.kiosk-checkout-summary {
	width: 100%;
	border-collapse: collapse;
	margin: 12px 0;
	font-family: var(--kiosk-font);
}

.kiosk-checkout-summary th {
	text-align: left;
	padding: 8px 0;
	font-size: 0.8rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--kiosk-text);
	opacity: 0.6;
	border-bottom: 1px solid #eee;
}

.kiosk-checkout-summary td {
	padding: 10px 0;
	font-size: 0.9rem;
	color: var(--kiosk-text);
	border-bottom: 1px solid #f5f5f5;
}

.kiosk-checkout-summary td:last-child {
	text-align: right;
	font-weight: 600;
}

.kiosk-checkout-summary tfoot td {
	font-weight: 700;
	font-size: 1.05rem;
	border-top: 2px solid var(--kiosk-text);
	border-bottom: none;
	padding-top: 12px;
}


/* ============================================================================
 * 6. Confirmation Page (.kiosk-confirmation)
 * ============================================================================ */

.kiosk-confirmation {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 60vh;
	padding: 40px 20px;
	text-align: center;
	font-family: var(--kiosk-font);
	color: var(--kiosk-text);
	animation: kioskFadeIn 0.4s ease;
}

/* Success icon */
.kiosk-confirmation .kiosk-confirm-icon {
	width: 80px;
	height: 80px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--kiosk-success);
	color: #fff;
	font-size: 2.2rem;
	margin-bottom: 24px;
}

/* Order number */
.kiosk-confirmation .kiosk-confirm-order-number {
	font-size: 2.2rem;
	font-weight: 800;
	margin: 0 0 8px;
	color: var(--kiosk-text);
}

.kiosk-confirmation .kiosk-confirm-subtitle {
	font-size: 1rem;
	opacity: 0.7;
	margin: 0 0 32px;
}

/* QR code container */
.kiosk-confirmation .kiosk-confirm-qr {
	max-width: 250px;
	width: 100%;
	padding: 20px;
	border: 2px solid #eee;
	border-radius: var(--kiosk-radius);
	background: #fff;
	margin-bottom: 24px;
}

.kiosk-confirmation .kiosk-confirm-qr img,
.kiosk-confirmation .kiosk-confirm-qr canvas {
	width: 100%;
	height: auto;
	display: block;
}

/* Summary table */
.kiosk-confirmation .kiosk-confirm-summary {
	width: 100%;
	max-width: 420px;
	border-collapse: collapse;
	margin: 0 auto 28px;
	font-size: 0.9rem;
}

.kiosk-confirmation .kiosk-confirm-summary td {
	padding: 8px 4px;
	border-bottom: 1px solid #f0f0f0;
}

.kiosk-confirmation .kiosk-confirm-summary td:last-child {
	text-align: right;
	font-weight: 600;
}

.kiosk-confirmation .kiosk-confirm-summary tr.kiosk-confirm-summary--total td {
	font-size: 1.1rem;
	font-weight: 700;
	border-top: 2px solid var(--kiosk-text);
	border-bottom: none;
	padding-top: 12px;
}

/* Action buttons */
.kiosk-confirmation .kiosk-confirm-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin-top: 8px;
}

.kiosk-confirm-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 28px;
	border: 2px solid transparent;
	border-radius: var(--kiosk-radius);
	font-family: var(--kiosk-font);
	font-size: 0.95rem;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.2s ease, border-color 0.2s ease;
}

.kiosk-confirm-btn--primary {
	background: var(--kiosk-primary);
	color: #fff;
}

.kiosk-confirm-btn--primary:hover {
	background: #cf2f3c;
}

.kiosk-confirm-btn--secondary {
	background: transparent;
	color: var(--kiosk-secondary);
	border-color: var(--kiosk-secondary);
}

.kiosk-confirm-btn--secondary:hover {
	background: rgba(69, 123, 157, 0.08);
}


/* ============================================================================
 * 7. Kiosk Mode (.kiosk-mode)
 * ============================================================================ */

.kiosk-mode {
	overflow-x: hidden;
}

/* Tarjetas de producto más grandes */
.kiosk-mode .kiosk-product-name {
	font-size: 1.15rem;
}

.kiosk-mode .kiosk-product-price {
	font-size: 1.35em;
}

.kiosk-mode .kiosk-add-btn {
	min-height: 56px;
	font-size: 1.05rem;
}

/* FAB más grande */
.kiosk-mode .kiosk-cart-fab {
	padding: 16px 32px;
	font-size: 1.1rem;
}

/* Todos los elementos interactivos: objetivo táctil mínimo 56px */
.kiosk-mode .kiosk-category-btn {
	min-height: 56px;
	padding: 14px 24px;
	font-size: 1.05rem;
}

.kiosk-mode .kiosk-qty-btn {
	width: 48px;
	height: 48px;
	font-size: 1.3rem;
}

.kiosk-mode .kiosk-cart-close {
	width: 48px;
	height: 48px;
	font-size: 1.4rem;
}

.kiosk-mode .kiosk-cart-confirm-btn {
	min-height: 56px;
	font-size: 1.1rem;
}

.kiosk-mode .kiosk-checkout-type-card {
	padding: 36px 20px;
}

.kiosk-mode .kiosk-confirm-btn {
	min-height: 56px;
	padding: 14px 32px;
}


/* ============================================================================
 * 8. Animations
 * ============================================================================ */

/* Cart fab: slide up from bottom */
@keyframes kioskSlideUp {
	from {
		opacity: 0;
		transform: translateX(-50%) translateY(40px);
	}
	to {
		opacity: 1;
		transform: translateX(-50%) translateY(0);
	}
}

/* Cart panel: slide in from right */
@keyframes kioskSlideInRight {
	from {
		transform: translateX(100%);
	}
	to {
		transform: translateX(0);
	}
}

/* Generic fade in */
@keyframes kioskFadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

/* Pulse for cart fab when item is added */
@keyframes kioskPulse {
	0% {
		transform: translateX(-50%) scale(1);
	}
	50% {
		transform: translateX(-50%) scale(1.1);
	}
	100% {
		transform: translateX(-50%) scale(1);
	}
}

/* Loading spinner rotation */
@keyframes kioskSpin {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

/* Brief scale pop for add-to-cart button */
@keyframes kioskBtnPop {
	0% {
		transform: scale(1);
	}
	40% {
		transform: scale(0.92);
	}
	100% {
		transform: scale(1);
	}
}


/* ============================================================================
 * 9. Responsive
 * ============================================================================ */

/* Tablet (768px+) */
@media (min-width: 768px) {
	.lp-products--dynamic .kiosk-product-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* Desktop (1024px+) */
@media (min-width: 1024px) {
	.lp-products--dynamic .kiosk-product-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* Large desktop (1400px+) */
@media (min-width: 1400px) {
	.lp-products--dynamic .kiosk-product-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

/* Mobile (<768px) */
@media (max-width: 767px) {
	/* Full-width cart panel as bottom sheet */
	.kiosk-cart-panel {
		width: 100%;
		top: auto;
		bottom: 0;
		height: 85vh;
		border-radius: var(--kiosk-radius) var(--kiosk-radius) 0 0;
		animation: kioskSlideUpPanel 0.3s ease;
	}

	@keyframes kioskSlideUpPanel {
		from {
			transform: translateY(100%);
		}
		to {
			transform: translateY(0);
		}
	}

	/* Checkout type cards stacked */
	.kiosk-checkout-types {
		grid-template-columns: 1fr;
	}

	/* Confirmation: reduce spacing */
	.kiosk-confirmation {
		padding: 24px 16px;
	}

	.kiosk-confirmation .kiosk-confirm-order-number {
		font-size: 1.8rem;
	}

	.kiosk-confirmation .kiosk-confirm-actions {
		flex-direction: column;
		width: 100%;
	}

	.kiosk-confirm-btn {
		width: 100%;
		justify-content: center;
	}
}


/* ============================================================================
 * 10. Print
 * ============================================================================ */

@media print {
	.kiosk-cart-fab,
	.kiosk-cart-overlay,
	.kiosk-cart-panel,
	.wizard-v2-overlay {
		display: none !important;
	}

	.lp-products--dynamic .kiosk-product-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.lp-products--dynamic .kiosk-product-card {
		box-shadow: none;
		border: 1px solid #ddd;
	}

	.lp-products--dynamic .kiosk-add-btn {
		display: none;
	}
}