@font-face{font-family:"Yekan Bakh";src:url("../fonts/yekan-regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Yekan Bakh";src:url("../fonts/yekan-bold.woff2") format("woff2");font-weight:700;font-display:swap}
html[dir=rtl] body, html[dir=rtl] input, html[dir=rtl] select, html[dir=rtl] textarea, html[dir=rtl] button,
body.task-login, body.task-login input { font-family:"Yekan Bakh", Tahoma, sans-serif; }
:root {
  --neomarket-navy: #0c4f59;
  --neomarket-blue: #106470;
  --neomarket-cyan: #f59e0b;
  --neomarket-ink: #16363b;
  --neomarket-surface: #f7feff;
}

body.task-login {
  background:
    radial-gradient(circle at 12% 18%, rgba(204, 248, 252, .95), transparent 34%),
    radial-gradient(circle at 88% 82%, rgba(78, 180, 195, .72), transparent 38%),
    linear-gradient(135deg, #eefcfe 0%, #9fe1ea 48%, #0c4f59 100%);
  color: var(--neomarket-ink);
}

.task-login #layout-content {
  min-height: 100vh;
}

.task-login #logo {
  top: 9vh;
  width: 92px;
  max-height: 104px;
  filter: drop-shadow(0 12px 22px rgba(28, 108, 120, .2));
}

#login-form {
  top: 12vh;
  max-width: 390px;
  padding: 2rem 2rem 1.6rem;
  border: 1px solid rgba(255, 255, 255, .78);
  border-radius: 28px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 30px 80px rgba(19, 71, 79, .24);
  backdrop-filter: blur(18px);
}

#login-form::before {
  content: "NeoMarket Mail";
  display: block;
  margin-bottom: 1.5rem;
  color: var(--neomarket-navy);
  font-size: 1.45rem;
  font-weight: 800;
  letter-spacing: -.02em;
}

#login-form .form-control {
  min-height: 48px;
  border-color: #daf1f4;
  border-radius: 14px;
  background-color: #fbfeff;
}

#login-form .form-control:focus {
  border-color: var(--neomarket-blue);
  box-shadow: 0 0 0 .2rem rgba(56, 200, 223, .14);
}

#rcmloginsubmit,
.btn-primary {
  border-color: var(--neomarket-blue) !important;
  background: linear-gradient(135deg, var(--neomarket-blue), var(--neomarket-navy)) !important;
  box-shadow: 0 12px 26px rgba(56, 200, 223, .22);
}

#login-footer {
  color: #66868b;
}

#taskmenu,
#taskmenu .special-buttons {
  background-color: var(--neomarket-navy);
}

#taskmenu a.selected,
#taskmenu a:hover,
.listing li.selected,
.listing tr.selected td {
  background-color: rgba(56, 200, 223, .16);
  color: var(--neomarket-blue);
}

a,
.listing a:hover {
  color: var(--neomarket-blue);
}

/* Full mailbox experience */
body:not(.task-login) {
  background:
    radial-gradient(circle at 8% 10%, rgba(205, 248, 252, .9), transparent 28%),
    linear-gradient(135deg, #eefcfe 0%, #defafd 46%, #bbeaf1 100%);
  color: var(--neomarket-ink);
}

#layout-sidebar,
#layout-list,
#layout-content {
  border-color: #daf2f5;
  background: rgba(250, 254, 255, .96);
}

#layout-sidebar,
#layout-list {
  box-shadow: 8px 0 28px rgba(23, 96, 106, .055);
}

#layout-sidebar > .header,
#layout-list > .header,
#layout-content > .header,
.toolbar,
.searchbar,
.footer {
  border-color: #dcf1f4 !important;
  background-color: rgba(247, 254, 255, .94) !important;
  color: var(--neomarket-ink);
}

#taskmenu {
  border: 0;
  background:
    radial-gradient(circle at 30% 0, rgba(73, 198, 218, .58), transparent 36%),
    linear-gradient(180deg, #1e7481 0%, #14525b 58%, #0c3d44 100%);
  box-shadow: 10px 0 34px rgba(16, 77, 86, .18);
}

#taskmenu .logo {
  background: rgba(255, 255, 255, .08);
}

#taskmenu a {
  color: rgba(226, 250, 253, .76);
  transition: background-color .18s ease, color .18s ease, box-shadow .18s ease;
}

#taskmenu a:hover {
  background: rgba(255, 255, 255, .08);
  color: #ffffff;
}

#taskmenu a.selected {
  background: linear-gradient(135deg, rgba(60, 200, 223, .96), rgba(245, 158, 11, .78));
  color: #ffffff;
  box-shadow: inset 3px 0 0 rgba(255, 255, 255, .72), 0 10px 24px rgba(4, 63, 72, .2);
}

.header .button,
.toolbar a.button,
.toolbar .dropbutton a.dropdown,
.footer .button {
  color: #55777c;
}

.header .button:hover,
.toolbar a.button:hover,
.toolbar a.button.selected,
.footer .button:hover {
  color: var(--neomarket-blue);
}

.searchbar {
  margin: .55rem .7rem;
  border: 1px solid #dcf1f4 !important;
  border-radius: 14px;
  background: #ffffff !important;
  box-shadow: 0 5px 16px rgba(23, 96, 106, .05);
}

.searchbar input,
.form-control,
input,
select,
textarea {
  border-color: #d8f0f3;
  background-color: #ffffff;
}

.form-control:focus,
input:focus,
select:focus,
textarea:focus {
  border-color: var(--neomarket-blue) !important;
  box-shadow: 0 0 0 .2rem rgba(56, 200, 223, .12) !important;
}

.listing li,
.listing tr td,
.messagelist tr td {
  border-color: #e6f4f6;
}

.listing li:hover,
.listing tr:hover td,
.messagelist tr:hover td {
  background-color: #f1fdfe;
}

.listing li.selected,
.listing tr.selected td,
.messagelist tr.selected td {
  background: linear-gradient(90deg, rgba(56, 200, 223, .14), rgba(245, 158, 11, .07));
  color: var(--neomarket-navy);
}

.folderlist li.selected > a,
.folderlist li > a:hover {
  color: var(--neomarket-blue);
}

.menu,
.popover,
.ui-dialog,
.dropdown-menu {
  border-color: #ddf1f3 !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, .98) !important;
  box-shadow: 0 18px 48px rgba(23, 96, 106, .16) !important;
}

.btn-secondary {
  border-color: #d8f0f3;
  background: #f6fdfe;
  color: var(--neomarket-navy);
}

.btn-secondary:hover {
  border-color: #c0e9ee;
  background: #ebfcfe;
  color: var(--neomarket-blue);
}

.watermark {
  opacity: .48;
  filter: saturate(1.12) drop-shadow(0 18px 30px rgba(28, 108, 120, .1));
}

/* Keep Roundcube's dark-mode option on-brand instead of charcoal. */
html.dark-mode body:not(.task-login) {
  background:
    radial-gradient(circle at 12% 8%, rgba(61, 184, 203, .32), transparent 34%),
    linear-gradient(135deg, #0e4851 0%, #0a3339 52%, #07272c 100%);
  color: #ebfcfe;
}

html.dark-mode #layout-sidebar,
html.dark-mode #layout-list,
html.dark-mode #layout-content {
  border-color: rgba(142, 216, 227, .16);
  background: rgba(13, 65, 73, .94);
  color: #ebfcfe;
}

html.dark-mode #layout-sidebar > .header,
html.dark-mode #layout-list > .header,
html.dark-mode #layout-content > .header,
html.dark-mode .toolbar,
html.dark-mode .footer {
  border-color: rgba(142, 216, 227, .16) !important;
  background: rgba(11, 55, 62, .96) !important;
  color: #ebfcfe;
}

html.dark-mode .searchbar {
  border-color: rgba(142, 216, 227, .2) !important;
  background: rgba(20, 91, 101, .88) !important;
}

html.dark-mode .searchbar input,
html.dark-mode .form-control,
html.dark-mode input,
html.dark-mode select,
html.dark-mode textarea {
  border-color: rgba(142, 216, 227, .2);
  background-color: #14535c;
  color: #f6fdfe;
}

html.dark-mode .listing li,
html.dark-mode .listing tr td,
html.dark-mode .messagelist tr td {
  border-color: rgba(142, 216, 227, .12);
  background-color: transparent;
  color: #ddf9fd;
}

html.dark-mode .listing li:hover,
html.dark-mode .listing tr:hover td,
html.dark-mode .messagelist tr:hover td {
  background-color: rgba(66, 192, 212, .16);
}

html.dark-mode .listing li.selected,
html.dark-mode .listing tr.selected td,
html.dark-mode .messagelist tr.selected td {
  background: linear-gradient(90deg, rgba(66, 192, 212, .34), rgba(245, 158, 11, .12));
  color: #ffffff;
}

html.dark-mode .header .button,
html.dark-mode .toolbar a.button,
html.dark-mode .footer .button {
  color: #b1dae0;
}

html.dark-mode .header .button:hover,
html.dark-mode .toolbar a.button:hover,
html.dark-mode .toolbar a.button.selected,
html.dark-mode .footer .button:hover {
  color: #fbbf24;
}

html.dark-mode .menu,
html.dark-mode .popover,
html.dark-mode .ui-dialog,
html.dark-mode .dropdown-menu {
  border-color: rgba(142, 216, 227, .2) !important;
  background: #11515a !important;
  color: #eefcfe !important;
  box-shadow: 0 20px 54px rgba(2, 26, 30, .38) !important;
}

html.dark-mode .watermark {
  opacity: .34;
  filter: saturate(1.3) drop-shadow(0 18px 36px rgba(245, 158, 11, .12));
}

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

  #login-form {
    top: 8vh;
    width: calc(100% - 2rem);
    padding: 1.5rem;
    border-radius: 22px;
  }

  #taskmenu {
    box-shadow: 0 -8px 28px rgba(13, 65, 73, .18);
  }

  .searchbar {
    margin: .4rem .55rem;
    border-radius: 12px;
  }
}

/* NeoMarket specifics */
#login-form::before { color:#0c4f59; }
#login-form::after { content:"ایمیل سازمانی نئومارکت"; display:block; order:-1; margin:-1rem 0 1.2rem;
  color:#33858f; font-size:.9rem; font-family:"Yekan Bakh",Tahoma,sans-serif; }
.task-login #logo { width:150px; max-height:120px; filter:drop-shadow(0 12px 22px rgba(12,79,89,.25)); }
#taskmenu .logo { background:rgba(255,255,255,.1) url(../images/neomarket-logo.svg) center/70% no-repeat; }
.task-login #login-footer a { color:#106470; }

/* --- login polish --- */
body.task-login {
  background: radial-gradient(circle at 15% 15%, #e6f0f1 0%, transparent 40%),
              radial-gradient(circle at 85% 85%, #33858f 0%, transparent 45%),
              linear-gradient(135deg, #cce0e3 0%, #66a3ab 55%, #0c4f59 100%) !important;
}
#login-form::after { content: none !important; display: none !important; }
#login-form::before {
  content: "NeoMarket Mail\Aایمیل سازمانی نئومارکت";
  white-space: pre-line; text-align: center; line-height: 1.7;
  font-family: "Yekan Bakh", Tahoma, sans-serif;
}
#login-form .input-group-text, #login-form .input-group-prepend .input-group-text {
  background: #106470 !important; border-color: #106470 !important; color: #fff !important;
}
#login-form .input-group-text * { color: #fff !important; }
#login-form .form-control { border-color: #99c2c7; }
#login-footer { margin-top: 1.2rem; text-align: center; }
#login-form td.title, #login-form td.title label, #login-form td.title label::before {
  background: #106470 !important; color: #fff !important; border-color: #106470 !important;
}
#login-form td.title label::before { background: transparent !important; }
#login-form td.title { border-radius: 14px 0 0 14px !important; }
#login-form td.input { margin: 0 !important; padding: 0 !important; }
#login-form td.input .form-control, #login-form .form-control {
  border-radius: 0 14px 14px 0 !important; margin: 0 !important; border-left-width: 0 !important;
}
html[dir=rtl] #login-form td.title { border-radius: 14px 0 0 14px !important; }
#login-form .form-control, #login-form input[type=text], #login-form input[type=password],
.form-control, input, select, textarea { color: #16363b !important; -webkit-text-fill-color: #16363b; }
#login-form .form-control::placeholder, ::placeholder { color: #6b8f94 !important; -webkit-text-fill-color: #6b8f94; opacity: 1; }
html.dark-mode #login-form .form-control, html.dark-mode .form-control, html.dark-mode input, html.dark-mode select, html.dark-mode textarea { color: #f5f8ff !important; -webkit-text-fill-color: #f5f8ff; }

/* login card is always light -> keep text dark even in dark mode */
html.dark-mode #login-form .form-control, html.dark-mode #login-form input,
html.dark-mode body.task-login #login-form .form-control {
  color: #16363b !important; -webkit-text-fill-color: #16363b !important; background-color: #fff !important;
}
html.dark-mode #login-form .form-control::placeholder { color: #6b8f94 !important; -webkit-text-fill-color: #6b8f94 !important; }
html.dark-mode #login-form::before { color: #0c4f59 !important; }
html.dark-mode #login-form input:-webkit-autofill { -webkit-text-fill-color: #16363b !important; box-shadow: 0 0 0 100px #fff inset !important; }
html.dark-mode #login-footer, html.dark-mode #login-footer a { color: #4d6e73 !important; }