
/* =========================================================
   WPZ Forum — Composer "type X/Facebook" (LIGHT)
   - Champ + bouton send intégré en bas à droite
   - Bloc "Vous répondez à ..." + extrait du message
   - Mobile : panneau plein écran stable (100dvh + safe-area)
   ========================================================= */

[data-wpz-thread-composer][hidden]{ display:none !important; }

.wpz-composer-x, .wpz-composer-x *{ box-sizing:border-box; }

/* Base container */
.wpz-composer-x{
  position:relative;
  z-index:60;
  font-family:inherit;
}

/* Backdrop (desktop off) */
.wpz-composer-x__backdrop{ display:none; }

/* Panel */
.wpz-composer-x__panel{
  width:100%;
  max-width:none;
  background:var(--wpz-bg, #ffffff);
  border:1px solid rgba(0,0,0,.12);
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.10);
}

/* Topbar */
.wpz-composer-x__topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  background:var(--wpz-bg, #ffffff);
  border-bottom:1px solid rgba(0,0,0,.08);
}

.wpz-composer-x__title{
  font-weight:900;
  color:rgba(0,0,0,.86);
  letter-spacing:.2px;
}

.wpz-composer-x__close{
  width:40px;
  height:40px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.10);
  background:#f3f4f6;
  color:rgba(0,0,0,.88);
  font-size:22px;
  line-height:1;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.wpz-composer-x__close:active{ transform:translateY(1px); }

/* Reply-to context */
.wpz-composer-x__replyto{
  padding:12px 14px;
  background:#eef0f3;
  border-bottom:1px solid rgba(0,0,0,.08);
}

.wpz-composer-x__replyto-head{
  display:flex;
  align-items:baseline;
  gap:8px;
  flex-wrap:wrap;
  font-size:.92rem;
  color:rgba(0,0,0,.64);
}

.wpz-composer-x__replyto-label{
  color:rgba(0,0,0,.62);
}

.wpz-composer-x__replyto-user{
  font-weight:900;
  color:var(--primary, #c0392b);
}

.wpz-composer-x__replyto-cancel{
  margin-left:auto;
  border:0;
  background:transparent;
  cursor:pointer;
  font-weight:800;
  color:rgba(0,0,0,.60);
  text-decoration:underline;
  text-underline-offset:3px;
  padding:0;
}

.wpz-composer-x__replyto-quote{
  margin-top:10px;
  padding:10px 12px;
  border:1px solid rgba(0,0,0,.10);
  border-radius:12px;
  background:rgba(255,255,255,.75);
  color:rgba(0,0,0,.72);
  font-size:.92rem;
  line-height:1.35;

  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* Body */
.wpz-composer-x__body{
  padding:12px 14px 14px;
  background:var(--wpz-bg, #ffffff);
}

/* Input wrap = textarea + send button inside */
.wpz-composer-x__inputwrap{
  position:relative;
  border:1px solid rgba(0,0,0,.14);
  border-radius:14px;
  background:#fff;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.02);
}

/* Focus */
.wpz-composer-x__inputwrap:focus-within{
  border-color:var(--primary, #c0392b);
  box-shadow:0 0 0 3px rgba(192,57,43,.14);
}

/* Textarea */
.wpz-composer-x__textarea{
  display:block;
  width:100%;
  border:0 !important;
  background:transparent !important;
  color:rgba(0,0,0,.88);
  padding:12px 54px 12px 12px; /* place pour send */
  min-height:46px;
  line-height:1.35;
  resize:none;
  outline:none;
  border-radius:14px;
  font-size:1rem;
}

/* Send button */
.wpz-composer-x__send{
  position:absolute;
  right:8px;
  bottom:8px;
  width:38px;
  height:38px;
  border-radius:12px;
  border:0;
  cursor:pointer;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  background:var(--primary, #c0392b);
  color:#fff;

  box-shadow:0 6px 14px rgba(0,0,0,.14);
  transition:transform .15s ease, opacity .15s ease, filter .15s ease;
}

.wpz-composer-x__send:hover{ transform:translateY(-1px); }
.wpz-composer-x__send:active{ transform:translateY(0); }
.wpz-composer-x__send[disabled]{ opacity:.55; cursor:not-allowed; filter:grayscale(.2); }

.wpz-composer-x__send-ico{
  width:18px;
  height:18px;
  display:block;
}

/* Message */
.wpz-composer-x__msg{
  margin-top:10px;
  min-height:18px;
  font-size:.92rem;
  color:rgba(0,0,0,.64);
}

/* =========================================================
   FULLSCREEN MOBILE (stable)
   ========================================================= */
@media (max-width: 820px){

  /* When open */
  [data-wpz-thread-composer]:not([hidden]).wpz-composer-x{
    position:fixed !important;
    inset:0 !important;
    width:100vw !important;
    height:100dvh !important;
    z-index:999999 !important;
    display:block !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
  }

  .wpz-composer-x__backdrop{
    display:block;
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.22);
  }

  .wpz-composer-x__panel{
    position:relative;
    z-index:1;
    width:100% !important;
    height:100% !important;
    border-radius:0 !important;
    border:0 !important;
    box-shadow:none !important;
    display:flex;
    flex-direction:column;
    padding-top:env(safe-area-inset-top);
    padding-bottom:env(safe-area-inset-bottom);
  }

  .wpz-composer-x__topbar{
    position:sticky;
    top:0;
    z-index:3;
  }

  .wpz-composer-x__replyto{
    position:sticky;
    top:64px;
    z-index:2;
  }

  .wpz-composer-x__body{
    flex:1;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
  }

  .wpz-composer-x__textarea{
    min-height:34vh;
  }
}

/* =========================================================
   Body scroll lock helper (JS toggles)
   ========================================================= */
body.wpz-composer-open{
  overflow:hidden !important;
  touch-action:none;
}
