/* ======================================================
   00 — VARIABLES / DESIGN TOKENS
   ======================================================

   Objectif :
   Centraliser toutes les valeurs "réutilisables"
   pour éviter les répétitions et faciliter les changements.

   WordPress (via theme.json) expose déjà :
   - des couleurs
   - des espacements
   - des gradients

   Ici, on crée des alias personnalisés.
   Si tu changes la palette plus tard,
   tu modifies uniquement ici.
   ====================================================== */

/* =====================================================================
   WS TOKENS — SPACING
   ===================================================================== */

:root{
  --ws-space-0: 0;
  --ws-space-xs: 4px;
  --ws-space-sm: 8px;
  --ws-space-md: 16px;
  --ws-space-lg: 24px;
  --ws-space-xl: 40px;
  --ws-space-2xl: 64px;
  
  --ws-form-input-height: 44px;
  --ws-form-radius-pill: 999px;
  --ws-form-button-bg: #F26A21;
  --ws-form-button-text: #ffffff;
}

h1 {
	font-size: 2.5rem;
	text-transform: none;
}

h2 {
	font-size: 2rem;
	text-transform: none;
}

/* ======================================================
   BOUTONS GUTENBERG — STYLE ALIGNÉ AVEC FLUENT FORMS
   ====================================================== */

/* Boutons natifs Gutenberg */
.wp-block-button__link,
.wp-element-button,
button,
input[type="button"],
input[type="submit"],
input[type="reset"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: var(--ws-form-input-height, 44px);
  padding: 10px 22px;
  margin: 10px 0;

  border: 0;
  border-radius: var(--ws-form-radius-pill, 999px);

  background: var(--ws-form-button-bg, #F26A21);
  color: var(--ws-form-button-text, #ffffff);

  font-family: inherit;
  font-size: inherit;
  font-weight: 600;
  line-height: 1.2;

  cursor: pointer;
  box-shadow: none;
  text-decoration: none;

  transition:
    background-color .25s ease,
    transform .25s ease,
    box-shadow .25s ease,
    opacity .25s ease;
}

input[type="search"] {
	margin: 10px 5px;
}

/* Hover doux */
.wp-block-button__link:hover,
.wp-element-button:hover,
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover {
  background-color: #2f7aa6;	
  opacity: .92;
  transform: translateY(-1px);
  text-decoration: none;
}

/* Focus clavier accessible */
.wp-block-button__link:focus-visible,
.wp-element-button:focus-visible,
button:focus-visible,
input[type="button"]:focus-visible,
input[type="submit"]:focus-visible,
input[type="reset"]:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}