/* ═══════════════════════════════════════════
   Soqueta Carta — Public catalog styles
   Scoped under .soqueta-carta to avoid theme conflicts.
═══════════════════════════════════════════ */

.soqueta-carta, .soqueta-carta * { box-sizing: border-box; }

.soqueta-carta {
	--sq-orange: #f97316;
	--sq-orange-dk: #ea6d0e;
	--sq-black: #1a1a1a;
	--sq-gray: #f5f5f3;
	--sq-gray-mid: #e2e0d8;
	--sq-gray-t: #6b6b6b;
	--sq-white: #ffffff;
	--sq-green: #16a34a;
	--sq-r: 12px;
	--sq-rp: 999px;
	font-family: 'Nunito', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	color: var(--sq-black);
	background: var(--sq-white);
	max-width: 720px;
	margin: 0 auto;
	padding: 0 1rem 3rem;
	line-height: 1.5;
}

.soqueta-carta button { font-family: inherit; cursor: pointer; }
.soqueta-carta a { color: inherit; text-decoration: none; }

/* ─── Brand header ─── */
.soqueta-carta .sq-brand-header { text-align: center; padding: 1.5rem 1rem 0.5rem; }
.soqueta-carta .sq-brand-name { font-size: 28px; font-weight: 900; color: var(--sq-black); letter-spacing: -0.5px; }
.soqueta-carta .sq-brand-tagline { font-size: 11px; color: var(--sq-gray-t); letter-spacing: 0.3em; text-transform: uppercase; margin-top: 4px; }

/* ─── Tabs ─── */
.soqueta-carta .sq-tabs {
	display: flex;
	gap: 6px;
	padding: 1rem 0;
	justify-content: center;
	flex-wrap: wrap;
	position: sticky;
	top: 0;
	background: var(--sq-white);
	z-index: 50;
	border-bottom: 1px solid var(--sq-gray-mid);
}
.soqueta-carta .sq-tab {
	padding: 9px 22px;
	border-radius: var(--sq-rp);
	font-size: 14px;
	font-weight: 700;
	border: none;
	transition: all 0.2s;
	white-space: nowrap;
}
.soqueta-carta .sq-tab-active { background: var(--sq-black); color: var(--sq-white); }
.soqueta-carta .sq-tab-other  { background: var(--sq-orange); color: var(--sq-white); }
.soqueta-carta .sq-tab-other:hover { background: var(--sq-orange-dk); }

/* ─── Notice ─── */
.soqueta-carta .sq-notice {
	background: var(--sq-gray);
	border-radius: var(--sq-r);
	padding: 14px 18px;
	font-size: 13px;
	color: var(--sq-gray-t);
	margin: 1rem 0 1.5rem;
	line-height: 1.6;
	border-left: 3px solid var(--sq-orange);
}

/* ─── Sections (accordion) ─── */
.soqueta-carta .sq-section { border-bottom: 1px solid var(--sq-gray-mid); }
.soqueta-carta .sq-sec-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 0;
	cursor: pointer;
	user-select: none;
}
.soqueta-carta .sq-sec-title { font-size: 20px; font-weight: 800; color: var(--sq-black); }
.soqueta-carta .sq-sec-line { height: 2.5px; background: var(--sq-orange); width: 52px; margin-top: 4px; border-radius: 2px; }
.soqueta-carta .sq-toggle-btn {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--sq-orange);
	border: none;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	cursor: pointer;
	position: relative;
	transition: background 0.2s;
	box-shadow: 0 2px 10px rgba(249,115,22,.4);
}
.soqueta-carta .sq-toggle-btn:hover { background: var(--sq-orange-dk); }

/* Ocultar cualquier SVG inline cacheado */
.soqueta-carta .sq-toggle-btn svg { display: none !important; }

/* Flecha CSS pura — funciona aunque el HTML esté cacheado */
.soqueta-carta .sq-toggle-btn::after {
	content: '';
	position: absolute;
	width: 13px;
	height: 13px;
	border-right: 3px solid #fff;
	border-bottom: 3px solid #fff;
	border-radius: 1px;
	top: 50%;
	left: 50%;
	/* Centrar y bajar ligeramente para que la punta quede en el centro visual */
	transform: translate(-50%, -65%) rotate(45deg);
	transition: transform 0.3s cubic-bezier(.4,0,.2,1);
}
/* Flecha arriba = sección ABIERTA */
.soqueta-carta .sq-toggle-btn.sq-open::after {
	transform: translate(-50%, -35%) rotate(-135deg);
}
.soqueta-carta .sq-sec-body { overflow: hidden; }

/* ─── Dishes ─── */
.soqueta-carta .sq-dish {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	padding: 12px 0;
	border-bottom: 1px solid var(--sq-gray-mid);
	gap: 16px;
}
.soqueta-carta .sq-dish:last-child { border-bottom: none; }
.soqueta-carta .sq-dish-left { flex: 1; min-width: 0; }
.soqueta-carta .sq-dish-name { font-size: 14px; font-weight: 700; color: var(--sq-black); margin-bottom: 2px; }
.soqueta-carta .sq-dish-desc { font-size: 12px; color: var(--sq-gray-t); margin-bottom: 6px; line-height: 1.5; }
.soqueta-carta .sq-dish-title {
	font-size: 14px;
	font-weight: 900;
	color: var(--sq-orange-dk);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 14px 0 6px;
	border-bottom: 1.5px solid var(--sq-orange);
	margin-bottom: 6px;
}

/* ─── Allergens ─── */
.soqueta-carta .sq-allergens { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 5px; }
.soqueta-carta .sq-al-tag {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	background: var(--sq-gray);
	border-radius: var(--sq-rp);
	padding: 3px 9px 3px 4px;
	font-size: 11px;
	color: #444;
	font-weight: 600;
	border: 1px solid var(--sq-gray-mid);
}
.soqueta-carta { --sq-al-size: 22px; }
.soqueta-carta .sq-al-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--sq-al-size);
	height: var(--sq-al-size);
	flex-shrink: 0;
}
.soqueta-carta .sq-al-ico svg,
.soqueta-carta .sq-al-ico img,
.soqueta-carta .sq-al-ico .sq-al-img {
	width: var(--sq-al-size) !important;
	height: var(--sq-al-size) !important;
	display: block;
	object-fit: contain;
}
.soqueta-carta .sq-apto-row { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.soqueta-carta .sq-apto-tag {
	display: inline-flex;
	padding: 2px 8px;
	border-radius: var(--sq-rp);
	font-size: 10px;
	font-weight: 700;
	background: #dcfce7;
	color: var(--sq-green);
	border: 1px solid #bbf7d0;
}

/* ─── Prices ─── */
.soqueta-carta .sq-dish-right { text-align: right; flex-shrink: 0; min-width: 90px; }
.soqueta-carta .sq-price-row { display: flex; flex-direction: column; align-items: flex-end; margin-bottom: 4px; }
.soqueta-carta .sq-price-row:last-child { margin-bottom: 0; }
.soqueta-carta .sq-price { font-size: 14px; font-weight: 800; color: var(--sq-black); white-space: nowrap; }
.soqueta-carta .sq-note { font-size: 11px; color: var(--sq-gray-t); line-height: 1.4; text-align: right; }

/* ─── Legend ─── */
.soqueta-carta .sq-legend-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 10px;
	padding-bottom: 1rem;
}
.soqueta-carta .sq-legend-item { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; color: var(--sq-black); }
.soqueta-carta .sq-legend-ico {
	width: 26px;
	height: 26px;
	display: inline-flex;
	flex-shrink: 0;
}
.soqueta-carta .sq-legend-ico svg { width: 100%; height: 100%; }

/* ─── Footer ─── */
.soqueta-carta .sq-footer-note {
	margin-top: 2rem;
	font-size: 12px;
	color: var(--sq-gray-t);
	text-align: center;
	line-height: 1.6;
	padding: 1.5rem 1rem 0;
	border-top: 1px solid var(--sq-gray-mid);
}
.soqueta-carta .sq-footer-note strong { color: var(--sq-black); }

/* ─── Empty state ─── */
.soqueta-empty {
	text-align: center;
	padding: 3rem 1rem;
	color: #999;
	font-size: 14px;
	font-style: italic;
}

/* ─── Responsive ─── */
@media (max-width: 768px) {
	.soqueta-carta { padding: 0 12px; }
	.soqueta-carta .sq-tabs { gap: 4px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: 4px; }
	.soqueta-carta .sq-tabs::-webkit-scrollbar { display: none; }
	.soqueta-carta .sq-tab { flex-shrink: 0; padding: 8px 14px; font-size: 13px; }
	.soqueta-carta .sq-sec-title { font-size: 18px; }
	.soqueta-carta .sq-dish-name { font-size: 14px; }
	.soqueta-carta { --sq-al-size: 18px; }
}
@media (max-width: 500px) {
	.soqueta-carta { padding: 0 10px; }
	.soqueta-carta .sq-sec-title { font-size: 16px; }
	.soqueta-carta .sq-dish-name { font-size: 13px; }
	.soqueta-carta .sq-tab { padding: 7px 12px; font-size: 12px; }
	.soqueta-carta .sq-brand-name { font-size: 22px; }
	.soqueta-carta .sq-brand-logo { max-height: 60px; }
	.soqueta-carta { --sq-al-size: 16px; }
	.soqueta-carta .sq-al-tag { font-size: 10px; padding: 3px 8px 3px 3px; gap: 4px; }
}

/* Logo personalizado */
.soqueta-carta .sq-brand-logo { max-height: 80px; margin: 0 auto 8px; display: block; }