/* --- Shared layout for email pages --- */
.email-page-container{ max-width:1100px; margin:0 auto; }
#email-toolbar{ z-index:1030; } /* sticky-top je z Bootstrapu */

/* Message content constraints */
.email-html{ overflow-x:auto; }
.email-html img{ max-width:100%; height:auto; }
.email-html table{ width:auto; max-width:100%; }
.email-plain{ white-space:pre-wrap; word-break:break-word; }

/* Header rows */
.one-line{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.msg-header .label{ opacity:.7; }
.subject-line{ word-break:break-word; }

/* Compact square action buttons on desktop */
@media (min-width: 992px){
  .btn-action{
    width:1cm; height:1cm; padding:0;
    display:inline-flex; align-items:center; justify-content:center; border-radius:10px;
  }
  .btn-action i{ font-size:1.1rem; line-height:1; }
}

/* --- Address chips (compose) --- */
.email-chips{ position:relative; }
.email-chips .chips{ display:flex; flex-wrap:wrap; gap:.25rem; margin-bottom:.25rem; }
.email-chips .chip{
  display:inline-flex; align-items:center; gap:.35rem; padding:.2rem .45rem;
  background:#f1f3f5; border:1px solid #dee2e6; border-radius:999px; font-size:.875rem;
}
.email-chips .chip .chip-x{ border:0; background:transparent; line-height:1; cursor:pointer; opacity:.6; }
.email-chips .chip .chip-x:hover{ opacity:1; }
.email-chips .suggest-box{
  position:absolute; left:0; right:0; top:100%; z-index:1050;
  background:#fff; border:1px solid #dee2e6; border-radius:.5rem; margin-top:.25rem;
  max-height:220px; overflow:auto;
}
.email-chips .suggest-box .item{ padding:.4rem .6rem; cursor:pointer; }
.email-chips .suggest-box .item[aria-selected="true"],
.email-chips .suggest-box .item:hover{ background:#f1f3f5; }

/* -------------------------------------------------------------------------
   TheaCRM v2.6.48 – mobile email template polish
------------------------------------------------------------------------- */
@media (max-width: 767.98px){
  .email-page-container{
    max-width:100%;
    margin:0;
    background:#fff;
    min-height:100vh;
  }
  #email-toolbar{
    top:var(--navbar-height, 60px);
    min-height:56px;
    padding:.55rem .75rem !important;
    border-bottom:1px solid #edf0f2 !important;
    box-shadow:0 1px 2px rgba(60,64,67,.06);
  }
  #email-toolbar h5{
    font-size:1.08rem;
    font-weight:600;
  }
  #compose-form{
    padding:.85rem .85rem 5.75rem !important;
    gap:.85rem !important;
  }
  #compose-form .form-label{
    font-size:.82rem;
    color:#5f6368;
    margin-bottom:.25rem;
  }
  #compose-form .form-control,
  #compose-form .email-chips .chip,
  #compose-form .html-editor{
    border-color:#e0e3e7;
  }
  #compose-form textarea#body,
  #compose-form .html-editor{
    min-height:42vh;
    font-size:1rem;
  }
  #compose-form > .d-flex.gap-2:last-child{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:1035;
    padding:.65rem .85rem calc(.65rem + env(safe-area-inset-bottom));
    background:rgba(255,255,255,.96);
    border-top:1px solid #edf0f2;
    box-shadow:0 -2px 12px rgba(60,64,67,.08);
  }
  #compose-form > .d-flex.gap-2:last-child .btn{
    flex:1 1 auto;
  }
}