/* Scoped support controls; preserve the site's existing layout and motion. */
:root { --boost-float-offset: clamp(16px, 2.2vw, 32px); }
.boost-float {
  position: fixed;
  bottom: calc(var(--boost-float-offset) + env(safe-area-inset-bottom, 0px));
  z-index: 90;
  width: 60px;
  height: 60px;
  display: grid;
  place-items: center;
  padding: 15px;
  border: 1px solid #d5aa53;
  border-radius: 50%;
  box-shadow: 0 6px 26px rgba(var(--boost-background-rgb), .28), inset 0 0 0 4px rgba(246, 222, 163, .08);
  cursor: pointer;
  text-decoration: none;
  transition: transform .22s ease, box-shadow .22s ease;
  -webkit-tap-highlight-color: transparent;
}
.boost-float--whatsapp { right: var(--boost-float-offset); background: linear-gradient(135deg, #f6dea3, #d5aa53 58%, #b58636); color: var(--boost-background); }
.boost-float--chat { left: var(--boost-float-offset); background: var(--boost-background); color: #f6dea3; }
.boost-float svg { display: block; width: 100%; height: 100%; }
.boost-float:hover { transform: translateY(-3px); box-shadow: 0 10px 32px rgba(var(--boost-background-rgb), .35); }
.boost-float:focus-visible, .boost-support-panel :is(a,button,[tabindex]):focus-visible { outline: 2px solid #d5aa53; outline-offset: 4px; }
.boost-float__label {
  position: absolute;
  bottom: calc(100% + 10px);
  padding: 4px 12px;
  border: 1px solid rgba(213, 170, 83, .5);
  border-radius: 8px;
  color: #fff;
  background: var(--boost-background);
  white-space: nowrap;
  font-size: 12px;
  line-height: 1.9;
  opacity: 0;
  pointer-events: none;
  transform: translateY(4px);
  transition: opacity .2s, transform .2s;
}
.boost-float--whatsapp .boost-float__label { right: 0; }
.boost-float--chat .boost-float__label { left: 0; }
.boost-float:is(:hover,:focus-visible) .boost-float__label { opacity: 1; transform: none; }
.boost-support-panel {
  position: fixed;
  inset: auto;
  bottom: calc(var(--boost-float-offset) + 76px + env(safe-area-inset-bottom, 0px));
  width: min(380px, calc(100% - 32px));
  max-width: none;
  max-height: calc(100dvh - 120px - env(safe-area-inset-bottom, 0px));
  margin: 0;
  padding: 0;
  border: 1px solid rgba(213, 170, 83, .55);
  border-radius: 22px;
  background: var(--boost-background);
  color: #fff;
  box-shadow: 0 18px 65px rgba(var(--boost-background-rgb), .45);
  direction: rtl;
  text-align: right;
  overflow: hidden;
}
.boost-support-panel--chat { left: var(--boost-float-offset); }
.boost-support-panel--whatsapp { right: var(--boost-float-offset); }
.boost-support-panel[open] { display: flex; flex-direction: column; animation: boost-support-in .2s ease-out; }
.boost-support-panel::backdrop { background: rgba(var(--boost-background-rgb), .32); }
.boost-support-panel__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 20px; border-bottom: 1px solid rgba(213, 170, 83, .24); flex-shrink: 0; }
html[lang="ar"] .boost-support-panel h2 { margin: 0; font-size: 17px; line-height: 1.8; color: #f6dea3; }
html[lang="ar"] .boost-support-panel p { margin: 0; font-size: 14px; line-height: 2; }
html[lang="ar"] .boost-support-panel__head p { margin-top: 3px; font-size: 11px; color: rgba(255,255,255,.75); }
.boost-support-close { width: 36px; height: 36px; padding: 0; flex: none; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; background: transparent; color: #fff; font: 26px/1 sans-serif; cursor: pointer; }
.boost-support-close:hover { background: rgba(255,255,255,.08); }
.boost-chat-log { min-height: 100px; height: min(310px, 38dvh); padding: 18px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #d5aa53 var(--boost-background); }
.boost-chat-message { padding: 13px 15px; margin-bottom: 14px; border-radius: 14px 3px 14px 14px; background: var(--boost-surface); overflow-wrap: anywhere; }
.boost-chat-message:last-child { margin-bottom: 0; }
.boost-chat-message--visitor { width: fit-content; max-width: 90%; margin-right: auto; background: #f6dea3; color: var(--boost-background); border-radius: 3px 14px 14px 14px; }
.boost-chat-message p + p { margin-top: 8px; }
.boost-chat-links { display: grid; gap: 8px; margin-top: 12px; }
.boost-chat-links :is(a,button), .boost-chat-actions button { padding: 9px 12px; border: 1px solid rgba(213,170,83,.55); border-radius: 10px; background: transparent; color: #f6dea3; text-align: right; text-decoration: none; font: inherit; font-size: 12px; line-height: 1.9; cursor: pointer; }
.boost-chat-links :is(a,button):hover, .boost-chat-actions button:hover { background: rgba(246,222,163,.1); border-color: #f6dea3; }
.boost-chat-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 14px 18px; border-top: 1px solid rgba(213,170,83,.2); flex-shrink: 0; }
.boost-chat-actions button { text-align: center; }
.boost-support-panel__foot { padding: 0 18px 16px; font-size: 10px; color: rgba(255,255,255,.72); flex-shrink: 0; }
.boost-support-panel__foot a { color: #f6dea3; text-underline-offset: 4px; }
.boost-whatsapp-message { padding: 22px; overflow-y: auto; }
.boost-support-cta { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 20px; padding: 12px 16px; border-radius: 12px; background: linear-gradient(120deg,#f6dea3,#d5aa53); color: var(--boost-background); text-decoration: none; font-size: 14px; }
/* Keep the video control beside the launcher even when the hero is taller than the viewport. */
.hero-with-film .hero-film-toggle { left: calc(var(--boost-float-offset) + 76px); right: auto; bottom: calc(var(--boost-float-offset) + 76px + env(safe-area-inset-bottom, 0px)); }
@keyframes boost-support-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@media (max-width: 479px) {
  .boost-float { width: 54px; height: 54px; padding: 13px; }
  .boost-support-panel { bottom: calc(82px + env(safe-area-inset-bottom, 0px)); max-height: calc(100dvh - 100px - env(safe-area-inset-bottom, 0px)); }
  .boost-support-panel__head { padding: 14px 16px; }
  .boost-chat-log { padding: 14px; }
  .boost-chat-actions { padding: 12px 14px; }
}
@media (max-height: 540px) {
  .boost-support-panel { bottom: 12px; max-height: calc(100dvh - 24px); }
  .boost-chat-log { min-height: 60px; }
  .boost-support-panel__head { padding-block: 10px; }
  .boost-chat-actions { padding-block: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .boost-float, .boost-float__label { transition: none; }
  .boost-support-panel[open] { animation: none; }
}
