/* ==========================================================
   Ánh Sáng Floating Share — Compact circular layout
   Strongly isolated from Elementor/theme button styling.
========================================================== */

.als-floating-share,
.als-floating-share *,
.als-floating-share *::before,
.als-floating-share *::after {
  box-sizing: border-box !important;
}

.als-floating-share {
  --als-primary: #ef476f;
  --als-secondary: #ffad57;
  --als-ink: #2c1a16;
  --als-shadow: rgba(43, 17, 12, .28);
  position: fixed !important;
  bottom: max(var(--als-bottom, 28px), env(safe-area-inset-bottom)) !important;
  z-index: 2147483000 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 12px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: inherit !important;
  line-height: 1 !important;
  isolation: isolate;
  -webkit-font-smoothing: antialiased;
}

.als-floating-share--right { right: max(18px, env(safe-area-inset-right)) !important; left: auto !important; }
.als-floating-share--left { left: max(18px, env(safe-area-inset-left)) !important; right: auto !important; align-items: flex-start !important; }

.als-floating-share--theme-coral { --als-primary: #ef476f; --als-secondary: #ff9f4b; }
.als-floating-share--theme-blue  { --als-primary: #2858db; --als-secondary: #21aeea; }
.als-floating-share--theme-teal  { --als-primary: #057f7b; --als-secondary: #31c5a9; }
.als-floating-share--theme-custom { --als-primary: var(--als-custom-primary, #ef476f); --als-secondary: #ffad57; }

/* Shared reset: protects the control from global Elementor/theme button rules. */
.als-floating-share .als-floating-share__trigger,
.als-floating-share .als-floating-share__item {
  -webkit-appearance: none !important;
  appearance: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  font: inherit !important;
  font-style: normal !important;
  letter-spacing: normal !important;
  text-decoration: none !important;
  text-transform: none !important;
  cursor: pointer !important;
  -webkit-tap-highlight-color: transparent;
}

/* Main fixed share circle. */
.als-floating-share .als-floating-share__trigger {
  position: relative !important;
  isolation: isolate;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 60px !important;
  width: 60px !important;
  height: 60px !important;
  min-width: 60px !important;
  min-height: 60px !important;
  max-width: 60px !important;
  max-height: 60px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 4px solid #fff !important;
  border-radius: 50% !important;
  color: #fff !important;
  background: linear-gradient(135deg, var(--als-primary), var(--als-secondary)) !important;
  box-shadow: 0 14px 30px var(--als-shadow), 0 3px 8px rgba(0,0,0,.18), inset 0 1px 1px rgba(255,255,255,.55), inset 0 -8px 15px rgba(93, 22, 20, .15) !important;
  line-height: 1 !important;
  transform: none !important;
  transition: transform .24s cubic-bezier(.2,.85,.25,1.15), box-shadow .24s ease, filter .24s ease !important;
}

.als-floating-share .als-floating-share__trigger::before {
  content: "" !important;
  position: absolute !important;
  inset: 4px !important;
  z-index: -1 !important;
  border: 1px solid rgba(255,255,255,.45) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
}

.als-floating-share .als-floating-share__trigger::after {
  content: "" !important;
  position: absolute !important;
  top: 9px !important;
  left: 12px !important;
  width: 28px !important;
  height: 10px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.24) !important;
  transform: rotate(-18deg) !important;
  pointer-events: none !important;
}

.als-floating-share .als-floating-share__trigger:hover {
  transform: translateY(-3px) scale(1.04) !important;
  filter: saturate(1.08) !important;
  box-shadow: 0 18px 35px var(--als-shadow), 0 3px 8px rgba(0,0,0,.16), inset 0 1px 1px rgba(255,255,255,.55), inset 0 -8px 15px rgba(93, 22, 20, .15) !important;
}

.als-floating-share.is-open .als-floating-share__trigger { transform: scale(.96) !important; }

.als-floating-share .als-floating-share__pulse {
  position: absolute !important;
  z-index: -2 !important;
  inset: -9px !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  border: 2px solid rgba(255,255,255,.62) !important;
  border-radius: 50% !important;
  animation: als-float-pulse 2.5s ease-out infinite !important;
  pointer-events: none !important;
}

@keyframes als-float-pulse {
  0%, 28% { transform: scale(.88); opacity: .72; }
  70%, 100% { transform: scale(1.25); opacity: 0; }
}

.als-floating-share .als-floating-share__trigger-icon {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  place-items: center !important;
  width: 25px !important;
  height: 25px !important;
  min-width: 25px !important;
  min-height: 25px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  transition: opacity .18s ease, transform .22s ease !important;
}

.als-floating-share .als-floating-share__trigger-icon svg,
.als-floating-share .als-floating-share__item-icon svg {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  fill: currentColor !important;
}

.als-floating-share .als-floating-share__trigger-icon--close {
  position: absolute !important;
  opacity: 0 !important;
  transform: rotate(-45deg) scale(.7) !important;
}

.als-floating-share.is-open .als-floating-share__trigger-icon--share { opacity: 0 !important; transform: rotate(45deg) scale(.7) !important; }
.als-floating-share.is-open .als-floating-share__trigger-icon--close { opacity: 1 !important; transform: rotate(0) scale(1) !important; }

.als-floating-share .als-floating-share__tooltip {
  position: absolute !important;
  top: 50% !important;
  right: calc(100% + 11px) !important;
  left: auto !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 8px 11px !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: rgba(35, 19, 15, .92) !important;
  box-shadow: 0 7px 18px rgba(0,0,0,.18) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate(5px, -50%) !important;
  transition: opacity .18s ease, transform .18s ease !important;
}

.als-floating-share--left .als-floating-share__tooltip { right: auto !important; left: calc(100% + 11px) !important; transform: translate(-5px, -50%) !important; }
.als-floating-share .als-floating-share__trigger:hover .als-floating-share__tooltip,
.als-floating-share .als-floating-share__trigger:focus-visible .als-floating-share__tooltip { opacity: 1 !important; transform: translate(0, -50%) !important; }
.als-floating-share.is-open .als-floating-share__tooltip { opacity: 0 !important; }

/* Compact popup: individual pill options with small circular icons. */
.als-floating-share .als-floating-share__menu {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 7px !important;
  width: 218px !important;
  min-width: 218px !important;
  max-width: 218px !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--als-ink) !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  transform-origin: bottom right !important;
  animation: als-float-menu-in .22s cubic-bezier(.2,.75,.22,1.08) both !important;
}

.als-floating-share--left .als-floating-share__menu { transform-origin: bottom left !important; }
.als-floating-share .als-floating-share__menu[hidden] { display: none !important; }

@keyframes als-float-menu-in {
  from { opacity: 0; transform: translateY(10px) scale(.93); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

.als-floating-share .als-floating-share__menu-heading { display: none !important; }

.als-floating-share .als-floating-share__item {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  flex: 0 0 46px !important;
  width: 218px !important;
  height: 46px !important;
  min-width: 218px !important;
  min-height: 46px !important;
  max-width: 218px !important;
  max-height: 46px !important;
  margin: 0 !important;
  padding: 5px 14px 5px 6px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.93) !important;
  border-radius: 999px !important;
  color: var(--als-ink) !important;
  background: rgba(255, 253, 250, .98) !important;
  box-shadow: 0 9px 20px rgba(31, 16, 10, .22), 0 1px 0 rgba(255,255,255,.9) inset !important;
  text-align: left !important;
  white-space: nowrap !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

.als-floating-share .als-floating-share__item:hover {
  transform: translateX(-3px) !important;
  filter: brightness(1.015) !important;
  box-shadow: 0 12px 25px rgba(31, 16, 10, .27), 0 1px 0 rgba(255,255,255,.9) inset !important;
}
.als-floating-share--left .als-floating-share__item:hover { transform: translateX(3px) !important; }

.als-floating-share .als-floating-share__item-icon {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 34px !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  max-width: 34px !important;
  max-height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 50% !important;
  color: #fff !important;
  box-shadow: 0 3px 8px rgba(25, 12, 10, .18), inset 0 1px 1px rgba(255,255,255,.4) !important;
}

.als-floating-share .als-floating-share__item-icon svg {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
}

.als-floating-share .als-floating-share__item--facebook .als-floating-share__item-icon { background: linear-gradient(135deg, #438af8, #1554c8) !important; }
.als-floating-share .als-floating-share__item--messenger .als-floating-share__item-icon { background: linear-gradient(135deg, #b559fb, #1676f2) !important; }
.als-floating-share .als-floating-share__item--copy .als-floating-share__item-icon { background: linear-gradient(135deg, #ac7b5f, #654638) !important; }

.als-floating-share .als-floating-share__item-label {
  display: block !important;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 154px !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: inherit !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

.als-floating-share .als-floating-share__item-arrow { display: none !important; }

.als-floating-share .als-floating-share__toast {
  position: absolute !important;
  right: 0 !important;
  bottom: calc(100% + 15px) !important;
  left: auto !important;
  display: block !important;
  width: max-content !important;
  max-width: min(280px, calc(100vw - 40px)) !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 10px 13px !important;
  border: 0 !important;
  border-radius: 12px !important;
  color: #fff !important;
  background: rgba(35, 24, 16, .96) !important;
  box-shadow: 0 9px 22px rgba(0,0,0,.18) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(8px) !important;
  transition: opacity .2s ease, transform .2s ease !important;
}
.als-floating-share--left .als-floating-share__toast { right: auto !important; left: 0 !important; }
.als-floating-share .als-floating-share__toast.is-visible { opacity: 1 !important; transform: translateY(0) !important; }

.als-floating-share .als-floating-share__trigger:focus-visible,
.als-floating-share .als-floating-share__item:focus-visible { outline: 3px solid #fff !important; outline-offset: 4px !important; }

@media (max-width: 782px) {
  .als-floating-share { gap: 10px !important; }
  .als-floating-share--right { right: max(14px, env(safe-area-inset-right)) !important; }
  .als-floating-share--left { left: max(14px, env(safe-area-inset-left)) !important; }
  .als-floating-share .als-floating-share__trigger { width: 56px !important; height: 56px !important; min-width: 56px !important; min-height: 56px !important; max-width: 56px !important; max-height: 56px !important; }
  .als-floating-share .als-floating-share__menu,
  .als-floating-share .als-floating-share__item { width: 206px !important; min-width: 206px !important; max-width: 206px !important; }
  .als-floating-share .als-floating-share__item { height: 44px !important; min-height: 44px !important; max-height: 44px !important; }
  .als-floating-share .als-floating-share__tooltip { display: none !important; }
}

@media (max-width: 390px) {
  .als-floating-share .als-floating-share__menu,
  .als-floating-share .als-floating-share__item { width: 190px !important; min-width: 190px !important; max-width: 190px !important; }
  .als-floating-share .als-floating-share__item-label { max-width: 136px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .als-floating-share *,
  .als-floating-share *::before,
  .als-floating-share *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}