/* ==========================================================================
   AG360 Eventin Ticket Form — Ag360 palette
   --------------------------------------------------------------------------
   The plugin ships its own colours (a lime accent on a dark teal ink), which
   read as a different site inside an Ag360 event page. Rather than fork the
   plugin, this remaps the custom properties it already exposes onto the
   theme's tokens, so it updates cleanly and inherits the design.

   Only colour, radius and type are remapped. Layout is the plugin's.
   Loaded after the plugin's own stylesheet; see inc/enqueue.php.
   ========================================================================== */

.ag360-etn {
  --ag360-ink:         var(--canopy);        /* deep green-black, the site's dark ground */
  --ag360-ink-soft:    var(--stone-dark);    /* secondary text that passes AA on paper   */
  --ag360-accent:      var(--ag-green-light);/* tertiary green: button fill on dark      */
  --ag360-accent-dark: var(--ag-forest);     /* secondary green: button fill on light    */
  --ag360-bone:        var(--bone);
  --ag360-paper:       var(--paper);
  --ag360-line:        var(--rule);
  --ag360-error:       #A93636;
  --ag360-success:     var(--ag-forest);

  /* The card is already inside .card.on-bone on the event page, so it drops
     its own frame rather than nesting two cards. */
  margin: 0;
  max-width: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  font-family: var(--font-body);
}

/* .card already carries the "Your Details" heading, so the plugin's own
   header would be a second title for the same panel. */
.card .ag360-etn__header {
  padding: 0 0 var(--s-4);
  color: inherit;
  background: none;
}

.card .ag360-etn__title,
.card .ag360-etn__header h2 {
  font-size: var(--t-h3);
  font-variation-settings: 'opsz' 20;
  font-weight: 500;
  color: inherit;
}

.card .ag360-etn__intro {
  font-size: var(--t-small);
  color: var(--text-muted);
}

.card .ag360-etn__form {
  padding: 0;
}

.card .ag360-etn__section {
  padding: var(--s-5) 0;
}

.card .ag360-etn__section-heading {
  margin-bottom: var(--s-4);
}

.card .ag360-etn__attendee {
  background: rgba(255, 255, 255, 0.36);
}

.card .ag360-etn__modal .ag360-etn__checkout {
  background: var(--bone);
}

/* Prices and seat counts are data: the site sets those in IBM Plex Mono. */
.ag360-etn__price,
.ag360-etn__total,
.ag360-etn__stock {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}

/* Match the site's pill buttons. */
.ag360-etn__submit,
.ag360-etn button[type="submit"] {
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.ag360-etn :focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}