/*
 * Omdaa brand override for Roundcube Elastic skin
 * Brand primary: #10B981  (Emerald-500)
 * Brand dark:    #059669  (Emerald-600)
 * Brand light:   #34D399  (Emerald-400)
 */

/* ── Core brand color replacements ─────────────────────────────────── */
:root {
  --color-main:        #10B981;
  --color-main-dark:   #065F46;
  --color-main-light:  #34D399;
}

/* Toolbar & header action buttons */
a.button.selected,
.task-menu-button.selected,
#taskmenu a.selected,
#taskmenu a:hover,
a.button:hover {
  color: #10B981 !important;
}

/* Primary button */
.btn-primary,
button.btn-primary,
input[type="submit"].btn-primary {
  background-color: #10B981 !important;
  border-color: #10B981 !important;
  color: #ffffff !important;
}
.btn-primary:hover,
button.btn-primary:hover {
  background-color: #059669 !important;
  border-color: #059669 !important;
}

/* Focus rings & input borders */
input:focus,
textarea:focus,
select:focus,
.form-control:focus {
  border-color: #10B981 !important;
  box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.2) !important;
  outline: none !important;
}

/* List item selection */
#mailboxlist .selected,
#mailboxlist li:hover,
.treelist li.selected > a,
.treelist li.selected > span {
  background-color: rgba(16, 185, 129, 0.12) !important;
  color: #065F46 !important;
}

/* Unread count badge */
.unreadcount,
.count-display {
  background-color: #10B981 !important;
}

/* Checkboxes */
input[type="checkbox"]:checked,
input[type="radio"]:checked {
  accent-color: #10B981;
}

/* Links */
a {
  color: #059669;
}
a:hover {
  color: #047857;
}

/* ── Login page ─────────────────────────────────────────────────────── */
#loginform .submit,
#loginform input[type="submit"] {
  background-color: #10B981 !important;
  border-color: #10B981 !important;
  color: #fff !important;
  font-weight: 600;
  border-radius: 8px;
  padding: 10px 0;
  font-size: 15px;
  transition: background 0.2s;
}
#loginform .submit:hover,
#loginform input[type="submit"]:hover {
  background-color: #059669 !important;
}

/* Login page background */
#login-form,
body.task-login {
  background: linear-gradient(135deg, #f0fdf4 0%, #ecfdf5 100%) !important;
}

/* Logo area on login */
#login-form #logo,
.login-logo {
  max-width: 180px;
  margin: 0 auto 24px;
}

/* ── Top navigation bar ─────────────────────────────────────────────── */
#header,
#layout-menu .menu-header {
  border-bottom: 2px solid rgba(16, 185, 129, 0.2) !important;
}

/* ── Compose & action buttons ───────────────────────────────────────── */
#compose-btn,
a[href*="compose"],
.button.compose {
  background-color: #10B981 !important;
  color: #fff !important;
}
#compose-btn:hover,
a[href*="compose"]:hover {
  background-color: #059669 !important;
}

/* ── Scrollbar (Webkit) ─────────────────────────────────────────────── */
::-webkit-scrollbar-thumb {
  background-color: rgba(16, 185, 129, 0.4);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background-color: #10B981;
}

/* ── Dark mode overrides ────────────────────────────────────────────── */
@media (prefers-color-scheme: dark) {
  .btn-primary,
  button.btn-primary {
    background-color: #059669 !important;
    border-color: #059669 !important;
  }
  a {
    color: #34D399;
  }
  a:hover {
    color: #6EE7B7;
  }
  #loginform .submit,
  #loginform input[type="submit"] {
    background-color: #059669 !important;
  }
  body.task-login {
    background: linear-gradient(135deg, #0f172a 0%, #1a2e24 100%) !important;
  }
}