/* ==================================================
   MES GARDES – VARIABLES MÉTIER
   (branchées sur le thème global Elementor)
================================================== */

.mes-gardes {

  /* Couleurs globales */
  --mg-color-primary: var(--e-global-color-primary);
  --mg-color-accent: var(--e-global-color-accent);
  --mg-color-text: var(--e-global-color-text);
  --mg-color-muted: var(--e-global-color-cd1c9dc);
  --mg-color-border: var(--e-global-color-b6f6d12);
  --mg-color-bg-grey: #EDECEC;

  /* Typographies */
  --mg-font-title: var(--e-global-typography-primary-font-family);
  --mg-font-text: var(--e-global-typography-text-font-family);

  /* UI */
  --mg-radius: 16px;

  /* ==========================
     STATUTS – COULEURS FIXÉES
  ========================== */

  /* Nouvelle demande */
  --mg-status-new-bg: #FEF8EE;
  --mg-status-new-badge: #FFE4A7;

  /* Garde confirmée */
  --mg-status-confirmed-bg: #F0F7EE;
  --mg-status-confirmed-badge: #72B79B;

  /* Demande refusée */
  --mg-status-refused-bg: #FDEDEA;
  --mg-status-refused-badge: #E18072;

  /* Garde en cours */
  --mg-status-progress-bg: #EBF0EE;
  --mg-status-progress-badge: #8FB3B8;

  /* En attente confirmation */
  --mg-status-waiting-bg: #FFEBE0;
  --mg-status-waiting-badge: #FFA36A;

  /* Garde terminée */
  --mg-status-done-bg: #E8E6E6;
  --mg-status-done-badge: #4C4F4F;

  /* Garde annulée */
  --mg-status-cancelled-bg: #F5F1ED;
  --mg-status-cancelled-badge: #E2CDA6;
  
  
}

.gardes-exchanges {
    /* ==================================================
       ÉCHANGES – COULEURS
    ================================================== */
    
      /* Propriétaire */
      --msg-owner-bg: #ffffff;
      --msg-owner-border: var(--e-global-color-primary);
      --msg-owner-text: var(--e-global-color-text);
    
      /* Petsitter */
      --msg-sitter-bg: #DEE8E8;
      --msg-sitter-border: var(--e-global-color-primary);
      --msg-sitter-text: var(--e-global-color-text);
    
      /* Système Blooming Pets */
      --msg-system-bg: #f7f7f7;
      --msg-system-border: var(--e-global-color-b6f6d12);
      --msg-system-text: #4E5652;
    
      /* Date / séparateur */
      --msg-date-text: var(--e-global-color-cd1c9dc);
}

/* ==================================================
   BASE
================================================== */

.mes-gardes {
  padding: 16px;
  font-family: var(--mg-font-text);
  color: var(--mg-color-text);
}

/* ==================================================
   HEADER
================================================== */

.mes-gardes-header {
  margin-bottom: 24px;
}

.mes-gardes-title {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;

  font-family: var(--mg-font-title);
  font-size: 26px;
  font-weight: normal;
  line-height: 1.2;
  color: var(--mg-color-primary);
}

.mes-gardes-title .blooming {
  font-size: 1.3em;
  line-height: 1;
}

.mes-gardes-separator {
  display: block;
  width: 100%;
  height: 3px;
  background: var(--mg-color-accent);
  border-radius: 999px;
  margin: 10px 0 14px;
}

.mes-gardes-back-and-user-block{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.mes-gardes-filtre, .mes-gardes-back{
  display: inline-block;
  padding: 8px 15px !important;
  border-radius: 999px !important;

  background: var(--e-global-color-b6f6d12) !important;
  color: var(--mg-color-text) !important;
  text-decoration: none !important;

  font-size: 14px;
  font-weight: 500;
  line-height: 21px !important;

  transition: opacity .2s ease;
  white-space: nowrap;
}

.mes-gardes-filtre i{font-size: 20px; font-weight: bold;}

.mes-gardes-filtre{
    background: var(--e-global-color-b6f6d12) !important;
    
}
.mes-gardes-filtre:hover, .mes-gardes-back:hover{
    background: var(--mg-color-accent) !important;
    color: #fff !important;
    
}

/* État actif du filtre */
.mes-gardes-filtre.is-active , .mes-gardes-back {
  background: var(--mg-color-primary) !important;
  color: #fff !important;
}

/* ==================================================
   GARDE CARD – STRUCTURE
================================================== */

.garde-card {
  border-radius: var(--mg-radius);
  padding: 14px 14px 12px;
  box-shadow: 0 6px 16px rgba(0,0,0,.2);
  margin: 0px 10px 20px;
}

/* ===== Fonds par statut ===== */

.garde-card.is-new-request { background: var(--mg-status-new-bg); }
.garde-card.is-confirmed   { background: var(--mg-status-confirmed-bg); }
.garde-card.is-refused     { background: var(--mg-status-refused-bg); }
.garde-card.is-in-progress { background: var(--mg-status-progress-bg); }
.garde-card.is-waiting     { background: var(--mg-status-waiting-bg); }
.garde-card.is-done        { background: var(--mg-status-done-bg); }
.garde-card.is-cancelled, .garde-card.is-bp-cancelled   { background: var(--mg-status-cancelled-bg); }

/* ==================================================
   TOP (icône + titre)
================================================== */
.garde-card__link{
    display: block;
    text-decoration: none !important;
    color: inherit !important;
}

.garde-card__top {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 10px;
  margin-bottom: 10px;
}

.garde-card__icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  position: relative;
}

.garde-card__icon .blooming {
  font-size: 44px;
  color: var(--mg-color-primary);
}

.garde-card__label {
  font-size: 13px;
  line-height: 1.25;
}

.garde-card__animals {
  display: block;
  font-weight: 600;
  color: var(--mg-color-primary);
}

.garde-card__wrong-price {
  display: block;
  font-size: 12px;
  font-style: italic;
  color: var(--mg-color-text);
  padding: 10px 0px;
  text-align: center;
  line-height: 15px;
}

/* ==================================================
   META INFOS
================================================== */

.garde-card__meta {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 10px 14px;
  margin: 10px 0 12px;
}

.garde-card__meta-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  line-height: 16px;
}

.garde-card__meta-item .blooming {
  font-size: 30px;
  color: var(--e-global-color-9b8eebd);
}

/* ==================================================
   BOTTOM (badge + action)
================================================== */

.garde-card__bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--mg-color-border);
}

/* ===== Badge ===== */

.garde-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 15px 5px 10px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: bold;
  font-style: italic;
  color: black;
  line-height: 1;
  white-space: nowrap;
}
.garde-badge i{font-size: 25px;}

/* Badges par statut */
.garde-badge--new        { background: var(--mg-status-new-badge); }
.garde-badge--confirmed { background: var(--mg-status-confirmed-badge); color:#fff; }
.garde-badge--refused   { background: var(--mg-status-refused-badge); color:#fff; }
.garde-badge--progress  { background: var(--mg-status-progress-badge); color:#fff; }
.garde-badge--waiting   { background: var(--mg-status-waiting-badge); color:#fff;}
.garde-badge--done      { background: var(--mg-status-done-badge); color:#fff; }
.garde-badge--cancelled { background: var(--mg-status-cancelled-badge); }
.garde-badge--bp-cancelled { background: var(--mg-status-cancelled-badge); }

.garde-card__sticky{
    position: sticky;
    top: 0;
    z-index: 5;
}

.garde-card__sticky.is-fixed {
    position: fixed;
    top: -180px; /* hauteur header mobile */
    left: 0;
    right: 0;
    z-index: 9999999;

}


/** ==================================================
   BLOC NOUVEAU PRIX (sticky) 
**================================================== */
.garde-card__new-price{
  position: sticky;
  top: 250px;
  z-index: 4;
  background-color: #FFF7AF;
  padding: 15px;
  border-radius: var(--mg-radius);
  box-shadow: 0 6px 16px rgba(0,0,0,.2);
  color: #000000;
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 10px;
}
.garde-card__new-price--hidden{
    display: none;
} 

.garde-card__new-price.is-fixed {
    position: fixed;
    top: 70px; /* hauteur header mobile */
    left: 15px;
    right: 15px;
    z-index: 9999998;

}

.garde-card__icon-new-price {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
}

.garde-card__icon-new-price .blooming {
  font-size: 44px;
  color: #000000;
}
.garde-card__label-new-price {
    font-size: 13px;
    line-height: 2;
    color: var(--mg-color-text);
}
.garde-card__label-new-price h4{
    font-family: var(--mg-font-text) !important;
    font-size: 16px !important;
    font-weight: bold;
    color: #000000;
    margin: 0px;
}

/** ==================================================
   BLOC VERT Rencontre confirmé (sticky) 
**================================================== */
.garde-card__meeting-confirmed{
  position: sticky;
  top: 250px;
  z-index: 4;
  background-color: var(--mg-status-confirmed-bg);
  padding: 15px;
  border-radius: var(--mg-radius);
  box-shadow: 0 6px 16px rgba(0,0,0,.2);
  color: #000000;
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 10px;
}
.garde-card__meeting-confirmed--hidden{
    display: none;
} 

.garde-card__meeting-confirmed.is-fixed {
    position: fixed;
    top: 70px; /* hauteur header mobile */
    left: 15px;
    right: 15px;
    z-index: 9999998;

}

.garde-card__icon-meeting-confirmed {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
}

.garde-card__icon-meeting-confirmed .blooming {
  font-size: 44px;
  color: var(--mg-color-primary);
}
.garde-card__label-meeting-confirmed {
    font-size: 13px;
    line-height: 2;
    color: var(--mg-color-text);
}
.garde-card__label-meeting-confirmed h4{
    font-family: var(--mg-font-text) !important;
    font-size: 16px !important;
    font-weight: bold;
    color: var(--mg-color-primary);
    margin: 0px;
}

/* ==================================================
   AFFICHER PLUS DE DÉTAILS
================================================== */

.garde-details-toggle, .garde-details-toggle-bt {
  display: inline-flex;
  align-items: center;
  gap: 8px;

  background: transparent !important;
  border: 0;
  padding: 6px 10px !important;
  cursor: pointer;

  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--mg-color-text) !important;

  border-radius: 6px !important;
  transition: background .2s ease, color .2s ease;
  text-decoration: none !important;
  line-height: 16px !important;
  min-height: 50px;
}

.garde-details-toggle__user-block {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 10px;
    background-color: #ffffff;
    border: 1px solid #eaeaea;
    border-radius: 10px;
    min-width: 200px;
}

.garde-details-toggle__user-profile-link{
    display: block;
    font-size: 12px !important;
    background-color: var(--e-global-color-secondary);
    padding: 0px 5px;
    line-height: 15px !important;
    width: 65%;
    min-width: 95px;
    border: 1px solid var(--e-global-color-primary);
    border-radius: 5px;
    text-align: center;
    text-decoration: none !important;
}

.garde-details-toggle:hover {
  background: rgba(0,0,0,0.04) !important;
}

.garde-details-toggle:active {
  transform: scale(0.97);
}
.garde-details-toggle__user{
    line-height: 14px;
}
.garde-details-toggle__user-type{
    font-size: 10px;
    color: var(--mg-color-muted);
    font-style: italic;
}
.garde-details-toggle img, .garde-details-toggle__user-block img{ border-radius: 100%;}
    
/* Chevron */
.garde-details-toggle__chev, .garde-details-toggle__chev-right {
  width: 15px;
  min-width: 15px;
  height: 15px;
  border-right: 3.5px solid var(--mg-color-text);
  border-bottom: 3.5px solid var(--mg-color-text);
  transform: rotate(45deg);
  margin-top: -8px;
}

.garde-details-toggle__chev-right {
    transform: rotate(-45deg);
    margin-top: -2px;
}

.garde-details-toggle[aria-expanded="true"] .garde-details-toggle__chev {
  transform: rotate(-135deg);
  margin-top: 2px;
}

/* ==================================================
   DÉTAILS DE GARDE – VERSION SIMPLE
================================================== */

.garde-details {
  margin-top: 14px;
  padding-top: 14px;
  animation: fadeIn .2s ease;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Wrapper des sections */
.garde-details-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

/* Mobile : une colonne */
@media (max-width: 768px) {
  .garde-details-grid {
    grid-template-columns: 1fr;
  }
}

/* Sections */
.garde-details-section {
  font-size: 13px;
  background-color: #fafafa;
  border-radius: 10px;
  border: 1px dashed var(--mg-color-border);
  padding: 10px;
}

/* Titres */
.garde-details-title {
  margin: 0 0 8px;
  font-size: 15px;
  font-weight: bold;
  color: var(--mg-color-primary);
}

/* Listes */
.garde-details-list,
.garde-details-pricing,
.garde-details-animals {
  list-style: none;
  padding: 0;
  margin: 0 0 8px;
}

.garde-details-animals .name{
    font-weight: bold;
    color: var(--e-global-color-primary);
    font-size: 19px;
}

.garde-details-list li,
.garde-details-pricing li,
.garde-details-animals li {
  padding: 4px 0;
  line-height: 1.35;
}

/* Note */
.garde-details-note {
  font-size: 12px;
  font-style: italic;
  color: var(--mg-color-muted);
}

/* Ligne non tarifée */
.garde-details-pricing .is-warning {
  color: var(--mg-status-refused-badge);
  font-style: italic;
}

/* Réduction */
.garde-details-discount {
  margin-top: 6px;
  font-weight: 600;
  color: var(--mg-color-primary);
}

.garde-details-total{
    font-size: 15px;
    font-weight: bold;
    background-color: #ffffff;
    padding: 10px;
    border-radius: 10px;
    border: 1px dashed var(--mg-color-border);
    
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}
.garde-details-total i{
    font-size: 25px;
}
.garde-details-total__comment{
    font-size: 12px;
    font-weight: normal;
    font-style: italic;
    color: var(--mg-color-muted);
    margin-left: auto;
}


/* ==================================================
   ÉCHANGES – NOUVEAU SYSTÈME (iMessage exact)
================================================== */

.gardes-exchanges {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin: 10px;
}

/* Date */
.exchange-date {
  text-align: center;
  font-size: 12px;
  color: var(--e-global-color-cd1c9dc);
  margin: 10px 0 0;
}

/* Wrapper */
.exchange {
  display: flex;
}

/* Alignements */
.exchange--owner { justify-content: flex-start; }
.exchange--sitter { justify-content: flex-end; }


/* Unread*/
.garde-card__unread-messages-badge{
  font-size: 12px;
  color: #fff;
  border: 1px solid #fff;
  font-weight: 900;
  width: 20px;
  background: #d9534f;
  height: 20px;
  text-align: center;
  border-radius: 20px;
  line-height: 17px;
  display: block;
  position: absolute;
  left: 30px;
  top: -5px;
  padding: 0px 2px;
}

.exchange-unread-wrapper {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 20px 0;
}

.exchange-unread-wrapper::before,
.exchange-unread-wrapper::after {
  content: "";
  flex: 1;
  height: 1px;
  background: #D9D9D9;
}

.exchange-unread-wrapper::before {
  margin-right: 15px;
}

.exchange-unread-wrapper::after {
  margin-left: 15px;
}

.exchange-unread-badge {
  display: inline-block;
  border: 1px solid #D9D9D9;
  background: #F7F7F7;
  color: var(--e-global-color-primary);
  font-size: 14px;
  font-weight: bold;
  padding: 6px 14px;
  border-radius: 999px;
  white-space: nowrap;
}

/* ==================================================
   DIVIDER
================================================== */
.bp-divider-wrapper {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 20px 0;
}

.bp-divider-wrapper::before,
.bp-divider-wrapper::after {
  content: "";
  flex: 1;
  height: 1px;
  background: #D9D9D9;
}

.bp-divider-wrapper::before {
  margin-right: 15px;
}

.bp-divider-wrapper::after {
  margin-left: 15px;
}

.bp-divider-badge {
  display: inline-block;
  border: 1px solid #D9D9D9;
  background: #F7F7F7;
  color: var(--e-global-color-primary);
  font-size: 14px;
  font-weight: bold;
  padding: 6px 14px;
  border-radius: 999px;
  white-space: nowrap;
}

/* ==================================================
   BULLES (BASE COMMUNE)
================================================== */

.exchange-bubble {
  max-width: 78%;
  position: relative;
}

.exchange-bubble p {
  border-radius: 1.15rem;
  padding: 0.5rem 0.875rem;
  font-size: 14px;
  line-height: 1.35;
  position: relative;
  word-wrap: break-word;
  margin: 0px;
}
.exchange-bubble img {
  border-radius: 15px;
  margin-top: 10px;
  display: block;
  cursor: zoom-in;
}

/* Auteur */
.exchange-author {
  display: block;
  font-size: 12px;
  color: grey;
  line-height: 20px;
}

.exchange--sitter .exchange-author{
    text-align: right;
}

/* ==================================================
   PROPRIÉTAIRE – GAUCHE (from-them EXACT)
================================================== */

.exchange-bubble.from-owner p {
  background-color: var(--msg-owner-bg);
  color: var(--msg-owner-text);
  border: 1px solid var(--msg-owner-border);
  
}

/* Pointe */
.exchange-bubble.from-owner p::before {
  content: "";
  position: absolute;
  bottom: -0.1rem;
  left: -0.35rem;
  height: 1rem;
  border-bottom-right-radius: 0.8rem 0.7rem;
  border-left: 1rem solid var(--msg-owner-border);
  z-index: -1;
  transform: translate(0, -0.1rem);
}

.exchange-bubble.from-owner p::after {
  content: "";
  position: absolute;
  bottom: -0.1rem;
  left: 19px;
  width: 10px;
  height: 1rem;
  background-color: #fafafa;
  border-bottom-right-radius: 0.5rem;
  transform: translate(-30px, -2px);
}

/* ==================================================
   PET-SITTER – DROITE (from-me EXACT)
================================================== */

.exchange-bubble.from-sitter p {
  background-color: var(--msg-sitter-bg);
  color: var(--msg-sitter-text);
  border: 1px solid var(--msg-sitter-border);
}

/* Pointe */
.exchange-bubble.from-sitter p::before {
  content: "";
  position: absolute;
  bottom: -0.1rem;
  right: -0.34rem;
  height: 1rem;
  border-bottom-left-radius: 0.8rem 0.7rem;
  border-right: 1rem solid var(--msg-sitter-border);
  z-index: -1;
  transform: translate(0, -0.1rem);
}

.exchange-bubble.from-sitter p::after {
  content: "";
  position: absolute;
  bottom: -0.1rem;
  right: -41px;
  width: 10px;
  height: 1rem;
  background-color: #fafafa;
  border-bottom-left-radius: 0.5rem;
  transform: translate(-30px, -2px);
}

/* ==================================================
   MESSAGE SYSTÈME
================================================== */

.exchange--system {
  justify-content: center;
  line-height: 17px;
  position: relative;
  flex-wrap: wrap;
}
.exchange--system H2, .exchange--system H3, .exchange--system H4, .exchange--system H5{ margin: 0px !important; }

.exchange--system H3 {font-size: 13px !important; font-weight: bold !important; font-family: var(--mg-font-text) !important;}
.exchange--system H4{ font-size: 13px !important; font-weight: bold !important; color: #000000 !important; font-family: var(--mg-font-text) !important;}
.exchange-system-box {
  margin-top: 20px;
  background: #F6F2F0;
  border: 1px solid #DFDCDC;
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 13px;
  width: 100%;
}

.exchange-system-box-cs {
  padding: 15px;
  font-size: 13px;
  width: 100%;
  background-color: var(--e-global-color-cd1c9dc);
  color: #fafafa;
  border-radius: 10px;
  display: block;
  margin-top: 15px;
}
.exchange-system-box-cs h4{
  color: #fafafa !important;
  font-size: 15px !important;
}
.exchange--system .chien-tortue-bp {
  position: absolute;
  top: -57px;       
  right: -5px;      /* déborde légèrement à droite */
  width: 60px;
  z-index: 3;
  pointer-events: none;
}

.exchange-system-box-trans {
  padding: 15px 14px;
  font-size: 13px;
  width: 100%;
  border-top: 1px solid #D9D9D9;
  border-bottom: 1px solid #D9D9D9;

}

/* ==================================================
    ACTIONS SYSTÈME
================================================== */

.exchange-possible-actions{
  flex: 0 0 100%;
  width: 100%;
  min-width: 90%;
  margin-top: 30px;
  border-top: 1px solid var(--e-global-color-primary);
  border-bottom: 1px solid var(--e-global-color-primary);
  padding: 10px 0px;
  text-align: center;
  color: var(--e-global-color-primary);
  font-size: 13px;
  background-color: var(--mg-color-bg-grey);
}

.exchange-system-actions{
  display: flex;
  gap:20px;
  flex-wrap: wrap;
  margin-top: 20px;
  justify-content: center;
  width: 100%;
}

.exchange-action-form{
  margin: 0;
}

.elementor-button .blooming{
  font-size: 25px;
}


.bp-modal{
  margin: 20px 10px;
  padding: 10px 20px;
  min-width: 80%;
  border-top: 1px solid #D9D9D9;
}

.bp-modal__title{
    font-size: 18px;
    font-weight: bold;
}

.bp-modal label{
    font-size: 14px;
    font-weight: 500;
    display: block;
    padding: 15px 0px 5px 0px;
    font-family: var(--mg-font-text);
    color: #000000;
}
.bp-modal .span-label{
  margin-top: 10px;;

}
.bp-modal .bp-field input{
    width: 100%;
}
.bp-modal__actions{
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 20px;
}

.bp-quick-reasons {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}
.bp-quick-reason {
    padding: 6px 12px;
    background: #f0f0f0 !important;
    border: 1px solid #ddd !important;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    transition: all 0.2s;
}
.bp-quick-reason:hover {
    background: var(--e-global-color-secondary) !important;
    color: var(--e-global-color-primary) !important;
}


.exchange-messaging-block{
    margin-top: 0px;
}
.exchange-new-message-header{
    background: var(--mg-color-accent);
    color: #fff;
    padding: 12px 16px;
    border-radius: 12px 12px 0 0;
    font-weight: 600;
    font-size: 15px;
    line-height: 17px;
    text-align: center;
}
.exchange-new-message-header.is-disabled{
  background-color: var(--e-global-color-cd1c9dc) !important;
  color: var(--e-global-color-9b8eebd) !important;
  opacity: 0.6;
  filter: grayscale(0.3) brightness(1.15);
  pointer-events: none;
}
.exchange--new-message.is-disabled {
  background-color: var(--e-global-color-cd1c9dc) !important;
  color: var(--e-global-color-9b8eebd) !important;
  opacity: 0.6;
  filter: grayscale(0.3) brightness(1.15);
  pointer-events: none;
}
.exchange--new-message {
    width: 100%;
    background-color: var(--mg-color-bg-grey);
    display: block;
    padding: 20px;
    border-radius: 0px 0px 16px 16px;
    box-shadow: 0 6px 16px rgba(0,0,0,.08);
}
.new-message-form, .js-send-message{
    width: 100%;
}
.exchange--new-message H3 {margin: 0px 0px 10px 0px; font-size: 13px !important; font-weight: bold; font-family: var(--mg-font-text) !important;}
.exchange--new-message H4 {margin: 0px 0px 10px 0px; font-size: 13px !important; font-weight: bold; color: #000000; font-family: var(--mg-font-text) !important;}

.exchange--new-message P {font-size: 14px !important; line-height: 15px;}
.exchange--new-message textarea{
    font-family: var(--mg-font-text);
    font-size: 13px;
    margin-bottom: 15px;
}

.exchange-attachment-wrapper {
    margin: 10px 0 15px;
}

.exchange-attachment-label {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  background: #F7F7F7 !important;
  border: 1px solid #DDD;
  padding: 6px 12px !important;
  border-radius: 20px;
  font-size: 14px !important;
  transition: all 0.2s ease;
}

.exchange-attachment-label:hover {
  background: #eee;
}

.exchange-attachment-label.has-file {
  background: #e6f4ff;
  border-color: var(--e-global-color-primary);
  color: var(--e-global-color-primary);
  font-weight: 600;
}

.exchange-attachment-preview {
  margin-top: 8px;
}

.exchange-attachment-preview img {
  max-width: 140px;
  border-radius: 8px;
  display: block;
}
.exchange-remove-file {
  cursor:pointer;
  margin-top:4px;
  font-size:14px;
  color: #000000;
}
.exchange-remove-file-cross {
  color:red;
}
.bp-message-pop {
  opacity: 0;
  transform: scale(1.2) translateY(12px);
  animation: bpMessageIn 620ms cubic-bezier(.12, 1, .25, 1) forwards;
}

@keyframes bpMessageIn {
  55% {
    opacity: 1;
    transform: scale(0.97) translateY(0);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

/*Meeting block */
.bp-meeting-block, .bp-actions-group, .bp-del-memory-block, .bp-review-this-petsitter-block{
  flex: 0 0 100%;
  width: 100%;
  background: var(--mg-color-bg-grey);
  padding: 0px;
  border-radius: 16px;
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
  margin: 20px 0px;
}

.bp-meeting-header, .bp-actions-group__header{
  background: var(--mg-color-accent);
  color: #fff;
  padding: 12px 16px;
  border-radius: 12px 12px 0 0;
  font-weight: 600;
  font-size: 15px;
  text-align: center;
}

.bp-meeting-content, .bp-actions-group__content{
  padding: 15px;
}
.bp-meeting-message, .bp-actions-group__message{
  font-size: 14px !important;
  line-height: 15px;
  margin: 10px 0px;
}

.bp-meeting-dates{
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.bp-meeting-dates input{
  padding: 10px 14px;
  border-radius: 10px;
  border: 2px solid var(--mg-color-primary);
  font-family: var(--mg-font-text);
  font-size: 14px;
}

.bp-add-date,
.bp-submit-meeting{
  margin-top: 15px;
  padding: 12px 20px;
  border-radius: 999px;
  border: none;
  font-weight: 600;
  cursor: pointer;
}

.bp-add-date{
  background: #EDECEC;
  color: var(--mg-color-primary);
}

.bp-submit-meeting{
  background: #E7A08C;
  color: var(--mg-color-primary);
}

.bp-meeting__actions, .bp-actions-group__actions{
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 20px;
}

/* Souvenir block */

.bp-souvenir-title{
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 10px;
    display: block;
}
.bp-souvenir-message{
    font-size: 12px;
    font-weight: normal;
    margin: 15px;
    display: inline-block;
    background-color: #ffffff;
    padding: 10px;
    border-radius: 10px;
    width: 70%;
}
.bp-souvenir-picture{
    display: inline-block;
} 
.bp-souvenir-picture img{
    width: 100px;
    border-radius: 10px;
}

/*Meeting block */
.bp-choice-meeting-block{
  flex: 0 0 100%;
  width: 100%;
  background: var(--mg-color-bg-grey);
  padding: 0px;
  border-radius: 16px;
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
  margin: 20px 0px;
}
.bp-meeting-choices {
    display:flex;
    gap:14px 6px;
    margin:20px 0;
    flex-wrap:wrap;
}

.bp-meeting-choice input {
    display:none;
}

.bp-meeting-choice-button {
    display:inline-block;
    padding:12px 20px;
    border-radius:30px;
    background: var(--e-global-color-secondary);
    border: 1px solid #ffff;
    cursor:pointer;
    transition:all .2s ease;
}

.bp-meeting-choice input:checked + .bp-meeting-choice-button {
    background:#8aa6a0;
    color:#fff;
    font-weight: bold;
}

.bp-field--comment{
    margin-top: 15px;
    border-top: 1px solid #D9D9D9;
    padding-top: 15px;
}
.bp-field--comment label{
  line-height: 30px;
}

.blooming-camera {
  color: var(--e-global-color-primary);
  animation: rafale 4s infinite; /* 1s pour les flashes + 3s de pause */
}
@keyframes rafale {
  0%, 30% { opacity: 1; color: var(--e-global-color-primary); } /* État normal */
  32% { opacity: 1; color: white; text-shadow: 0 0 10px white; } /* Flash 1 */
  34% { opacity: 1; color: var(--e-global-color-primary); }
  36% { opacity: 1; color: white; text-shadow: 0 0 10px white; } /* Flash 2 */
  38% { opacity: 1; color: var(--e-global-color-primary); }
  40% { opacity: 1; color: white; text-shadow: 0 0 10px white; } /* Flash 3 */
  42%, 100% { opacity: 1; color: var(--e-global-color-primary); } /* Pause jusqu'à la fin */
}


@media only screen and (max-width: 768px) {/* iPhone: */
  .mes-gardes { padding: 5px;}

  .bp-action, .bp-action button {width: 100%;}
  .bp-action, .bp-action button .elementor-button-content-wrapper{justify-content: left;}
  .bp-meeting__actions, .bp-actions-group__actions{
    flex-direction: column;
    align-items: stretch;
  }
}