/* Azera Pay: a fine travelling beam, paced independently on each card. */
html.az-portal-enhanced .az-beam-card {
  --az-beam-color: #1689eb;
  --az-beam-opacity: .94;
  --az-beam-glow: rgba(22, 137, 235, .62);
  transition: border-color .25s ease, box-shadow .25s ease;
}
html.az-portal-enhanced:is([data-az-theme="blue"], [data-az-theme="black"]) .az-beam-card {
  --az-beam-color: #28baff;
  --az-beam-opacity: 1;
  --az-beam-glow: rgba(40, 186, 255, .82);
}
html.az-portal-enhanced .az-beam-position { position: relative; }
html.az-portal-enhanced .az-card-beam {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  overflow: visible;
  pointer-events: none;
  user-select: none;
  z-index: 2;
  opacity: var(--az-beam-opacity);
  filter: drop-shadow(0 0 3px var(--az-beam-glow)) drop-shadow(0 0 8px color-mix(in srgb, var(--az-beam-glow) 55%, transparent));
}
html.az-portal-enhanced .az-card-beam rect {
  width: calc(100% - 1px);
  height: calc(100% - 1px);
  fill: none;
  stroke: var(--az-beam-color);
  stroke-width: 1.65;
  vector-effect: non-scaling-stroke;
  stroke-linecap: round;
  animation: az-card-orbit 9s linear infinite;
  animation-delay: var(--az-beam-delay, 0s);
  animation-play-state: paused;
}
html.az-portal-enhanced .az-card-beam .az-beam-trail { stroke-dasharray: 180 820; opacity: .3; }
html.az-portal-enhanced .az-card-beam .az-beam-mid { stroke-dasharray: 104 896; opacity: .58; }
html.az-portal-enhanced .az-card-beam .az-beam-head { stroke-dasharray: 34 966; opacity: 1; }
html.az-portal-enhanced .az-beam-visible > .az-card-beam rect { animation-play-state: running; }
html.az-portal-enhanced.az-motion-paused .az-card-beam rect { animation-play-state: paused; }
html.az-portal-enhanced .az-beam-card:hover {
  border-color: color-mix(in srgb, var(--az-beam-color) 36%, var(--az-stroke));
}
@keyframes az-card-orbit { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -1000; } }
@media (prefers-reduced-motion: reduce) {
  html.az-portal-enhanced .az-card-beam { display: none; }
  html.az-portal-enhanced .az-beam-card { transition: none; }
}

/* Campaign artwork is intentionally shown in a lower 4:1 frame on desktop.
   The image keeps its natural proportions; excess vertical canvas is cropped,
   never scaled non-uniformly. */
@media (min-width: 761px) {
  html.az-portal-enhanced .az-hero-carousel {
    aspect-ratio: 4 / 1;
    max-height: none !important;
    min-height: 0 !important;
  }
  html.az-portal-enhanced .az-hero-carousel .az-hero-slides,
  html.az-portal-enhanced .az-hero-carousel .az-hero-slide {
    position: absolute !important;
    inset: 0 !important;
    height: auto !important;
    min-height: 0 !important;
  }
  html.az-portal-enhanced .az-hero-carousel .az-hero-slide {
    transform: none !important;
  }
  html.az-portal-enhanced .az-hero-carousel .az-campaign-image {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
    object-position: center center;
  }
  /* This campaign carries a wordmark at the very top and its policy copy lower down.
     Preserve the supplied safety artwork in full instead of cropping either end. */
  html.az-portal-enhanced .az-hero-carousel [data-az-slide="2"] {
    background: #061a4a !important;
  }
  html.az-portal-enhanced .az-hero-carousel [data-az-slide="2"] .az-campaign-image {
    object-fit: contain !important;
    object-position: center center;
    background: #061a4a;
  }
}

/* The legacy page moves only the child-safety panel when it becomes active.
   Keep its visual controls in the same visible frame. */
html.az-portal-enhanced .az-hero-carousel.az-hero-frame-aligned .az-hero-arrow { transform: translateY(calc(-50% + var(--az-carousel-frame-offset))) !important; }
html.az-portal-enhanced .az-hero-carousel.az-hero-frame-aligned .az-hero-dots { transform: translate(-50%, var(--az-carousel-frame-offset)) !important; }
html.az-portal-enhanced .az-hero-collapse { position:absolute; top:10px; right:10px; z-index:6; display:grid; place-items:center; width:28px; height:28px; padding:0; border:1px solid #79b9ff70; border-radius:8px; background:#06182dcc; color:#fff; cursor:pointer; transition:background .16s ease,transform .16s ease; }
html.az-portal-enhanced .az-hero-collapse:hover { background:#1574d9; transform:translateY(-1px); }
html.az-portal-enhanced .az-hero-collapse svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; transition:transform .2s ease; }
html.az-portal-enhanced .az-hero-collapsed { min-height:48px !important; height:48px !important; aspect-ratio:auto !important; margin-bottom:18px; transition:height .22s ease, min-height .22s ease; }
html.az-portal-enhanced .az-hero-collapsed :is(.az-hero-slides,.az-hero-arrow,.az-hero-dots) { display:none !important; }
html.az-portal-enhanced .az-hero-collapsed .az-hero-collapse svg { transform:rotate(180deg); }

html.az-portal-enhanced .az-sidebar-community {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 38px;
  margin: 6px 4px 12px;
  padding: 9px 10px !important;
  border: 1px solid #28a95a !important;
  border-radius: 9px !important;
  background: linear-gradient(135deg, #24b65d, #138c44) !important;
  color: #fff !important;
  box-shadow: 0 8px 18px #128d4430;
  font-size: 11px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}
html.az-portal-enhanced .az-sidebar-community:hover { background: #15994a !important; color: #fff !important; }
html.az-portal-enhanced .az-sidebar-community svg { width: 17px; height: 17px; flex: none; }
html.az-portal-enhanced.az-sidebar-collapsed .az-sidebar-community { width: 42px; min-height: 42px; margin: 7px auto 12px; padding: 0 !important; }
html.az-portal-enhanced.az-sidebar-collapsed .az-sidebar-community span { display: none; }
html.az-portal-enhanced .az-med-balance .metric-icon { display: grid; place-items: center; border-color: #2a85e5 !important; background: linear-gradient(135deg, #143d73, #0f2647) !important; color: #65c7ff !important; }
html.az-portal-enhanced .az-med-balance .metric-icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }