/**
 * File Name: gco-ui-accordion.css
 * Project: GCO UI CSS Architecture Migration
 * Pattern: PL-0014 — GCO Accordion / Disclosure
 *
 * KISS file contract:
 * - Pattern-specific tokens and selectors live together in this file.
 * - Shared foundation semantics are reused where already governed.
 * - No separate Accordion token file.
 * - No separate Accordion matrix file.
 *
 * First validation pass preserves the current governed PL-0014 presentation.
 * The same pattern contract is rendered on both dark and light hosts.
 * Context-specific values are introduced only if browser evidence requires them.
 */

:root {
  /* Current governed PL-0014 values without an existing shared semantic. */
  --gco-ui-accordion-trigger-background: #1f6fb5;
  --gco-ui-accordion-trigger-expanded-background: rgba(212, 175, 55, 0.80);
  --gco-ui-accordion-trigger-ring: 0 0 0 1px rgba(255, 255, 255, 0.60);

  /* Reuse shared governed semantics. */
  --gco-ui-accordion-border: var(--gco-ui-color-white-22);
  --gco-ui-accordion-trigger-foreground: var(--gco-ui-text-on-dark);
  --gco-ui-accordion-trigger-expanded-foreground: var(--gco-ui-text-on-dark);
  --gco-ui-accordion-focus-ring: var(--gco-ui-color-accent);
  --gco-ui-accordion-hover-opacity: 0.92;
}

.gco-ui-accordion {
  display: grid;
  gap: var(--gco-ui-space-3);
  width: 100%;
}

.gco-ui-accordion__item {
  width: 100%;
}

.gco-ui-accordion__trigger {
  display: grid;
  grid-template-columns: var(--gco-ui-space-6) minmax(0, 1fr);
  align-items: center;
  gap: var(--gco-ui-space-2);
  width: 100%;
  margin: 0;
  padding: var(--gco-ui-space-3) var(--gco-ui-space-4);
  border: 1px solid var(--gco-ui-accordion-border);
  border-radius: var(--gco-ui-radius-2);
  background: var(--gco-ui-accordion-trigger-background);
  color: var(--gco-ui-accordion-trigger-foreground);
  box-shadow: var(--gco-ui-accordion-trigger-ring);
  font: inherit;
  font-weight: var(--gco-ui-font-weight-bold);
  line-height: var(--gco-ui-line-height);
  text-align: left;
  cursor: pointer;
}

.gco-ui-accordion__trigger:hover {
  opacity: var(--gco-ui-accordion-hover-opacity);
  box-shadow: var(--gco-ui-interaction-hover-ring);
}

.gco-ui-accordion__trigger:focus-visible {
  outline: 2px solid var(--gco-ui-accordion-focus-ring);
  outline-offset: 2px;
}

.gco-ui-accordion__item.is-expanded > .gco-ui-accordion__trigger {
  background: var(--gco-ui-accordion-trigger-expanded-background);
  color: var(--gco-ui-accordion-trigger-expanded-foreground);
}

.gco-ui-accordion__indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--gco-ui-space-6);
  min-width: var(--gco-ui-space-6);
  height: var(--gco-ui-space-6);
  font-size: var(--gco-ui-font-size-5);
  line-height: 1;
  font-weight: var(--gco-ui-font-weight-bold);
}

.gco-ui-accordion__indicator::before {
  content: "▸";
}

.gco-ui-accordion__item.is-expanded > .gco-ui-accordion__trigger .gco-ui-accordion__indicator::before {
  content: "▾";
}

.gco-ui-accordion__title {
  min-width: 0;
}

.gco-ui-accordion__panel {
  margin-top: var(--gco-ui-space-2);
  box-sizing: border-box;
}

.gco-ui-accordion__panel[hidden] {
  display: none;
}

@media (forced-colors: active) {
  .gco-ui-accordion__trigger {
    border-color: currentColor;
    forced-color-adjust: auto;
  }

  .gco-ui-accordion__trigger:focus-visible {
    outline-color: Highlight;
  }
}
