/* ============================================================
   Composant « Fiche à valider » — Tounes Stays
   Complète les styles existants dans style.css
   (.card, .card__*, .card__badge--pending, .card__pending-note)
   ============================================================ */

/* Placeholder de marque en remplacement des photos tierces
   pour les fiches en attente de validation par l'hôte.
   Aucune photo extraite d'Airbnb ou Booking, même floutée. */
.pending-cover {
  position: relative;
  aspect-ratio: 4/3;
  overflow: hidden;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,0.15) 0%, transparent 55%),
    linear-gradient(135deg, var(--color-primary) 0%, #095e79 60%, #054a60 100%);
  color: var(--color-text-inverse);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4);
}
.pending-cover__vagues {
  position: absolute;
  inset: auto 0 0 0;
  height: 40%;
  opacity: 0.35;
  pointer-events: none;
}
.pending-cover__fare {
  position: relative;
  z-index: 1;
  width: 96px;
  height: 96px;
  opacity: 0.9;
}
/* Variante état verifié (placeholder de fallback quand aucune photo hôte n'est fournie) */
.pending-cover--verified {
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,0.2) 0%, transparent 55%),
    linear-gradient(135deg, #1a8fb0 0%, #0e7a9c 60%, #095e79 100%);
}

/* Rating aligne sous le titre plutôt que à côté, pour laisser respirer les titres longs */
.card .card__rating {
  margin-bottom: var(--space-2);
}

/* Bloc SDT dans le footer verifié */
.card__sdt {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  padding: var(--space-1) 0;
}
.card__sdt strong {
  color: var(--color-text);
  font-family: var(--font-body);
  letter-spacing: 0.02em;
}

/* Ligne d'observation associée à la note agrégée
   (affiche la date à laquelle la note a été observée). */
.card__rating-source {
  font-size: var(--text-xs);
  color: var(--color-text-faint);
  margin-top: 2px;
}

/* Lien externe neutre « Vérifier disponibilités et prix ».
   Aucun logo, aucun paramètre d'affiliation, libellé texte. */
.card__external-link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  text-decoration: underline;
  text-underline-offset: 3px;
  padding: var(--space-2) 0;
}
.card__external-link:hover {
  color: var(--color-primary);
}
.card__external-link svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

/* CTA principal des fiches à valider : « Administrer ce bien ». */
.btn-claim {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  background: var(--color-accent);
  color: var(--color-text-inverse);
  padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: background var(--transition-interactive);
}
.btn-claim:hover {
  background: var(--color-accent-hover);
}
.btn-claim svg {
  width: 14px;
  height: 14px;
}

/* Footer d'une fiche pending : le CTA « Administrer » remplace
   le bloc contact WhatsApp / email des fiches verified. */
.card__footer--pending {
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-3);
}
.card__footer--pending .btn-claim {
  justify-content: center;
}

/* Bloc sources publiques utilisées (transparence éditoriale) */
.card__sources {
  font-size: var(--text-xs);
  color: var(--color-text-faint);
  margin-top: var(--space-2);
}
.card__sources details summary {
  cursor: pointer;
  padding: 2px 0;
}
.card__sources ul {
  list-style: none;
  padding: var(--space-2) 0 0 0;
  margin: 0;
}
.card__sources li {
  padding: 2px 0;
}
.card__sources a {
  color: var(--color-text-muted);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ============================================================
   Formulaire de revendication « Administrer ce bien »
   ============================================================ */
.claim-form {
  max-width: 640px;
  margin: 0 auto;
  padding: var(--space-6);
  background: var(--color-surface);
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-divider);
}
.claim-form__section {
  margin-bottom: var(--space-6);
  padding-bottom: var(--space-5);
  border-bottom: 1px solid var(--color-divider);
}
.claim-form__section:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.claim-form__section h3 {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  margin-bottom: var(--space-3);
}
.claim-form label {
  display: block;
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: var(--space-2);
}
.claim-form input[type="text"],
.claim-form input[type="email"],
.claim-form input[type="tel"],
.claim-form input[type="file"],
.claim-form select,
.claim-form textarea {
  width: 100%;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  font-size: var(--text-base);
  font-family: var(--font-body);
  background: var(--color-surface);
  color: var(--color-text);
  margin-bottom: var(--space-4);
}
.claim-form input:focus,
.claim-form select:focus,
.claim-form textarea:focus {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}
.claim-form input[aria-invalid="true"] {
  border-color: var(--color-error);
}
.claim-form__hint {
  display: block;
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  font-weight: 400;
  margin-top: 2px;
  margin-bottom: var(--space-2);
}
.claim-form__error {
  color: var(--color-error);
  font-size: var(--text-xs);
  margin-top: -8px;
  margin-bottom: var(--space-3);
  display: none;
}
.claim-form__error.is-visible {
  display: block;
}
.claim-form__required {
  color: var(--color-accent);
  margin-left: 2px;
}
.claim-form__checkbox {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  padding: var(--space-2) 0;
  font-size: var(--text-sm);
  font-weight: 400;
  cursor: pointer;
}
.claim-form__checkbox input {
  margin-top: 4px;
  flex-shrink: 0;
  width: auto;
}
.claim-form__legal {
  background: #fef3d4;
  border-left: 4px solid #d99a2b;
  border-top: 1px solid #e6bf6c;
  border-right: 1px solid #e6bf6c;
  border-bottom: 1px solid #e6bf6c;
  color: #5d4000;
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  line-height: 1.6;
  margin-bottom: var(--space-4);
}
.claim-form__legal strong {
  color: #5d4000;
  display: block;
  margin-bottom: 2px;
}