/* Formulaires de dépôt (maquette 12b) */
.wpp { display: flex; flex-direction: column; gap: 14px; padding-top: 18px; padding-bottom: 48px; }
.wpp-card {
  background: var(--wp-bg); border: 1px solid var(--wp-line); border-radius: 14px; overflow: hidden;
  box-shadow: 0 20px 50px -20px rgba(40, 30, 10, .25); display: grid; grid-template-columns: minmax(0, 1fr) 320px;
}
.wpp-main { padding: 32px; display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.wpp-h1 { font-size: 28px; font-weight: 900; letter-spacing: -.02em; line-height: 1.1; }
.wpp-lead { font-size: 15px; line-height: 1.5; color: var(--wp-ink-2); margin-top: -12px; max-width: 62ch; }

.wpp-set { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.wpp-legend { font: 500 11px/1.3 var(--wp-mono); text-transform: uppercase; letter-spacing: .08em; color: var(--wp-muted); padding: 0 0 10px; width: 100%; border-bottom: 1px solid var(--wp-line); margin-bottom: 2px; }
.wpp-opt { font-weight: 400; color: var(--wp-faint); }
.wpp .wp-input, .wpp .wp-select, .wpp .wp-textarea { border-radius: 12px; border-color: #D6CFC0; }
.wpp .wp-input:focus, .wpp .wp-select:focus, .wpp .wp-textarea:focus { border: 2px solid var(--wp-ink); padding: 11px 13px; box-shadow: none; }
.wpp .wp-select:focus { padding-right: 37px; }
.wpp .wp-field .wp-input + .wp-input, .wpp .wp-field .wp-select + .wp-input { margin-top: 2px; }

.wpp-roles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.wpp-role {
  position: relative; display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; border-radius: 12px; cursor: pointer;
  background: var(--wp-paper); border: 1px solid #D6CFC0;
}
.wpp-role input { position: absolute; opacity: 0; pointer-events: none; }
.wpp-role strong { font-size: 16px; font-weight: 800; }
.wpp-role span { font-size: 13px; color: var(--wp-ink-2); line-height: 1.4; }
.wpp-role:has(input:checked) { background: var(--wp-ink); border-color: var(--wp-ink); color: var(--wp-paper); }
.wpp-role:has(input:checked) span { color: inherit; opacity: .75; }
.wpp-role:has(input:focus-visible), .wpp-pick:has(input:focus-visible) { outline: 3px solid rgba(236, 122, 36, .5); outline-offset: 2px; }

.wpp-pick { position: relative; cursor: pointer; background: var(--wp-paper); }
.wpp-pick input { position: absolute; opacity: 0; pointer-events: none; }
.wpp-pick:has(input:checked) { background: var(--wp-ink); color: var(--wp-paper); border-color: var(--wp-ink); }
.wpp-when { display: flex; flex-direction: column; gap: 8px; }
.wpp:has(input[name="frequency"][value="ponctuel"]:checked) .wpp-when--habituel,
.wpp:has(input[name="frequency"][value="habituel"]:checked) .wpp-when--ponctuel,
.wpp:has(input[name="role"][value="cherche"]:checked) .wpp-seats { display: none; }
.wpp-phone { max-width: 280px; }

.wpp-errors { background: var(--wp-paper); border: 1px solid var(--wp-line); border-left: 6px solid var(--wp-danger); border-radius: 12px; padding: 12px 16px; font-size: 14px; }
.wpp-errors ul { margin: 6px 0 0; padding-left: 18px; display: flex; flex-direction: column; gap: 2px; }

.wpp-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; padding-top: 4px; }
.wpp-cancel { font-size: 14px; color: var(--wp-muted); text-decoration: underline; text-underline-offset: 3px; margin-left: 4px; }

.wpp-side { background: var(--wp-paper); padding: 24px; display: flex; flex-direction: column; gap: 14px; border-left: 1px solid var(--wp-line); }
.wpp-side__k { font: 500 11px/1.3 var(--wp-mono); text-transform: uppercase; letter-spacing: .08em; color: var(--wp-muted); }
.wpp-preview { border: 1px solid var(--wp-line); position: sticky; top: 16px; }
.wpp-side__box { background: var(--wp-bg); border-radius: 10px; padding: 12px; font-size: 13px; line-height: 1.5; }
.wpp-side__tips { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 6px; font-size: 13px; line-height: 1.5; color: var(--wp-ink-2); }
.wpp-side__note { font-size: 12px; line-height: 1.5; color: var(--wp-muted); }
.wpp-card--gate .wpp-main { justify-content: center; }

/* Publier : étapes, type, photos, aperçu */
.wppb__card:has(> .wpp-side[hidden]) { grid-template-columns: minmax(0, 1fr); }
.wppb-steps { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; font-size: 12px; font-weight: 700; }
.wppb-steps li { flex: 1; padding: 8px; border-radius: 8px; text-align: center; background: var(--wp-paper); color: var(--wp-muted); }
.wppb-steps li.is-done { background: #E9E3D6; }
.wppb-steps li.is-on { background: var(--wp-dark); color: var(--wp-paper); }
.wppb__head { display: flex; flex-direction: column; gap: 6px; }
.wppb__head .wpp-lead { margin-top: 0; }
.wppb__hint { font-size: 13px; font-weight: 600; color: var(--wp-acc-2); }
.wppb__note { background: var(--wp-paper); border-left: 4px solid var(--wp-acc); border-radius: 10px; padding: 10px 12px; font-size: 13px; line-height: 1.5; }
.wppb__note--warn { border-left-color: var(--wp-danger); }
.wppb__meta { font-size: 12px; line-height: 1.5; color: var(--wp-muted); }
.wppb__meta:empty { display: none; }
.wppb__meta--split { display: flex; justify-content: space-between; gap: 12px; }
.wppb__meta--split span:last-child { font-family: var(--wp-mono); white-space: nowrap; }

.wppb-kindbar { display: flex; align-items: center; gap: 12px; font-size: 14px; font-weight: 700; margin-top: -10px; }
.wppb-kindbar .wp-link { font-size: 13px; font-weight: 600; background: none; border: 0; padding: 0; cursor: pointer; color: var(--wp-muted); }
.wppb-kinds { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.wppb-kind {
  position: relative; display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; border-radius: 12px; cursor: pointer;
  background: var(--wp-paper); border: 1px solid #D6CFC0; color: var(--wp-ink); text-decoration: none;
}
body.wp a.wppb-kind { color: var(--wp-ink); }
.wppb-kind:hover { border-color: var(--wp-ink); }
.wppb-kind__ico { width: 36px; height: 36px; border-radius: 50%; background: var(--wp-sand); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 4px; }
.wppb-kind__ico svg, .wppb-kind__ico .lw-icon { width: 18px; height: 18px; }
.wppb-kind__label { font-size: 15px; font-weight: 800; }
.wppb-kind__hint { font-size: 13px; line-height: 1.4; color: var(--wp-ink-2); }
.wppb-kind--link { border-style: dashed; }
.wppb-kind:has(input:checked) { background: var(--wp-ink); border-color: var(--wp-ink); color: var(--wp-paper); }
.wppb-kind:has(input:checked) .wppb-kind__hint { color: inherit; opacity: .75; }
.wppb-kind:has(input:checked) .wppb-kind__ico { background: var(--wp-acc); color: var(--wp-ink); }
.wppb-kind:has(input:focus-visible) { outline: 3px solid rgba(236, 122, 36, .5); outline-offset: 2px; }

.wppb__fields, .wppb-rubrique, .wppb__content, .wppb__group, .wppb-group, .wppb-photo-panel { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.wppb-group { gap: 8px; }
.wppb__fields { gap: 20px; }
.wppb__listing, .wppb__event, .wppb-photo-panel { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.wppb__event { gap: 12px; padding: 16px; border-radius: 12px; background: var(--wp-paper); }
.wppb__event legend { float: left; width: 100%; padding: 0; margin-bottom: 2px; }
.wppb-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.wppb-row > [hidden] + *, .wppb-row > :only-child { grid-column: 1 / -1; }
.wppb .wp-chip input { position: absolute; opacity: 0; pointer-events: none; }
.wppb .wp-chip { position: relative; cursor: pointer; }
.wppb .wp-chip:has(input:checked) { background: var(--wp-dark); border-color: var(--wp-dark); color: var(--wp-paper); }
.wppb .wp-chip:has(input:focus-visible) { outline: 3px solid rgba(236, 122, 36, .5); outline-offset: 2px; }
.publish-subtypes { display: flex; flex-direction: column; gap: 8px; }

.wppb-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.wppb-pill { padding: 9px 14px; border-radius: 999px; border: 1px solid #D6CFC0; background: var(--wp-paper); font: 700 14px/1.2 var(--wp-sans); color: var(--wp-ink); cursor: pointer; }
.wppb-pill:hover { border-color: var(--wp-ink); }
.wppb-pill.is-on { background: var(--wp-dark); border-color: var(--wp-dark); color: var(--wp-paper); }

.wppb-photos { display: flex; flex-direction: column; gap: 8px; }
.wppb-drop { position: relative; min-height: 150px; border: 2px dashed #C9C1B0; border-radius: 14px; background: var(--wp-paper); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.wppb-drop:hover { border-color: var(--wp-acc); }
.wppb-drop__input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.wppb-drop__ph { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 20px; text-align: center; pointer-events: none; }
.wppb-drop__ph strong { font-size: 16px; font-weight: 800; }
.wppb-drop__ph span { font-size: 12px; color: var(--wp-muted); }
.wppb-drop__preview { position: relative; width: 100%; align-self: stretch; pointer-events: none; }
.wppb-drop__preview img { width: 100%; height: 220px; object-fit: cover; display: block; }
.wppb-drop:has(.wppb-drop__preview:not([hidden])) { border-style: solid; border-color: var(--wp-line); }
.wppb-drop__badge { position: absolute; left: 10px; top: 10px; background: var(--wp-dark); color: var(--wp-paper); font: 500 11px var(--wp-mono); padding: 4px 8px; border-radius: 6px; }
.wppb-drop__clear { position: absolute; right: 10px; top: 10px; z-index: 2; pointer-events: auto; background: rgba(23, 26, 23, .8); color: #fff; border: 0; border-radius: 999px; padding: 6px 12px; font: 600 12px var(--wp-sans); cursor: pointer; }
.wppb-slots { display: flex; flex-wrap: wrap; gap: 8px; }
.wppb-slot { position: relative; width: 76px; height: 76px; border: 1.5px dashed #C9C1B0; border-radius: 10px; background: var(--wp-paper); display: flex; align-items: center; justify-content: center; overflow: hidden; cursor: pointer; font-size: 22px; color: var(--wp-muted); }
.wppb-slot:hover { border-color: var(--wp-acc); }
.wppb-slot input[type="file"] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.wppb-slot img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.wppb-slot.is-filled { border-style: solid; border-color: var(--wp-line); }
.wppb-slot.is-filled > span { display: none; }
.wppb-slot__remove { position: absolute; left: 4px; right: 4px; bottom: 4px; display: flex; gap: 4px; align-items: center; justify-content: center; background: rgba(23, 26, 23, .78); color: #fff; border-radius: 6px; padding: 3px 4px; font-size: 11px; font-weight: 600; cursor: pointer; }
.wppb-slot__remove input { width: 13px; height: 13px; margin: 0; }
.wppb__title-input { border: 2px solid var(--wp-ink) !important; }

.wppb__foot { display: flex; flex-direction: column; gap: 12px; padding-top: 4px; }
.wppb__charte { font-size: 13px; line-height: 1.5; color: var(--wp-ink-2); }
.wppb__autosave { font-size: 13px; color: var(--wp-muted); }
.wppb__autosave .wp-link { background: none; border: 0; padding: 0; cursor: pointer; font: inherit; color: inherit; }

.wppb-preview { border-radius: 12px; overflow: hidden; background: var(--wp-bg); }
.wppb-preview__media img { width: 100%; height: 120px; object-fit: cover; display: block; }
.wppb-preview__ph { height: 120px; background: var(--wp-sand); display: flex; align-items: center; justify-content: center; color: var(--wp-faint); }
.wppb-preview__body { padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.wppb-preview__tag { font: 500 10px/1.3 var(--wp-mono); text-transform: uppercase; letter-spacing: .06em; color: var(--wp-muted); }
.wppb-preview__title { font-size: 14px; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
.wppb-preview__row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 2px 8px; }
.wppb-preview__price { color: var(--wp-acc-2); font-size: 14px; white-space: nowrap; }
.wppb-preview__meta { font-size: 11px; color: var(--wp-faint); margin-left: auto; text-align: right; }
.wppb-preview__text { margin: 6px 0 0; font-size: 14px; line-height: 1.55; color: var(--wp-ink-2); white-space: pre-line; }
.wppb-review { display: flex; flex-direction: column; gap: 10px; }
.wppb-review__card .wppb-preview { border: 1px solid var(--wp-line); max-width: 520px; background: var(--wp-paper); }
.wppb-review__card .wppb-preview__media img, .wppb-review__card .wppb-preview__ph { height: 240px; }
.wppb-review__card .wppb-preview__body { padding: 14px 16px; gap: 4px; }
.wppb-review__card .wppb-preview__title { font-size: 18px; }
.wppb__card[data-step="3"] #publish-preview, .wppb__card[data-step="3"] #publish-preview-heading { display: none; }
.wppb-tips { display: flex; flex-direction: column; gap: 8px; }
.wppb-tips__t { font-size: 13px; font-weight: 800; }
.wppb-tips:has(#publish-tips-list:empty) { display: none; }

@media (max-width: 960px) {
  .wpp-card { grid-template-columns: minmax(0, 1fr); }
  .wppb__card[data-step="3"] .wppb__aside { display: none; }
  .wpp-side { border-left: 0; border-top: 1px solid var(--wp-line); }
  .wpp-preview { position: static; }
}

@media (max-width: 760px) {
  .wpp { padding-top: 12px; padding-bottom: 32px; }
  .wpp-card { border-radius: 12px; box-shadow: none; }
  .wpp-main { padding: 20px 16px; gap: 18px; }
  .wpp-h1 { font-size: 24px; }
  .wpp-lead { font-size: 14px; margin-top: -8px; }
  .wpp-roles { gap: 8px; }
  .wpp-role { padding: 12px; }
  .wpp-role strong { font-size: 14.5px; }
  .wpp-role span { font-size: 12px; }
  .wpp-side { padding: 18px 16px; }
  .wpp-actions .wp-btn--lg { width: 100%; justify-content: center; }
  .wppb-steps { font-size: 11px; gap: 4px; }
  .wppb-steps li { padding: 7px 4px; }
  .wppb-steps li:not(.is-on) { flex: .6; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .wppb-kinds { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  .wppb-kind { padding: 12px; }
  .wppb-kind__label { font-size: 14px; }
  .wppb-kind__hint { font-size: 12px; }
  .wppb-row { grid-template-columns: minmax(0, 1fr); }
  .wppb-slots { gap: 6px; }
  .wppb-slot { width: calc((100% - 24px) / 5); height: auto; aspect-ratio: 1; }
  .wppb-drop__preview img { height: 190px; }
  .wppb__meta--split { flex-direction: column; gap: 2px; }
  .wppb-review__card .wppb-preview__media img, .wppb-review__card .wppb-preview__ph { height: 200px; }
}
