/* Tema de Casa Pablo: solo tokens (la estructura vive en estructura-base.css) */ :root { --fondo-interior: url(/images/fondo4.png); --fondo-index-img: url(/images/fondo3.png); --logo-fondo: none; --color-degradado2: none; --blanco: #ffffff; --negro: #111111; --fondo-negro: #000; --color-nombre-plato: var(--blanco); --color-acento-carta: var(--color-titulo); --color-footer-acento: var(--color-titulo); --fondo-app: #000; /* Tokens semánticos de tema (defaults = oscuro) */ --color-texto-tema: var(--blanco); --color-icono-nav: var(--blanco); --halo-texto: 0 0 0.25rem var(--negro), 0 0 0.625rem var(--negro), 0 0 1.25rem var(--negro); --color-primario: #f07c00; --color-secundario: #b05b00; --color-titulo: #b05b00; --color-form-borde: rgba(255, 255, 255, 0.4); --color-form-borde-focus: rgba(255, 255, 255, 0.3); /* Formulario de reservas */ --form-fondo: linear-gradient( 160deg, var(--negro) 0%, var(--negro) 30%, color-mix(in srgb, var(--color-primario) 50%, var(--negro)) 100% ); --form-texto: var(--blanco); --form-input-fondo: rgba(255, 255, 255, 0.08); --form-placeholder: rgba(249, 239, 218, 0.4); --form-warning: color-mix(in srgb, var(--color-primario) 55%, #fff); --form-datepicker-filtro: invert(1); /* Liquid Glass */ --lg-bg-color: rgba(0, 0, 0, 0.4); --lg-highlight: rgba(255, 255, 255, 0.75); --lg-blur: 0.25rem; /* Sombras */ --sombra: 0.1875rem 0.1875rem 0.25rem #fff, -0.1875rem -0.1875rem 0.25rem var(--negro); /* Botones */ --border-radius: 1.25rem; /* Tipografía */ --tipo-principal: "Roboto", sans-serif; } /* TEMA CLARO ACTIVO — Casa Pablo (fondo claro, acento naranja) */ :root { --fondo-app: #fff; --color-texto-tema: var(--negro); --color-icono-nav: var(--color-secundario); --halo-texto: none; --color-nombre-plato: var(--negro); --lg-bg-color: rgba(255, 255, 255, 0.45); --lg-brightness: 1; --lg-highlight: rgba(255, 255, 255, 0.15); --color-degradado2: linear-gradient( -45deg, var(--color-secundario) 0%, transparent 45% ); --color-form-borde: rgba(0, 0, 0, 0.25); --color-form-borde-focus: rgba(0, 0, 0, 0.15); --form-fondo: linear-gradient( 160deg, #fff 0%, #fff 30%, color-mix(in srgb, var(--color-primario) 15%, #fff) 100% ); --form-texto: var(--negro); --form-input-fondo: rgba(0, 0, 0, 0.04); --form-placeholder: rgba(0, 0, 0, 0.45); --form-warning: var(--color-secundario); --form-datepicker-filtro: none; } html { color: var(--color-texto-tema); overflow-x: hidden; } body { width: 100%; font-family: var(--tipo-principal); background-color: var(--fondo-negro); } /* Oculto en pantalla, visible para lectores y SEO (el

de cada página) / .visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } / fadeIn - En el de cada página / .fade-in { animation: fadeIn ease 2s; } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes degradadoMovil { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } / ==== SINGULARIDADES DE CASA PABLO (nunca en los CSS compartidos) ==== / / Recuadro naranja del texto de cabecera de familia / .carta .textos__header-footer-familia { border: 2px solid #c06300; border-radius: 2mm; padding: 2mm 3mm; box-sizing: border-box; } / Rótulos "Contiene" / "Puede contener" de la lista de alérgenos. Móvil: "contiene" al lado del plato y "puede contener" en su línea de abajo / .lista_alergenos .lista_alergenos-plato { grid-template-columns: 1fr auto; gap: 0.15rem 0.5rem; } .lista_alergenos .contenedor-icons.cp-alergenos { display: contents; } .lista_alergenos .contenedor-texto { grid-column: 1; grid-row: 1; padding-bottom: 0; } .lista_alergenos .cp-alergenos__fila { display: flex; align-items: center; gap: 0.35rem; } .lista_alergenos .cp-alergenos__fila--contiene { grid-column: 2; grid-row: 1; justify-content: flex-end; } .lista_alergenos .cp-alergenos__fila--puede { grid-column: 1 / -1; grid-row: 2; padding-bottom: 0.4rem; } .lista_alergenos .cp-alergenos__iconos { display: flex; flex-wrap: wrap; gap: 0.15rem; } .lista_alergenos .cp-alergenos__texto { font-size: 0.8rem; line-height: 1.2; text-align: left; } .lista_alergenos .cp-alergenosfila--puede .cp-alergenostexto { opacity: 0.7; } / Desde tablet caben los dos grupos juntos a la derecha del nombre */ @media screen and (min-width: 48rem) { .lista_alergenos .lista_alergenos-plato { grid-template-columns: minmax(6rem, 1fr) auto; gap: 0.5rem; } .lista_alergenos .contenedor-icons.cp-alergenos { display: flex; width: auto; flex-direction: column; align-items: flex-end; gap: 0.2rem; grid-column: 2; grid-row: 1; padding: 0.2rem 0; } .lista_alergenos .cp-alergenos__fila--contiene, .lista_alergenos .cp-alergenos__fila--puede { grid-column: auto; grid-row: auto; padding-bottom: 0; } .lista_alergenos .cp-alergenos__iconos { justify-content: flex-end; } .lista_alergenos .cp-alergenos__texto { flex: 0 0 6.5rem; } }