/* ============================================
   SEKO Facility Management — Roundcube Brand
   Primärfarbe: #102a43 · Akzent: #1a7a3a
   ============================================ */

/* ---- Task Menu (linke Icon-Leiste) ---- */
#taskmenu,
#taskmenu > div {
  background-color: #102a43 !important;
}
#taskmenu a {
  color: rgba(255,255,255,0.7) !important;
}
#taskmenu a:hover,
#taskmenu a.selected {
  color: #fff !important;
  background-color: rgba(255,255,255,0.12) !important;
}
#taskmenu a.logout {
  color: rgba(255,100,100,0.9) !important;
}
#taskmenu a.logout:hover {
  color: #fff !important;
  background-color: rgba(220,50,50,0.4) !important;
}

/* ---- Haupthintergrund ---- */
body, html {
  background-color: #f8fafc !important;
}
#layout {
  background-color: #f8fafc !important;
}

/* ---- Sidebar (Ordnerliste) ---- */
#layout-sidebar {
  background-color: #fff !important;
  border-right: 1px solid #e5e9ed !important;
}
#layout-sidebar .header {
  background-color: #fff !important;
  border-bottom: 1px solid #e5e9ed !important;
}

/* ---- Nachrichten-Liste ---- */
#layout-list {
  background-color: #fff !important;
  border-right: 1px solid #e5e9ed !important;
}
#layout-list .header {
  background-color: #fff !important;
  border-bottom: 1px solid #e5e9ed !important;
}
.messagelist tbody tr:hover td {
  background-color: #f0f4f8 !important;
}
.messagelist tbody tr.selected td,
.messagelist tbody tr.focused td {
  background-color: #e8f0f7 !important;
}
.messagelist tbody tr.unread td span.subject {
  color: #102a43 !important;
}

/* ---- Header / Toolbar ---- */
.header {
  background-color: #fff !important;
  border-bottom: 1px solid #e5e9ed !important;
}
.toolbar {
  background-color: #fff !important;
}
.toolbar a.button:hover,
.toolbar button:hover {
  background-color: #f0f4f8 !important;
  color: #102a43 !important;
}
.toolbar a.button.selected,
.toolbar button.selected {
  color: #102a43 !important;
}

/* ---- Primär-Buttons ---- */
.button.primary,
button.primary,
input.primary,
.ui-button.primary,
.formbuttons a.button.mainaction,
.formbuttons button.mainaction,
a.button.create,
button.create {
  background-color: #102a43 !important;
  border-color: #102a43 !important;
  color: #fff !important;
}
.button.primary:hover,
button.primary:hover,
.formbuttons a.button.mainaction:hover,
.formbuttons button.mainaction:hover {
  background-color: #1a3d5c !important;
  border-color: #1a3d5c !important;
}

/* ---- Links ---- */
a, a:visited {
  color: #102a43;
}
a:hover {
  color: #1a7a3a;
}

/* ---- Neue Mail Button (Compose) ---- */
.toolbar a.compose,
.toolbar button.compose {
  background-color: #102a43 !important;
  color: #fff !important;
  border-radius: 8px !important;
}
.toolbar a.compose:hover,
.toolbar button.compose:hover {
  background-color: #1a3d5c !important;
}

/* ---- Suchleiste ---- */
.searchbar input[type="text"],
.searchbar input[type="search"] {
  border-color: #d1d9e0 !important;
  border-radius: 8px !important;
}
.searchbar input:focus {
  border-color: #102a43 !important;
  box-shadow: 0 0 0 2px rgba(16,42,67,0.12) !important;
}

/* ---- Formularfelder ---- */
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
textarea:focus,
select:focus {
  border-color: #102a43 !important;
  box-shadow: 0 0 0 2px rgba(16,42,67,0.12) !important;
  outline: none !important;
}

/* ---- Folder-Liste Auswahl ---- */
#mailboxlist li a:hover {
  background-color: #f0f4f8 !important;
  color: #102a43 !important;
}
#mailboxlist li.selected > a {
  background-color: #e8f0f7 !important;
  color: #102a43 !important;
  font-weight: 600 !important;
}
#mailboxlist .unreadcount {
  background-color: #102a43 !important;
  color: #fff !important;
  border-radius: 10px !important;
}

/* ---- Login-Seite ---- */
body.task-login {
  background: linear-gradient(135deg, #0d2236 0%, #102a43 50%, #153450 100%) !important;
}
#login-form,
.formbox {
  border-radius: 16px !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.25) !important;
  border: none !important;
}
#login-form h1,
.formbox h1 {
  color: #102a43 !important;
}
#login-logo,
.login-header {
  display: none !important;
}

/* ---- Nachrichten-Inhalt ---- */
#layout-content .header {
  background-color: #fff !important;
  border-bottom: 1px solid #e5e9ed !important;
}
#messagecontent {
  background-color: #fff !important;
}

/* ---- Tabs / aktive Elemente ---- */
.tabsbar .tablink.selected,
.tabsbar .tablink:hover {
  border-bottom-color: #102a43 !important;
  color: #102a43 !important;
}

/* ---- Scrollbar dezenter ---- */
* {
  scrollbar-width: thin;
  scrollbar-color: #c5cdd5 transparent;
}
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background-color: #c5cdd5; border-radius: 3px; }

/* ---- Responsive: Mobile Header ---- */
@media (max-width: 768px) {
  #layout-header {
    background-color: #102a43 !important;
    color: #fff !important;
  }
  #layout-header .header-title {
    color: #fff !important;
  }
  .task-menu-button {
    color: #fff !important;
  }
}