/* Rahmah Webmail theme — teal */
:root { --rh-main:#0f766e; --rh-main-dark:#115e59; --rh-accent:#14b8a6; --rh-soft:#ccfbf1; --rh-bg:#f0fdfa; }

/* ===== Login ===== */
html:has(body.task-login), body.task-login, body.task-login #layout { background: linear-gradient(135deg,#0f766e 0%,#14b8a6 55%,#5eead4 100%) fixed !important; }
body.task-login #layout { position:static !important; min-height:100vh; }
body.task-login #layout-content { position:fixed !important; top:0; right:0; bottom:0; left:0; width:auto !important; height:auto !important; min-height:0 !important; overflow:auto; box-sizing:border-box; margin:0 !important; padding:max(24px, calc(50vh - 325px)) 16px 24px !important; display:flex !important; flex-direction:column; align-items:center; justify-content:flex-start; background:transparent !important; box-shadow:none !important; }
body.task-login #logo { width: 260px; max-width: 80%; height: auto; margin: 0 0 20px !important; background:#fff; padding:14px 22px; border-radius:16px; box-shadow:0 10px 30px rgba(0,0,0,.18); }
body.task-login #login-form { width: 100%; max-width: 380px; margin:0 !important; background:#fff; border-radius:16px; padding: 28px 28px 18px; box-shadow:0 20px 50px rgba(0,0,0,.25); }
body.task-login #login-form .input-group { margin-bottom: 14px; }
body.task-login #login-form .form-control { height: 46px; font-size: 1rem; }
body.task-login #login-form .input-group-text { background: var(--rh-bg); color: var(--rh-main); }
body.task-login #login-form .button.mainaction, body.task-login #login-form button[type=submit] { height: 46px; font-weight:600; letter-spacing:.04em; border-radius:10px; }
body.task-login #login-footer { color:#64748b; margin-top: 14px; font-size:.8rem; }
html.dark-mode body.task-login #login-form, html.dark-mode body.task-login #logo { background:#1f2933; }
html.dark-mode body.task-login #login-form .input-group-text { background:#2b3945; }

/* ===== Warna aksen (ganti biru bawaan) ===== */
.btn.btn-primary, .button.mainaction, button.btn-primary, a.btn-primary,
.ui-dialog .ui-dialog-buttonset .btn-primary, .formbuttons .btn-primary { background-color: var(--rh-main) !important; border-color: var(--rh-main) !important; color:#fff !important; }
.btn.btn-primary:hover, .button.mainaction:hover, button.btn-primary:hover { background-color: var(--rh-main-dark) !important; border-color: var(--rh-main-dark) !important; }
.form-control:focus, .custom-select:focus, .input-group .form-control:focus { border-color: var(--rh-accent) !important; box-shadow: 0 0 0 .2rem rgba(20,184,166,.2) !important; }
a, .pagenav a:hover { color: var(--rh-main); }
a:hover { color: var(--rh-main-dark); }

/* ===== Aplikasi (inbox) ===== */
#layout-menu { background: var(--rh-main) !important; }
#layout-menu a.selected, #layout-menu a:hover { background: rgba(255,255,255,.16) !important; }
#taskmenu a.compose, #layout-menu a.compose { background: var(--rh-accent) !important; color:#fff !important; border-radius:10px; }
#layout-sidebar { background:#fff; }
#layout-sidebar .treelist li.selected > a, ul.treelist li.selected > a { background: var(--rh-soft) !important; color: var(--rh-main-dark) !important; font-weight:600; }
#folderlist-content .treelist li.mailbox.selected > a { border-left: 3px solid var(--rh-main); }
.messagelist tr.selected td, .messagelist tr.focused td, table.listing tr.selected td { background: var(--rh-soft) !important; color: #134e4a; }
.messagelist tr.unread td .subject a, .messagelist tr.unread td.subject span.subject { font-weight:700; color:#134e4a; }
.messagelist tr.unread td { background:#fff; }
.messagelist td { padding-top:10px; padding-bottom:10px; }
.header, .header-title, #layout-list .header, #layout-content .header { background: var(--rh-bg); border-bottom: 1px solid #e2e8f0; }
.toolbar a.compose, a.button.compose { color: var(--rh-main) !important; }
span.badge, .unreadcount { background: var(--rh-main) !important; color:#fff !important; }
.ui-dialog .ui-dialog-titlebar { background: var(--rh-bg); color: var(--rh-main-dark); }
.popover .listing li a.active, .menu a:hover { color: var(--rh-main-dark); }

/* sudut halus & bayangan lembut */
.ui-dialog, .popover, .form-control, .btn { border-radius: 10px; }
html.dark-mode #layout-menu { background:#0b3b37 !important; }