/* Rounded corners trial for the guest site.
   One set of tokens, loaded last on every guest page.
   Buttons share one radius, cards and panels share one radius.
   Full-bleed hero media and the logo stay square.
   Remove the <link> to this file to go back to square corners. */

:root {
  --k-radius-btn: 12px;
  --k-radius-card: 16px;
  --k-radius-input: 12px;
  --k-radius-tag: 6px;
  --k-radius-check: 4px;
}

/* ---------- Guest pages (homepage, show page, events, info pages) ----------
   html:not(#k-round) adds one id of specificity so these beat the
   class-only "border-radius: 0 !important" rules in the page styles. */

/* Buttons and CTAs */
html:not(#k-round) body :is(
  .site-navbar-cta,
  .site-navbar-toggle,
  .launch-cta,
  .launch-menu-toggle,
  .hero-action,
  .event-book,
  .block-link,
  .btn,
  .btn-primary,
  .button,
  .chip,
  .laurels__more a,
  .skip-link
) {
  border-radius: var(--k-radius-btn) !important;
}

/* Menu panels: phone dropdown and desktop Shows dropdown */
html:not(#k-round) body :is(.site-navbar.is-menu-open .site-navbar-links, .site-navbar .site-nav-dropdown) {
  border-radius: var(--k-radius-card) !important;
}

/* Cards, tiles and boxed sections */
html:not(#k-round) body :is(
  .calendar-board,
  .photo-card,
  .visit-facts,
  .map-card,
  .guest-expect-card,
  .show-feature,
  .premonitions-photo-hit__card,
  .faq-list,
  .events-card,
  .events-photo,
  .info-card,
  .panel,
  .show-panel,
  .event-card,
  .menu-item
) {
  border-radius: var(--k-radius-card) !important;
  overflow: hidden;
}

/* Small images inside cards and rows */
html:not(#k-round) body :is(.gallery-strip img, .gallery-strip figure, .premonitions-director-photo) {
  border-radius: var(--k-radius-card) !important;
}

/* Small tags like Selling fast */
html:not(#k-round) body :is(.event-scarcity, [class*="scarcity"]:is(small, span)) {
  border-radius: var(--k-radius-tag) !important;
}

html:not(#k-round) body :is(.event-poster, .menu-item-image, .show-panel img, .gallery img) {
  border-radius: calc(var(--k-radius-card) - 6px) !important;
}

/* Form fields */
html:not(#k-round) body :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select,
  textarea
) {
  border-radius: var(--k-radius-input) !important;
}
/* Hero buttons sit flush in their row, so an outside focus ring gets
   clipped. Draw it just inside the rounded edge instead. */
html:not(#k-round) body .hero-action:focus-visible {
  outline-offset: -5px !important;
}

html:not(#k-round) body input[type="checkbox"] {
  border-radius: var(--k-radius-check) !important;
}

/* ---------- Ticket checkout (CSS only, no behavior change) ----------
   tickets-checkout.css squares everything with a universal rule that
   carries two ids of specificity, so this prefix carries three. */

html.tickets-flow body.prototype-page.prototype-page.prototype-page.prototype-page.prototype-page:not(#k-round-a):not(#k-round-b):not(#k-round-c) :is(
  button.prototype-option,
  .prototype-option,
  .prototype-guest-step,
  .prototype-heard-chip
) {
  border-radius: var(--k-radius-card) !important;
}

html.tickets-flow body.prototype-page.prototype-page.prototype-page.prototype-page.prototype-page:not(#k-round-a):not(#k-round-b):not(#k-round-c) :is(
  #continueBtn,
  #actionBackBtn,
  #sidebarDateContinue,
  .prototype-continue,
  .action-back,
  .prototype-people .prototype-option,
  .prototype-guest-chips .prototype-option,
  .prototype-heard-chip
) {
  border-radius: var(--k-radius-btn) !important;
}

html.tickets-flow body.prototype-page.prototype-page.prototype-page.prototype-page.prototype-page:not(#k-round-a):not(#k-round-b):not(#k-round-c) :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select,
  textarea,
  .prototype-payment-card-skeleton-field
) {
  border-radius: var(--k-radius-input) !important;
}

html.tickets-flow body.prototype-page.prototype-page.prototype-page.prototype-page.prototype-page:not(#k-round-a):not(#k-round-b):not(#k-round-c) input[type="checkbox"] {
  border-radius: var(--k-radius-check) !important;
}

html.tickets-flow body.prototype-page.prototype-page.prototype-page.prototype-page.prototype-page:not(#k-round-a):not(#k-round-b):not(#k-round-c) :is(.prototype-seat-scarcity, [class*="scarcity"]:is(small, span)) {
  border-radius: var(--k-radius-tag) !important;
}

/* Family cards already share .prototype-option with the seat tiers.
   Keep their compact quantity buttons at half the shared card radius. */
html.tickets-flow body.prototype-page.prototype-page.prototype-page.prototype-page.prototype-page:not(#k-round-a):not(#k-round-b):not(#k-round-c) #familyTicketControls .family-ticket-step {
  border-radius: calc(var(--k-radius-card) / 2) !important;
}

/* Card and wallet payment (CSS only, no behavior change).
   Square's style option sets the card box radius to 12px where the card
   form mounts. Square paints that border on .sq-card-iframe-container
   (and its ::before ring) in this page, so the global square lock in
   tickets-checkout.css would flatten it; these rules restore 12px on the
   container, its ring and the iframe inside it. No overflow clip on the mount: card errors print below the
   box in .sq-card-message. Apple Pay takes border-radius on its CSS
   button. Google Pay gets buttonRadius 12 from Square, and these rules
   keep the square lock off the button Google draws inside its host. */
html.tickets-flow body.prototype-page.prototype-page.prototype-page.prototype-page.prototype-page:not(#k-round-a):not(#k-round-b):not(#k-round-c) :is(
  #embeddedCheckout,
  #embeddedCheckout .sq-card-iframe-container,
  #embeddedCheckout .sq-card-component,
  #apple-pay-button,
  #google-pay-button,
  #google-pay-button button,
  #google-pay-button .gpay-button-fill,
  #google-pay-button .gpay-card-info-container-fill,
  #google-pay-button .gpay-card-info-container
) {
  border-radius: var(--k-radius-input) !important;
}

html.tickets-flow body.prototype-page.prototype-page.prototype-page.prototype-page.prototype-page:not(#k-round-a):not(#k-round-b):not(#k-round-c) #google-pay-button {
  overflow: hidden;
}

/* Square draws the focus and error ring on this ::before, and the square
   lock also covers ::before, so it needs its own rule (:is() cannot hold a
   pseudo-element). */
html.tickets-flow body.prototype-page.prototype-page.prototype-page.prototype-page.prototype-page:not(#k-round-a):not(#k-round-b):not(#k-round-c) #embeddedCheckout .sq-card-iframe-container::before {
  border-radius: var(--k-radius-input) !important;
}