/* Keep form-label typography out of editable mail content. In particular,
   adressen.css applies font-weight:600 to every span inside a field. */
.beleg-mail-rich-content{
  max-height:40vh;
  font-weight:400;
}
.beleg-mail-rich-content span{font-weight:inherit;}
.beleg-mail-rich-content b,
.beleg-mail-rich-content strong{
  font-weight:700;
}

#belegMailOverlay .beleg-mail-two{margin-top:-8px}
#belegMailOverlay .beleg-mail-options{display:flex;align-items:center;flex-wrap:wrap;gap:8px 18px}
#belegMailOverlay .beleg-mail-options>.address-edit-field{min-width:150px;max-width:190px}
#belegMailOverlay .beleg-mail-option-check{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:400;cursor:pointer}
#belegMailOverlay .beleg-mail-option-check input{accent-color:#063f6c}
#belegMailOverlay .beleg-mail-format-select{width:auto;min-width:83px;max-width:155px;height:28px}
#belegMailOverlay .beleg-mail-rich-content img{max-width:100%;height:auto}
#belegMailOverlay .xcraft-richtext-toolbar{flex-wrap:wrap}

/* Compact mail compose rows: captions precede their controls. */
#belegMailOverlay .beleg-mail-body{gap:7px;padding-top:12px;padding-bottom:12px}
#belegMailOverlay .beleg-mail-inline-field{display:flex;flex-direction:row;align-items:center;gap:8px;min-width:0}
#belegMailOverlay .beleg-mail-inline-field>span{flex:0 0 74px;margin:0;line-height:28px}
#belegMailOverlay .beleg-mail-inline-field>.address-edit-control{flex:1 1 auto;min-width:0;width:100%;margin:0}
#belegMailOverlay .beleg-mail-two{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:0;min-width:0}
#belegMailOverlay .beleg-mail-options{gap:8px 14px}
#belegMailOverlay .beleg-mail-options>.address-edit-field{max-width:none;min-width:200px}
#belegMailOverlay .beleg-mail-options .beleg-mail-inline-field>span{flex-basis:74px}
#belegMailOverlay .beleg-mail-options select{max-width:135px}
#belegMailOverlay .beleg-mail-message-field{min-width:0}
#belegMailOverlay .beleg-mail-message-field>.beleg-mail-message{display:none}
#belegMailOverlay .beleg-mail-message-field>.xcraft-richtext-editor{margin:0}
#belegMailOverlay .beleg-mail-suggestions:empty{display:none}
#belegMailOverlay .beleg-mail-rich-content{min-height:130px}
@media(max-width:700px){
  #belegMailOverlay .beleg-mail-two{grid-template-columns:1fr;gap:7px}
  #belegMailOverlay .beleg-mail-options{align-items:flex-start}
  #belegMailOverlay .beleg-mail-options>.address-edit-field{width:100%}
}
.xcraft-mail-color-picker{position:relative;display:inline-flex;align-items:center}
.xcraft-mail-color-trigger{height:28px;min-width:30px;display:inline-flex;align-items:center;justify-content:center;gap:3px;border:1px solid #cad5e0;border-radius:5px;background:#fff;color:#063f6c;cursor:pointer;padding:2px 5px}
.xcraft-mail-color-letter{font-size:16px;font-weight:700;line-height:18px;border-bottom:3px solid var(--color-preview,#063f6c)}
.xcraft-mail-color-popover{position:absolute;z-index:100030;left:0;top:calc(100% + 5px);width:222px;background:#fff;border:1px solid #c9d6e2;border-radius:8px;padding:10px;box-shadow:0 10px 26px #102c4540}
.xcraft-mail-color-swatches{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-bottom:10px}
.xcraft-mail-color-swatch{width:27px;height:27px;border:1px solid #a9b7c3;border-radius:5px;cursor:pointer}
.xcraft-mail-color-swatch:focus-visible,.xcraft-mail-color-trigger:focus-visible{outline:2px solid #063f6c;outline-offset:2px}
.xcraft-mail-color-custom{display:flex;align-items:center;gap:6px}
.xcraft-mail-color-custom input[type=color]{width:32px;height:28px;padding:0;border:0;background:transparent;cursor:pointer}
.xcraft-mail-color-custom input[type=text]{width:84px;min-width:0;height:28px;box-sizing:border-box}
.xcraft-mail-color-custom button{height:28px}

/* Recipient labels become clickable directory triggers after initialization. */
#belegMailOverlay .beleg-mail-inline-field>.mail-recipient-label{flex:0 0 74px;width:74px;min-width:74px;line-height:28px;text-align:left;margin:0}
#belegMailOverlay .beleg-mail-inline-field.mail-recipient-field{min-width:0}
#belegMailOverlay .beleg-mail-two .beleg-mail-inline-field>.mail-recipient-label{flex-basis:74px}
#belegMailOverlay .beleg-mail-inline-field input.address-edit-control{min-width:0}
.xcraft-mail-color-popover[hidden]{display:none}

/* One shared height and baseline for mail formatting actions. */
#belegMailOverlay .xcraft-richtext-toolbar{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:5px;
}
#belegMailOverlay .xcraft-richtext-toolbar>button,
#belegMailOverlay .xcraft-richtext-toolbar>.beleg-mail-format-select,
#belegMailOverlay .xcraft-richtext-toolbar>.xcraft-mail-color-picker,
#belegMailOverlay .xcraft-richtext-toolbar>.xcraft-mail-color-picker>.xcraft-mail-color-trigger{
  height:28px;
  min-height:28px;
  max-height:28px;
  box-sizing:border-box;
  margin:0;
  vertical-align:middle;
  line-height:1;
}
#belegMailOverlay .xcraft-richtext-toolbar>button{
  padding:0 8px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
#belegMailOverlay .xcraft-richtext-toolbar>button .material-icons{
  font-size:18px;
  line-height:1;
}
#belegMailOverlay .xcraft-richtext-toolbar>.beleg-mail-format-select{
  padding-top:0;
  padding-bottom:0;
  font-size:12px;
  align-self:center;
}
#belegMailOverlay .xcraft-richtext-toolbar>.beleg-mail-format-select[aria-label="Schriftart"]{
  min-width:142px;
  max-width:170px;
}
#belegMailOverlay .xcraft-richtext-toolbar>.xcraft-mail-color-picker{
  flex:none;
  align-items:center;
}

/* Default/automatic color is part of the palette, not a toolbar button. */
.xcraft-mail-color-automatic{
  display:flex;
  align-items:center;
  width:100%;
  min-height:28px;
  padding:4px 8px;
  margin:0 0 8px;
  border:1px solid #cbd5e1;
  border-radius:5px;
  background:#f8fafc;
  color:#063f6c;
  font:inherit;
  font-size:12px;
  text-align:left;
  cursor:pointer;
}
.xcraft-mail-color-automatic:hover{background:#eaf2f8;border-color:#8ba4b8}

/* Unified sortable mail attachment list: merging is decided beside each PDF. */
#belegMailOverlay #belegMeasurementMailMode,
#belegMailOverlay #belegMailWiderruf,
#belegMailOverlay #belegMailAttachmentList,
#belegMailOverlay #belegMailProjectAttachmentList{display:none!important}
#belegMailOverlay #belegMailSystemAttachmentList{
  display:flex;flex-direction:column;gap:5px;min-width:0;
}
#belegMailOverlay .beleg-mail-document-row{
  display:flex;align-items:center;gap:9px;min-width:0;
  padding:7px 9px;min-height:37px;box-sizing:border-box;
  border:1px solid #dbe4ed;border-radius:6px;background:#fff;
}
#belegMailOverlay .beleg-mail-document-row.is-merged{
  margin-left:26px;background:#f2f7fb;border-left:3px solid #063f6c;
}
#belegMailOverlay .beleg-mail-document-row .material-icons{font-size:19px;line-height:1;flex:none}
#belegMailOverlay .beleg-mail-document-grip{color:#7e8d9e;cursor:grab}
#belegMailOverlay .beleg-mail-document-name{
  flex:1 1 auto;min-width:0;overflow-wrap:anywhere;font-size:13px;
}
#belegMailOverlay .beleg-mail-document-mode-link{
  flex:none;min-height:28px;padding:3px 0;
  border:0;background:transparent;color:#063f6c;
  font:inherit;font-size:12px;font-weight:600;
  text-decoration:underline;text-underline-offset:2px;
  cursor:pointer;text-align:left;
}
#belegMailOverlay .beleg-mail-document-mode-link:hover{color:#005d98;text-decoration-thickness:2px}
#belegMailOverlay .beleg-mail-document-mode-link:focus-visible{outline:2px solid #063f6c;outline-offset:3px;border-radius:2px}
#belegMailOverlay .beleg-mail-document-note{
  flex:none;color:#64748b;font-size:12px;
}
#belegMailOverlay .beleg-mail-document-remove{
  flex:none;display:inline-flex;align-items:center;justify-content:center;
  border:0;background:transparent;color:#64748b;padding:3px;cursor:pointer;
}
#belegMailOverlay .beleg-mail-document-remove:hover{color:#c42a4e}
#belegMailOverlay .beleg-mail-document-row[draggable=true]{cursor:grab}
@media(max-width:650px){
 #belegMailOverlay .beleg-mail-document-row{flex-wrap:wrap}
 #belegMailOverlay .beleg-mail-document-mode-link{max-width:100%;margin-left:26px}
 #belegMailOverlay .beleg-mail-document-row.is-merged{margin-left:12px}
}

/* Dedicated mail picker: reuse the address-detail tabs and project file explorer. */
.beleg-mail-picker-overlay[hidden]{display:none!important}
.beleg-mail-picker-overlay{display:flex;position:fixed;inset:0;z-index:100030}
.beleg-mail-picker-dialog{
  width:min(1040px,calc(100vw - 24px));max-height:92dvh;
  display:flex;flex-direction:column;min-height:0;
}
.beleg-mail-picker-body{
  display:flex;flex-direction:column;gap:10px;min-height:0;overflow:auto;
  padding-top:12px;padding-bottom:12px;
}
.beleg-mail-picker-tabs.address-workspace-tabs{
  flex:0 0 auto;width:100%;box-sizing:border-box;
  border-bottom:1px solid #dce5ec;padding:6px 12px 0;
}
.beleg-mail-picker-tabs .address-workspace-tab{
  min-height:38px;background:transparent;border:0;
  border-bottom:3px solid transparent;
  padding:9px 12px;
}
.beleg-mail-picker-tabs .address-workspace-tab[aria-selected="true"]{
  color:#063f6c;border-bottom-color:#f28c18;background:transparent;
}
.beleg-mail-picker-explorer.project-files-explorer{
  flex:1 1 auto;min-height:230px;margin:0;
  grid-template-columns:minmax(195px,260px) minmax(0,1fr);
}
.beleg-mail-picker-tree-panel,.beleg-mail-picker-content-panel{
  min-height:230px;max-height:40dvh;overflow:auto;
}
.beleg-mail-picker-tree-panel .project-files-tree{
  max-height:none;overflow:visible;
}
.beleg-mail-picker-content-panel{
  display:flex;flex-direction:column;gap:9px;
  padding:10px;
}
.beleg-mail-picker-path{flex:0 0 auto;min-height:20px}
.beleg-mail-picker-breadcrumbs{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.beleg-mail-picker-breadcrumbs button{
  border:0;background:transparent;color:#063f6c;
  cursor:pointer;padding:2px 3px;font:inherit;font-size:12px;
}
.beleg-mail-picker-items.project-files-list{
  display:flex;flex-direction:column;gap:5px;
  flex:1 1 auto;min-width:0;overflow:auto;
}
.beleg-mail-picker-file.project-file-row{
  display:flex;align-items:center;gap:10px;
  min-height:42px;margin:0;cursor:pointer;
  border:1px solid #e1e8ee;border-radius:7px;
  padding:8px 11px;background:#fff;
}
.beleg-mail-picker-file:hover{background:#f2f7fb;border-color:#aec5d7}
.beleg-mail-picker-file:has(input:checked){background:#f0f6fb;border-color:#c6dbe9}
.beleg-mail-picker-file .beleg-mail-picker-check{
  flex:0 0 auto;width:16px;height:16px;
  accent-color:#063f6c;cursor:pointer;
}
.beleg-mail-picker-file .project-file-text{flex:1 1 auto;min-width:0}
.beleg-mail-picker-file .project-file-text strong{overflow-wrap:anywhere}
.beleg-mail-picker-file-icon{width:19px;height:23px}
.beleg-mail-picker-tree-info{font-size:12px;padding:10px;color:#64748b}
.beleg-mail-picker-selection{
  display:flex;flex-direction:column;gap:7px;
  flex:0 0 auto;border-top:1px solid #dbe4ed;padding:10px 0 0;
}
.beleg-mail-picker-selection-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.beleg-mail-picker-selection-head strong{font-size:13px;color:#063f6c}
.beleg-mail-picker-selection-head>span{color:#64748b;font-size:12px}
.beleg-mail-picker-selected-list{
  display:flex;flex-wrap:wrap;gap:6px;
  overflow-y:auto;max-height:126px;min-height:30px;
}
.beleg-mail-picker-selected-row{
  display:inline-flex;align-items:center;gap:7px;
  min-width:0;max-width:100%;padding:5px 8px;
  border:1px solid #cddde9;border-radius:6px;
  background:#f3f7fb;
}
.beleg-mail-picker-selected-row>.material-icons{font-size:17px;color:#063f6c;flex:none}
.beleg-mail-picker-selected-text{display:flex;flex-direction:column;min-width:0;gap:2px}
.beleg-mail-picker-selected-text strong{font-size:12px;font-weight:600;overflow-wrap:anywhere}
.beleg-mail-picker-selected-text small{font-size:11px;color:#64748b}
.beleg-mail-picker-selected-remove{
  display:inline-flex;align-items:center;justify-content:center;
  background:transparent;border:0;border-radius:4px;cursor:pointer;
  color:#64748b;margin-left:5px;padding:2px;
}
.beleg-mail-picker-selected-remove .material-icons{font-size:17px}
.beleg-mail-picker-selected-remove:hover{background:#e3edf5;color:#a51c38}
.beleg-mail-picker-selected-remove:focus-visible{outline:2px solid #063f6c}
.beleg-mail-picker-dialog .address-edit-footer{justify-content:flex-end;gap:8px}
@media(max-width:680px){
  .beleg-mail-picker-dialog{width:calc(100vw - 16px)}
  .beleg-mail-picker-tabs.address-workspace-tabs{
    display:flex;overflow-x:auto;gap:0;padding:4px 6px 0;
  }
  .beleg-mail-picker-tabs .address-workspace-tab{
    flex:none;font-size:12px;white-space:nowrap;padding:10px 8px;
  }
  .beleg-mail-picker-explorer.project-files-explorer{
    display:grid;grid-template-columns:minmax(112px,38%) minmax(0,1fr);gap:7px;
  }
  .beleg-mail-picker-tree-panel,.beleg-mail-picker-content-panel{min-height:190px}
  .beleg-mail-picker-file.project-file-row{padding:7px 5px;gap:6px}
}

/* Mouse resizing for inline images without persisting editor handles into HTML. */
#belegMailOverlay .xcraft-richtext-editor{position:relative}
#belegMailOverlay .beleg-mail-rich-content img{
  display:inline-block;
  max-width:100%;
  height:auto;
  vertical-align:middle;
  cursor:pointer;
}
#belegMailOverlay .beleg-mail-rich-content img.is-selected{
  outline:2px solid #063f6c;
  outline-offset:2px;
}
#belegMailOverlay .beleg-mail-image-resize-handle{
  position:absolute;
  z-index:4;
  width:16px;height:16px;min-width:16px;min-height:16px;
  padding:0;
  border:2px solid #fff;border-radius:3px;
  background:#063f6c;
  box-shadow:0 0 0 1px #063f6c;
  cursor:nwse-resize;
  touch-action:none;
}
#belegMailOverlay .beleg-mail-image-resize-handle[hidden]{display:none!important}

/* Drag the image itself to reposition it; the corner handle still resizes. */
#belegMailOverlay .beleg-mail-rich-content img[draggable="true"]{cursor:grab}
#belegMailOverlay .beleg-mail-rich-content img.is-dragging{opacity:.5;cursor:grabbing}
#belegMailOverlay .beleg-mail-rich-content.is-image-dragging{cursor:move}

/* The same rich-text/image controls are reused in Mail signatures and Beleg mail-text defaults. */
.xmail-template-rich{position:relative;min-width:0;margin-top:8px}
.xmail-template-rich .beleg-mail-rich-content img{
  display:inline-block;max-width:100%;height:auto;vertical-align:middle;cursor:grab;
}
.xmail-template-rich .beleg-mail-rich-content img.is-selected{
  outline:2px solid #063f6c;outline-offset:2px;
}
.xmail-template-rich .beleg-mail-rich-content img.is-dragging{opacity:.5;cursor:grabbing}
.xmail-template-rich .beleg-mail-image-resize-handle{
  position:absolute;z-index:4;width:16px;height:16px;min-width:16px;min-height:16px;
  padding:0;border:2px solid #fff;border-radius:3px;background:#063f6c;
  box-shadow:0 0 0 1px #063f6c;cursor:nwse-resize;touch-action:none;
}
.xmail-template-rich .beleg-mail-image-resize-handle[hidden]{display:none!important}
.xmail-beleg-text-block{margin:12px 0 14px;min-width:0}
.xmail-beleg-text-block[hidden]{display:none!important}
.xmail-beleg-text-block .address-single-section-title{margin-bottom:8px}
.xmail-beleg-text-toggle{display:flex;align-items:center;gap:8px;cursor:pointer;margin:10px 0;font-size:13px;color:#334155}
.xmail-beleg-text-toggle input{accent-color:#063f6c;width:16px;height:16px}
.xmail-beleg-placeholders{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.xmail-placeholder{border:1px solid #d5e1eb;border-radius:5px;background:#f4f8fb;color:#063f6c;cursor:pointer;font:inherit;font-size:11px;padding:5px 7px}
.xmail-placeholder:hover{background:#e3eff8}
#settingsMailTemplatesSection{min-width:0}
#settingsMailTemplatesSection .xcraft-richtext-surface{min-height:115px}

/* Editing aids for the central mail signature only; borders are not mailed. */
.xmail-signature-section .xcraft-richtext-surface table{border-collapse:collapse;width:100%;max-width:100%;table-layout:auto;margin:5px 0}
.xmail-signature-section .xcraft-richtext-surface table td,
.xmail-signature-section .xcraft-richtext-surface table th{border:1px dashed #b6c5d3;min-width:36px;padding:4px;vertical-align:top}
.xmail-signature-section .xcraft-richtext-toolbar .xmail-signature-table-action .material-icons{font-size:18px}
