html { scroll-behavior: smooth; }
body { margin: 0; background: #F3E8D6; }
*, *::before, *::after { box-sizing: border-box; }
button, input { font: inherit; }
button:disabled { opacity: .5; cursor: default; }
:focus-visible { outline: 3px solid #E08A5A; outline-offset: 4px; }
.sa-root, .sm-root { width: 100%; }
.sm-root { max-width: 480px; margin-inline: auto; }
.dish-photo { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.demo-tools { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 16px; padding: 10px 20px; background: #12162A; color: #EAD7B7; font: 400 12px/1.5 Figtree, sans-serif; }
.demo-tools a { color: inherit; text-decoration: none; min-height: 28px; display: inline-flex; align-items: center; }
.language-switch { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; min-height: 44px; }
[role="dialog"] { outline: none; }
.sm-root .sm-scroll > header { min-height: 250px; }
.sm-root [role="dialog"] { max-height: 92dvh !important; overflow-y: auto; }
@media (max-width: 640px) {
 .demo-tools { padding-inline: 16px; font-size: 11px; }
 .demo-tools span { flex-basis: 100%; order: 3; }
 .sa-root > header { height: auto !important; min-height: 440px; padding-bottom: 65px; }
 .sa-root nav { padding: 16px !important; gap: 8px !important; }
 .sa-root nav > div { gap: 12px !important; font-size: 12px !important; }
 .sa-root main { padding-inline: 16px !important; }
 .sa-root #menu > div { padding-inline: 16px !important; }
 .sa-root #menu [role="group"] { gap: 6px !important; }
 .sa-root #menu button { font-size: 12px !important; }
 .sa-root [role="dialog"] { max-height: calc(100dvh - 24px) !important; }
 .sa-root [role="dialog"] > div[style*="min-height: 320px"] { min-height: 220px !important; }
}

@font-face { font-family: 'Sahra Arabic'; font-style: normal; font-weight: 300; font-display: swap; src: url('./assets/arabic-300.woff2') format('woff2'); }
@font-face { font-family: 'Sahra Arabic'; font-style: normal; font-weight: 400; font-display: swap; src: url('./assets/arabic-400.woff2') format('woff2'); }
@font-face { font-family: 'Sahra Arabic'; font-style: normal; font-weight: 500; font-display: swap; src: url('./assets/arabic-500.woff2') format('woff2'); }
@font-face { font-family: 'Sahra Arabic'; font-style: normal; font-weight: 600; font-display: swap; src: url('./assets/arabic-600.woff2') format('woff2'); }
@font-face { font-family: 'Reem Kufi'; font-style: normal; font-weight: 400; font-display: swap; src: url('./assets/arabic-400.woff2') format('woff2'); }
.secondary-name { font-family: 'Sahra Arabic', Tahoma, sans-serif !important; }
html[lang="ar"] body,
html[lang="ar"] .sa-root *,
html[lang="ar"] .sm-root * { font-family: 'Sahra Arabic', Tahoma, sans-serif !important; letter-spacing: normal !important; }
html[lang="ar"] h1, html[lang="ar"] h2, html[lang="ar"] h3 { line-height: 1.5 !important; }
html[lang="ar"] p { line-height: 1.8 !important; }
html[lang="ar"] .secondary-name { display: none; }
html[lang="ar"] [style*="text-align: left"] { text-align: right !important; }
html[lang="ar"] .sa-search { padding: 0 44px 0 16px; }
html[lang="ar"] .sm-search { padding: 0 40px 0 14px; }
html[lang="ar"] label > svg { left: auto !important; right: 14px !important; }
html[lang="ar"] aside[role="dialog"] { right: auto !important; left: 0 !important; animation-name: sahraSlideRtl !important; }
@keyframes sahraSlideRtl { from { transform: translateX(-100%); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) {
 html { scroll-behavior: auto; }
 *, *::before, *::after { animation: none !important; transition: none !important; }
}

.sa-card div[style*="margin-top: 16px"],
.sa-card div[style*="gap: 6px"] { flex-wrap: wrap; }

.menu-dish-price { margin: 8px 0 0; font-weight: 600; color: #A34E2A; }
.menu-portions { margin-top: 18px; }
.menu-portions > p { font-size: 13px; font-weight: 600; color: #4A4250; }
.menu-portions ul { margin: 8px 0 0; padding: 0; list-style: none; }
.menu-portions li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-top: 1px solid rgb(18 22 42 / .15); font-size: 14px; }
