/* FoxMail // NEON EDITION — Roundcube Elastic extension
   Only appearance is modified; core Roundcube templates remain inherited. */
:root {
  color-scheme: dark;
  --fox-night: #070c17;
  --fox-panel: #0f1929;
  --fox-panel-2: #131f32;
  --fox-line: #26394e;
  --fox-text: #e6f7ff;
  --fox-muted: #9aacc4;
  --fox-cyan: #00dafa;
  --fox-blue: #3576ff;
  --fox-purple: #8b59e9;
}
html, body { background-color: var(--fox-night) !important; color: var(--fox-text); }
body {
  background-image: radial-gradient(ellipse 50% 42% at 90% -12%, rgba(0,218,250,.12),transparent 80%),
                    radial-gradient(ellipse 42% 40% at 8% 100%, rgba(139,89,233,.095),transparent 85%);
  background-attachment: fixed;
}
body, input, button, textarea, select, .btn { font-family: Inter, 'Segoe UI', system-ui, sans-serif !important; }
#layout, #layout-main, #layout-content, #layout-list, #layout-sidebar,
#layout-menu, .frame-content, .content, .popover, .menu, .popupmenu,
.listbox, .scroller, .box, .settings-header {
  border-color: var(--fox-line);
}
#layout-menu, #layout-sidebar, #layout-list, #layout-content, .listbox {
  background-color: var(--fox-panel) !important;
  color: var(--fox-text);
}
#layout-menu { background: linear-gradient(180deg, #101f35 0%, #090f1d 85%) !important; border-right: 1px solid #1b3850; }
#layout-sidebar { background: linear-gradient(180deg, #0c1525, #0a1120) !important; }
#layout-list, #layout-content { background-color: #0d1524 !important; }
#layout-list .header, #layout-content .header, .listbox .header,
#layout-sidebar .header, .header, .toolbar, .boxfooter, .footer,
.searchbar, .popupmenu, .popover, .dropdown-menu {
  background: var(--fox-panel-2) !important;
  border-color: var(--fox-line) !important;
  color: var(--fox-text) !important;
}
#layout-menu a, #layout-sidebar a, .header a, .toolbar a,
.nav-item a, .popupmenu a, .footer a { color: #bacee1; }
#layout-menu a:hover, #layout-sidebar a:hover,
.listing li:hover, .listing tr:hover, .popupmenu a:hover {
  color: #fff !important;
  background-color: rgba(0,218,250,.075) !important;
}
#layout-menu .selected a, #layout-menu a.active,
.listing .selected, .listing tr.selected, .listing li.selected,
.listing .focused, .folderlist li.selected {
  background: linear-gradient(90deg, rgba(0,218,250,.16), rgba(46,89,165,.055)) !important;
  color: #fff !important;
  border-color: rgba(0,218,250,.25) !important;
}
.listing, .listing tbody, .listing tr, .listing td, .listing li,
.messagelist, .folderlist, .mailboxlist, .treelist,
#messagelist, #messagelist tr, #messagelist td {
  background-color: transparent;
  border-color: rgba(111,159,196,.12) !important;
  color: #d8e8f7 !important;
}
.listing .unread, .messagelist .unread { font-weight: 650; color: #f5fbff !important; }
.listing .unread .subject, .messagelist .unread .subject { color: #a4f4ff !important; }
#layout-list .scroller, #layout-content .scroller, .scroller { scrollbar-color: #2d526d #0d1725; }
input, textarea, select, .form-control, .custom-select,
.input-group-text, .select, .searchbar input {
  background-color: #0b1728 !important;
  color: #effaff !important;
  border: 1px solid #2c4961 !important;
  border-radius: 9px !important;
}
input::placeholder, textarea::placeholder { color: #879cb4 !important; opacity: 1; }
input:focus, textarea:focus, select:focus, .form-control:focus {
  border-color: var(--fox-cyan) !important;
  box-shadow: 0 0 0 3px rgba(0,218,250,.13) !important;
  outline: none;
}
.btn-primary, button.btn-primary, .button.primary, button[type='submit'],
input[type='submit'] {
  background: linear-gradient(112deg, #00b6d9, #2475e0) !important;
  color: #03131e !important;
  border: 1px solid #2ddcf3 !important;
  border-radius: 9px !important;
  font-weight: 700;
  box-shadow: 0 7px 25px rgba(0,171,221,.18);
}
.btn-primary:hover, .button.primary:hover, button[type='submit']:hover {
  filter: brightness(1.12);
  box-shadow: 0 8px 30px rgba(0,218,250,.30);
}
a { color: #62dffc; }
a:hover { color: #baf5ff; }
.modal-content, .modal-header, .modal-body, .modal-footer, .menu,
.dropdown-menu, .popupmenu, .popover { background-color: #101c2e !important; color: #e6f7ff; border-color: #2d485f !important; }
/* Login landing screen */
body.task-login {
  min-height: 100vh;
  background:
    linear-gradient(rgba(0, 218, 250, .026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 218, 250, .026) 1px, transparent 1px),
    radial-gradient(ellipse at 50% 23%, #152d48 0, #0c1424 45%, #050914 88%) !important;
  background-size: 34px 34px,34px 34px,auto !important;
}
body.task-login #layout, body.task-login #layout-content {
  background-color: transparent !important;
}
body.task-login #layout-content {
  max-width: 470px;
  width: calc(100% - 32px);
  margin: min(11vh, 95px) auto 50px;
  padding: 28px 34px 32px;
  border-radius: 20px;
  background: rgba(14,26,44,.88) !important;
  border: 1px solid rgba(0,218,250,.32) !important;
  box-shadow: 0 22px 70px rgba(0,0,0,.55), 0 0 50px rgba(0,218,250,.085), inset 0 1px rgba(206,247,255,.08);
  backdrop-filter: blur(16px);
}
body.task-login #layout-content:before {
  content: 'FOXMAIL  /  NEON EDITION';
  display: block;
  text-align: center;
  margin: 2px 0 10px;
  font: 750 18px/1.5 ui-monospace, 'SFMono-Regular', Consolas, monospace;
  letter-spacing: .11em;
  color: #89f2ff;
  text-shadow: 0 0 16px rgba(0,218,250,.4);
}
body.task-login #layout-content:after {
  content: 'PRIVATE MAIL TERMINAL  •  FOXHOME NETWORK';
  display:block;
  text-align:center;
  margin: 24px 0 0;
  color:#819bb3;
  font: 11px/1.5 ui-monospace, Consolas,monospace;
  letter-spacing:.07em;
}
body.task-login #logo { width: 88px !important; max-height: 100px; margin: 6px auto 16px; filter: drop-shadow(0 0 16px rgba(0,218,250,.30)); }
body.task-login #login-form { max-width: 100%; }
body.task-login #login-form label, body.task-login #login-form .col-form-label { color: #b4cadb !important; }
body.task-login #login-form input { min-height: 43px; }
body.task-login #login-footer { color:#8194aa !important; }
/* Smaller screens: preserve the responsive Elastic layout */
@media (max-width: 640px) {
  body.task-login #layout-content { margin: 6vh auto 20px; padding: 22px 18px 26px; }
  body.task-login #layout-content:before { font-size: 16px; letter-spacing: .05em; }
  #layout-menu { box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) {
  * { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}