.kmail-editor {
  border: 1px solid #e4e8f5;
  border-radius: 18px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 18px 45px rgba(38, 43, 91, .08);
}
.kmail-editor,
.kmail-editor * {
  box-sizing: border-box;
}
.kmail-editor-toolbar {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  padding: 10px;
  background: #f7f8ff;
  border-bottom: 1px solid #e7eaf8;
}
.kmail-editor-toolbar button,
.kmail-editor-toolbar select {
  min-height: 38px;
  border: 1px solid #dfe4f4;
  border-radius: 12px;
  background: #fff;
  color: #172033;
  font-weight: 800;
  padding: 0 12px;
}
.kmail-editor-toolbar button:hover {
  border-color: #6c55ff;
  color: #4f39f6;
}
.kmail-editor-body .ql-toolbar.ql-snow {
  border: 0;
  border-bottom: 1px solid #edf0fb;
  background: #fbfcff;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  padding: 8px;
}
.kmail-editor-body .ql-toolbar.ql-snow .ql-formats {
  display: inline-flex;
  gap: 2px;
  align-items: center;
  margin: 0 4px 0 0;
}
.kmail-editor-body .ql-toolbar.ql-snow button {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  min-height: 30px !important;
  padding: 5px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #1f2937 !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}
.kmail-editor-body .ql-toolbar.ql-snow button:hover {
  background: #eef2ff !important;
  color: #4f39f6 !important;
}
.kmail-editor-body .ql-toolbar.ql-snow button svg {
  width: 16px !important;
  height: 16px !important;
  display: block !important;
}
.kmail-editor-body .ql-toolbar.ql-snow .ql-picker {
  height: 30px !important;
  font-size: 13px !important;
  color: #1f2937 !important;
}
.kmail-editor-body .ql-toolbar.ql-snow .ql-picker-label {
  height: 30px !important;
  display: flex !important;
  align-items: center !important;
  padding: 4px 22px 4px 8px !important;
  border: 1px solid #e4e8f5 !important;
  border-radius: 8px !important;
  background: #fff !important;
}
.kmail-editor-body .ql-toolbar.ql-snow .ql-picker-options {
  z-index: 10060 !important;
  max-height: 220px;
  overflow: auto;
  border-radius: 10px;
  box-shadow: 0 18px 45px rgba(17, 24, 39, .18);
}
.kmail-editor-body .ql-editor {
  min-height: 240px;
  font-size: 15px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
.kmail-editor-body .ql-container.ql-snow {
  border: 0;
  min-height: 260px;
  font-size: 15px;
}
.kmail-editor-email {
  box-shadow: none;
  border-radius: 16px;
  overflow: visible;
}
.kmail-editor-email .kmail-editor-toolbar {
  gap: 6px;
  padding: 8px;
}
.kmail-editor-email .kmail-editor-toolbar button {
  min-height: 34px;
  padding: 0 10px;
}
.kmail-editor-email .kmail-editor-body {
  overflow: visible;
}
.kmail-editor-email .kmail-editor-body .ql-container.ql-snow {
  min-height: 250px;
}
.kmail-editor-status {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 14px;
  color: #6d7691;
  font-size: 13px;
  border-top: 1px solid #edf0fb;
}
.kmail-editor.fullscreen {
  position: fixed;
  inset: 16px;
  z-index: 5000;
  display: flex;
  flex-direction: column;
}
.kmail-editor.fullscreen .kmail-editor-body {
  flex: 1;
  overflow: auto;
}
.kmail-editor-drop {
  outline: 3px dashed #7c65ff;
  outline-offset: -10px;
}
.kmail-editor-source {
  width: 100%;
  min-height: 360px;
  border: 0;
  padding: 16px;
  font: 14px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.kmail-editor-media {
  position: fixed;
  inset: 8vh 5vw;
  z-index: 5100;
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 28px 90px rgba(17, 24, 39, .28);
  padding: 18px;
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 12px;
}
.kmail-editor-media > div:first-child {
  display: flex;
  gap: 10px;
  align-items: center;
}
.kmail-editor-media input {
  flex: 1;
  min-height: 44px;
  border: 1px solid #e4e8f5;
  border-radius: 12px;
  padding: 10px 12px;
}
.kmail-editor-media button {
  width: auto;
  min-width: 86px;
  min-height: 42px;
  border: 0;
  border-radius: 12px;
  background: #4f39f6;
  color: #fff;
  font-weight: 800;
}
.kmail-editor-media-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 12px;
  overflow: auto;
}
.kmail-editor-media-item {
  border: 1px solid #e5e8f4;
  border-radius: 14px;
  padding: 10px;
  background: #fafbff;
  cursor: pointer;
}
.kmail-editor-media-item img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 10px;
  background: #eef1fb;
}
.dark .kmail-editor,
.theme-dark .kmail-editor,
body.dark .kmail-editor {
  background: #111827;
  border-color: #26324a;
}
.dark .kmail-editor-toolbar,
.theme-dark .kmail-editor-toolbar,
body.dark .kmail-editor-toolbar,
.dark .kmail-editor-body .ql-toolbar.ql-snow,
.theme-dark .kmail-editor-body .ql-toolbar.ql-snow,
body.dark .kmail-editor-body .ql-toolbar.ql-snow {
  background: #172033;
  border-color: #26324a;
}
.dark .kmail-editor-toolbar button,
.dark .kmail-editor-toolbar select,
.theme-dark .kmail-editor-toolbar button,
.theme-dark .kmail-editor-toolbar select,
body.dark .kmail-editor-toolbar button,
body.dark .kmail-editor-toolbar select {
  background: #0f172a;
  color: #e5e7eb;
  border-color: #334155;
}
.dark .kmail-editor-body .ql-toolbar.ql-snow button,
.theme-dark .kmail-editor-body .ql-toolbar.ql-snow button,
body.dark .kmail-editor-body .ql-toolbar.ql-snow button {
  color: #e5e7eb !important;
}
.dark .kmail-editor-body .ql-toolbar.ql-snow .ql-picker-label,
.theme-dark .kmail-editor-body .ql-toolbar.ql-snow .ql-picker-label,
body.dark .kmail-editor-body .ql-toolbar.ql-snow .ql-picker-label {
  background: #0f172a !important;
  color: #e5e7eb !important;
  border-color: #334155 !important;
}
@media (max-width: 760px) {
  .kmail-editor,.kmail-editor-body,.kmail-editor-body .ql-toolbar.ql-snow,.kmail-editor-body .ql-container.ql-snow{width:100%;min-width:0;max-width:100%;box-sizing:border-box}
  .kmail-editor-toolbar { gap: 6px; overflow: visible; flex-wrap: wrap; }
  .kmail-editor-toolbar button, .kmail-editor-toolbar select { min-width: 38px; max-width:100%; padding: 0 8px; }
  .kmail-editor-body .ql-toolbar.ql-snow{display:flex;flex-wrap:wrap;overflow:visible;white-space:normal}
  .kmail-editor-body .ql-toolbar.ql-snow .ql-formats{display:flex;flex-wrap:wrap;max-width:100%;margin:2px 4px 2px 0}
  .kmail-editor-body .ql-toolbar.ql-snow .ql-picker{max-width:100%}
  .kmail-editor-body .ql-editor{max-width:100%;overflow-x:hidden;overflow-wrap:anywhere;word-break:break-word}
  .kmail-editor.fullscreen { inset: 0; border-radius: 0; }
}
.kmail-editor-email .ql-picker.ql-font{width:160px}.kmail-editor-email .ql-picker.ql-font .ql-picker-label:before,.kmail-editor-email .ql-picker.ql-font .ql-picker-item:before{content:attr(data-value);text-transform:none}.kmail-editor-email .ql-picker.ql-font .ql-picker-item[data-value="Arial"]{font-family:Arial,sans-serif}.kmail-editor-email .ql-picker.ql-font .ql-picker-item[data-value="Calibri"]{font-family:Calibri,Arial,sans-serif}.kmail-editor-email .ql-picker.ql-font .ql-picker-item[data-value="Georgia"]{font-family:Georgia,serif}.kmail-editor-email .ql-picker.ql-font .ql-picker-item[data-value="Helvetica"]{font-family:Helvetica,Arial,sans-serif}.kmail-editor-email .ql-picker.ql-font .ql-picker-item[data-value="Tahoma"]{font-family:Tahoma,sans-serif}.kmail-editor-email .ql-picker.ql-font .ql-picker-item[data-value="Times New Roman"]{font-family:"Times New Roman",serif}.kmail-editor-email .ql-picker.ql-font .ql-picker-item[data-value="Trebuchet MS"]{font-family:"Trebuchet MS",sans-serif}.kmail-editor-email .ql-picker.ql-font .ql-picker-item[data-value="Verdana"]{font-family:Verdana,sans-serif}.kmail-editor-email .ql-picker.ql-font .ql-picker-item[data-value="Courier New"]{font-family:"Courier New",monospace}
.kmail-editor-email .ql-picker.ql-size{width:88px}.kmail-editor-email .ql-picker.ql-size .ql-picker-label:before,.kmail-editor-email .ql-picker.ql-size .ql-picker-item:before{content:attr(data-value)!important}.kmail-editor-email .ql-picker.ql-size .ql-picker-label:not([data-value]):before{content:"14px"!important}
.kmail-emoji-picker{position:fixed;z-index:1000000;display:grid;grid-template-columns:repeat(8,minmax(34px,1fr));gap:5px;max-width:calc(100vw - 20px);max-height:min(340px,calc(100dvh - 20px));overflow:auto;padding:10px;background:var(--panel,#fff);border:1px solid #d9dceb;border-radius:14px;box-shadow:0 18px 55px #10154a40;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}.kmail-emoji-picker button{display:grid;place-items:center;min-width:34px;min-height:38px;padding:3px;border:0;border-radius:9px;background:#f7f8ff;color:initial;font:22px/1 "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}.kmail-emoji-picker button:hover{background:#ebe9ff}.kmail-emoji-picker.mobile{left:10px!important;right:10px!important;bottom:calc(10px + env(safe-area-inset-bottom))!important;top:auto!important;width:auto!important;grid-template-columns:repeat(8,minmax(30px,1fr))}
