/* Hand-written CSS escape hatch — CR-P003 T-C.
 *
 * Enqueued AFTER the built etick.css, so anything here wins.
 *
 * Use this for what is awkward to express as utility classes: keyframes,
 * third-party overrides, one-off rules. Editing this file needs no build step
 * and takes effect on the next page load. It is also where styles go if a
 * build cannot be run for some reason.
 *
 * Everything else belongs in the markup as Tailwind classes, which the build
 * picks up automatically.
 */

/* --- Modal chrome for etick-ui.js (CR-P003 T-D) -----------------------
   Replaces the backdrop and scroll-lock Flowbite used to provide. The modal
   panels themselves are styled by their own Tailwind classes in the markup,
   which the build already covers. */
.etick-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 40;
  background: rgba(15, 23, 42, 0.5);
}

body.etick-modal-open {
  overflow: hidden;
}

/* The button on the "we have nothing to show you" panel (CR-P078 T-B, Q-P078-3).

   DELIBERATELY NOT `.btn-primary`. That class, and `.btn` beside it, carry ZERO
   rules in any stylesheet this plugin enqueues - measured on the running site:
   computed background transparent, border-radius 0, padding 0, the only
   near-match in any loaded sheet being an unrelated `.btn-container`. So the
   three error panels' links had never been buttons, which is what Q-P078-3 put
   to the owner. Defining `.btn-primary` here would have been the tempting fix
   and the wrong one: ten call sites across frontend.php, boarding.php and
   view-trip.php would all have changed appearance at once, on screens nobody
   had reviewed. This class styles the three panels and nothing else.

   Colours come from the palette roles, never a literal. `accent`,
   `accent-second` and `accent-contrast` are three of THE NINE that both the
   theme and the plugin publish, so they resolve on every branch - unlike the
   meaning colours that caused CR-P077. Fallbacks are the shipped defaults, so a
   stock WordPress theme with no palette still gets a button rather than a
   transparent rectangle. */
.etick-panel-btn {
  display: inline-block;
  padding: 0.625rem 1.25rem;
  border-radius: 0.5rem;
  background-color: var(--etick-accent, #F88400);
  color: var(--etick-accent-contrast, #FFFFFF);
  font-weight: 600;
  line-height: 1.25;
  text-decoration: none;
  transition: background-color 0.15s ease-in-out;
}

.etick-panel-btn:hover,
.etick-panel-btn:focus {
  background-color: var(--etick-accent-second, #D86F00);
  color: var(--etick-accent-contrast, #FFFFFF);
  text-decoration: none;
}