/* Compact, persistent controls for the bilingual studio website. */
body.studio-home > main { padding-top: var(--yamar-scroll-offset,84px); }
.site-utilities {
  position: fixed; right: max(18px,env(safe-area-inset-right)); bottom: max(18px,env(safe-area-inset-bottom)); left: auto;
  z-index: 950; display: flex; align-items: center; gap: 4px; width: max-content; max-width: calc(100vw - 24px);
  padding: 6px; border: 1px solid #d7cfbf; border-radius: 32px; background: #fffdf8f5; color: #26382e;
  box-shadow: 0 6px 24px #17271d1a; direction: ltr; isolation: isolate;
}
.site-utilities .language-switch { position: static; display: flex; gap: 0; min-height: 0; margin: 0; padding: 0 5px 0 0; border-right: 1px solid #ded6c8; background: none; color: inherit; z-index: auto; }
.site-utilities .language-switch a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 38px; padding: 0 7px; border: 0; border-radius: 22px; color: #576157; font: 400 14px/1.4 Arial,sans-serif; }
.site-utilities .language-switch a[lang="ar"] { font-family: 'Noto Sans Arabic',Tahoma,Arial,sans-serif; }
.site-utilities .language-switch a[aria-current="true"] { background: #ece3d2; color: #26382e; }
.utility-action,body[data-yamar-page] .site-utilities .motion-toggle {
  position: relative; inset: auto; display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 44px; width: 44px; inline-size: 44px; max-inline-size: none; height: 44px; min-height: 44px;
  padding: 0; margin: 0; border: 0; border-radius: 50%; background: transparent; color: #34483c; box-shadow: none;
  cursor: pointer; text-decoration: none; line-height: 1; transition: background .18s ease,color .18s ease;
}
.utility-action svg { display: block; width: 22px; height: 22px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.utility-action--whatsapp { color: #24613d; }
.utility-action--ammar { background: #ece3d2; color: #614c2c; }
.utility-action:hover,body[data-yamar-page] .site-utilities .motion-toggle:hover { background: #e9eee7; color: #1d3727; }
body[data-yamar-page] .site-utilities .motion-toggle { font-size: 0; }
body[data-yamar-page] .site-utilities .motion-toggle::before { content: 'Ⅱ'; font: 400 19px/1 Arial,sans-serif; }
body[data-yamar-page] .site-utilities .motion-toggle[aria-pressed="false"]::before { content: '▷'; }
.site-utilities :is(a,button):focus-visible { outline: 2px solid #7c663e; outline-offset: 2px; }
.utility-action::after { content: attr(aria-label); position: absolute; bottom: calc(100% + 16px); right: 0; width: max-content; max-width: 210px; padding: 8px 12px; border: 1px solid #ded6c8; border-radius: 8px; background: #fffdf8; color: #26382e; font: 400 14px/1.5 Arial,sans-serif; pointer-events: none; opacity: 0; }
.utility-action:focus-visible::after { opacity: 1; }
@media(hover:hover) { .utility-action:hover::after { opacity: 1; } }
.utility-panel {
  position: fixed; inset: auto; right: max(18px,env(safe-area-inset-right)); bottom: calc(max(18px,env(safe-area-inset-bottom)) + 70px);
  width: min(340px,calc(100vw - 24px)); max-height: calc(100svh - 110px); overflow-y: auto;
  margin: 0; padding: 24px; border: 1px solid #d7cfbf; border-radius: 16px; background: #fffdf8; color: #26382e;
  box-shadow: 0 12px 42px #17271d26; font: 400 15px/1.7 var(--font-body,Arial,sans-serif);
}
.utility-panel::backdrop { background: transparent; }
.utility-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 8px; }
.utility-panel-heading h2 { margin: 0; font: 400 23px/1.4 var(--font-body,Arial,sans-serif); color: inherit; letter-spacing: 0; text-transform: none; }
.utility-panel-close { display: inline-flex; align-items: center; justify-content: center; width: 36px; min-height: 36px; border: 0; border-radius: 50%; background: #eee9df; color: #34483c; font: 400 24px/1 Arial,sans-serif; cursor: pointer; }
.utility-panel p { margin: 0 0 12px; color: #5a6359; font-size: 15px; line-height: 1.7; }
.utility-panel a { display: inline-flex; min-height: 44px; align-items: center; color: #24613d; text-decoration: underline; text-underline-offset: 4px; font-size: 15px; }
/* A lighter, smaller close to the page, with room for the fixed control bar. */
body[data-yamar-page]:is(.studio-home,.yamar-editorial) > :is(#footer,.site-footer,.footer) { min-height: 0; padding: 0 0 74px; border-top: 1px solid #d7cfbf; background: #f2eee6; color: #34483c; }
body[data-yamar-page] > footer :is(.footer-top,.footer-main) { padding-block: 24px 20px; }
body[data-yamar-page] > footer :is(.footer-grid,.footer-main) { display: grid; grid-template-columns: minmax(180px,1.2fr) minmax(170px,1fr) minmax(260px,1.4fr) minmax(170px,1fr); gap: 28px; }
body[data-yamar-page] > footer :is(.footer-grid,.footer-main) > * { min-width: 0; }
body[data-yamar-page] > .site-footer .footer-main { grid-template-columns: minmax(180px,1.2fr) minmax(260px,1.4fr) minmax(160px,.9fr) minmax(180px,1fr); }
body[data-yamar-page] > footer :is(.footer-links,.footer-bottom-links) { gap: 2px 16px; }
body[data-yamar-page] > footer .footer-links { display: grid; }
body[data-yamar-page] > #footer .footer-grid > :nth-child(3) .footer-links,
body[data-yamar-page] > .site-footer .footer-main > :nth-child(2) .footer-links { grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 16px; }
body[data-yamar-page] > footer :is(.footer-brand-desc,.footer-brand p,.footer-link,.footer-links a,.footer-copy,.footer-bottom,.footer-bottom-link) { color: #546054; font-size: 14px; letter-spacing: 0; line-height: 1.65; }
body[data-yamar-page] > #footer .footer-brand-desc { color: #546054; }
body[data-yamar-page] > footer :is(.footer-link,.footer-links a) { min-height: 32px; min-width: 0; overflow-wrap: anywhere; }
body[data-yamar-page] > footer :is(.footer-title,.footer-col-title) { margin-bottom: 9px; color: #34483c; font-size: 14px; letter-spacing: 0; text-transform: none; }
body[data-yamar-page] > footer a:hover { color: #1d3c29; text-decoration: underline; text-underline-offset: 4px; }
body[data-yamar-page] > footer .footer-brand-name { width: auto; height: auto; margin-bottom: 8px; background: none; color: #34483c; font: 400 23px/1.4 Georgia,serif; letter-spacing: 0; }
body[data-yamar-page] > footer .footer-brand::before { display: none; }
body[data-yamar-page] > footer .footer-brand > .brand-name { display: block; color: #34483c; font: 400 23px/1.4 Georgia,serif; letter-spacing: 0; }
body[data-yamar-page] > footer .footer-brand p { margin-top: 8px; }
body[data-yamar-page] > footer .footer-bottom { padding-block: 14px; border-top: 1px solid #d7cfbf; gap: 8px 20px; }
body[data-yamar-page] > footer .replay-intro { min-height: 36px; margin-top: 12px; color: #6b583a; border-color: #b6a381; font-size: 14px; }
body[data-yamar-page] > .footer > .container:last-child { padding-block: 18px 0; gap: 12px 24px; }
body[data-yamar-page] > .footer .footer-links { display: flex; flex-wrap: wrap; }
@media(max-width:1100px) {
  body[data-yamar-page] > footer :is(.footer-grid,.footer-main),body[data-yamar-page] > .site-footer .footer-main { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px 32px; }
}
@media(max-width:700px) {
  .site-utilities { right: max(12px,env(safe-area-inset-right)); bottom: max(12px,env(safe-area-inset-bottom)); gap: 2px; padding: 5px; }
  .site-utilities .language-switch { padding-right: 3px; }
  .site-utilities .language-switch a { min-width: 35px; padding-inline: 6px; }
  .utility-panel { right: 12px; padding: 20px; }
  body[data-yamar-page] > footer :is(.footer-grid,.footer-main) { gap: 20px; }
  body[data-yamar-page] > footer :is(.footer-grid,.footer-main) > :first-child { grid-column: 1 / -1; }
  body[data-yamar-page] > footer :is(.footer-brand-desc,.footer-brand p) { max-width: 38ch; }
  body[data-yamar-page] > #footer .footer-grid > :nth-child(3) .footer-links,
  body[data-yamar-page] > .site-footer .footer-main > :nth-child(2) .footer-links { grid-template-columns: minmax(0,1fr); }
  body[data-yamar-page] > footer .footer-bottom { align-items: start; }
}
