:root {
  --nova-primary: #4f46e5;
  --nova-primary-strong: #4338ca;
  --nova-violet: #7c3aed;
  --nova-cyan: #38bdf8;
  --nova-navy: #081426;
  --nova-navy-soft: #10213a;
  --nova-surface: #ffffff;
  --nova-muted: #64748b;
  --nova-border: #dbe4f0;
  --nova-selected: #eef2ff;
}

body:not(.task-login) {
  color: #172033;
  background: #f5f7fb;
}

/* Navigation principale NovaConnect */
#layout-menu {
  background: #0a182e !important;
  border-right: 0 !important;
  box-shadow: 8px 0 28px rgba(8, 20, 38, .12);
}

#layout-menu #taskmenu,
#layout-menu .menu.toolbar,
#layout-menu .action-buttons,
#layout-menu .special-buttons {
  background: #0a182e !important;
}

#layout-menu .popover-header {
  min-height: 58px;
  padding: 6px !important;
  background: #0a182e !important;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}

#layout-menu .popover-header img,
#layout-menu .logo img {
  display: none !important;
}

#layout-menu .popover-header:before {
  content: "✉";
  display: grid;
  width: 40px;
  height: 40px;
  margin: auto;
  place-items: center;
  color: #fff;
  background: transparent;
  box-shadow: none;
  font: 700 22px/1 Arial, sans-serif;
}

#layout-menu .menu a {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: calc(100% - 14px) !important;
  box-sizing: border-box;
  margin: 2px 7px;
  min-height: 46px;
  padding-right: 0 !important;
  padding-left: 0 !important;
  border-radius: 9px;
  color: #dbe7f6 !important;
  opacity: .94;
  font-size: .72rem;
  text-align: center;
  transition: background-color .15s ease, color .15s ease;
}

#layout-menu .menu a:before {
  position: static !important;
  display: block !important;
  width: 100% !important;
  margin: 0 auto 2px !important;
  font-size: 1.2rem !important;
  text-align: center !important;
}

#layout-menu .menu a .inner {
  display: block;
  width: 100%;
  padding: 0 !important;
  text-align: center;
}

#layout-menu .menu a .inner:before {
  position: static !important;
  display: block !important;
  width: 100% !important;
  margin: 0 auto 2px !important;
  transform: none !important;
  text-align: center !important;
}

#layout-menu .menu a:hover {
  color: #fff !important;
  opacity: 1;
  background: rgba(255, 255, 255, .08) !important;
}

#layout-menu .menu a.selected,
#layout-menu .menu a:focus {
  color: #fff !important;
  opacity: 1;
  background: linear-gradient(135deg, rgba(79, 70, 229, .9), rgba(124, 58, 237, .9)) !important;
  box-shadow: 0 8px 18px rgba(79, 70, 229, .22);
}

#layout-menu .menu a.disabled,
#layout-menu .menu a[aria-disabled='true'] {
  color: #b7c8dd !important;
  opacity: .82;
}

#layout-menu .menu a.compose,
#layout-menu .menu a.contacts,
#layout-menu .menu a.settings {
  color: #e5eef9 !important;
  opacity: 1;
}

#layout-menu .menu a.compose:before,
#layout-menu .menu a.contacts:before,
#layout-menu .menu a.settings:before {
  color: #8ddcff !important;
}

#layout-menu .menu a.selected:before,
#layout-menu .menu a:hover:before {
  color: var(--nova-cyan) !important;
}

#layout-menu .special-buttons {
  right: auto !important;
  left: 0 !important;
  width: 5rem !important;
  max-width: 100% !important;
  box-sizing: border-box;
  border-top: 1px solid rgba(255, 255, 255, .08);
  background: #0a182e !important;
}

#layout-menu .special-buttons .theme,
#layout-menu .special-buttons .about {
  display: none !important;
}

#layout-menu .special-buttons a {
  color: #d8e3f2 !important;
}

#layout-menu .special-buttons .logout {
  width: calc(100% - 14px) !important;
  margin-right: 7px !important;
  margin-left: 7px !important;
  box-sizing: border-box;
  min-height: 45px;
  color: #fca5a5 !important;
}

/* Barres d'outils et panneaux */
#layout-list,
#layout-sidebar,
#layout-content {
  background: var(--nova-surface);
}

#layout-sidebar {
  border-right: 1px solid var(--nova-border) !important;
}

#layout-list {
  border-right: 1px solid var(--nova-border) !important;
}

.header,
.listbox .listbox-header,
.toolbar,
.searchbar {
  border-color: var(--nova-border) !important;
  background: rgba(255, 255, 255, .97) !important;
}

.toolbar a.button:hover,
.toolbar a.button:focus,
.toolbar a.button.selected {
  color: var(--nova-primary) !important;
  background-color: var(--nova-selected) !important;
  border-radius: 9px;
}

.searchbar input,
.form-control,
select.form-control {
  border-color: var(--nova-border);
  border-radius: 9px;
}

.searchbar input:focus,
.form-control:focus {
  border-color: #818cf8;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, .12);
}

/* Dossiers et messages */
.listing li,
.listing tr td {
  border-color: #edf1f7 !important;
}

.listing li:hover,
.listing tr:hover td {
  background-color: #f8faff !important;
}

.listing li.selected,
.listing tr.selected td,
.messagelist tr.selected td {
  color: #26305c !important;
  background: linear-gradient(90deg, #e9edff, #f5f3ff) !important;
}

.listing li.selected {
  border-left: 3px solid var(--nova-primary) !important;
}

#mailboxlist li.selected > a {
  color: #273067 !important;
  background: linear-gradient(90deg, #e7edff, #f3f0ff) !important;
}

.messagelist tr.unread td,
.messagelist tr.unread span {
  color: #111c35;
  font-weight: 650;
}

.quota-widget .bar,
.progress-bar {
  background: linear-gradient(90deg, var(--nova-primary), var(--nova-violet)) !important;
}

/* Boutons et menus contextuels */
.btn-primary,
button.btn-primary,
.custom-switch .custom-control-input:checked ~ .custom-control-label:before {
  border-color: var(--nova-primary) !important;
  background: linear-gradient(135deg, var(--nova-primary), var(--nova-violet)) !important;
}

.btn-primary:hover,
button.btn-primary:hover {
  border-color: var(--nova-primary-strong) !important;
  background: linear-gradient(135deg, var(--nova-primary-strong), #6d28d9) !important;
}

.popover,
.dropdown-menu {
  border-color: var(--nova-border);
  border-radius: 12px;
  box-shadow: 0 16px 45px rgba(15, 23, 42, .16);
}

/* État vide plus doux */
#messagecontframe:empty,
.listing-info {
  color: var(--nova-muted);
}

#layout-content .watermark {
  opacity: .42;
  filter: hue-rotate(190deg) saturate(.8);
}

@media (max-width: 768px) {
  #layout-menu .menu a { margin: 2px 5px; }
}