/* --- ID 182: hivepress - annonces edit --- */
/*********************************
 * HOMERENTAI — EDIT LISTING (HivePress)
 * Scope strict : page "modifier une annonce"
 * DA: Bleu accent #4C6FFF | Bleu profond #1D2850
 *********************************/

body .hp-form--listing-update{
  --hr-navy:#1D2850;
  --hr-blue:#4C6FFF;
  --hr-blue-soft:rgba(76,111,255,.10);
  --hr-blue-shadow:rgba(76,111,255,.22);
  --hr-border:rgba(148,163,184,.35);
  --hr-radius:999px;
}

/* ---------------------------------------------------
   0) Neutralise ton hover global (vert/bleu) SUR CETTE PAGE UNIQUEMENT
--------------------------------------------------- */
body .hp-form--listing-update button:hover,
body .hp-form--listing-update .button:hover,
body .hp-form--listing-update .hp-field--button:hover,
body .hp-form--listing-update .hp-form__button:hover,
body .hp-form--listing-update input[type="submit"]:hover,
body .hp-form--listing-update a.button:hover{
  background-image:none !important;
}

/* ---------------------------------------------------
   1) Topbar actions : Masquer / Supprimer (sombre, DA)
--------------------------------------------------- */
.hp-page__topbar.hp-page__topbar--separate{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.hp-listing__actions.hp-listing__actions--secondary{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.hp-page__topbar--separate .hp-menu--listing-manage .hp-menu__item > a{
  color:#5e6c89 !important;
}
.hp-page__topbar--separate .hp-menu--listing-manage .hp-menu__item > a span{
  color:inherit !important;
}
.hp-page__topbar--separate .hp-menu--listing-manage .hp-menu__item > a:hover{
  color:#2f4edd !important;
}

/* Base action pill */
.hp-page__topbar--separate .hp-listing__actions--secondary .hp-listing__action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border-radius:var(--hr-radius, 999px);
  font-weight:600;
  font-size:14px;
  line-height:1.2;
  text-decoration:none !important;
  border:1px solid transparent;
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease, color .2s ease;
}

/* Force contour visible (page edit listing) */
.hp-page__topbar--separate .hp-listing__actions--secondary .hp-listing__action--hide,
.hp-page__topbar--separate .hp-listing__actions--secondary .hp-listing__action--delete{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:42px;
  padding:10px 16px !important;
  border-radius:999px !important;
  border-width:1.5px !important;
  border-style:solid !important;
  background:#fff !important;
}

/* Masquer = sombre outline (navy) */
.hp-page__topbar--separate .hp-listing__action--hide{
  color:#1d2850 !important;
  border-color:rgba(29,40,80,.24) !important;
  box-shadow:0 10px 26px rgba(29,40,80,.08) !important;
}
.hp-page__topbar--separate .hp-listing__action--hide span{
  color:#1d2850 !important;
}

.hp-page__topbar--separate .hp-listing__action--hide i{
  color:rgba(29,40,80,.70) !important;
}

.hp-page__topbar--separate .hp-listing__action--hide:hover{
  background:rgba(29,40,80,.06) !important;
  color:#1d2850 !important;
  transform:translateY(-1px);
  box-shadow:0 14px 34px rgba(29,40,80,.12) !important;
}
.hp-page__topbar--separate .hp-listing__action--hide:hover span{
  color:#1d2850 !important;
}

/* Supprimer = danger outline (texte rouge) */
.hp-page__topbar--separate .hp-listing__action--delete{
  color:#ef4444 !important;
  border-color:#ef4444 !important;
  box-shadow:0 10px 26px rgba(239,68,68,.18) !important;
}
.hp-page__topbar--separate .hp-listing__action--delete span{
  color:inherit !important;
}

.hp-page__topbar--separate .hp-listing__action--delete i{
  color:inherit !important;
}

.hp-page__topbar--separate .hp-listing__action--delete:hover{
  background:#ef4444 !important;
  color:#fff !important;
  border-color:#ef4444 !important;
  transform:translateY(-1px);
  box-shadow:0 18px 44px rgba(239,68,68,.28) !important;
}
.hp-page__topbar--separate .hp-listing__action--delete:hover span{
  color:#fff !important;
}

.hp-page__topbar--separate .hp-listing__action--delete:hover i{
  color:#fff;
}

/* ---------------------------------------------------
   2) Bouton secondaire (DA) : outline bleu accent
   - "Choisir des Images"
   - "Ajouter un élément"
--------------------------------------------------- */
body .hp-form--listing-update .hp-field--button.button,
body .hp-form--listing-update .hp-field--repeater > .hp-field--button.button{
  width:auto !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;

  padding:12px 18px !important;
  border-radius:var(--hr-radius) !important;

  background:#fff !important;
  color:var(--hr-blue) !important;

  border:2px solid var(--hr-blue) !important;
  box-shadow:0 12px 30px var(--hr-blue-shadow) !important;

  font-weight:700 !important;
  letter-spacing:.01em;

  transition:transform .16s ease, box-shadow .2s ease, background .2s ease !important;
}

body .hp-form--listing-update .hp-field--button.button span{
  color:inherit !important;
}

body .hp-form--listing-update .hp-field--button.button:hover{
  transform:translateY(-1px);
  background:var(--hr-blue-soft) !important;
  box-shadow:0 18px 46px rgba(76,111,255,.26) !important;
}

body .hp-form--listing-update .hp-field--button.button:focus{
  outline:none !important;
  box-shadow:
    0 18px 46px rgba(76,111,255,.26),
    0 0 0 3px rgba(76,111,255,.22) !important;
}

/* "Ajouter un élément" pleine largeur (comme ta capture) */
body .hp-form--listing-update .hp-field--repeater > .hp-field--button.button{
  width:100% !important;
  margin-top:12px;
}

/* Petit spacing bouton upload */
body .hp-form--listing-update .hp-form__field--attachment-upload .hp-field--button.button{
  margin-top:10px;
}

/* ---------------------------------------------------
   3) Bouton principal (DA) : "Enregistrer les modifications"
--------------------------------------------------- */
body .hp-form--listing-update .hp-form__footer .hp-form__button{
  width:100%;
  border-radius:var(--hr-radius);
  border:1px solid rgba(76,111,255,.35);
  background:var(--hr-blue) !important;
  background-image:none !important;
  color:#fff !important;

  font-weight:700;
  font-size:16px;
  letter-spacing:.01em;
  padding:18px 32px;

  box-shadow:0 18px 40px rgba(76,111,255,.22);
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}

body .hp-form--listing-update .hp-form__footer .hp-form__button span{
  color:inherit !important;
}

body .hp-form--listing-update .hp-form__footer .hp-form__button:hover{
  background:rgba(76,111,255,.92) !important;
  transform:translateY(-2px);
  box-shadow:0 22px 55px rgba(76,111,255,.28);
}

body .hp-form--listing-update .hp-form__footer .hp-form__button:active{
  transform:translateY(0);
  box-shadow:0 12px 30px rgba(76,111,255,.20);
}

/* ---------------------------------------------------
   4) Tags : ré-afficher la barre de saisie (création de tags)
   (Select2 multiple input)
--------------------------------------------------- */
/* Override: le select2 doit être VISIBLE pour créer de nouveaux tags */
body .hp-form--listing-update .hp-form__field--tags .select2-container,
body .hp-form--listing-submit .hp-form__field--tags .select2-container,
body .hp-form--listing-edit .hp-form__field--tags .select2-container{
  position: static !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  height: auto !important;
  overflow: visible !important;
  margin-top: 0.5rem;
}

body .hp-form--listing-update .select2-container--default .select2-selection--multiple,
body .hp-form--listing-submit .select2-container--default .select2-selection--multiple,
body .hp-form--listing-edit .select2-container--default .select2-selection--multiple{
  border:1px solid rgba(76,111,255,.25) !important;
  border-radius:18px !important;
  padding:8px 12px !important;
  background:#fff !important;
  min-height:52px !important;
  display:flex !important;
  align-items:center !important;
  box-shadow:0 10px 26px rgba(15,23,42,.06) !important;
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease !important;
}

body .hp-form--listing-update .hp-form__field--tags .select2-container,
body .hp-form--listing-submit .hp-form__field--tags .select2-container,
body .hp-form--listing-edit .hp-form__field--tags .select2-container{
  width:100% !important;
}

body .hp-form--listing-update .select2-container--default .select2-selection--multiple .select2-selection__rendered,
body .hp-form--listing-submit .select2-container--default .select2-selection--multiple .select2-selection__rendered,
body .hp-form--listing-edit .select2-container--default .select2-selection--multiple .select2-selection__rendered{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

/* IMPORTANT : ne jamais cacher le champ de recherche inline */
body .hp-form--listing-update .select2-container--default .select2-search--inline,
body .hp-form--listing-submit .select2-container--default .select2-search--inline,
body .hp-form--listing-edit .select2-container--default .select2-search--inline{
  display:inline-flex !important;
  align-items:center;
  flex:1 1 160px;
  min-width:160px;
}

body .hp-form--listing-update .select2-container--default .select2-search--inline .select2-search__field,
body .hp-form--listing-submit .select2-container--default .select2-search--inline .select2-search__field,
body .hp-form--listing-edit .select2-container--default .select2-search--inline .select2-search__field{
  display:block !important;
  opacity:1 !important;
  width:auto !important;
  min-width:120px !important;
  max-width:100% !important;
  padding:6px 6px !important;
  margin:0 !important;
  border-radius:10px;
  background:transparent !important;
  border:0 !important;
  color:#1d2850;
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

body .hp-form--listing-update .select2-container--default .select2-search--inline .select2-search__field::placeholder,
body .hp-form--listing-submit .select2-container--default .select2-search--inline .select2-search__field::placeholder,
body .hp-form--listing-edit .select2-container--default .select2-search--inline .select2-search__field::placeholder{
  color:rgba(29,40,80,.55);
  opacity:1;
}

/* Bonus: focus plus clair */
body .hp-form--listing-update .select2-container--default.select2-container--focus .select2-selection--multiple,
body .hp-form--listing-submit .select2-container--default.select2-container--focus .select2-selection--multiple,
body .hp-form--listing-edit .select2-container--default.select2-container--focus .select2-selection--multiple{
  border-color:rgba(76,111,255,.55) !important;
  box-shadow:0 0 0 3px rgba(76,111,255,.16), 0 12px 28px rgba(76,111,255,.12) !important;
  background:#fff !important;
}

/* Chips sélectionnées (Select2) */
body .hp-form--listing-update .select2-selection__choice,
body .hp-form--listing-submit .select2-selection__choice,
body .hp-form--listing-edit .select2-selection__choice{
  display:none !important; /* évite les tags en double */
}

/* Tags sélectionnés (chips sous le champ) */
body .hp-form--listing-update .hr-tags-selected,
body .hp-form--listing-submit .hr-tags-selected,
body .hp-form--listing-edit .hr-tags-selected{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:8px;
}
body .hp-form--listing-update .hr-tag-selected,
body .hp-form--listing-submit .hr-tag-selected,
body .hp-form--listing-edit .hr-tag-selected{
  border-radius:999px;
  padding:6px 12px;
  font-size:.86rem;
  background:#fff;
  border:1px solid rgba(76,111,255,.22);
  color:#1d2850;
  display:inline-flex;
  align-items:center;
  gap:6px;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .12s ease;
}
body .hp-form--listing-update .hr-tag-selected:hover,
body .hp-form--listing-submit .hr-tag-selected:hover,
body .hp-form--listing-edit .hr-tag-selected:hover{
  background:rgba(76,111,255,.08);
  border-color:rgba(76,111,255,.45);
  transform:translateY(-1px);
}
body .hp-form--listing-update .hr-tag-selected__remove,
body .hp-form--listing-submit .hr-tag-selected__remove,
body .hp-form--listing-edit .hr-tag-selected__remove{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  border-radius:999px;
  background:rgba(76,111,255,.12);
  color:var(--hr-blue);
  font-weight:700;
  line-height:1;
}

/* Listing edit: éviter double encapsulation sur le champ localisation */
body .hp-form--listing-update .hp-form__field--location input,
body .hp-form--listing-submit .hp-form__field--location input,
body .hp-form--listing-edit .hp-form__field--location input{
  border:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  padding:0 !important;
}
body .hp-form--listing-update .hp-form__field--location .hp-field__input,
body .hp-form--listing-submit .hp-form__field--location .hp-field__input,
body .hp-form--listing-edit .hp-form__field--location .hp-field__input{
  padding:12px 16px !important;
}

/* Listing edit: keep suggestions visible under the field */
body .hp-form--listing-update .hp-tag-suggestions,
body .hp-form--listing-submit .hp-tag-suggestions,
body .hp-form--listing-edit .hp-tag-suggestions{
  display:block !important;
  margin-top:10px;
}

/* Listing edit: custom tags mode hides native list/select2 UI */
body .hp-form--listing-update .hp-form__field--tags.hr-tags-custom-mode .select2-container,
body .hp-form--listing-submit .hp-form__field--tags.hr-tags-custom-mode .select2-container,
body .hp-form--listing-edit .hp-form__field--tags.hr-tags-custom-mode .select2-container{
  display:none !important;
}
body .hp-form--listing-update .hp-form__field--tags.hr-tags-custom-mode select[name="tags[]"],
body .hp-form--listing-submit .hp-form__field--tags.hr-tags-custom-mode select[name="tags[]"],
body .hp-form--listing-edit .hp-form__field--tags.hr-tags-custom-mode select[name="tags[]"]{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* Listing edit: éviter double cadre pour tags (input wrapper) */
body .hp-form--listing-update .hp-form__field--tags .hp-field__input,
body .hp-form--listing-submit .hp-form__field--tags .hp-field__input,
body .hp-form--listing-edit .hp-form__field--tags .hp-field__input{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:0 !important;
}

/* Listing edit: selected popular tags remain visible with active state */
body .hp-form--listing-update .hp-tag-pill.is-selected,
body .hp-form--listing-submit .hp-tag-pill.is-selected,
body .hp-form--listing-edit .hp-tag-pill.is-selected{
  background:linear-gradient(90deg,#4c6fff,#5f8dff) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 10px 24px rgba(76,111,255,.26) !important;
}

/* Listing edit: quick entry for custom tags */
body .hp-form--listing-update .hr-tags-entry,
body .hp-form--listing-submit .hr-tags-entry,
body .hp-form--listing-edit .hr-tags-entry{
  margin-top:10px;
}
body .hp-form--listing-update .hr-tags-entry__input,
body .hp-form--listing-submit .hr-tags-entry__input,
body .hp-form--listing-edit .hr-tags-entry__input{
  width:100% !important;
  border:1px solid rgba(76,111,255,.28) !important;
  border-radius:14px !important;
  background:#fff !important;
  color:#1d2850 !important;
  padding:12px 14px !important;
  box-shadow:0 10px 26px rgba(15,23,42,.06) !important;
}
body .hp-form--listing-update .hr-tags-entry__input:focus,
body .hp-form--listing-submit .hr-tags-entry__input:focus,
body .hp-form--listing-edit .hr-tags-entry__input:focus{
  outline:none !important;
  border-color:rgba(76,111,255,.58) !important;
  box-shadow:0 0 0 3px rgba(76,111,255,.16),0 14px 30px rgba(76,111,255,.16) !important;
}

body .hp-form--listing-update .hr-tag-selected--custom,
body .hp-form--listing-submit .hr-tag-selected--custom,
body .hp-form--listing-edit .hr-tag-selected--custom{
  border-color:rgba(31,41,55,.24);
  background:rgba(15,23,42,.04);
}
body .hp-form--listing-update .hp-form__field--tags.hr-tags-custom-mode.hp-tags-error .hr-tags-entry__input,
body .hp-form--listing-submit .hp-form__field--tags.hr-tags-custom-mode.hp-tags-error .hr-tags-entry__input,
body .hp-form--listing-edit .hp-form__field--tags.hr-tags-custom-mode.hp-tags-error .hr-tags-entry__input{
  border-color:#e35656 !important;
  box-shadow:0 0 0 3px rgba(227,86,86,.16) !important;
}

/* Extras select: align arrow with text */
body .hp-form--listing-update .hp-field--repeater select,
body .hp-form--listing-submit .hp-field--repeater select,
body .hp-form--listing-edit .hp-field--repeater select{
  height:44px !important;
  line-height:44px !important;
  background-position:right 14px calc(50% - 1px) !important;
  padding-right:40px !important;
}

/* Extras select2 arrow alignment (si select2 est utilisé) */
body .hp-form--listing-update .hp-field--repeater .select2-container--default .select2-selection--single,
body .hp-form--listing-submit .hp-field--repeater .select2-container--default .select2-selection--single,
body .hp-form--listing-edit .hp-field--repeater .select2-container--default .select2-selection--single{
  height:44px !important;
  display:flex !important;
  align-items:center !important;
}
body .hp-form--listing-update .hp-field--repeater .select2-container--default .select2-selection--single .select2-selection__arrow,
body .hp-form--listing-submit .hp-field--repeater .select2-container--default .select2-selection--single .select2-selection__arrow,
body .hp-form--listing-edit .hp-field--repeater .select2-container--default .select2-selection--single .select2-selection__arrow{
  top:50% !important;
  transform:translateY(-50%) !important;
}
body .hp-form--listing-update .hp-field--repeater .select2-container--default .select2-selection--single .select2-selection__arrow b,
body .hp-form--listing-submit .hp-field--repeater .select2-container--default .select2-selection--single .select2-selection__arrow b,
body .hp-form--listing-edit .hp-field--repeater .select2-container--default .select2-selection--single .select2-selection__arrow b{
  margin-top:0 !important;
}

body .hp-form--listing-update .select2-selection__choice__remove,
body .hp-form--listing-submit .select2-selection__choice__remove,
body .hp-form--listing-edit .select2-selection__choice__remove{
  color:#4c6fff !important;
  margin-right:6px !important;
}

body .hp-form--listing-update .select2-selection__choice__remove:hover,
body .hp-form--listing-submit .select2-selection__choice__remove:hover,
body .hp-form--listing-edit .select2-selection__choice__remove:hover{
  color:#1d2850 !important;
}

/* Dropdown tags (class ajoutée en JS) */
.select2-dropdown.hr-tags-dropdown{
  border-radius:16px !important;
  border:1px solid rgba(76,111,255,.18) !important;
  box-shadow:0 22px 50px rgba(15,23,42,.16) !important;
  overflow:hidden !important;
}

.select2-dropdown.hr-tags-dropdown .select2-search__field{
  border-radius:12px !important;
  border:1px solid rgba(76,111,255,.22) !important;
  padding:8px 10px !important;
}

.select2-dropdown.hr-tags-dropdown .select2-results__option{
  padding:10px 12px !important;
  margin:4px 6px !important;
  border-radius:10px !important;
  font-size:13px;
}

.select2-dropdown.hr-tags-dropdown .select2-results__option--highlighted.select2-results__option--selectable{
  background:rgba(76,111,255,.08) !important;
  color:#1d2850 !important;
}

.select2-dropdown.hr-tags-dropdown .select2-results__option--selected{
  background:rgba(76,111,255,.14) !important;
  color:var(--hr-blue) !important;
  font-weight:600;
}













/*********************************
 * HOMERENTAI — UPLOAD IMAGES TILE (Listing Edit)
 *********************************/

/* Cible uniquement le champ Images (attachment upload) */
.hp-form__field--attachment-upload .hp-field--attachment-upload{
  --hp-thumb: clamp(96px, 10vw, 132px);
  --hp-radius: 14px;
  --hp-gap: 18px;
}

/* Le conteneur des vignettes devient un vrai layout propre */
.hp-form__field--attachment-upload .hp-row[data-component="sortable"]{
  display: flex !important;
  flex-wrap: wrap;
  gap: var(--hp-gap) !important;
  align-items: flex-start;
}

/* Chaque élément du flux (image + états upload) garde une tuile stable */
.hp-form__field--attachment-upload .hp-row[data-component="sortable"] > *{
  flex: 0 0 var(--hp-thumb) !important;
  width: var(--hp-thumb) !important;
  max-width: var(--hp-thumb) !important;
  padding: 0 !important;
  position: relative;
  overflow: hidden;
}

/* Les placeholders transitoires serveur restent masqués (on affiche notre tile de progression) */
.hp-form__field--attachment-upload .hp-row[data-component="sortable"] > *.hr-upload-ghost{
  display:none !important;
}

/* Image thumbnail toujours carrée et clean */
.hp-form__field--attachment-upload .hp-row[data-component="sortable"] > * img{
  width: 100% !important;
  height: var(--hp-thumb) !important;
  object-fit: cover !important;
  border-radius: var(--hp-radius) !important;
  display: block;
}
.hp-form__field--attachment-upload .hp-row[data-component="sortable"] > * > div:first-child{
  width:100% !important;
  height:var(--hp-thumb) !important;
  border-radius: var(--hp-radius) !important;
  overflow:hidden !important;
}

/* Bouton supprimer en haut à droite des vignettes */
.hp-form__field--attachment-upload .hp-row[data-component="sortable"] > * .hp-field__button--delete{
  position: absolute !important;
  top: 6px !important;
  right: 6px !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 999px !important;
  display: grid !important;
  place-items: center !important;
  background: rgba(15,23,42,.78) !important;
  color: #fff !important;
  text-decoration: none !important;
  box-shadow: 0 6px 16px rgba(15,23,42,.22) !important;
}
.hp-form__field--attachment-upload .hp-row[data-component="sortable"] > * .hp-field__button--delete .hp-icon{
  font-size: 0.85rem !important;
  color: inherit !important;
}
.hp-form__field--attachment-upload .hp-row[data-component="sortable"] > * .hp-field__button--download{
  position:absolute !important;
  top:40px !important;
  right:6px !important;
}

/* Bouton "Choisir des images" : même style que réglages (image profil) */
body .hp-page__content .hp-form--listing-update .hp-form__field--attachment-upload .hp-field--button.button,
body .hp-page__content .hp-form--listing-edit .hp-form__field--attachment-upload .hp-field--button.button,
body .hp-page__content .hp-form--listing-submit .hp-form__field--attachment-upload .hp-field--button.button,
body .hp-page__content .hp-form--listing-update .hp-form__field--attachment-upload label > .button,
body .hp-page__content .hp-form--listing-edit .hp-form__field--attachment-upload label > .button,
body .hp-page__content .hp-form--listing-submit .hp-form__field--attachment-upload label > .button,
body .hp-page__content .hp-form--listing-update .hp-form__field--attachment-upload label > button,
body .hp-page__content .hp-form--listing-edit .hp-form__field--attachment-upload label > button,
body .hp-page__content .hp-form--listing-submit .hp-form__field--attachment-upload label > button{
  width:auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:44px !important;
  padding:12px 18px !important;
  border:1.5px solid #4c6fff !important;
  border-radius:999px !important;
  background:#fff !important;
  color:#4c6fff !important;
  box-shadow:none !important;
  font-weight:700 !important;
  letter-spacing:.01em !important;
  text-decoration:none !important;
  transition:transform .15s ease, background .2s ease, box-shadow .2s ease !important;
}
body .hp-page__content .hp-form--listing-update .hp-form__field--attachment-upload .hp-field--button.button span,
body .hp-page__content .hp-form--listing-edit .hp-form__field--attachment-upload .hp-field--button.button span,
body .hp-page__content .hp-form--listing-submit .hp-form__field--attachment-upload .hp-field--button.button span{
  color:inherit !important;
}
body .hp-page__content .hp-form--listing-update .hp-form__field--attachment-upload .hp-field--button.button:hover,
body .hp-page__content .hp-form--listing-edit .hp-form__field--attachment-upload .hp-field--button.button:hover,
body .hp-page__content .hp-form--listing-submit .hp-form__field--attachment-upload .hp-field--button.button:hover,
body .hp-page__content .hp-form--listing-update .hp-form__field--attachment-upload label > .button:hover,
body .hp-page__content .hp-form--listing-edit .hp-form__field--attachment-upload label > .button:hover,
body .hp-page__content .hp-form--listing-submit .hp-form__field--attachment-upload label > .button:hover,
body .hp-page__content .hp-form--listing-update .hp-form__field--attachment-upload label > button:hover,
body .hp-page__content .hp-form--listing-edit .hp-form__field--attachment-upload label > button:hover,
body .hp-page__content .hp-form--listing-submit .hp-form__field--attachment-upload label > button:hover{
  transform:translateY(-1px) !important;
  background:rgba(76,111,255,.06) !important;
  box-shadow:0 14px 36px rgba(76,111,255,.22) !important;
}

/* --- Add tile --- */
.hr-add-tile{
  position: relative;
  flex: 0 0 var(--hp-thumb);
  width: var(--hp-thumb);
  height: var(--hp-thumb);
  border-radius: var(--hp-radius);
  border: 1.5px dashed rgba(76,111,255,.35);
  background: rgba(76,111,255,.05);
  display: grid;
  place-items: center;
  cursor: pointer;
  user-select: none;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

.hr-add-tile:hover{
  transform: translateY(-1px);
  background: rgba(76,111,255,.08);
  box-shadow: 0 12px 28px rgba(15,23,42,.08);
}

.hr-add-tile__inner{
  position:relative;
  width:100%;
  height:100%;
}

.hr-add-tile__plus{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width: 46px;
  height: 46px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  font-size: 26px;
  line-height: 1;
  color: #1f2a44;
  background: rgba(255,255,255,.9);
  box-shadow: 0 10px 20px rgba(15,23,42,.08);
}

.hr-add-tile__label{
  position:absolute;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  white-space:nowrap;
  font-size: 13px;
  color: rgba(31,42,68,.75);
}

/* input invisible MAIS cliquable via le tile */
.hr-add-tile input[type="file"]{
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

/* --- Upload overlay / progress --- */
.hr-add-tile__overlay{
  position: absolute;
  inset: 0;
  border-radius: var(--hp-radius);
  background: rgba(255,255,255,.85);
  display: none;
  align-content: center;
  justify-items: center;
  padding: 14px;
  gap: 10px;
}

.hr-add-tile.is-uploading .hr-add-tile__overlay{
  display: grid;
}

/* Spinner */
.hr-spinner{
  width: 22px;
  height: 22px;
  border-radius: 999px;
  border: 2px solid rgba(76,111,255,.25);
  border-top-color: rgba(76,111,255,.95);
  animation: hrspin .8s linear infinite;
}

@keyframes hrspin { to { transform: rotate(360deg); } }

/* Progress bar */
.hr-progress{
  width: 100%;
  height: 8px;
  border-radius: 999px;
  background: rgba(15,23,42,.08);
  overflow: hidden;
}

.hr-progress > span{
  display: block;
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, rgba(76,111,255,.9), rgba(76,111,255,.55));
  border-radius: 999px;
  transition: width .12s ease;
}

.hr-progress__txt{
  font-size: 12px;
  color: rgba(31,42,68,.75);
}

/* ---------------------------------------------------
   Mobile optimisation: edit listing page
--------------------------------------------------- */
@media (max-width: 768px){
  .hp-page__topbar.hp-page__topbar--separate{
    flex-direction:column !important;
    align-items:stretch !important;
    gap:10px !important;
  }

  .hp-page__topbar--separate .hp-menu--tabbed{
    width:100% !important;
    margin:0 !important;
    padding:6px !important;
    border:1px solid rgba(180,194,226,.55) !important;
    border-radius:14px !important;
    background:#fff !important;
    box-shadow:0 10px 24px rgba(15,23,42,.08) !important;
  }
  .hp-page__topbar--separate .hp-menu--tabbed > ul{
    display:flex !important;
    align-items:center !important;
    gap:6px !important;
    width:100% !important;
  }
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item{
    flex:1 1 0 !important;
    margin:0 !important;
    padding:0 !important;
  }
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item > a{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:40px !important;
    padding:0 12px !important;
    border:0 !important;
    border-radius:10px !important;
    background:transparent !important;
    color:#5e6c89 !important;
    font-size:14px !important;
    line-height:1 !important;
    font-weight:700 !important;
    text-decoration:none !important;
    transition:background-color .16s ease, color .16s ease, box-shadow .16s ease !important;
  }
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item > a span{
    color:inherit !important;
  }
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item > a:hover{
    background:rgba(76,111,255,.09) !important;
    color:#2f4edd !important;
  }
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item--current > a,
  .hp-page__topbar--separate .hp-menu--tabbed .current-menu-item > a,
  .hp-page__topbar--separate .hp-menu--tabbed .current_page_item > a,
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item.active > a,
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item.is-active > a,
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item.hr-tab-active > a,
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item > a[aria-current="page"],
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item > a[aria-current="true"],
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item > a.hr-tab-active-link{
    background:linear-gradient(135deg,#4c6fff 0%,#3252de 100%) !important;
    color:#fff !important;
    box-shadow:0 8px 18px rgba(62,93,224,.24) !important;
  }
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item--current > a span,
  .hp-page__topbar--separate .hp-menu--tabbed .current-menu-item > a span,
  .hp-page__topbar--separate .hp-menu--tabbed .current_page_item > a span,
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item.active > a span,
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item.is-active > a span,
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item.hr-tab-active > a span,
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item > a[aria-current="page"] span,
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item > a[aria-current="true"] span,
  .hp-page__topbar--separate .hp-menu--tabbed .hp-menu__item > a.hr-tab-active-link span{
    color:#fff !important;
  }

  .hp-page__topbar--separate .hp-listing__actions--secondary{
    width:100%;
    justify-content:space-between;
    gap:8px !important;
  }
  .hp-page__topbar--separate .hp-listing__actions--secondary .hp-listing__action{
    flex:1 1 calc(50% - 4px);
    text-align:center;
  }

  .hp-form__field--attachment-upload .hp-field--attachment-upload{
    --hp-thumb: 104px;
    --hp-gap: 12px;
  }

  .hr-add-tile__plus{
    width:42px;
    height:42px;
    font-size:24px;
  }
  .hr-add-tile__label{
    bottom:14px;
    font-size:12px;
  }
}

