/* Emporter theme — WordPress-specific additions on top of the untouched compiled design CSS. */ /* Bilingual toggle: the page ships with BOTH full language versions in the markup (guaranteeing pixel-perfect fidelity in each language, since each was captured directly from the real, already-approved site rather than re-typed by hand). Only one is shown at a time, controlled by a data-lang attribute on . */ .atelier-page.lang-en { display: none; } body[data-lang="en"] .atelier-page.lang-ar { display: none; } body[data-lang="en"] .atelier-page.lang-en { display: block; } /* Same idea for the 404 template. */ .notfound-page.lang-en { display: none; } body[data-lang="en"] .notfound-page.lang-ar { display: none; } body[data-lang="en"] .notfound-page.lang-en { display: block; } /* The mobile drawer is closed by default (inline style="display:none" in the markup); theme.js toggles that inline style on click. This rule is just a safety net so the drawer never appears open if JS fails to load for any reason. */ .mobile-drawer { display: none; } html { scroll-behavior: smooth; } /* Footer address: now a clickable Google Maps link. Keep it looking like the plain legal-line text it always was (not like the small uppercase social links next to it) and only hint that it's clickable on hover/focus. */ .atelier-footer p a.footer-address-link { color: inherit; font: inherit; letter-spacing: inherit; text-decoration: none; } .atelier-footer p a.footer-address-link:hover, .atelier-footer p a.footer-address-link:focus-visible { text-decoration: underline; } /* Shipping-coverage badge on each world tile: packaged goods (jams, dairy, frozen, gifts, sweets, daily, special) ship nationwide; catering/buffets stay Jeddah-only. Small pill, consistent with the tile-number treatment already used on the same cards. */ .tile-shipping-badge { display: block; width: fit-content; margin: 0 0 .5rem; padding: .22rem .55rem; border-radius: 999px; font-size: .62rem; font-weight: 700; letter-spacing: .01em; color: var(--ink); background: #fffefae6; border: 1px solid var(--gold); } .tile-shipping-badge.local { color: #fff; background: var(--red); border-color: var(--red); } /* Fix: heading + paragraph pairs in "section-lead"-style blocks (used in the "عالم أمبورتر" section and its siblings) sit in a flex row on wide viewports. Without min-width:0 a flex child can render at its full intrinsic content width for an instant before the browser reflows it to the allotted flex space — on this layout that shows up as the heading and paragraph briefly overlapping right as the scroll-reveal animation starts. This is the standard, safe fix and does not change how anything looks once settled. */ .section-lead, .section-lead > *, .seasonal-content, .seasonal-content > *, .heritage-text, .heritage-text > *, .passage-copy, .passage-copy > *, .catering-copy, .catering-copy > *, .closing-section, .closing-section > * { min-width: 0; } /* Progressive enhancement: content remains visible when JavaScript is unavailable. */ .reveal { opacity: 1; transform: none; } #worlds .section-lead { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.75fr); gap:2rem; } #worlds .section-lead > p { max-width:100%; } .language-pills a { display:inline-flex; padding:.4rem .65rem; border-radius:2rem; text-decoration:none; color:inherit; font:inherit; } .language-pills a.active { background:var(--red); color:white; } .film-toggle { position:absolute; bottom:1rem; inset-inline-start:1rem; z-index:4; padding:.6rem 1rem; border-radius:2rem; background:#fff; color:#231d19; border:1px solid #765d46; } .lead-whatsapp[hidden], [hidden].consent-panel { display:none!important; } .lead-whatsapp { display:inline-block; padding:.7rem; text-decoration:underline; } .catering-form fieldset { border:0; padding:0; margin:0; min-width:0; display:grid; gap:1rem; } .catering-form .privacy-ack { display:flex; gap:.6rem; align-items:flex-start; font-size:.85rem; } .catering-form .privacy-ack input { width:1.2rem; height:1.2rem; } .catering-form [role=status] { white-space:normal; } .catering-form button:disabled { opacity:.55; cursor:not-allowed; } .consent-panel { position:fixed; bottom:1rem; inset-inline:1rem; margin:auto; max-width:42rem; padding:1rem; background:#fffaf1; color:#221c18; border:1px solid #8b7055; box-shadow:0 4px 30px #0003; border-radius:1rem; z-index:1000; } .consent-panel button, .privacy-settings { padding:.6rem; margin:.25rem; cursor:pointer; } .price-label { position:absolute; top:3.8rem; inset-inline-start:1rem; padding:.3rem .6rem; background:#fffaf1; color:#221c18; border-radius:1rem; font-size:.8rem; } :focus-visible { outline:3px solid #ad7626; outline-offset:4px; } .hero-caption { box-sizing:border-box; padding-inline:1.25rem; } .lang-en .seasonal-content:before { content:"Emporter gifts"; } .lang-en .trust-ribbon:after { content:"✓ Fully licensed"; } .lang-en .hero-caption:after { content:"Made with Love"; } .lang-en .passage-photos:before { content:"From Jeddah"; } @media(max-width:700px) { #worlds .section-lead { grid-template-columns:1fr; } } @media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *, *::before, *::after { animation:none!important; transition:none!important; } }