/**
 * wallpaper-forms.css
 * Styles formulaires : ct_wallpaper, ct_wall, ct_panel, ct_strip, ct_atelier.
 */

/* ── Portée des formulaires concernées ────────────────────────── */
.node-ct-wallpaper-form,
.node-ct-wallpaper-edit-form,
.node-ct-wall-form,
.node-ct-wall-edit-form,
.node-ct-panel-form,
.node-ct-panel-edit-form,
.node-ct-strip-form,
.node-ct-strip-edit-form,
.node-ct-atelier-form,
.node-ct-atelier-edit-form {
  font-family: var(--font-sans);
}

/* ── Labels de champs ─────────────────────────────────────────── */
.node-ct-wallpaper-form label,
.node-ct-wallpaper-edit-form label,
.node-ct-wall-form label,
.node-ct-wall-edit-form label,
.node-ct-panel-form label,
.node-ct-panel-edit-form label,
.node-ct-strip-form label,
.node-ct-strip-edit-form label,
.node-ct-atelier-form label,
.node-ct-atelier-edit-form label {
  font-size: var(--font-size-xs);
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--wp-gris-500);
  margin-bottom: 4px;
  display: block;
}

/* ── Inputs et selects ────────────────────────────────────────── */
.node-ct-wallpaper-form input[type="text"],
.node-ct-wallpaper-form input[type="number"],
.node-ct-wallpaper-form textarea,
.node-ct-wallpaper-form select,
.node-ct-wallpaper-edit-form input[type="text"],
.node-ct-wallpaper-edit-form input[type="number"],
.node-ct-wallpaper-edit-form textarea,
.node-ct-wallpaper-edit-form select,
.node-ct-wall-form input[type="text"],
.node-ct-wall-form input[type="number"],
.node-ct-wall-form textarea,
.node-ct-wall-form select,
.node-ct-wall-edit-form input[type="text"],
.node-ct-wall-edit-form input[type="number"],
.node-ct-wall-edit-form textarea,
.node-ct-wall-edit-form select,
.node-ct-panel-form input[type="text"],
.node-ct-panel-form input[type="number"],
.node-ct-panel-form textarea,
.node-ct-panel-form select,
.node-ct-panel-edit-form input[type="text"],
.node-ct-panel-edit-form input[type="number"],
.node-ct-panel-edit-form textarea,
.node-ct-panel-edit-form select,
.node-ct-strip-form input[type="text"],
.node-ct-strip-form input[type="number"],
.node-ct-strip-form textarea,
.node-ct-strip-form select,
.node-ct-strip-edit-form input[type="text"],
.node-ct-strip-edit-form input[type="number"],
.node-ct-strip-edit-form textarea,
.node-ct-strip-edit-form select,
.node-ct-atelier-form input[type="text"],
.node-ct-atelier-form input[type="number"],
.node-ct-atelier-form textarea,
.node-ct-atelier-form select,
.node-ct-atelier-edit-form input[type="text"],
.node-ct-atelier-edit-form input[type="number"],
.node-ct-atelier-edit-form textarea,
.node-ct-atelier-edit-form select {
  font-size: var(--font-size-s);
  border: 1px solid var(--wp-gris-300);
  border-radius: var(--wp-radius-sm);
  padding: 8px 12px;
}

/* ── Section Structure (IEF Walls dans Wallpaper) ─────────────── */
.node-ct-wallpaper-form .field--name-field-walls-in-wallpaper,
.node-ct-wallpaper-edit-form .field--name-field-walls-in-wallpaper {
  background: var(--wp-gris-50);
  border: 1px solid var(--wp-gris-300);
  border-radius: var(--wp-radius-md);
  padding: 20px;
  margin-top: 16px;
}

/* ── IEF imbriqué : Panels dans Wall ─────────────────────────── */
.field--name-field-panels-in-wall {
  margin-left: 16px;
  border-left: 3px solid var(--wp-bleu-border);
  padding-left: 16px;
  margin-top: 12px;
}

/* ── IEF imbriqué : Strips dans Panel ────────────────────────── */
.field--name-field-panel-strips {
  margin-left: 16px;
  border-left: 3px solid var(--wp-gris-300);
  padding-left: 16px;
  margin-top: 12px;
}

/* ── En-tête entité IEF ───────────────────────────────────────── */
.inline-entity-form-entity-label {
  font-family: var(--font-serif);
  font-size: var(--font-size-l);
  font-weight: 400;
  color: var(--wp-gris-900);
}

/* ── Boutons IEF + “Ajouter un élément” ───────────────────────── */
.inline-entity-form-container .button,
.field-add-more-submit {
  font-family: var(--font-sans);
  font-size: var(--font-size-s);
  font-weight: 500;
}

/* ── Table IEF Complex ────────────────────────────────────────── */
.inline-entity-form-complex table {
  width: 100%;
  border-collapse: collapse;
}

.inline-entity-form-complex table th {
  font-family: var(--font-sans);
  font-size: var(--font-size-xs);
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--wp-gris-500);
  padding: 8px 12px;
  border-bottom: 2px solid var(--wp-gris-300);
  text-align: left;
}

.inline-entity-form-complex table td {
  padding: 8px 12px;
  border-bottom: 1px solid var(--wp-gris-100);
  font-size: var(--font-size-s);
  vertical-align: middle;
}

/* ── Description des champs ───────────────────────────────────── */
.form-item .description {
  font-size: var(--font-size-xs);
  color: var(--wp-gris-500);
  margin-top: 4px;
  font-style: italic;
}

/* ── Champs requis ────────────────────────────────────────────── */
.form-required::after {
  color: #dc2626;
  content: " *";
}

/* ── Responsive formulaires ───────────────────────────────────── */
@media (max-width: 768px) {
  .field--name-field-panels-in-wall,
  .field--name-field-panel-strips {
    margin-left: 8px;
    padding-left: 8px;
  }
}