/* Alasta v5.17.T132 — Mail workspace + trusted browser */

.mfa-remember-row {
  display: flex;
  gap: 11px;
  align-items: flex-start;
  padding: 12px 13px;
  margin: 4px 0 14px;
  border: 1px solid #dbe4f0;
  border-radius: 12px;
  background: #f8fafc;
  cursor: pointer;
}
.mfa-remember-row input { width: 17px; height: 17px; margin-top: 2px; accent-color: #1d4ed8; }
.mfa-remember-row span { display: grid; gap: 3px; }
.mfa-remember-row strong { color: #172033; font-size: 13px; }
.mfa-remember-row small { color: #64748b; line-height: 1.35; font-size: 11px; }

.mail-nav-unread {
  min-width: 20px;
  height: 20px;
  margin-left: auto;
  padding: 0 6px;
  border-radius: 999px;
  background: #d97706;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  line-height: 20px;
  text-align: center;
}

#view-mail { padding: 0 !important; overflow: hidden; }
.mail-shell {
  --mail-ink: #152238;
  --mail-muted: #718096;
  --mail-line: #dfe6ee;
  --mail-paper: #fff;
  --mail-warm: #d97706;
  --mail-warm-soft: #fff6df;
  min-height: calc(100vh - 66px);
  height: calc(100vh - 66px);
  background:
    linear-gradient(90deg, rgba(217,119,6,.035) 1px, transparent 1px) 0 0/26px 26px,
    #edf1f5;
  color: var(--mail-ink);
  font-family: "Segoe UI Variable", "Aptos", "Segoe UI", sans-serif;
  overflow: hidden;
}
.mail-loading-state,
.mail-setup-state {
  min-height: calc(100vh - 66px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
  text-align: center;
  padding: 28px;
}
.mail-loading-mark,
.mail-setup-icon,
.mail-empty-glyph {
  display: grid;
  place-items: center;
  width: 68px;
  height: 68px;
  border-radius: 22px 8px 22px 8px;
  color: #fff;
  background: #172033;
  box-shadow: 12px 12px 0 #f3c46f;
  font: 700 30px Georgia, serif;
  margin-bottom: 15px;
}
.mail-loading-state strong { font: 700 22px Georgia, serif; }
.mail-loading-state span { color: var(--mail-muted); }
.mail-toolbar {
  height: 64px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 9px 15px;
  border-bottom: 1px solid #cad3de;
  background: rgba(248,250,252,.96);
  backdrop-filter: blur(12px);
}
.mail-toolbar-brand { min-width: 232px; display: flex; align-items: center; gap: 10px; }
.mail-toolbar-brand > div { display: grid; line-height: 1.05; }
.mail-toolbar-brand strong { font: 700 17px Georgia, serif; letter-spacing: -.02em; }
.mail-toolbar-brand small { margin-top: 4px; color: var(--mail-muted); font-size: 10px; text-transform: uppercase; letter-spacing: .12em; }
.mail-logo {
  width: 38px; height: 38px; display: grid; place-items: center;
  border-radius: 14px 5px 14px 5px;
  color: #fff; background: #172033; font: 700 19px Georgia, serif;
  box-shadow: 5px 5px 0 #efc36f;
}
.mail-btn,
.mail-icon-btn {
  border: 1px solid #ccd6e1;
  border-radius: 9px;
  background: #fff;
  color: #26364d;
  min-height: 36px;
  padding: 0 13px;
  font: 650 12px inherit;
  cursor: pointer;
  transition: .16s ease;
}
.mail-btn:hover,.mail-icon-btn:hover { transform: translateY(-1px); border-color: #9cadc0; box-shadow: 0 5px 16px rgba(34,49,70,.1); }
.mail-btn:disabled { opacity: .55; cursor: wait; transform: none; }
.mail-btn-primary { background: #172033; color: #fff; border-color: #172033; }
.mail-btn-danger { color: #a1261c; border-color: #f0b8b3; background: #fff2f1; }
.mail-icon-btn { width: 38px; padding: 0; font-size: 20px; }
.mail-icon-btn.spinning { animation: mail-spin .7s linear infinite; }
@keyframes mail-spin { to { transform: rotate(360deg); } }
.mail-search {
  flex: 1;
  min-width: 180px;
  height: 38px;
  display: flex;
  align-items: center;
  gap: 9px;
  max-width: 720px;
  margin: 0 auto;
  padding: 0 11px;
  border: 1px solid #cad5e1;
  border-radius: 9px;
  background: #fff;
}
.mail-search span { color: #718096; font-size: 20px; transform: rotate(-20deg); }
.mail-search input { flex: 1; border: 0; outline: 0; color: #172033; background: transparent; font: 12px inherit; }
.mail-search kbd { color: #8492a6; background: #f3f6f9; border: 1px solid #dce3eb; border-radius: 5px; padding: 2px 6px; font-size: 9px; }
.mail-workspace {
  display: grid;
  grid-template-columns: 238px minmax(320px, 390px) minmax(410px, 1fr);
  height: calc(100% - 64px);
}
.mail-rail {
  display: flex;
  flex-direction: column;
  min-width: 0;
  border-right: 1px solid #d3dbe5;
  background: #f7f9fb;
}
.mail-rail-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 15px 8px; color: #718096;
  font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .14em;
}
.mail-rail-head button,.mail-rail-foot button { border: 0; background: transparent; color: #7d8999; cursor: pointer; font-size: 19px; }
.mail-folders-title { padding-top: 18px; border-top: 1px solid #e3e8ee; margin-top: 10px; }
.mail-account-list,.mail-folder-list { display: grid; gap: 3px; padding: 0 8px; }
.mail-account,.mail-folder {
  width: 100%; display: flex; align-items: center; gap: 9px;
  border: 0; border-radius: 8px; padding: 8px; color: #34435a;
  background: transparent; text-align: left; cursor: pointer;
}
.mail-account:hover,.mail-folder:hover { background: #e9eef4; }
.mail-account.active { background: #fff; box-shadow: 0 2px 10px rgba(40,55,75,.08), inset 3px 0 #d97706; }
.mail-folder.active { color: #9a4f00; background: var(--mail-warm-soft); }
.mail-account-avatar {
  flex: 0 0 34px; width: 34px; height: 34px; display: grid; place-items: center;
  border-radius: 11px 4px 11px 4px; background: var(--mail-color); color: #fff; font-weight: 800;
}
.mail-account-copy { display: grid; min-width: 0; flex: 1; }
.mail-account-copy strong { overflow: hidden; text-overflow: ellipsis; font-size: 12px; }
.mail-account-copy small { overflow: hidden; text-overflow: ellipsis; color: #7a8798; font-size: 10px; }
.mail-account b,.mail-folder b { margin-left: auto; min-width: 20px; color: #9a4f00; font-size: 10px; text-align: right; }
.mail-folder { padding: 8px 10px; }
.mail-folder > span { width: 18px; color: #7a8798; font: 700 14px Georgia, serif; text-align: center; }
.mail-folder strong { font-size: 12px; font-weight: 650; }
.mail-add-account-card {
  display: grid; place-items: center; gap: 3px; width: 100%;
  padding: 18px 8px; border: 1px dashed #b7c3d1; border-radius: 10px;
  color: #55657b; background: #fff; cursor: pointer;
}
.mail-add-account-card span { font-size: 23px; color: #d97706; }
.mail-add-account-card small { color: #8995a5; }
.mail-rail-placeholder { padding: 12px; color: #98a3b0; font-size: 11px; text-align: center; }
.mail-inline-loader { padding: 12px; color: #8492a6; font-size: 11px; }
.mail-inline-loader i,.mail-reader-loader i {
  display: inline-block; width: 13px; height: 13px; margin-right: 6px;
  border: 2px solid #d6dde6; border-top-color: #d97706; border-radius: 50%;
  animation: mail-spin .7s linear infinite;
}
.mail-rail-foot {
  display: flex; align-items: center; gap: 7px; margin-top: auto;
  padding: 12px 14px; border-top: 1px solid #dfe5ec; color: #7c899a; font-size: 10px;
}
.mail-rail-foot button { margin-left: auto; font-size: 14px; }
.mail-bridge-dot { width: 7px; height: 7px; border-radius: 50%; background: #22a06b; box-shadow: 0 0 0 3px #d8f4e7; }
.mail-list-pane { min-width: 0; display: flex; flex-direction: column; border-right: 1px solid #d3dbe5; background: #fff; }
.mail-list-head {
  min-height: 69px; display: flex; justify-content: space-between; align-items: center;
  padding: 12px 14px; border-bottom: 1px solid #e0e6ed;
}
.mail-list-head > div:first-child { display: grid; gap: 2px; }
.mail-list-head strong { font: 700 18px Georgia, serif; }
.mail-list-head span { color: var(--mail-muted); font-size: 10px; }
.mail-filter-switch { display: flex; padding: 2px; border: 1px solid #dbe2ea; border-radius: 7px; background: #f4f7f9; }
.mail-filter-switch button { border: 0; border-radius: 5px; padding: 5px 7px; background: transparent; color: #748196; font-size: 9px; cursor: pointer; }
.mail-filter-switch button.active { color: #172033; background: #fff; box-shadow: 0 1px 5px rgba(30,45,65,.12); }
.mail-message-list { flex: 1; overflow: auto; }
.mail-message {
  position: relative; width: 100%; display: flex; gap: 10px; min-height: 88px;
  padding: 13px 12px; border: 0; border-bottom: 1px solid #edf0f4;
  color: #34435a; background: #fff; text-align: left; cursor: pointer;
}
.mail-message:hover { background: #f8fafc; }
.mail-message.active { background: #fff7e7; box-shadow: inset 3px 0 #d97706; }
.mail-message.unread { background: #f5f8fc; }
.mail-message.unread::after { content: ""; position: absolute; right: 9px; top: 45px; width: 6px; height: 6px; border-radius: 50%; background: #d97706; }
.mail-sender-avatar {
  flex: 0 0 34px; width: 34px; height: 34px; display: grid; place-items: center;
  border-radius: 50%; color: #4e5e74; background: #e8edf3; font: 700 13px Georgia, serif;
}
.mail-message.unread .mail-sender-avatar { color: #fff; background: #34435a; }
.mail-message-copy { display: grid; min-width: 0; flex: 1; gap: 3px; }
.mail-message-line { display: flex; justify-content: space-between; min-width: 0; gap: 8px; }
.mail-message-line strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.mail-message-line time { flex: 0 0 auto; color: #8a96a6; font-size: 9px; }
.mail-message-subject { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #27364b; font-size: 12px; }
.mail-message.unread .mail-message-subject { font-weight: 750; }
.mail-message-snippet { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; color: #7b8797; line-height: 1.35; font-size: 10px; }
.mail-star { margin-right: 4px; color: #d97706; }
.mail-paperclip { position: absolute; right: 12px; bottom: 8px; color: #8995a5; }
.mail-load-more { min-height: 36px; border: 0; border-top: 1px solid #e1e7ee; color: #596a81; background: #f8fafc; cursor: pointer; font-size: 11px; }
.mail-list-empty { min-height: 320px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px; color: #748196; text-align: center; }
.mail-list-empty > span { color: #d97706; font: 700 34px Georgia, serif; }
.mail-list-empty strong { margin-top: 8px; color: #34435a; font: 700 17px Georgia, serif; }
.mail-list-empty p { max-width: 250px; font-size: 11px; line-height: 1.5; }
.mail-list-empty button { border: 0; border-radius: 8px; padding: 9px 14px; color: #fff; background: #172033; cursor: pointer; }
.mail-message-skeleton { display: grid; grid-template-columns: 35px 1fr; gap: 10px; padding: 14px 12px; border-bottom: 1px solid #edf0f4; }
.mail-message-skeleton i { grid-row: span 2; width: 34px; height: 34px; border-radius: 50%; background: #edf1f5; }
.mail-message-skeleton span,.mail-message-skeleton em { height: 10px; border-radius: 4px; background: linear-gradient(90deg,#edf1f5,#f8fafc,#edf1f5); background-size: 220% 100%; animation: mail-shimmer 1.3s infinite; }
.mail-message-skeleton em { width: 70%; }
@keyframes mail-shimmer { to { background-position: -220% 0; } }
.mail-reader { min-width: 0; background: #fff; overflow: hidden; }
.mail-reader-empty,.mail-reader-loader {
  height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 40px; color: #8591a1; text-align: center;
}
.mail-reader-empty h2 { margin: 18px 0 4px; color: #34435a; font: 700 22px Georgia, serif; }
.mail-reader-empty p { max-width: 340px; font-size: 12px; line-height: 1.55; }
.mail-reader-empty.error .mail-empty-glyph { background: #991b1b; box-shadow: 12px 12px 0 #fecaca; }
.mail-reader-loader { flex-direction: row; }
.mail-reader-toolbar {
  height: 48px; display: flex; align-items: center; gap: 4px; padding: 6px 12px;
  border-bottom: 1px solid #e0e6ed; background: #f8fafc;
}
.mail-reader-toolbar button { border: 0; border-radius: 6px; padding: 7px 9px; color: #56667c; background: transparent; cursor: pointer; font-size: 10px; }
.mail-reader-toolbar button:hover { background: #e9eef4; }
.mail-reader-toolbar span { flex: 1; }
.mail-reader-toolbar .danger { color: #b42318; }
.mail-reader-scroll { height: calc(100% - 48px); overflow: auto; }
.mail-message-header { display: flex; gap: 13px; padding: 23px 26px 18px; border-bottom: 1px solid #edf0f4; }
.mail-reader-avatar { flex: 0 0 46px; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #34435a; font: 700 18px Georgia, serif; }
.mail-header-main { min-width: 0; flex: 1; }
.mail-header-main h1 { margin: 0 0 9px; color: #172033; font: 700 clamp(18px,2vw,25px) Georgia, serif; letter-spacing: -.015em; }
.mail-header-main div { color: #526178; font-size: 11px; }
.mail-header-main a { color: #8a5a12; text-decoration: none; }
.mail-header-main small { color: #8a96a6; font-size: 10px; }
.mail-message-header time { color: #8491a2; font-size: 10px; white-space: nowrap; }
.mail-body { max-width: 920px; padding: 28px 34px 60px; color: #26364d; font-size: 13px; line-height: 1.65; }
.mail-html-body img { max-width: 100%; height: auto; }
.mail-html-body img.mail-remote-image-blocked {
  display: inline-block;
  min-width: 180px;
  min-height: 34px;
  padding: 8px;
  border: 1px dashed #cbd5e1;
  border-radius: 6px;
  color: #7b8797;
  background: #f8fafc;
  font-size: 10px;
}
.mail-html-body table { max-width: 100%; }
.mail-text-body { white-space: normal; }
.mail-attachments { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 26px; border-bottom: 1px solid #edf0f4; background: #fbfcfd; }
.mail-attachments button { display: grid; grid-template-columns: auto 1fr; column-gap: 8px; min-width: 170px; padding: 8px 10px; border: 1px solid #dce3eb; border-radius: 8px; color: #526178; background: #fff; text-align: left; cursor: pointer; }
.mail-attachments button span { grid-row: span 2; color: #d97706; font-size: 20px; }
.mail-attachments button strong { font-size: 10px; }
.mail-attachments button small { color: #8995a5; font-size: 8px; }

.mail-dialog { width: min(760px, calc(100vw - 28px)); max-width: none; padding: 0; border: 0; border-radius: 14px; background: transparent; box-shadow: 0 28px 90px rgba(15,23,42,.3); }
.mail-dialog::backdrop { background: rgba(14,24,39,.56); backdrop-filter: blur(5px); }
.mail-dialog-card { overflow: hidden; border: 1px solid #d7dfe8; border-radius: 14px; background: #fff; }
.mail-dialog-card > header { display: flex; justify-content: space-between; align-items: center; padding: 18px 20px; color: #fff; background: #172033; }
.mail-dialog-card > header small { display: block; color: #eec67b; font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.mail-dialog-card > header h2 { margin: 3px 0 0; font: 700 22px Georgia, serif; }
.mail-dialog-card > header button { border: 0; color: #b8c2d1; background: transparent; cursor: pointer; font-size: 27px; }
.mail-dialog-body { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; max-height: 68vh; overflow: auto; padding: 18px 20px; }
.mail-field { display: grid; gap: 5px; }
.mail-field > span,.mail-server-grid label > span { color: #596a81; font-size: 10px; font-weight: 700; }
.mail-field-wide { grid-column: 1 / -1; }
.mail-server-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.mail-server-grid > div { display: grid; gap: 9px; padding: 14px; border: 1px solid #dfe5ec; border-radius: 10px; background: #f8fafc; }
.mail-server-grid > div > strong { color: #34435a; font: 700 13px Georgia, serif; }
.mail-server-grid label:not(.mail-check) { display: grid; grid-template-columns: 62px 1fr; align-items: center; gap: 8px; }
.mail-check { display: flex !important; flex-direction: row; align-items: flex-start; gap: 8px; color: #596a81; font-size: 10px; }
.mail-check input { accent-color: #d97706; }
.mail-security-note { display: flex; gap: 10px; padding: 12px; border-radius: 9px; color: #3f4e63; background: #fff7e8; border: 1px solid #f1d49c; }
.mail-security-note > span { color: #b96800; }
.mail-security-note div { display: grid; gap: 3px; }
.mail-security-note small { color: #7b6a4e; line-height: 1.4; }
.mail-dialog-card > footer { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 20px; border-top: 1px solid #e2e8ef; background: #f8fafc; }
.mail-footer-spacer { flex: 1; }
.mail-form-status { margin: 0 20px 12px; padding: 9px 11px; border: 1px solid #cbd8e5; border-radius: 8px; color: #53647a; background: #f4f7fa; font-size: 11px; }
.mail-dialog-body .mail-form-status { margin: 0; }
.mail-form-status.success { color: #08754d; border-color: #a8dfca; background: #edf9f4; }
.mail-form-status.error { color: #a1261c; border-color: #f3bbb6; background: #fff1f0; }
.mail-compose-dialog { width: min(920px, calc(100vw - 28px)); }
.mail-compose-fields { display: grid; padding: 10px 20px 0; }
.mail-compose-fields label { display: grid; grid-template-columns: 68px 1fr; align-items: center; min-height: 42px; border-bottom: 1px solid #e7ebf0; }
.mail-compose-fields label > span { color: #728095; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.mail-compose-fields .input { border: 0; box-shadow: none; }
.mail-compose-editor { margin: 12px 20px; border: 1px solid #dce3eb; border-radius: 10px; overflow: hidden; }
.mail-editor-bar { min-height: 38px; display: flex; align-items: center; gap: 3px; padding: 4px 7px; border-bottom: 1px solid #e1e7ed; background: #f6f8fa; }
.mail-editor-bar button,.mail-editor-bar label { border: 0; border-radius: 5px; padding: 6px 8px; color: #56667c; background: transparent; cursor: pointer; font-size: 10px; }
.mail-editor-bar button:hover,.mail-editor-bar label:hover { background: #e4eaf0; }
.mail-editor-bar span { flex: 1; }
.mail-rich-editor { min-height: 260px; max-height: 45vh; overflow: auto; padding: 17px; outline: 0; color: #26364d; font-size: 13px; line-height: 1.6; }
.mail-rich-editor blockquote { margin: 16px 0 0; padding-left: 14px; border-left: 3px solid #e5b45d; color: #68778a; }
.mail-compose-attachments { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 8px 8px; }
.mail-compose-attachments span { padding: 6px 8px; border-radius: 6px; color: #596a81; background: #edf1f5; font-size: 9px; }
.mail-compose-attachments button { border: 0; color: #a1261c; background: transparent; cursor: pointer; }
.mail-setup-state { background: #f4f7fa; }
.mail-setup-state h2 { margin: 12px 0 0; color: #26364d; font: 700 23px Georgia, serif; }
.mail-setup-state > p { max-width: 620px; color: #66768a; line-height: 1.5; }
.mail-setup-steps { display: grid; gap: 8px; margin: 15px 0; text-align: left; }
.mail-setup-steps span { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid #dbe2ea; border-radius: 8px; background: #fff; font-size: 11px; }
.mail-setup-steps b { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #d97706; }

body.dark .mail-shell { --mail-ink:#e5eaf1; --mail-muted:#93a1b4; --mail-line:#344154; --mail-paper:#172033; background:#111827; }
body.dark .mail-toolbar,body.dark .mail-rail,body.dark .mail-list-pane,body.dark .mail-reader { background:#172033; border-color:#344154; color:#dce3ec; }
body.dark .mail-search,body.dark .mail-message,body.dark .mail-account.active { background:#1e2b40; border-color:#3b4a60; color:#dce3ec; }
body.dark .mail-message:hover,body.dark .mail-folder:hover { background:#223149; }
body.dark .mail-message.active { background:#3a2b16; }
body.dark .mail-list-head,body.dark .mail-reader-toolbar,body.dark .mail-message-header { border-color:#344154; }
body.dark .mail-message-subject,body.dark .mail-header-main h1,body.dark .mail-list-head strong { color:#edf2f7; }

@media (max-width: 1180px) {
  .mail-workspace { grid-template-columns: 210px 330px minmax(360px,1fr); }
  .mail-toolbar-brand { min-width: 190px; }
}
@media (max-width: 900px) {
  .mail-workspace { grid-template-columns: 190px minmax(300px,1fr); }
  .mail-reader { position: absolute; inset: 64px 0 0 190px; z-index: 3; display: none; }
  .mail-reader:has(.mail-reader-toolbar) { display: block; }
  .mail-toolbar-brand { min-width: auto; }
  .mail-toolbar-brand > div { display: none; }
  .mail-search kbd { display: none; }
}
@media (max-width: 640px) {
  .mail-shell { height: calc(100vh - 55px); }
  .mail-toolbar { height: 58px; padding: 7px; }
  .mail-toolbar .mail-btn-primary { width: 38px; overflow: hidden; padding: 0; font-size: 0; }
  .mail-toolbar .mail-btn-primary::before { content:"✎"; font-size:18px; }
  .mail-workspace { grid-template-columns: 1fr; height: calc(100% - 58px); }
  .mail-rail { display: none; }
  .mail-reader { inset: 58px 0 0; }
  .mail-filter-switch button:not(.active) { display: none; }
  .mail-dialog-body,.mail-server-grid { grid-template-columns: 1fr; }
  .mail-field-wide { grid-column: auto; }
  .mail-message-header { padding: 16px; }
  .mail-message-header time { display: none; }
  .mail-body { padding: 20px 18px 50px; }
}