:root {
  --diskora-navy: #0b1430;
  --diskora-navy-soft: #142044;
  --diskora-teal: #31c1bb;
  --diskora-teal-dark: #169b97;
  --diskora-surface: #ffffff;
  --diskora-canvas: #f5f7fb;
  --diskora-border: #dfe5ef;
  --diskora-text: #182238;
  --diskora-muted: #68748a;
}

html,
body {
  color: var(--diskora-text);
  font-family: Inter, Roboto, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

#layout-menu {
  background: var(--diskora-navy);
}

#layout-menu .popover-header,
#layout-menu .special-buttons a {
  background-color: var(--diskora-navy);
}

#layout-menu .selected > a,
#layout-menu a:hover,
#layout-menu a:focus-visible {
  background: var(--diskora-navy-soft);
}

.listing li.selected,
.listing tr.selected td,
.messagelist tr.selected td {
  background-color: #e8f8f7;
}

a,
.listing li.selected a,
.listing tr.selected a {
  color: var(--diskora-teal-dark);
}

.btn-primary,
button.btn-primary,
input.btn-primary {
  background: var(--diskora-teal-dark);
  border-color: var(--diskora-teal-dark);
  box-shadow: none;
}

.btn-primary:hover,
.btn-primary:focus,
button.btn-primary:hover,
button.btn-primary:focus {
  background: #117f7c;
  border-color: #117f7c;
}

.form-control:focus,
.custom-select:focus {
  border-color: var(--diskora-teal);
  box-shadow: 0 0 0 3px rgba(49, 193, 187, 0.16);
}

.task-login {
  background: var(--diskora-canvas);
}

.task-login #layout-content {
  background: var(--diskora-canvas);
}

.task-login #logo {
  top: 8vh;
  width: 92px;
  height: 92px;
  max-height: none;
  aspect-ratio: 1;
  object-fit: contain;
  border-radius: 22px;
  box-shadow: 0 10px 30px rgba(11, 20, 48, 0.12);
}

.task-login #login-form {
  top: 11vh;
  max-width: 380px;
  padding: 30px;
  background: var(--diskora-surface);
  border: 1px solid var(--diskora-border);
  border-radius: 18px;
  box-shadow: 0 16px 44px rgba(11, 20, 48, 0.08);
  animation: diskora-enter 240ms ease-out both;
}

.task-login #login-form::before {
  display: block;
  margin-bottom: 22px;
  color: var(--diskora-navy);
  content: "Diskora Mail";
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.task-login #login-form input {
  min-height: 46px;
  border-color: var(--diskora-border);
  border-radius: 10px;
}

.task-login #rcmloginsubmit {
  min-height: 46px;
  border: 0;
  border-radius: 10px;
  background: var(--diskora-teal-dark);
  font-weight: 700;
}

.task-login .diskora-remember {
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 2px 0 18px;
  padding: 10px 11px;
  color: var(--diskora-navy);
  background: rgba(49, 193, 187, 0.06);
  border: 1px solid rgba(49, 193, 187, 0.18);
  border-radius: 10px;
  cursor: pointer;
  user-select: none;
}

.task-login .diskora-remember input {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  min-height: 0;
  margin: 0;
  accent-color: var(--diskora-teal-dark);
}

.task-login .diskora-remember span {
  display: grid;
  gap: 1px;
  line-height: 1.25;
}

.task-login .diskora-remember strong {
  font-size: 0.9rem;
  font-weight: 700;
}

.task-login .diskora-remember small {
  color: var(--diskora-muted);
  font-size: 0.76rem;
}

.task-login #login-footer {
  color: var(--diskora-muted);
}

.task-login #login-footer > div {
  background: transparent;
}

.diskora-install {
  position: fixed;
  z-index: 1050;
  right: 18px;
  bottom: 18px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 12px;
  color: #fff;
  background: var(--diskora-navy);
  box-shadow: 0 10px 28px rgba(11, 20, 48, 0.2);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  transition: transform 160ms ease, background-color 160ms ease;
}

.diskora-install:hover,
.diskora-install:focus-visible {
  transform: translateY(-1px);
  background: var(--diskora-navy-soft);
}

.diskora-install svg {
  width: 18px;
  height: 18px;
}

.diskora-install-dialog {
  position: fixed;
  z-index: 1100;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(11, 20, 48, 0.38);
}

.diskora-install-welcome {
  z-index: 1300;
  background: rgba(5, 12, 30, 0.62);
  backdrop-filter: blur(5px);
}

.diskora-install-card {
  position: relative;
  width: min(100%, 390px);
  padding: 24px;
  border: 1px solid var(--diskora-border);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(11, 20, 48, 0.2);
}

.diskora-install-welcome .diskora-install-card {
  width: min(100%, 430px);
  padding: 30px;
  animation: diskora-modal-enter 180ms ease-out both;
}

@keyframes diskora-modal-enter {
  from { opacity: 0; transform: translateY(10px) scale(0.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

.diskora-install-card strong,
.diskora-install-card span {
  display: block;
}

.diskora-install-card strong {
  margin-bottom: 8px;
  color: var(--diskora-navy);
  font-size: 1.15rem;
}

.diskora-install-card span {
  color: var(--diskora-muted);
  line-height: 1.55;
}

.diskora-install-card button {
  width: 100%;
  min-height: 42px;
  margin-top: 18px;
  border: 0;
  border-radius: 10px;
  color: #fff;
  background: var(--diskora-teal-dark);
  font-weight: 700;
}

.diskora-install-card .diskora-install-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 36px;
  min-height: 36px;
  display: grid;
  place-items: center;
  margin: 0;
  padding: 0;
  border: 1px solid var(--diskora-border);
  border-radius: 50%;
  color: var(--diskora-muted);
  background: transparent;
  font: 500 23px/1 system-ui, sans-serif;
  cursor: pointer;
}

.diskora-install-card .diskora-install-close:hover,
.diskora-install-card .diskora-install-close:focus-visible {
  color: var(--diskora-navy);
  background: #eef3f7;
}

.diskora-install-mark {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  margin-bottom: 18px;
  border-radius: 16px;
  color: #fff;
  background: linear-gradient(145deg, var(--diskora-teal), var(--diskora-teal-dark));
  box-shadow: 0 12px 30px rgba(22, 155, 151, 0.25);
}

.diskora-install-mark svg {
  width: 27px;
  height: 27px;
}

.diskora-install-welcome .diskora-install-card > strong {
  padding-right: 28px;
  font-size: 1.28rem;
  line-height: 1.3;
}

.diskora-install-welcome .diskora-install-card > span {
  margin-top: 10px;
}

.diskora-install-welcome ul {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.diskora-install-welcome li {
  padding: 6px 9px;
  border: 1px solid rgba(22, 155, 151, 0.22);
  border-radius: 999px;
  color: #0d6664;
  background: #e7f8f7;
  font-size: 0.75rem;
  font-weight: 700;
}

.diskora-install-actions {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.35fr);
  gap: 10px;
  margin-top: 22px;
}

.diskora-install-card .diskora-install-actions button {
  min-width: 0;
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0;
  padding: 0 14px;
  cursor: pointer;
}

.diskora-install-card .diskora-install-later {
  border: 1px solid var(--diskora-border);
  color: var(--diskora-text);
  background: #f4f7fa;
}

.diskora-install-card .diskora-install-primary {
  background: var(--diskora-teal-dark);
}

.diskora-install-card .diskora-install-primary span {
  color: #fff;
}

.diskora-install-card .diskora-install-primary:hover,
.diskora-install-card .diskora-install-primary:focus-visible {
  background: #0d6664;
}

.diskora-install-primary svg {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
}

.dark-mode .task-login,
.dark-mode.task-login,
.dark-mode .task-login #layout-content {
  background: #081027;
}

.dark-mode .task-login #login-form,
.dark-mode .diskora-install-card {
  color: #eef2fb;
  background: #111b38;
  border-color: #243155;
}

.dark-mode .diskora-install-card .diskora-install-close,
html[data-diskora-theme="dark"] .diskora-install-card .diskora-install-close {
  color: #b8c3db;
  border-color: #2b3959;
}

.dark-mode .diskora-install-card .diskora-install-close:hover,
.dark-mode .diskora-install-card .diskora-install-close:focus-visible,
html[data-diskora-theme="dark"] .diskora-install-card .diskora-install-close:hover,
html[data-diskora-theme="dark"] .diskora-install-card .diskora-install-close:focus-visible {
  color: #fff;
  background: #1b2945;
}

.dark-mode .diskora-install-card .diskora-install-later,
html[data-diskora-theme="dark"] .diskora-install-card .diskora-install-later {
  color: #eef2fb;
  border-color: #2b3959;
  background: #17233e;
}

.dark-mode .task-login .diskora-remember,
.dark-mode.task-login .diskora-remember {
  color: #f5f7ff;
  background: rgba(49, 193, 187, 0.1);
  border-color: rgba(49, 193, 187, 0.26);
}

.dark-mode .task-login .diskora-remember small,
.dark-mode.task-login .diskora-remember small {
  color: #aeb8d3;
}

.dark-mode .task-login #login-form::before,
.dark-mode .diskora-install-card strong {
  color: #fff;
}

@keyframes diskora-enter {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 600px) {
  .task-login #logo {
    top: 5vh;
    width: 76px;
    height: 76px;
  }

  .task-login #login-form {
    top: 7vh;
    width: calc(100% - 28px);
    padding: 24px 20px;
  }

  .diskora-install {
    right: 12px;
    bottom: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Diskora mailbox workspace */
.task-mail,
.task-addressbook,
.task-settings {
  background: var(--diskora-canvas);
  font-size: 15px;
}

.task-mail #layout-menu,
.task-addressbook #layout-menu,
.task-settings #layout-menu {
  border-right: 1px solid rgba(255, 255, 255, 0.08);
  background: var(--diskora-navy);
}

.task-mail #layout-menu #logo,
.task-addressbook #layout-menu #logo,
.task-settings #layout-menu #logo {
  width: 54px;
  height: 54px;
  margin: 10px auto 6px;
  padding: 0;
  border-radius: 14px;
  background: #0b1430;
  content: url("/diskora-icons/diskora-mail.png");
  object-fit: cover;
  box-shadow: 0 8px 22px rgba(2, 8, 24, 0.22);
}

.task-mail #taskmenu a,
.task-addressbook #taskmenu a,
.task-settings #taskmenu a,
.task-mail #layout-menu .special-buttons a,
.task-addressbook #layout-menu .special-buttons a,
.task-settings #layout-menu .special-buttons a {
  margin: 3px 8px;
  border-radius: 10px;
  color: #aebad0;
  background: transparent;
  font-size: 0.82rem;
  transition: color 140ms ease, background-color 140ms ease;
}

.task-mail #taskmenu a.selected,
.task-mail #taskmenu .selected a,
.task-addressbook #taskmenu a.selected,
.task-addressbook #taskmenu .selected a,
.task-settings #taskmenu a.selected,
.task-settings #taskmenu .selected a,
.task-mail #taskmenu a:hover,
.task-addressbook #taskmenu a:hover,
.task-settings #taskmenu a:hover {
  color: #fff;
  background: rgba(49, 193, 187, 0.16);
}

.task-mail #layout-sidebar,
.task-addressbook #layout-sidebar,
.task-settings #layout-sidebar {
  color: var(--diskora-text);
  background: #fff;
  border-right: 1px solid var(--diskora-border);
}

.task-mail #layout-sidebar > .header,
.task-addressbook #layout-sidebar > .header,
.task-settings #layout-sidebar > .header {
  min-height: 62px;
  padding-inline: 16px;
  color: var(--diskora-navy);
  background: #fff;
  border-bottom: 1px solid var(--diskora-border);
  font-weight: 700;
}

.task-mail #mailboxlist,
.task-addressbook .listing,
.task-settings .listing {
  padding: 10px 8px;
}

.task-mail #mailboxlist li,
.task-addressbook .listing li,
.task-settings .listing li {
  overflow: hidden;
  margin: 2px 0;
  border: 0;
  border-radius: 9px;
}

.task-mail #mailboxlist li a,
.task-addressbook .listing li a,
.task-settings .listing li a {
  min-height: 42px;
  display: flex;
  align-items: center;
  color: #536079;
}

.task-mail #mailboxlist li.selected,
.task-addressbook .listing li.selected,
.task-settings .listing li.selected {
  background: #e7f8f7;
}

.task-mail #mailboxlist li.selected a,
.task-addressbook .listing li.selected a,
.task-settings .listing li.selected a {
  color: #117f7c;
  font-weight: 700;
}

.task-mail #layout-list,
.task-addressbook #layout-list,
.task-settings #layout-list {
  color: var(--diskora-text);
  background: #f8fafc;
  border-right: 1px solid var(--diskora-border);
}

.task-mail #messagelist-header,
.task-mail #layout-list > .header,
.task-addressbook #layout-list > .header,
.task-settings #layout-list > .header {
  min-height: 62px;
  color: #526077;
  background: #fff;
  border-bottom: 1px solid var(--diskora-border);
}

.task-mail .searchbar {
  min-height: 46px;
  margin: 10px 12px;
  border: 1px solid var(--diskora-border);
  border-radius: 12px;
  color: var(--diskora-text);
  background: #fff;
  box-shadow: none;
}

.task-mail .searchbar input {
  min-height: 44px;
  color: var(--diskora-text);
  background: transparent;
  font-size: 0.92rem;
}

.task-mail #messagelist tbody tr {
  border-bottom: 1px solid #e7ebf2;
  color: var(--diskora-text);
  background: #fff;
}

.task-mail #messagelist tbody tr:hover td {
  background: #f1f7f7;
}

.task-mail #messagelist tbody tr.selected td {
  color: #0d6664;
  background: #ddf5f3;
}

.task-mail #messagelist td {
  min-height: 68px;
  padding-block: 10px;
  font-size: 0.9rem;
}

.task-mail #messagelist tr.unread td {
  color: var(--diskora-navy);
  font-weight: 700;
}

.task-mail #layout-content,
.task-addressbook #layout-content,
.task-settings #layout-content {
  color: var(--diskora-text);
  background: var(--diskora-canvas);
}

.task-mail #layout-content > .header,
.task-mail #layout-content .toolbar,
.task-addressbook #layout-content > .header,
.task-settings #layout-content > .header {
  min-height: 62px;
  color: #526077;
  background: #fff;
  border-bottom: 1px solid var(--diskora-border);
}

.task-mail #layout-content .toolbar a,
.task-mail #layout-content .toolbar button {
  color: #536079;
}

.task-mail #messagecontframe {
  margin: 12px;
  border: 1px solid var(--diskora-border);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(11, 20, 48, 0.05);
}

.task-mail.action-compose #layout-content,
.task-mail.action-compose #compose-content,
.task-mail.action-compose .formcontent {
  background: #fff;
}

.task-mail.action-compose .form-control,
.task-mail.action-compose .custom-select {
  min-height: 42px;
  border-color: var(--diskora-border);
  border-radius: 9px;
  color: var(--diskora-text);
  background: #fff;
}

.diskora-compose {
  position: fixed;
  z-index: 1060;
  right: 18px;
  bottom: 18px;
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0 18px;
  border: 0;
  border-radius: 13px;
  color: #061b25;
  background: var(--diskora-teal);
  box-shadow: 0 12px 30px rgba(11, 20, 48, 0.22);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  transition: transform 150ms ease, background-color 150ms ease;
}

.diskora-compose:hover,
.diskora-compose:focus-visible {
  transform: translateY(-1px);
  background: #55d3ce;
}

.diskora-compose svg {
  width: 18px;
  height: 18px;
}

.task-mail .diskora-install {
  bottom: 78px;
}

html.dark-mode .task-mail,
html.dark-mode .task-addressbook,
html.dark-mode .task-settings,
html.dark-mode .task-mail #layout-content,
html.dark-mode .task-addressbook #layout-content,
html.dark-mode .task-settings #layout-content {
  color: #edf2f8;
  background: #09101d;
}

html.dark-mode .task-mail #layout-sidebar,
html.dark-mode .task-addressbook #layout-sidebar,
html.dark-mode .task-settings #layout-sidebar,
html.dark-mode .task-mail #layout-sidebar > .header,
html.dark-mode .task-addressbook #layout-sidebar > .header,
html.dark-mode .task-settings #layout-sidebar > .header {
  color: #edf2f8;
  background: #101a2e;
  border-color: #24304a;
}

html.dark-mode .task-mail #mailboxlist li a,
html.dark-mode .task-addressbook .listing li a,
html.dark-mode .task-settings .listing li a {
  color: #b8c3d7;
}

html.dark-mode .task-mail #mailboxlist li.selected,
html.dark-mode .task-addressbook .listing li.selected,
html.dark-mode .task-settings .listing li.selected {
  background: rgba(49, 193, 187, 0.16);
}

html.dark-mode .task-mail #mailboxlist li.selected a,
html.dark-mode .task-addressbook .listing li.selected a,
html.dark-mode .task-settings .listing li.selected a {
  color: #69ddd8;
}

html.dark-mode .task-mail #layout-list,
html.dark-mode .task-addressbook #layout-list,
html.dark-mode .task-settings #layout-list {
  color: #edf2f8;
  background: #0d1625;
  border-color: #24304a;
}

html.dark-mode .task-mail #messagelist-header,
html.dark-mode .task-mail #layout-list > .header,
html.dark-mode .task-addressbook #layout-list > .header,
html.dark-mode .task-settings #layout-list > .header,
html.dark-mode .task-mail #layout-content > .header,
html.dark-mode .task-mail #layout-content .toolbar,
html.dark-mode .task-addressbook #layout-content > .header,
html.dark-mode .task-settings #layout-content > .header {
  color: #b8c3d7;
  background: #101a2a;
  border-color: #24304a;
}

html.dark-mode .task-mail .searchbar,
html.dark-mode .task-mail .searchbar input {
  color: #edf2f8;
  background: #111d30;
  border-color: #2a3853;
}

html.dark-mode .task-mail #messagelist tbody tr {
  color: #dfe7f2;
  background: #0f1928;
  border-color: #202d43;
}

html.dark-mode .task-mail #messagelist tbody tr:hover td {
  background: #152339;
}

html.dark-mode .task-mail #messagelist tbody tr.selected td {
  color: #efffff;
  background: #173439;
}

html.dark-mode .task-mail #messagelist tr.unread td {
  color: #fff;
}

html.dark-mode .task-mail #messagecontframe {
  border-color: #24304a;
  background: #0f1928;
  box-shadow: none;
}

html.dark-mode .task-mail.action-compose #layout-content,
html.dark-mode .task-mail.action-compose #compose-content,
html.dark-mode .task-mail.action-compose .formcontent {
  background: #0f1928;
}

html.dark-mode .task-mail.action-compose .form-control,
html.dark-mode .task-mail.action-compose .custom-select {
  color: #edf2f8;
  background: #111d30;
  border-color: #2a3853;
}

@media (max-width: 600px) {
  .diskora-compose {
    right: 12px;
    bottom: 12px;
    min-height: 46px;
  }

  .task-mail .diskora-install {
    bottom: 70px;
  }
}

/* Diskora interaction layer */
.task-mail #layout-menu #logo,
.task-addressbook #layout-menu #logo,
.task-settings #layout-menu #logo {
  flex: 0 0 54px;
  width: 54px !important;
  min-width: 54px;
  max-width: 54px;
  height: 54px !important;
  min-height: 54px;
  max-height: 54px;
  aspect-ratio: 1 / 1;
  object-fit: contain;
}

.diskora-compose {
  bottom: 68px;
}

.task-mail .diskora-install {
  bottom: 126px;
}

/* Roundcube menüleri ve diyalogları her zaman kayan eylemlerin üstünde kalır. */
.diskora-compose,
.diskora-install {
  z-index: 700;
}

body:has(.popover.show) .diskora-compose,
body:has(.popupmenu:not(.hidden)) .diskora-compose,
body:has(.ui-dialog) .diskora-compose,
body:has(.diskora-tools-panel) .diskora-compose,
body:has(.diskora-install-dialog) .diskora-compose,
body:has(.popover.show) .diskora-install,
body:has(.popupmenu:not(.hidden)) .diskora-install,
body:has(.ui-dialog) .diskora-install,
body:has(.diskora-tools-panel) .diskora-install,
body:has(.diskora-install-dialog) .diskora-install {
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
}

#mailboxlist li > a {
  min-width: 0;
}

#mailboxlist .unreadcount {
  min-width: 23px;
  height: 22px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  padding: 0 6px;
  border-radius: 999px;
  color: #052322;
  background: var(--diskora-teal);
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1;
}

#mailboxlist .unreadcount.diskora-zero {
  display: none !important;
}

.diskora-sender-avatar {
  width: 32px;
  height: 32px;
  display: inline-grid;
  place-items: center;
  float: left;
  margin: 0 9px 2px 0;
  border: 1px solid rgba(22, 155, 151, 0.2);
  border-radius: 50%;
  color: #0f7471;
  background: #e6f7f6;
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: -0.03em;
}

.diskora-tools-icon {
  width: 1.18em;
  display: inline-block;
  margin-right: 0.25rem;
  text-align: center;
  font-size: 1.15em;
}

.diskora-tools-panel {
  position: fixed;
  z-index: 1090;
  top: 14px;
  right: 14px;
  width: min(390px, calc(100vw - 28px));
  overflow: hidden;
  border: 1px solid var(--diskora-border);
  border-radius: 16px;
  color: var(--diskora-text);
  background: #fff;
  box-shadow: 0 24px 70px rgba(11, 20, 48, 0.22);
  animation: diskora-enter 180ms ease-out both;
}

.diskora-tools-panel header {
  min-height: 68px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 16px;
  color: #fff;
  background: var(--diskora-navy);
}

.diskora-tools-panel header > div,
.diskora-tools-panel section > div:first-child {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.diskora-tools-panel header span,
.diskora-switch-row span {
  color: #aebad0;
  font-size: 0.76rem;
}

.diskora-tools-panel header button {
  border: 0;
  color: #fff;
  background: transparent;
  font-size: 1.6rem;
  cursor: pointer;
}

.diskora-tools-panel section {
  padding: 14px 16px;
  border-bottom: 1px solid var(--diskora-border);
}

.diskora-tools-panel section > label,
.diskora-switch-row label {
  display: block;
  margin-bottom: 8px;
  color: var(--diskora-muted);
  font-size: 0.76rem;
  font-weight: 700;
}

.diskora-choice {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: 5px;
}

.diskora-choice button,
.diskora-tools-actions button,
.diskora-switch-row > button {
  min-height: 38px;
  border: 1px solid var(--diskora-border);
  border-radius: 9px;
  color: #536079;
  background: #f8fafc;
  font: inherit;
  font-size: 0.8rem;
  cursor: pointer;
}

.diskora-choice button.active {
  border-color: rgba(22, 155, 151, 0.45);
  color: #0d6664;
  background: #e7f8f7;
  font-weight: 750;
}

.diskora-switch-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.diskora-switch-row label {
  margin: 0;
  color: var(--diskora-text);
}

.diskora-switch-row > button {
  min-width: 64px;
}

.diskora-switch-row > button[aria-checked="true"] {
  color: #fff;
  background: var(--diskora-teal-dark);
}

.diskora-tools-actions {
  display: grid;
  gap: 7px;
  border-bottom: 0 !important;
}

.diskora-tools-actions button {
  width: 100%;
  text-align: left;
  padding-inline: 12px;
}

.diskora-toast {
  position: fixed;
  z-index: 1200;
  left: 50%;
  bottom: 22px;
  min-height: 46px;
  max-width: min(620px, calc(100vw - 28px));
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 9px 12px 9px 16px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 12px;
  color: #fff;
  background: var(--diskora-navy);
  box-shadow: 0 16px 45px rgba(11, 20, 48, 0.28);
  transform: translateX(-50%);
}

.diskora-toast span {
  font-size: 0.86rem;
}

.diskora-toast button {
  min-height: 30px;
  padding: 0 10px;
  border: 0;
  border-radius: 7px;
  color: #052322;
  background: var(--diskora-teal);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 800;
  cursor: pointer;
}

.diskora-context-menu {
  position: fixed;
  z-index: 1180;
  width: 184px;
  overflow: hidden;
  padding: 5px;
  border: 1px solid var(--diskora-border);
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 16px 40px rgba(11, 20, 48, 0.2);
}

.diskora-context-menu button {
  width: 100%;
  min-height: 36px;
  display: block;
  padding: 0 10px;
  border: 0;
  border-radius: 7px;
  color: var(--diskora-text);
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.diskora-context-menu button:hover {
  background: #e7f8f7;
}

.diskora-compose-helper {
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  border-bottom: 1px solid var(--diskora-border);
  color: var(--diskora-text);
  background: #f7fafc;
}

.diskora-compose-helper strong {
  font-size: 0.9rem;
}

.diskora-compose-helper span {
  color: var(--diskora-muted);
  font-size: 0.76rem;
}

.diskora-compose-helper button {
  min-height: 34px;
  margin-left: auto;
  padding: 0 11px;
  border: 1px solid rgba(22, 155, 151, 0.35);
  border-radius: 8px;
  color: #0d6664;
  background: #e7f8f7;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 750;
  cursor: pointer;
}

.task-mail.action-compose #compose-content {
  width: min(100%, 1120px);
  margin: 0 auto;
  border-inline: 1px solid var(--diskora-border);
}

.task-mail.action-compose #composebody {
  min-height: 330px;
  font-size: 1rem;
  line-height: 1.6;
}

.diskora-drop-active {
  outline: 3px dashed var(--diskora-teal);
  outline-offset: -8px;
  background: rgba(49, 193, 187, 0.05) !important;
}

.diskora-schedule-card input {
  width: 100%;
  min-height: 44px;
  margin-top: 16px;
  padding: 0 11px;
  border: 1px solid var(--diskora-border);
  border-radius: 9px;
  font: inherit;
}

.diskora-schedule-card > div {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}

.diskora-schedule-card > div button {
  flex: 1;
  margin-top: 0;
}

html[data-diskora-density="compact"] .task-mail #messagelist td {
  min-height: 50px;
  padding-block: 5px;
  font-size: 0.82rem;
}

html[data-diskora-density="compact"] .task-mail #mailboxlist li a {
  min-height: 34px;
}

html[data-diskora-density="compact"] .diskora-sender-avatar {
  width: 27px;
  height: 27px;
  margin-right: 7px;
}

html[data-diskora-theme="dark"] body,
html[data-diskora-theme="dark"] .task-mail,
html[data-diskora-theme="dark"] .task-addressbook,
html[data-diskora-theme="dark"] .task-settings {
  color: #edf2f8;
  background: #09101d;
}

html[data-diskora-theme="dark"] .diskora-tools-panel,
html[data-diskora-theme="dark"] .diskora-context-menu {
  color: #edf2f8;
  background: #101a2e;
  border-color: #24304a;
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .column-resizer {
    display: block !important;
  }
}

@media (max-width: 900px) {
  body.task-mail,
  body.task-addressbook,
  body.task-settings {
    padding-bottom: 62px;
  }

  .task-mail #layout-menu,
  .task-addressbook #layout-menu,
  .task-settings #layout-menu {
    position: fixed !important;
    z-index: 1080;
    top: auto !important;
    right: 0;
    bottom: 0;
    left: 0 !important;
    width: 100% !important;
    height: 62px !important;
    min-height: 62px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    border-right: 0;
  }

  .task-mail #layout-menu #logo,
  .task-addressbook #layout-menu #logo,
  .task-settings #layout-menu #logo,
  #layout-menu .popover-header {
    display: none !important;
  }

  #taskmenu {
    height: 100%;
    display: flex;
    align-items: stretch;
    justify-content: space-around;
    overflow-x: auto;
  }

  #taskmenu > a {
    min-width: 62px;
    flex: 1 0 62px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin: 0 !important;
    border-radius: 0 !important;
    font-size: 0.67rem !important;
  }

  #taskmenu > a .inner {
    display: block !important;
    margin-top: 2px;
  }

  .diskora-compose {
    right: 12px;
    bottom: 76px;
  }

  .task-mail .diskora-install {
    right: 12px;
    bottom: 132px;
  }

  .diskora-toast {
    bottom: 74px;
  }

  .diskora-compose-helper {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .diskora-compose-helper button {
    width: 100%;
    margin-left: 0;
  }
}

/* Diskora navigation and account refinement */
.task-mail #layout-menu #logo,
.task-addressbook #layout-menu #logo,
.task-settings #layout-menu #logo,
.diskora-tools-button,
.diskora-tools-panel,
.diskora-compose-helper {
  display: none !important;
}

@media (min-width: 901px) {
  .task-mail #layout-menu,
  .task-addressbook #layout-menu,
  .task-settings #layout-menu {
    background-color: var(--diskora-navy);
    background-image: url("/diskora-icons/diskora-mail.png");
    background-repeat: no-repeat;
    background-position: center 14px;
    background-size: 46px 46px;
  }

  .task-mail #taskmenu,
  .task-addressbook #taskmenu,
  .task-settings #taskmenu {
    padding-top: 70px;
    background-image: url("/diskora-icons/diskora-mail.png");
    background-repeat: no-repeat;
    background-position: center 14px;
    background-size: 46px 46px;
  }
}

#taskmenu .special-buttons .about,
#taskmenu .special-buttons .logout {
  display: none !important;
}

.diskora-compose {
  z-index: 950 !important;
  right: 18px;
  bottom: 18px;
}

.diskora-install-wrap {
  position: fixed;
  z-index: 940;
  right: 18px;
  bottom: 18px;
  display: inline-flex;
}

.task-mail .diskora-install-wrap {
  bottom: 78px;
}

.diskora-install-wrap .diskora-install,
.task-mail .diskora-install-wrap .diskora-install {
  position: relative !important;
  right: auto !important;
  bottom: auto !important;
}

.diskora-install-dismiss {
  position: absolute;
  z-index: 2;
  top: -9px;
  right: -9px;
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 2px solid #fff;
  border-radius: 50%;
  color: #fff;
  background: #42506b;
  box-shadow: 0 5px 14px rgba(11, 20, 48, 0.24);
  font: 700 18px/1 system-ui, sans-serif;
  cursor: pointer;
}

.diskora-install-dismiss:hover,
.diskora-install-dismiss:focus-visible {
  background: #26334e;
}

body:has(.popover.show) .diskora-install-wrap,
body:has(.popupmenu:not(.hidden)) .diskora-install-wrap,
body:has(.ui-dialog) .diskora-install-wrap,
body:has(.diskora-install-dialog) .diskora-install-wrap {
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
}

/* Roundcube görünmez menüleri DOM'da açık görünebildiği için kayan eylemleri
   yalnızca katman sırasıyla koru; aksi halde masaüstünde yanlışlıkla kaybolurlar. */
body .diskora-compose,
body .diskora-install-wrap {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: none !important;
}

.diskora-compose { z-index: 620 !important; }
.diskora-install-wrap { z-index: 610; }

.diskora-profile-button {
  position: fixed;
  z-index: 990;
  top: 9px;
  right: 13px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(11, 20, 48, 0.1);
  border-radius: 50%;
  color: var(--diskora-navy);
  background: #fff;
  box-shadow: 0 7px 20px rgba(11, 20, 48, 0.12);
  cursor: pointer;
}

.diskora-profile-button:hover,
.diskora-profile-button:focus-visible,
.diskora-profile-button[aria-expanded="true"] {
  color: #0d6664;
  border-color: rgba(22, 155, 151, 0.35);
  background: #e7f8f7;
}

.diskora-profile-button svg {
  width: 23px;
  height: 23px;
}

.diskora-profile-menu {
  position: fixed;
  z-index: 1085;
  top: 59px;
  right: 12px;
  width: min(360px, calc(100vw - 24px));
  overflow: hidden;
  border: 1px solid var(--diskora-border);
  border-radius: 16px;
  color: var(--diskora-text);
  background: #fff;
  box-shadow: 0 22px 60px rgba(11, 20, 48, 0.23);
  animation: diskora-enter 160ms ease-out both;
}

.diskora-profile-menu header {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 15px 16px 13px;
  color: #fff;
  background: var(--diskora-navy);
}

.diskora-profile-menu header strong {
  font-size: 0.96rem;
}

.diskora-profile-menu header span {
  overflow: hidden;
  color: #b8c5da;
  font-size: 0.76rem;
  text-overflow: ellipsis;
}

.diskora-account-list {
  max-height: min(50vh, 330px);
  overflow-y: auto;
  padding: 7px;
}

.diskora-account-row {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 2px 0;
  border: 1px solid transparent;
  border-radius: 11px;
}

.diskora-account-row.active {
  border-color: rgba(22, 155, 151, 0.22);
  background: #effaf9;
}

.diskora-account-switch {
  min-width: 0;
  flex: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 7px;
  border: 0;
  color: var(--diskora-text);
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.diskora-account-switch > span:first-child {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #062b2a;
  background: var(--diskora-teal);
  font-size: 0.8rem;
  font-weight: 850;
}

.diskora-account-switch > span:last-child {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.diskora-account-switch strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.84rem;
}

.diskora-account-switch small {
  color: var(--diskora-muted);
  font-size: 0.7rem;
}

.diskora-account-remove {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  padding: 0;
  border: 0;
  border-radius: 9px;
  color: #778299;
  background: transparent;
  font: 500 20px/1 system-ui, sans-serif;
  cursor: pointer;
}

.diskora-account-remove:hover,
.diskora-account-remove:focus-visible {
  color: #a72f3f;
  background: #fff0f2;
}

.diskora-profile-menu footer {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  padding: 10px;
  border-top: 1px solid var(--diskora-border);
  background: #f8fafc;
}

.diskora-profile-menu footer button {
  min-height: 40px;
  padding: 0 10px;
  border: 1px solid var(--diskora-border);
  border-radius: 9px;
  color: #526077;
  background: #fff;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 750;
  cursor: pointer;
}

.diskora-profile-menu footer button:first-child {
  color: #0d6664;
  border-color: rgba(22, 155, 151, 0.28);
  background: #e7f8f7;
}

.diskora-settings-help {
  margin-top: 8px !important;
  border-top: 1px solid var(--diskora-border) !important;
}

.diskora-settings-help a {
  display: flex !important;
  align-items: center;
  gap: 10px;
  padding-top: 9px !important;
}

.diskora-settings-help-mark {
  width: 24px;
  height: 24px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(22, 155, 151, 0.3);
  border-radius: 50%;
  color: #0d6664;
  background: #e7f8f7;
  font-weight: 850;
}

html.dark-mode .diskora-profile-button,
html.dark-mode .diskora-profile-menu,
html[data-diskora-theme="dark"] .diskora-profile-button,
html[data-diskora-theme="dark"] .diskora-profile-menu {
  color: #edf2f8;
  border-color: #293752;
  background: #101a2e;
}

html.dark-mode .diskora-account-row.active,
html[data-diskora-theme="dark"] .diskora-account-row.active {
  background: rgba(49, 193, 187, 0.12);
}

html.dark-mode .diskora-account-switch,
html[data-diskora-theme="dark"] .diskora-account-switch {
  color: #edf2f8;
}

html.dark-mode .diskora-profile-menu footer,
html[data-diskora-theme="dark"] .diskora-profile-menu footer {
  border-color: #293752;
  background: #0d1627;
}

@media (max-width: 900px) {
  .task-mail #layout-list .back-sidebar-button.folders::before {
    content: "\f0c9" !important;
  }

  .task-mail #layout-sidebar.selected,
  .task-mail #layout-sidebar:not(.hidden) {
    position: fixed !important;
    z-index: 1075;
    top: 0 !important;
    right: auto !important;
    bottom: 62px !important;
    left: 0 !important;
    width: min(84vw, 340px) !important;
    min-width: 240px !important;
    max-width: 340px !important;
    height: auto !important;
    display: flex !important;
    border-right: 1px solid var(--diskora-border) !important;
    box-shadow: 14px 0 42px rgba(5, 12, 30, 0.24);
  }

  .task-mail #layout:has(#layout-sidebar.selected) #layout-list.hidden,
  .task-mail #layout:has(#layout-sidebar:not(.hidden)) #layout-list.hidden {
    display: flex !important;
    opacity: 0.72;
    pointer-events: none;
  }

  .diskora-drawer-overlay {
    position: fixed;
    z-index: 1070;
    inset: 0 0 62px 0;
    padding: 0;
    border: 0;
    background: rgba(5, 12, 30, 0.42);
  }

  body:has(.diskora-drawer-overlay) .diskora-profile-button {
    opacity: 0;
    pointer-events: none;
  }

  #taskmenu {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: stretch;
    overflow: visible;
  }

  #taskmenu > .action-buttons {
    display: contents !important;
  }

  #taskmenu > a,
  #taskmenu > .action-buttons > a {
    min-width: 0;
    width: auto !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin: 0 !important;
    border-radius: 0 !important;
    font-size: 0.67rem !important;
  }

  #taskmenu > .special-buttons {
    position: fixed;
    z-index: 1060;
    left: 12px;
    bottom: 72px;
    display: block !important;
  }

  #taskmenu > .special-buttons .theme {
    width: 42px !important;
    height: 42px;
    display: grid !important;
    place-items: center;
    margin: 0 !important;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 12px !important;
    color: #fff;
    background: var(--diskora-navy);
    box-shadow: 0 8px 22px rgba(11, 20, 48, 0.22);
  }

  #taskmenu > .special-buttons .theme .inner {
    display: none !important;
  }

  .diskora-compose {
    right: 12px;
    bottom: 76px;
  }

  .task-mail .diskora-install-wrap {
    right: 12px;
    bottom: 136px;
  }

  .diskora-profile-button {
    top: 8px;
    right: 10px;
    width: 40px;
    height: 40px;
  }

  .diskora-profile-menu {
    top: 56px;
    right: 8px;
    width: min(360px, calc(100vw - 16px));
  }

  .diskora-toast {
    bottom: 74px;
  }
}

/* Mobile workspace stabilization
 * Roundcube marks the global task menu as hidden in phone layout. Diskora uses
 * that same menu as a persistent bottom navigation, so it must stay mounted
 * while the selected workspace panel changes. Keep these rules last: they
 * intentionally reconcile Elastic's phone state with Diskora's navigation. */
@media (max-width: 900px) {
  :root {
    --diskora-mobile-nav-height: calc(64px + env(safe-area-inset-bottom, 0px));
  }

  html,
  body.task-mail,
  body.task-addressbook,
  body.task-settings {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  body.task-mail,
  body.task-addressbook,
  body.task-settings {
    padding-bottom: var(--diskora-mobile-nav-height) !important;
  }

  .task-mail #layout,
  .task-addressbook #layout,
  .task-settings #layout,
  .task-mail #layout-list,
  .task-addressbook #layout-list,
  .task-settings #layout-list,
  .task-mail #layout-content,
  .task-addressbook #layout-content,
  .task-settings #layout-content {
    min-width: 0;
    max-width: 100%;
  }

  .task-mail #layout-menu,
  .task-mail #layout-menu.hidden,
  .task-addressbook #layout-menu,
  .task-addressbook #layout-menu.hidden,
  .task-settings #layout-menu,
  .task-settings #layout-menu.hidden {
    position: fixed !important;
    z-index: 1080;
    top: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: var(--diskora-mobile-nav-height) !important;
    min-height: var(--diskora-mobile-nav-height) !important;
    display: block !important;
    overflow: hidden;
    padding: 0 0 env(safe-area-inset-bottom, 0px);
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    border-right: 0;
    box-sizing: border-box;
    box-shadow: 0 -8px 24px rgba(5, 12, 30, 0.16);
  }

  /* Elastic forces this drawer header back on with a higher-specificity
   * !important rule in phone mode; a persistent bottom nav has no drawer. */
  html.layout-phone body.task-mail #layout-menu > .popover-header,
  html.layout-phone body.task-addressbook #layout-menu > .popover-header,
  html.layout-phone body.task-settings #layout-menu > .popover-header {
    display: none !important;
  }

  #taskmenu {
    width: 100%;
    height: 100% !important;
    min-height: 0;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: stretch;
    overflow: hidden;
  }

  #taskmenu > .action-buttons {
    display: contents !important;
  }

  #taskmenu > a,
  #taskmenu > .action-buttons > a {
    min-width: 0 !important;
    max-width: none !important;
    min-height: 44px;
    width: auto !important;
    height: 100%;
    justify-self: stretch;
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    overflow: hidden;
    margin: 0 !important;
    padding: 5px 3px 4px;
    border-radius: 0 !important;
    box-sizing: border-box;
    font-size: 0.78rem !important;
    line-height: 1.1;
    text-align: center;
    text-overflow: ellipsis;
  }

  #taskmenu > a .inner,
  #taskmenu > .action-buttons > a .inner {
    max-width: 100%;
    display: block !important;
    overflow: hidden;
    margin-top: 1px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #taskmenu > a::before,
  #taskmenu > .action-buttons > a::before {
    font-size: 1.25rem !important;
    line-height: 1 !important;
  }

  /* Keep message rows compact and proportional on touch layouts. The desktop
   * rule's 10px cell padding otherwise combines with Elastic's two-line row. */
  .task-mail #messagelist tbody tr {
    min-height: 74px;
  }

  .task-mail #messagelist td {
    min-height: 74px;
    padding-block: 6px;
  }

  /* The persistent bottom navigation replaces Elastic's duplicate menu icon. */
  .task-mail .task-menu-button,
  .task-addressbook .task-menu-button,
  .task-settings .task-menu-button,
  #taskmenu > .special-buttons {
    display: none !important;
  }

  /* Leave room for the account control instead of covering toolbar actions. */
  .task-mail #messagelist-header {
    padding-right: 49px !important;
  }

  .diskora-profile-button {
    top: 8px;
    right: 8px;
    width: 40px;
    height: 40px;
  }

  .diskora-profile-menu {
    top: 56px;
    right: 8px;
    width: min(360px, calc(100vw - 16px));
    max-height: calc(100dvh - var(--diskora-mobile-nav-height) - 64px);
    overflow-y: auto;
  }

  /* Compose already exists as the first bottom-nav item on phones. */
  .diskora-compose,
  .task-mail .floating-action-buttons .compose,
  .task-mail .diskora-install-wrap,
  .task-addressbook .diskora-install-wrap,
  .task-settings .diskora-install-wrap {
    display: none !important;
  }

  .task-mail #layout-sidebar.selected,
  .task-mail #layout-sidebar:not(.hidden) {
    bottom: var(--diskora-mobile-nav-height) !important;
  }

  .diskora-drawer-overlay {
    inset: 0 0 var(--diskora-mobile-nav-height) 0;
  }

  /* Roundcube anchors notices to viewport bottom, directly underneath the
   * persistent nav. Lift and constrain both native notices and Diskora toasts
   * so they never cover navigation, pagination, or compose actions. */
  #messagestack {
    position: fixed !important;
    z-index: 1210;
    top: auto !important;
    right: 12px !important;
    bottom: calc(var(--diskora-mobile-nav-height) + 47px) !important;
    left: auto !important;
    width: min(360px, calc(100vw - 24px)) !important;
    max-height: calc(100dvh - var(--diskora-mobile-nav-height) - 96px);
    display: flex;
    flex-direction: column;
    gap: 8px;
    overflow-y: auto;
  }

  #messagestack > div {
    min-height: 48px !important;
    margin: 0 !important;
    padding: 11px 42px 11px 14px !important;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 12px !important;
    box-shadow: 0 14px 34px rgba(5, 12, 30, 0.28);
    box-sizing: border-box;
    font-size: 0.88rem;
    line-height: 1.35;
  }

  body.action-compose #messagestack {
    bottom: calc(var(--diskora-mobile-nav-height) + 74px) !important;
  }

  .diskora-toast {
    bottom: calc(var(--diskora-mobile-nav-height) + 47px);
    width: min(360px, calc(100vw - 24px));
    max-width: none;
    justify-content: space-between;
    box-sizing: border-box;
  }

  body.action-compose .diskora-toast {
    bottom: calc(var(--diskora-mobile-nav-height) + 74px);
  }
}

/* Compose options help: visible on pointer hover/focus and pinnable by click. */
.task-mail.action-compose #layout-sidebar > .header {
  overflow: visible;
  padding-right: 52px;
}

.diskora-compose-info {
  z-index: 3;
  width: 30px;
  min-width: 30px;
  height: 30px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 30px;
  margin: 0 4px 0 8px;
  padding: 0;
  border: 1px solid rgba(49, 193, 187, 0.48);
  border-radius: 50%;
  color: #0d6664;
  background: rgba(231, 248, 247, 0.95);
  box-shadow: 0 4px 12px rgba(5, 12, 30, 0.08);
  cursor: help;
  transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease, transform 150ms ease;
}

.diskora-compose-info:hover,
.diskora-compose-info:focus-visible,
.diskora-compose-info[aria-expanded="true"] {
  color: #fff;
  border-color: var(--diskora-teal-dark);
  background: var(--diskora-teal-dark);
  outline: none;
  transform: translateY(-1px);
}

.diskora-compose-info svg {
  width: 18px;
  height: 18px;
}

.diskora-compose-info-popover {
  position: fixed;
  z-index: 1320;
  max-width: calc(100vw - 24px);
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 13px 14px;
  border: 1px solid rgba(49, 193, 187, 0.32);
  border-radius: 12px;
  color: var(--diskora-text);
  background: #fff;
  box-shadow: 0 16px 38px rgba(5, 12, 30, 0.22);
  box-sizing: border-box;
  font-size: 0.82rem;
  line-height: 1.45;
  text-align: left;
}

.diskora-compose-info-popover[hidden] {
  display: none !important;
}

.diskora-compose-info-popover strong,
.diskora-compose-info-popover span {
  display: block;
}

.diskora-compose-info-popover strong {
  color: var(--diskora-navy);
  font-size: 0.88rem;
}

.diskora-compose-info-popover span {
  color: var(--diskora-muted);
}

.dark-mode .diskora-compose-info-popover,
html[data-diskora-theme="dark"] .diskora-compose-info-popover {
  color: #edf2f8;
  border-color: #2a8d89;
  background: #111b38;
}

.dark-mode .diskora-compose-info-popover strong,
html[data-diskora-theme="dark"] .diskora-compose-info-popover strong {
  color: #fff;
}

.dark-mode .diskora-compose-info-popover span,
html[data-diskora-theme="dark"] .diskora-compose-info-popover span {
  color: #b8c3db;
}

/* The first-visit modal must suppress the persistent install chip. */
body:has(.diskora-install-dialog) .diskora-install-wrap {
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (max-width: 600px) {
  .diskora-install-dialog {
    align-items: end;
    padding: 12px;
  }

  .diskora-install-welcome .diskora-install-card {
    width: 100%;
    padding: 25px 20px 18px;
    border-radius: 18px;
  }

  .diskora-install-welcome .diskora-install-card > strong {
    padding-right: 24px;
    font-size: 1.14rem;
  }

  .diskora-install-actions {
    display: flex;
    flex-direction: column;
  }

  .diskora-install-card .diskora-install-primary {
    order: -1;
  }

  .task-mail.action-compose #layout-sidebar > .header {
    padding-right: 50px;
  }

  .diskora-compose-info {
    width: 32px;
    min-width: 32px;
    height: 32px;
    flex-basis: 32px;
    margin-left: 6px;
  }

  .diskora-compose-info-popover {
    font-size: 0.84rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .diskora-install-welcome .diskora-install-card,
  .diskora-compose-info {
    animation: none;
    transition: none;
  }
}

/* Mobile shell separation
 * The workspace ends where the persistent task menu begins. Roundcube's
 * phone dialogs and slide-over menus use the same boundary, so destructive
 * action buttons can never be covered by the bottom navigation. */
@media (max-width: 900px) {
  :root {
    --diskora-workspace-height: calc(100dvh - var(--diskora-mobile-nav-height));
  }

  body.task-mail,
  body.task-addressbook,
  body.task-settings {
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    overflow: hidden !important;
    padding-bottom: 0 !important;
  }

  .task-mail #layout,
  .task-addressbook #layout,
  .task-settings #layout {
    position: relative;
    z-index: auto;
    width: 100% !important;
    height: calc(100vh - var(--diskora-mobile-nav-height)) !important;
    height: var(--diskora-workspace-height) !important;
    max-height: var(--diskora-workspace-height) !important;
    overflow: hidden;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    box-sizing: border-box;
  }

  .task-mail #layout > #layout-sidebar,
  .task-mail #layout > #layout-list,
  .task-mail #layout > #layout-content,
  .task-addressbook #layout > #layout-sidebar,
  .task-addressbook #layout > #layout-list,
  .task-addressbook #layout > #layout-content,
  .task-settings #layout > #layout-sidebar,
  .task-settings #layout > #layout-list,
  .task-settings #layout > #layout-content {
    bottom: 0 !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0;
    box-sizing: border-box;
  }

  /* The folder drawer is position:fixed, so percentage height would resolve
   * against the viewport and cover the persistent task menu. Keep it inside
   * the workspace and leave the drawer itself outside the click-catcher. */
  .task-mail #layout > #layout-sidebar.selected,
  .task-mail #layout > #layout-sidebar:not(.hidden) {
    top: 0 !important;
    bottom: var(--diskora-mobile-nav-height) !important;
    height: auto !important;
    max-height: var(--diskora-workspace-height) !important;
    z-index: 1075 !important;
  }

  body.task-mail > .diskora-drawer-overlay {
    top: 0 !important;
    right: 0 !important;
    bottom: var(--diskora-mobile-nav-height) !important;
    left: clamp(240px, 84vw, 340px) !important;
    width: auto !important;
    height: auto !important;
    z-index: 1070 !important;
  }

  .task-mail #layout-menu,
  .task-addressbook #layout-menu,
  .task-settings #layout-menu {
    isolation: isolate;
    contain: paint;
  }

  /* Roundcube/Bs popovers are full-height drawers in phone and small modes. */
  html.layout-phone .popover:not(.select-menu),
  html.layout-small .popover:not(.select-menu) {
    z-index: 1450 !important;
    bottom: var(--diskora-mobile-nav-height) !important;
    height: auto !important;
    max-height: var(--diskora-workspace-height) !important;
  }

  html.layout-phone .popover-overlay,
  html.layout-small .popover-overlay {
    position: fixed !important;
    z-index: 1440 !important;
    inset: 0 0 var(--diskora-mobile-nav-height) 0 !important;
    width: auto !important;
    height: auto !important;
  }

  .select-menu,
  .ui-menu,
  .ui-autocomplete {
    z-index: 1460 !important;
    max-height: calc(var(--diskora-workspace-height) - 16px) !important;
    overflow-y: auto !important;
  }

  body.task-mail > .ui-widget-overlay,
  body.task-addressbook > .ui-widget-overlay,
  body.task-settings > .ui-widget-overlay {
    position: fixed !important;
    z-index: 1470 !important;
    inset: 0 0 var(--diskora-mobile-nav-height) 0 !important;
    width: auto !important;
    height: auto !important;
  }

  body.task-mail > .ui-dialog,
  body.task-addressbook > .ui-dialog,
  body.task-settings > .ui-dialog {
    z-index: 1480 !important;
    max-height: var(--diskora-workspace-height) !important;
    box-sizing: border-box !important;
  }

  .diskora-install-dialog {
    bottom: var(--diskora-mobile-nav-height) !important;
  }
}

@media (max-width: 480px) {
  body.task-mail > .ui-dialog,
  body.task-addressbook > .ui-dialog,
  body.task-settings > .ui-dialog {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: var(--diskora-mobile-nav-height) !important;
    left: 0 !important;
    width: 100% !important;
    height: calc(100vh - var(--diskora-mobile-nav-height)) !important;
    height: var(--diskora-workspace-height) !important;
    max-height: var(--diskora-workspace-height) !important;
    margin: 0 !important;
    overflow: hidden;
  }

  body.task-mail > .ui-dialog .ui-dialog-content,
  body.task-addressbook > .ui-dialog .ui-dialog-content,
  body.task-settings > .ui-dialog .ui-dialog-content {
    min-height: 0;
    overflow-y: auto;
  }

  body.task-mail > .ui-dialog .ui-dialog-buttonpane,
  body.task-addressbook > .ui-dialog .ui-dialog-buttonpane,
  body.task-settings > .ui-dialog .ui-dialog-buttonpane {
    position: relative;
    z-index: 1;
    flex: 0 0 58px;
    width: 100%;
    box-sizing: border-box;
  }
}

/* Mobile compose attachments
 * Keep Roundcube's native upload form and attachment list intact, but place
 * them directly below the subject field on narrow screens. */
.diskora-mobile-attachments {
  display: none;
}

@media (max-width: 900px) {
  .task-mail.action-compose .diskora-mobile-attachments {
    display: block;
    margin: 0 12px 14px;
  }

  .task-mail.action-compose .diskora-mobile-attachments-heading {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 8px;
    color: var(--diskora-text);
  }

  .task-mail.action-compose .diskora-mobile-attachments-heading svg {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    color: var(--diskora-teal-dark);
  }

  .task-mail.action-compose .diskora-mobile-attachments-heading span {
    min-width: 0;
    display: flex;
    align-items: baseline;
    gap: 7px;
  }

  .task-mail.action-compose .diskora-mobile-attachments-heading strong {
    font-size: 0.88rem;
  }

  .task-mail.action-compose .diskora-mobile-attachments-heading small {
    color: var(--diskora-muted);
    font-size: 0.72rem;
  }

  .task-mail.action-compose .diskora-mobile-attachments #compose-attachments.file-upload {
    min-height: 0;
    margin: 0;
    padding: 10px;
    border: 1px solid var(--diskora-border);
    border-radius: 12px;
    background: #f7fafc;
  }

  .task-mail.action-compose .diskora-mobile-attachments #compose-attachments.file-upload::after {
    display: none !important;
  }

  .task-mail.action-compose .diskora-mobile-attachments .upload-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    padding: 0;
    text-align: left;
  }

  .task-mail.action-compose .diskora-mobile-attachments .upload-form .hint {
    width: 100%;
    margin: 0 0 2px;
    text-align: left;
    font-size: 0.72rem;
  }

  .task-mail.action-compose .diskora-mobile-attachments .upload-form .btn {
    min-height: 40px;
    margin: 0;
    border-radius: 9px;
    font-weight: 700;
  }

  .task-mail.action-compose .diskora-mobile-attachments .attachmentslist:not(:empty) {
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px solid var(--diskora-border);
  }

  .task-mail.action-compose .diskora-mobile-attachments .attachmentslist:not(:empty)::before {
    content: "Eklenen dosyalar";
    display: block;
    margin: 0 0 4px;
    color: var(--diskora-muted);
    font-size: 0.72rem;
    font-weight: 700;
  }

  .task-mail.action-compose #layout > #layout-sidebar:not(.hidden) {
    top: 0 !important;
    right: 0 !important;
    bottom: var(--diskora-mobile-nav-height) !important;
    left: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    max-height: var(--diskora-workspace-height) !important;
    border-right: 0 !important;
    box-shadow: none;
  }

  .task-mail.action-compose #layout-sidebar > .header .back-content-button {
    position: absolute;
    z-index: 5;
    top: 8px;
    left: 8px;
    width: 42px;
    height: 42px;
    display: inline-grid !important;
    place-items: center;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 50%;
  }

  .task-mail.action-compose #layout-sidebar > .header .header-title {
    margin: 0 !important;
    padding-left: 44px;
    padding-right: 44px;
    text-align: center;
  }
}

.dark-mode .task-mail.action-compose .diskora-mobile-attachments #compose-attachments.file-upload,
html[data-diskora-theme="dark"] .task-mail.action-compose .diskora-mobile-attachments #compose-attachments.file-upload {
  border-color: #29445b;
  background: #102033;
}