/* QCB UI component contract, RC5.
 * Only reusable controls live here. Features own layout and exceptional controls.
 * All editable text controls use neutral white. No global :root, no priority flags.
 * Surface boundaries deliberately outrank generic WordPress/Elementor selectors.
 */
:is(#qcb-app, .campfire-member-portal-login, .qcb-overlay, .campfire-admin-wrap) {
  --qcb-ui-primary: var(--qcb-primary, #3e5f4a);
  --qcb-ui-ivory: #fff;
  --qcb-ui-ink: #293b31;
  --qcb-ui-border: var(--qcb-app-input-border, #cdd8d1);
  --qcb-ui-focus: #7ba389;
  --qcb-ui-danger: #a73535;
  --qcb-ui-space: var(--qcb-ui-density, 1);
  /* Canonical entry-text size on all QCB surfaces, independently of the host page font. */
  --qcb-ui-input-text-size: 14px;
}

/* A portal root has one stable namespace. Controls are applied within it only. */
:is(#qcb-app#qcb-app, .campfire-member-portal-login.campfire-member-portal-login,
    .qcb-overlay.qcb-overlay, .campfire-admin-wrap.campfire-admin-wrap)
  :is(input:where(:not([type="checkbox"], [type="radio"], [type="hidden"], [type="file"], [type="range"], [type="color"], [type="submit"], [type="button"])),
      select, textarea) {
  background: var(--qcb-ui-ivory);
  color: var(--qcb-ui-ink);
  border: 1px solid var(--qcb-ui-border);
  border-radius: var(--qcb-control-radius, 10px);
  font-family: var(--qcb-ui-body-font, "Work Sans", Arial, sans-serif);
  font-size: var(--qcb-ui-input-text-size);
  line-height: 1.3;
  box-shadow: none;
  opacity: 1;
}
:is(#qcb-app#qcb-app, .campfire-member-portal-login.campfire-member-portal-login,
    .qcb-overlay.qcb-overlay, .campfire-admin-wrap.campfire-admin-wrap)
  :is(input, textarea)::placeholder { color: var(--qcb-app-muted, #7a8279); opacity: 1; }
:is(#qcb-app#qcb-app, .campfire-member-portal-login.campfire-member-portal-login,
    .qcb-overlay.qcb-overlay, .campfire-admin-wrap.campfire-admin-wrap)
  :is(input, textarea, select):focus-visible {
  border-color: var(--qcb-ui-primary);
  outline: 3px solid var(--qcb-ui-focus);
  outline-offset: 2px;
}
:is(#qcb-app#qcb-app, .campfire-member-portal-login.campfire-member-portal-login,
    .qcb-overlay.qcb-overlay, .campfire-admin-wrap.campfire-admin-wrap)
  :is(input, textarea, select):disabled {
  background: var(--qcb-app-tile, #f4f7f5);
  color: var(--qcb-app-muted, #52665a);
  opacity: .75;
  cursor: not-allowed;
}
:is(#qcb-app#qcb-app, .campfire-member-portal-login.campfire-member-portal-login,
    .qcb-overlay.qcb-overlay, .campfire-admin-wrap.campfire-admin-wrap)
  :is(input, textarea, select)[aria-invalid="true"] { border-color: var(--qcb-ui-danger); }

/* Member and committee action buttons. Icon-only/crop/calendar controls are distinct. */
:is(#qcb-app#qcb-app, .campfire-member-portal-login.campfire-member-portal-login, .qcb-overlay.qcb-overlay)
  :is(.campfire-portal-button, .campfire-table-action, .campfire-primary-link, .qcb-ui-button,
      .qcb-button, .qcb-my-event-action, .campfire-home-card-button, .qcb-benefit-action, .qcb-pet-add-btn) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: calc(40px * var(--qcb-ui-space, 1));
  padding: calc(9px * var(--qcb-ui-space, 1)) calc(14px * var(--qcb-ui-space, 1));
  font-family: var(--qcb-ui-body-font, "Work Sans", Arial, sans-serif);
  font-size: 14px;
  font-weight: 650;
  line-height: 1.3;
  border-radius: var(--qcb-control-radius, 10px);
  text-align: center;
  text-decoration: none;
  white-space: normal;
  opacity: 1;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
:is(#qcb-app#qcb-app, .campfire-member-portal-login.campfire-member-portal-login, .qcb-overlay.qcb-overlay)
  :is(.campfire-portal-button:not(.is-secondary):not(.is-outline):not(.is-danger), .campfire-primary-link,
      .qcb-ui-primary, .qcb-button, .qcb-my-event-action, .campfire-home-card-button,
      .qcb-benefit-action, .qcb-pet-add-btn):not(:disabled):not([aria-disabled="true"]) {
  background: var(--qcb-ui-primary);
  border: 1px solid var(--qcb-ui-primary);
  color: var(--qcb-on-primary, #fff);
  -webkit-text-fill-color: var(--qcb-on-primary, #fff);
}
:is(#qcb-app#qcb-app, .campfire-member-portal-login.campfire-member-portal-login, .qcb-overlay.qcb-overlay)
  :is(.campfire-portal-button:not(.is-secondary):not(.is-outline):not(.is-danger), .campfire-primary-link,
      .qcb-ui-primary, .qcb-button, .qcb-my-event-action, .campfire-home-card-button,
      .qcb-benefit-action, .qcb-pet-add-btn):hover:not(:disabled) {
  filter: brightness(.92);
  color: var(--qcb-on-primary, #fff);
  -webkit-text-fill-color: var(--qcb-on-primary, #fff);
}
:is(#qcb-app#qcb-app, .campfire-member-portal-login.campfire-member-portal-login, .qcb-overlay.qcb-overlay)
  :is(.campfire-portal-button.is-secondary, .campfire-portal-button.is-outline, .campfire-table-action, .qcb-ui-secondary) {
  background: var(--qcb-ui-ivory);
  border: 1px solid var(--qcb-ui-primary);
  color: var(--qcb-ui-primary);
  -webkit-text-fill-color: var(--qcb-ui-primary);
}
:is(#qcb-app#qcb-app, .campfire-member-portal-login.campfire-member-portal-login, .qcb-overlay.qcb-overlay)
  :is(.campfire-portal-button.is-secondary, .campfire-portal-button.is-outline, .campfire-table-action, .qcb-ui-secondary):hover:not(:disabled) {
  background: #edf1ed;
  color: var(--qcb-ui-primary);
  -webkit-text-fill-color: var(--qcb-ui-primary);
}
:is(#qcb-app#qcb-app, .campfire-member-portal-login.campfire-member-portal-login, .qcb-overlay.qcb-overlay)
  :is(.campfire-portal-button, .campfire-table-action, .campfire-primary-link, .qcb-ui-button,
      .qcb-button, .qcb-my-event-action, .campfire-home-card-button,
      .qcb-benefit-action, .qcb-pet-add-btn):is(:disabled, [aria-disabled="true"], .is-disabled) {
  cursor: not-allowed;
  opacity: .58;
}
:is(#qcb-app#qcb-app, .campfire-member-portal-login.campfire-member-portal-login, .qcb-overlay.qcb-overlay)
  :is(.campfire-portal-button, .campfire-table-action, .campfire-primary-link, .qcb-ui-button,
      .qcb-button, .qcb-my-event-action, .campfire-home-card-button,
      .qcb-benefit-action, .qcb-pet-add-btn):focus-visible {
  outline: 3px solid var(--qcb-ui-focus);
  outline-offset: 3px;
}

/* Shared typography follows controlled Appearance settings. */
:is(#qcb-app, .campfire-member-portal-login) :is(h1, h2, h3) {
  font-family: var(--qcb-ui-heading-font, "League Spartan", "Work Sans", Arial, sans-serif);
}
:is(#qcb-app, .campfire-member-portal-login) :is(p, label, input, button, select, textarea) {
  font-family: var(--qcb-ui-body-font, "Work Sans", Arial, sans-serif);
}

/* Density controls spacing only. It never reduces entry text or touch readability. */
#qcb-app :is(.campfire-portal-card, .campfire-home-card, .campfire-benefit-card) {
  --qcb-density-card-pad: calc(20px * var(--qcb-ui-density, 1));
}
#qcb-app .campfire-portal-card { padding: var(--qcb-density-card-pad); }
#qcb-app :is(.campfire-form-row, .campfire-portal-form, .campfire-dashboard-cards),
.qcb-overlay :is(.campfire-form-row, .campfire-portal-form) {
  row-gap: calc(14px * var(--qcb-ui-density, 1));
}
#qcb-app :is(.campfire-member-register-table, .campfire-payment-table) :is(th, td) {
  padding-block: calc(12px * var(--qcb-ui-density, 1));
}
#qcb-app :is(.campfire-portal-sidebar, .campfire-portal-bottom-nav) a {
  padding-block: calc(11px * var(--qcb-ui-density, 1));
}

/* Backend uses compact versions of the same primitives. */
.campfire-admin-wrap.campfire-admin-wrap :is(.button, .qcb-ui-button):not(.campfire-admin-menu-toggle) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 34px;
  padding: 7px 12px;
  font-family: "Work Sans", Arial, sans-serif;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.3;
  border: 1px solid var(--qcb-app-tile-border, #c9d4cc);
  border-radius: var(--qcb-control-radius, 8px);
  background: var(--qcb-app-tile, #fff);
  color: #345344;
  text-decoration: none;
  box-shadow: none;
  white-space: normal;
}
.campfire-admin-wrap.campfire-admin-wrap :is(.button, .qcb-ui-button):is(.button-primary, .qcb-ui-primary) {
  background: var(--qcb-ui-primary, #3e5f4a);
  border-color: var(--qcb-ui-primary, #3e5f4a);
  color: var(--qcb-on-primary, #fff);
  -webkit-text-fill-color: var(--qcb-on-primary, #fff);
}
.campfire-admin-wrap.campfire-admin-wrap :is(.button, .qcb-ui-button):is(.qcb-ui-secondary) {
  background: var(--qcb-app-tile, #fff);
  border-color: var(--qcb-ui-primary, #3e5f4a);
  color: var(--qcb-ui-primary, #3e5f4a);
  -webkit-text-fill-color: var(--qcb-ui-primary, #3e5f4a);
}
.campfire-admin-wrap.campfire-admin-wrap :is(.button, .qcb-ui-button):hover:not(:disabled) { filter: brightness(.95); }
.campfire-admin-wrap.campfire-admin-wrap :is(.button, .qcb-ui-button):focus-visible {
  outline: 3px solid var(--qcb-accent, #b48d57);
  outline-offset: 2px;
}
.campfire-admin-wrap.campfire-admin-wrap :is(.button, .qcb-ui-button):disabled {
  opacity: .58;
  cursor: not-allowed;
}
@media (max-width: 767px) {
  :is(#qcb-app, .campfire-member-portal-login, .qcb-overlay, .campfire-admin-wrap) {
    --qcb-ui-input-text-size: 16px;
  }
}

/* Destructive actions have an explicit semantic variant. */
:is(#qcb-app#qcb-app, .campfire-member-portal-login.campfire-member-portal-login, .qcb-overlay.qcb-overlay)
  :is(.campfire-portal-button.is-danger, .qcb-ui-button.qcb-ui-danger) {
  background: var(--qcb-app-danger, #934839);
  border: 1px solid var(--qcb-app-danger, #934839);
  color: var(--qcb-on-primary, #fff);
  -webkit-text-fill-color: var(--qcb-on-primary, #fff);
}

/* RC7: Small semantic actions, not inherited WordPress/Elementor heading typography. */
#qcb-app a.qcb-back-link,
#qcb-app a.qcb-back-link:visited {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 14px;
  padding: 0;
  font: 650 14px/1.45 "Work Sans", Arial, sans-serif;
  color: var(--qcb-ui-primary, #3e5f4a);
  -webkit-text-fill-color: currentColor;
  text-decoration: none;
  letter-spacing: normal;
  text-transform: none;
}
#qcb-app a.qcb-back-link:hover { text-decoration: underline; }
#qcb-app a.qcb-back-link:focus-visible { outline: 2px solid var(--qcb-ui-focus); outline-offset: 3px; }

/* Reuse the same icon-only receipt action in booking details and payment history. */
#qcb-app a.qcb-receipt-action,
#qcb-app a.qcb-receipt-action:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  min-height: 38px;
  padding: 7px;
  border-radius: 9px;
  border: 1px solid #cddcd2;
  background: #f0f5f1;
  color: var(--qcb-primary, #3e5f4a);
  -webkit-text-fill-color: var(--qcb-primary, #3e5f4a);
  font: 500 14px/1 "Work Sans", Arial, sans-serif;
  text-decoration: none;
  white-space: nowrap;
  box-sizing: border-box;
}
#qcb-app a.qcb-receipt-action:is(:hover,:focus-visible) { background: #dbe9df; border-color: var(--qcb-primary, #3e5f4a); }
#qcb-app a.qcb-receipt-action svg { display:block; flex:none; width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

/* A sortable header is a table control, never a display heading. */
#qcb-app .qcb-committee-data-table thead th,
#qcb-app .campfire-member-register-table thead th {
  font: 750 12px/1.4 "Work Sans", Arial, sans-serif;
  letter-spacing: .035em;
  text-transform: uppercase;
}
#qcb-app .qcb-committee-data-table thead th a.qcb-sort-link,
#qcb-app .campfire-member-register-table thead th a.qcb-sort-link {
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  color: inherit;
  -webkit-text-fill-color: currentColor;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: normal;
}
#qcb-app .qcb-sort-link:is(:hover,:focus-visible) { text-decoration: underline; }

/* Toggle is a persistent setting; checkbox semantics retained for screen readers/forms. */
#qcb-app .qcb-setting-switch {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  width: fit-content;
  max-width: 100%;
  min-width: 0;
  padding: 3px 0;
  font: 650 14px/1.4 "Work Sans", Arial, sans-serif;
  color: var(--qcb-ui-ink);
  cursor: pointer;
}
#qcb-app .qcb-setting-switch > input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}
#qcb-app .qcb-setting-switch .qcb-switch-track {
  display: inline-flex;
  flex: 0 0 48px;
  align-items: center;
  width: 48px;
  height: 28px;
  padding: 3px;
  border-radius: 999px;
  background: #9baaa1;
  transition: background .15s ease;
  box-sizing: border-box;
}
#qcb-app .qcb-setting-switch .qcb-switch-track > span {
  display: block;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--qcb-app-tile, #fff);
  box-shadow: 0 1px 3px #0003;
  transition: transform .15s ease;
}
#qcb-app .qcb-setting-switch > input:checked + .qcb-switch-track { background: var(--qcb-ui-primary, #3e5f4a); }
#qcb-app .qcb-setting-switch > input:checked + .qcb-switch-track > span { transform: translateX(20px); }
#qcb-app .qcb-setting-switch > input:focus-visible + .qcb-switch-track { outline: 3px solid var(--qcb-accent, #b48d57); outline-offset: 2px; }
#qcb-app .qcb-setting-switch > input:disabled + .qcb-switch-track { opacity: .5; }

/* Hidden is a functional state and always outranks a component's display mode. */
:is(#qcb-app#qcb-app, .campfire-member-portal-login.campfire-member-portal-login,
    .qcb-overlay.qcb-overlay, .campfire-admin-wrap.campfire-admin-wrap) [hidden] {
  display: none;
}