

/* ==========================================================
   DJR_MESSAGING_MINI_WINDOW_V6

   One bounded communication window.

   Header owns the close control.
   Content owns the available remaining height.
   Provider iframe fills that content area.
   No duplicated status bar.
   ========================================================== */

.djr-message-mini-tray {
  position: fixed;

  right:
    max(
      10px,
      env(safe-area-inset-right)
    );

  bottom:
    calc(
      86px
      + env(safe-area-inset-bottom)
    );

  z-index: 100050;

  display: grid;
  grid-template-rows:
    58px
    minmax(0, 1fr)
    54px;

  width:
    min(
      390px,
      calc(100vw - 20px)
    );

  height:
    min(
      560px,
      calc(100dvh - 125px)
    );

  max-height:
    calc(100dvh - 125px);

  overflow: hidden;

  border:
    1px solid
    rgba(92, 73, 165, .16);

  border-radius: 24px;

  background: #ffffff;

  color: #202b43;

  box-shadow:
    0 26px 78px
    rgba(25, 31, 72, .25);

  isolation: isolate;
}


.djr-message-mini-tray[hidden] {
  display: none !important;
}


.djr-message-mini-tray__head {
  position: relative;
  z-index: 4;

  display: flex;
  align-items: center;
  justify-content: space-between;

  min-width: 0;

  padding: 0 13px 0 16px;

  border-bottom:
    1px solid
    rgba(67, 78, 116, .10);

  background:
    linear-gradient(
      135deg,
      #102d59,
      #244f91 62%,
      #6938cf
    );

  color: #ffffff;
}


.djr-message-mini-tray__head > div {
  display: grid;

  min-width: 0;
}


.djr-message-mini-tray__head small {
  color:
    rgba(255, 255, 255, .62);

  font-size: .58rem;
  font-weight: 900;
  letter-spacing: .13em;
}


.djr-message-mini-tray__head strong {
  overflow: hidden;

  margin-top: 2px;

  color: #ffffff;

  font-size: .91rem;
  font-weight: 900;

  text-overflow: ellipsis;
  white-space: nowrap;
}


.djr-message-mini-tray__head
[data-djr-mini-close] {
  appearance: none;

  position: relative;
  z-index: 10;

  display: grid;
  flex: 0 0 38px;

  width: 38px;
  height: 38px;

  margin: 0;
  padding: 0;

  place-items: center;

  border:
    1px solid
    rgba(255, 255, 255, .22);

  border-radius: 50%;

  background:
    rgba(255, 255, 255, .13);

  color: #ffffff;

  font: inherit;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1;

  cursor: pointer;

  box-shadow:
    inset 0 1px 0
    rgba(255, 255, 255, .15);

  touch-action: manipulation;
}


.djr-message-mini-tray__head
[data-djr-mini-close]:active {
  transform: scale(.94);
}


.djr-message-mini-tray__content {
  position: relative;

  min-width: 0;
  min-height: 0;

  height: auto;

  overflow: hidden;

  background: #ffffff;
}


.djr-message-mini-tray__content
> [data-djr-mini-panel] {
  position: absolute;

  inset: 0;

  min-width: 0;
  min-height: 0;

  height: auto !important;

  overflow: hidden !important;

  background: #ffffff !important;
}


.djr-message-mini-tray__content
> [data-djr-mini-panel][hidden] {
  display: none !important;
}


.djr-message-mini-frame {
  display: block;

  width: 100%;
  height: 100%;

  min-height: 0 !important;

  border: 0;

  background: #ffffff;
}


.djr-message-mini-connect {
  display: grid;

  width: 100%;
  height: 100%;

  padding: 24px;

  place-items: center;
  align-content: center;

  gap: 10px;

  text-align: center;

  background: #ffffff;
}


.djr-message-mini-connect strong {
  color: #202b43;

  font-size: .94rem;
  font-weight: 900;
}


.djr-message-mini-connect p {
  max-width: 290px;

  margin: 0;

  color: #77849a;

  font-size: .77rem;
  line-height: 1.5;
}


.djr-message-mini-connect a {
  display: inline-flex;

  min-height: 40px;

  padding: 0 15px;

  align-items: center;
  justify-content: center;

  border-radius: 12px;

  background:
    linear-gradient(
      135deg,
      #6841d9,
      #853be0
    );

  color: #ffffff;

  font-size: .75rem;
  font-weight: 900;

  text-decoration: none;
}


.djr-message-mini-mail-switch {
  display: flex;

  gap: 6px;

  padding: 8px;

  overflow-x: auto;

  border-bottom:
    1px solid
    rgba(67, 78, 116, .09);

  background: #f7f8fc;
}


.djr-message-mini-mail-switch button {
  appearance: none;

  flex: 0 0 auto;

  min-height: 34px;

  padding: 0 12px;

  border:
    1px solid
    rgba(92, 73, 165, .12);

  border-radius: 11px;

  background: #ffffff;

  color: #677389;

  font: inherit;
  font-size: .7rem;
  font-weight: 850;
}


.djr-message-mini-mail-switch
button.is-active {
  border-color:
    rgba(105, 65, 217, .22);

  background: #f2eeff;

  color: #6841d9;
}


[data-djr-mini-mail-panel] {
  height:
    calc(100% - 51px);
}


.djr-message-mini-tray__footer {
  position: relative;
  z-index: 4;

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

  min-height: 0;

  padding: 7px 11px;

  border-top:
    1px solid
    rgba(67, 78, 116, .10);

  background:
    rgba(250, 250, 254, .98);
}


.djr-message-mini-tray__footer a {
  display: inline-flex;

  min-height: 39px;

  padding: 0 15px;

  align-items: center;
  justify-content: center;

  border-radius: 12px;

  background:
    linear-gradient(
      135deg,
      #6841d9,
      #853be0
    );

  color: #ffffff;

  font-size: .73rem;
  font-weight: 900;

  text-decoration: none;
}


@media (max-width: 600px) {

  .djr-message-mini-tray {
    right:
      max(
        7px,
        env(safe-area-inset-right)
      );

    bottom:
      calc(
        80px
        + env(safe-area-inset-bottom)
      );

    width:
      calc(100vw - 14px);

    height:
      min(
        68dvh,
        560px
      );

    max-height:
      calc(100dvh - 118px);

    border-radius: 22px;
  }

}


/* ==========================================================
   END DJR_MESSAGING_MINI_WINDOW_V6
   ========================================================== */



/* ==========================================================
   DJR_MESSENGER_NATIVE_MINI_FRAGMENT_V2

   Messenger is injected directly into the existing tray.
   No iframe.
   No portal-in-portal.
   ========================================================== */

.djr-message-mini-fragment-host {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;

  overflow-y: auto;
  overflow-x: hidden;

  -webkit-overflow-scrolling: touch;

  background: #ffffff;
}


.djr-message-mini-fragment-loading,
.djr-message-mini-fragment-error {
  display: grid;

  min-height: 220px;

  padding: 24px;

  place-items: center;
  align-content: center;

  gap: 7px;

  color: #7d899b;

  text-align: center;
}


.djr-message-mini-fragment-error strong {
  color: #26334b;
}


/* ==========================================================
   END DJR_MESSENGER_NATIVE_MINI_FRAGMENT_V2
   ========================================================== */
