/**
 * Fachárna Design System — Etapa 20
 * Centrální tokeny a společné styly komponent. Sekční CSS může doplňovat layout,
 * ale nemá znovu definovat základní barvy, typografii ani interakční stavy.
 */
:root {
  /* Brand */
  --fa-color-brand: #f5b400;
  --fa-color-brand-hover: #dda000;
  --fa-color-brand-active: #c98f00;
  --fa-color-brand-soft: #fff7df;
  --fa-color-brand-soft-strong: #fff0bd;
  --fa-color-brand-ink: #171717;

  /* Neutrals */
  --fa-color-background: #fff;
  --fa-color-surface: #fff;
  --fa-color-surface-subtle: #f7f7f5;
  --fa-color-surface-muted: #f1f1ef;
  --fa-color-text: #171717;
  --fa-color-text-secondary: #626262;
  --fa-color-text-muted: #777;
  --fa-color-border: #e7e7e4;
  --fa-color-border-strong: #d4d4cf;
  --fa-color-footer: #111;
  --fa-color-error: #c62828;
  --fa-color-error-soft: #fff0ef;
  --fa-color-success: #19734a;
  --fa-color-success-soft: #eaf7ef;
  --fa-color-info: #175cd3;
  --fa-color-info-soft: #eff6ff;

  /* Type scale */
  --fa-font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --fa-font-size-2xs: .6875rem;
  --fa-font-size-xs: .75rem;
  --fa-font-size-sm: .875rem;
  --fa-font-size-md: 1rem;
  --fa-font-size-lg: 1.125rem;
  --fa-font-size-xl: 1.25rem;
  --fa-font-size-2xl: 1.5rem;
  --fa-font-size-3xl: clamp(1.75rem, 2.6vw, 2.25rem);
  --fa-font-size-display: clamp(2.5rem, 5vw, 4rem);
  --fa-line-height-tight: 1.08;
  --fa-line-height-heading: 1.16;
  --fa-line-height-body: 1.55;
  --fa-font-weight-regular: 400;
  --fa-font-weight-medium: 500;
  --fa-font-weight-semibold: 650;
  --fa-font-weight-bold: 750;
  --fa-font-weight-black: 900;

  /* Spacing scale */
  --fa-space-1: .25rem;
  --fa-space-2: .5rem;
  --fa-space-3: .75rem;
  --fa-space-4: 1rem;
  --fa-space-5: 1.25rem;
  --fa-space-6: 1.5rem;
  --fa-space-8: 2rem;
  --fa-space-10: 2.5rem;
  --fa-space-12: 3rem;
  --fa-space-section: clamp(1.5rem, 2.8vw, 2.5rem);
  --fa-container-width: 1440px;
  --fa-page-gutter: clamp(1rem, 3vw, 2.5rem);

  /* Shape, borders and elevation */
  --fa-radius-xs: .375rem;
  --fa-radius-sm: .625rem;
  --fa-radius-md: .75rem;
  --fa-radius-lg: 1rem;
  --fa-radius-xl: 1.25rem;
  --fa-radius-2xl: 1.5rem;
  --fa-radius-pill: 999px;
  --fa-shadow-sm: 0 1px 4px rgb(0 0 0 / 4%);
  --fa-shadow-md: 0 5px 18px rgb(0 0 0 / 6%);
  --fa-shadow-lg: 0 14px 36px rgb(0 0 0 / 10%);
  --fa-focus-ring: 0 0 0 3px rgb(245 180 0 / 35%);

  /* Interaction */
  --fa-motion-fast: 140ms ease;
  --fa-motion-normal: 200ms ease;
  --fa-motion-slow: 300ms ease;
  --fa-control-height: 2.75rem;
  --fa-control-height-sm: 2.25rem;

  /* Compatibility aliases used by existing theme modules */
  --fa-yellow: var(--fa-color-brand);
  --fa-yellow-dark: var(--fa-color-brand-hover);
  --fa-ink: var(--fa-color-text);
  --fa-muted: var(--fa-color-text-secondary);
  --fa-border: var(--fa-color-border);
  --fa-surface-legacy: var(--fa-color-surface-subtle);
  --fa-cream: var(--fa-color-brand-soft);
  --fa-footer: var(--fa-color-footer);
  --fa-white: var(--fa-color-background);
  --fa-radius: var(--fa-radius-xl);
  --fa-radius-sm-legacy: var(--fa-radius-sm);
  --fa-shadow: var(--fa-shadow-md);
  --fa-container: var(--fa-container-width);
  --fa-space: var(--fa-page-gutter);
}

/* Predictable sizing and shared type */
*, *::before, *::after { box-sizing: border-box; }
body { color: var(--fa-color-text); background: var(--fa-color-background); font-family: var(--fa-font-family); line-height: var(--fa-line-height-body); }
button, input, select, textarea { font: inherit; }
button, input[type="submit"], input[type="button"], input[type="reset"] { cursor: pointer; }
img, video, iframe { max-width: 100%; }
:where(h1,h2,h3,h4,h5,h6) { color: var(--fa-color-text); line-height: var(--fa-line-height-heading); font-family: var(--fa-font-family); }
:where(p,li) { overflow-wrap: anywhere; }
::selection { background: var(--fa-color-brand); color: var(--fa-color-brand-ink); }
:where(a,button,input,select,textarea,[tabindex]):focus-visible { outline: 3px solid var(--fa-color-brand-hover); outline-offset: 3px; box-shadow: var(--fa-focus-ring); }

/* Shared buttons — explicit common classes and common WordPress controls */
:where(.button, .btn, .wp-block-button__link, button.button, input[type="submit"], .wp-element-button) {
  border-radius: var(--fa-radius-sm);
  transition: background-color var(--fa-motion-fast), border-color var(--fa-motion-fast), color var(--fa-motion-fast), box-shadow var(--fa-motion-fast), transform var(--fa-motion-fast);
}
:where(.button--primary, .btn-primary, .wp-block-button:not(.is-style-outline) .wp-block-button__link, .button-primary) {
  background: var(--fa-color-brand);
  border-color: var(--fa-color-brand);
  color: var(--fa-color-brand-ink);
  font-weight: var(--fa-font-weight-bold);
}
:where(.button--primary, .btn-primary, .wp-block-button:not(.is-style-outline) .wp-block-button__link, .button-primary):hover {
  background: var(--fa-color-brand-hover);
  border-color: var(--fa-color-brand-hover);
  color: var(--fa-color-brand-ink);
}

/* Shared form controls */
:where(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]), select, textarea) {
  max-width: 100%;
  color: var(--fa-color-text);
  background-color: var(--fa-color-surface);
  border: 1px solid var(--fa-color-border-strong);
  border-radius: var(--fa-radius-sm);
  transition: border-color var(--fa-motion-fast), box-shadow var(--fa-motion-fast);
}
:where(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]), select):not([type="file"]) { min-height: var(--fa-control-height); }
:where(input, select, textarea)::placeholder { color: var(--fa-color-text-muted); opacity: 1; }
:where(input, select, textarea):focus { border-color: var(--fa-color-brand-hover); }

/* Reusable surface and metadata primitives */
:where(.fa-card, .facharna-card, .topic-card, .realization-card, .article-card, .member-card, .profession-card, .event-card) {
  border-color: var(--fa-color-border);
  border-radius: var(--fa-radius-lg);
}
:where(.fa-muted, .text-muted, .entry-meta, .post-meta, .topic-meta, .card-meta) { color: var(--fa-color-text-secondary); }
:where(.fa-tag, .category-tag, .topic-category, .profession-tag, .article-category) { border-radius: var(--fa-radius-pill); }
:where(.notice--error, .form-error, .error-message) { color: var(--fa-color-error); }
:where(.notice--success, .form-success, .success-message) { color: var(--fa-color-success); }

/* Loading, empty and error states share the same visual language */
:where(.fa-loading, .is-loading, .loading-state) { color: var(--fa-color-text-secondary); }
:where(.fa-empty-state, .empty-state, .no-results, .no-content) {
  padding: clamp(1.5rem, 3vw, 2.5rem);
  border: 1px dashed var(--fa-color-border-strong);
  border-radius: var(--fa-radius-lg);
  background: var(--fa-color-surface-subtle);
  color: var(--fa-color-text-secondary);
  text-align: center;
}
:where(.fa-error-state, .error-state) { padding: var(--fa-space-4); border-radius: var(--fa-radius-md); background: var(--fa-color-error-soft); color: var(--fa-color-error); }
:where(.fa-success-state, .success-state) { padding: var(--fa-space-4); border-radius: var(--fa-radius-md); background: var(--fa-color-success-soft); color: var(--fa-color-success); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}