/**
 * Azure Premium action-prompt presentation.
 *
 * This layer recolours the existing universal mobile CTA and the existing
 * treatment-aware promotional banner/pill. It does not change their markup,
 * destinations, analytics, timing, reveal logic, dismissal or dimensions.
 */

/*
 * Universal mobile CTA: a warm reading surface separates the persistent
 * action bar from the dark premium canvas. The primary booking action remains
 * the brand accent, now with dark text for accessible small-label contrast.
 */
@media (max-width: 1024px) {
  html body.az-premium-site.az-premium-sandbox-visuals #azure-cta {
    background: linear-gradient(180deg, #fbf8fc 0%, var(--az-bg-reading-alt) 100%) !important;
    color: var(--az-text-reading) !important;
    border-top: 0 !important;
    box-shadow: inset 0 2px 0 var(--az-brand-accent), 0 -14px 36px rgba(3, 2, 6, 0.34), 0 -1px 0 rgba(248, 244, 251, 0.86) !important;
  }

  html body.az-premium-site.az-premium-sandbox-visuals
    #azure-cta .azure-cta__progress {
    background: rgba(33, 27, 43, 0.14) !important;
  }

  html body.az-premium-site.az-premium-sandbox-visuals
    #azure-cta .azure-cta__progress i {
    background: var(--az-brand-accent-deep-hover) !important;
  }

  html body.az-premium-site.az-premium-sandbox-visuals
    #azure-cta .azure-cta__btn,
  html body.az-premium-site.az-premium-sandbox-visuals
    #azure-cta .azure-cta__btn:visited,
  html body.az-premium-site.az-premium-sandbox-visuals
    #azure-cta .azure-cta__btn:hover,
  html body.az-premium-site.az-premium-sandbox-visuals
    #azure-cta .azure-cta__btn:focus,
  html body.az-premium-site.az-premium-sandbox-visuals
    #azure-cta .azure-cta__label {
    color: var(--az-text-reading) !important;
  }

  html body.az-premium-site.az-premium-sandbox-visuals
    #azure-cta .azure-cta__btn:not(.is-primary):hover,
  html body.az-premium-site.az-premium-sandbox-visuals
    #azure-cta .azure-cta__btn:not(.is-primary):focus {
    background: rgba(125, 53, 127, 0.09) !important;
  }

  html body.az-premium-site.az-premium-sandbox-visuals
    #azure-cta .azure-cta__btn + .azure-cta__btn::before {
    background: rgba(33, 27, 43, 0.16) !important;
  }

  html body.az-premium-site.az-premium-sandbox-visuals
    #azure-cta .azure-cta__btn.is-primary {
    background: linear-gradient(145deg, var(--az-brand-accent-hover), var(--az-brand-accent)) !important;
    color: var(--az-bg-canvas) !important;
  }

  html body.az-premium-site.az-premium-sandbox-visuals
    #azure-cta .azure-cta__btn.is-primary .azure-cta__label {
    color: var(--az-bg-canvas) !important;
  }

  html body.az-premium-site.az-premium-sandbox-visuals
    #azure-cta .azure-cta__close {
    color: var(--az-text-reading-muted) !important;
    border-left: 1px solid rgba(33, 27, 43, 0.12) !important;
  }

  html body.az-premium-site.az-premium-sandbox-visuals
    #azure-cta :is(.azure-cta__btn, .azure-cta__close):focus-visible {
    outline: 3px solid var(--az-focus-light) !important;
    outline-offset: -4px !important;
    box-shadow: none !important;
  }
}

/* Desktop promotional banner and the expanded mobile card. */
html body.az-premium-site.az-premium-sandbox-visuals .azure-promo,
html body.az-premium-site.az-premium-sandbox-visuals
  .azure-promo.azure-expanded {
  background: linear-gradient(155deg, #fbf8fc 0%, var(--az-bg-reading-alt) 100%);
  color: var(--az-text-reading);
  border-color: rgba(125, 53, 127, 0.34);
  box-shadow: 0 20px 50px rgba(3, 2, 6, 0.34), inset 4px 0 0 var(--az-brand-accent);
}

html body.az-premium-site.az-premium-sandbox-visuals
  .azure-promo h3 {
  color: var(--az-text-reading);
}

html body.az-premium-site.az-premium-sandbox-visuals
  .azure-promo p {
  color: var(--az-text-reading-muted);
}

html body.az-premium-site.az-premium-sandbox-visuals
  .azure-promo .azure-promo-close {
  background: transparent !important;
  color: var(--az-brand-accent-deep-hover) !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.az-premium-site.az-premium-sandbox-visuals
  .azure-promo a,
html body.az-premium-site.az-premium-sandbox-visuals
  .azure-promo a:visited {
  background: linear-gradient(145deg, var(--az-brand-accent-hover), var(--az-brand-accent));
  color: var(--az-bg-canvas);
  border: 1px solid rgba(125, 53, 127, 0.36);
  box-shadow: 0 8px 20px rgba(125, 53, 127, 0.18);
}

html body.az-premium-site.az-premium-sandbox-visuals
  .azure-promo a:hover,
html body.az-premium-site.az-premium-sandbox-visuals
  .azure-promo a:focus {
  background: var(--az-brand-accent-hover);
  color: var(--az-bg-canvas);
}

html body.az-premium-site.az-premium-sandbox-visuals
  .azure-promo :is(a, button, .azure-promo-pill):focus-visible {
  outline: 3px solid var(--az-focus-light);
  outline-offset: 3px;
  box-shadow: var(--az-shadow-focus-light);
}

/*
 * On phones the collapsed promo must read as a separate action, not another
 * dark-purple page chip. The rose surface and dark copy provide that contrast.
 */
@media (max-width: 768px) {
  html body.az-premium-site.az-premium-sandbox-visuals
    .azure-promo:not(.azure-expanded) {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
  }

  html body.az-premium-site.az-premium-sandbox-visuals
    .azure-promo-pill {
    background: linear-gradient(145deg, #edb1e7 0%, var(--az-brand-accent-hover) 100%);
    color: var(--az-bg-canvas);
    border: 1px solid rgba(248, 244, 251, 0.82);
    box-shadow: 0 12px 30px rgba(3, 2, 6, 0.4), 0 0 0 1px rgba(18, 15, 26, 0.3);
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.az-premium-site.az-premium-sandbox-visuals
    :is(#azure-cta, .azure-promo) {
    transition: none !important;
  }
}

@media print {
  html body.az-premium-site.az-premium-sandbox-visuals
    :is(#azure-cta, .azure-promo) {
    display: none !important;
  }
}