/* HerMail Custom Theme - Pink, Red, White */

:root {
    --hm-pink: #e91e8c;
    --hm-pink-dark: #c0006e;
    --hm-pink-pale: #fce4f3;
    --hm-pink-border: rgba(233, 30, 140, 0.2);
    --hm-red: #c0003a;
    --hm-white: #ffffff;
    --hm-bg: #fdf5f9;
    --hm-text: #1a1a1a;
}

/* === LOGO === */
#logo, img#logo {
    content: url('https://herhost.live/logo.png') !important;
    width: 480px !important;
    height: 480px !important;
    min-width: 480px !important;
    min-height: 480px !important;
    max-width: 480px !important;
    max-height: 480px !important;
    margin: 0 auto 1.5rem !important;
    display: block !important;
    object-fit: contain !important;
}

/* === BACKGROUND === */
body, body.task-login, #layout-content, #layout, .layout-default {
    background: var(--hm-bg) !important;
}

/* === LOGIN PAGE === */
body.task-login #layout-content {
    background: var(--hm-white) !important;
}

body.task-login form {
    background: var(--hm-white) !important;
    border: 2px solid var(--hm-pink-border) !important;
    border-radius: 16px !important;
    padding: 2rem !important;
    box-shadow: 0 4px 20px rgba(233, 30, 140, 0.1) !important;
}

/* === BUTTONS === */
button.mainaction, .button.mainaction, button.btn-primary, .btn-primary,
input[type="submit"].mainaction {
    background: var(--hm-pink) !important;
    border-color: var(--hm-pink) !important;
    color: var(--hm-white) !important;
    border-radius: 50px !important;
    font-weight: 600 !important;
    transition: background 0.2s !important;
}

button.mainaction:hover, .button.mainaction:hover,
button.btn-primary:hover, .btn-primary:hover {
    background: var(--hm-pink-dark) !important;
    border-color: var(--hm-pink-dark) !important;
}

button.btn-danger, .btn-danger {
    background: var(--hm-red) !important;
    border-color: var(--hm-red) !important;
    border-radius: 50px !important;
}

button.btn-secondary, .btn-secondary {
    background: var(--hm-white) !important;
    border: 2px solid var(--hm-pink) !important;
    color: var(--hm-pink) !important;
    border-radius: 50px !important;
}

/* === LINKS === */
a, a:visited {
    color: var(--hm-pink) !important;
}

a:hover {
    color: var(--hm-pink-dark) !important;
}

/* === HEADER / TOOLBAR === */
.task-mail #layout-sidebar header,
.task-mail #layout-list header,
.task-mail #layout-content header,
#taskmenu, .menu, .toolbar {
    background: var(--hm-white) !important;
    border-bottom: 2px solid var(--hm-pink) !important;
}

#taskmenu a, .menu a {
    color: var(--hm-text) !important;
}

#taskmenu a.selected, #taskmenu a:hover,
.menu a.selected, .menu a:hover {
    color: var(--hm-pink) !important;
    background: var(--hm-pink-pale) !important;
}

/* === SIDEBAR === */
#layout-sidebar, .menu, .navlist, .listing {
    background: var(--hm-white) !important;
}

.listing li.selected,
.listing tr.selected,
.listing tr.selected td {
    background: var(--hm-pink-pale) !important;
    color: var(--hm-text) !important;
}

.listing li.selected a,
.listing tr.selected a {
    color: var(--hm-pink) !important;
}

/* === BADGES & COUNTERS === */
.badge, .unreadcount, span.unreadcount {
    background: var(--hm-pink) !important;
    color: var(--hm-white) !important;
    border-radius: 50px !important;
}

/* === FORM INPUTS === */
input[type="text"], input[type="password"], input[type="email"],
textarea, select, .form-control {
    border: 1.5px solid var(--hm-pink-border) !important;
    border-radius: 8px !important;
    background: var(--hm-white) !important;
}

input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus,
textarea:focus, select:focus, .form-control:focus {
    border-color: var(--hm-pink) !important;
    box-shadow: 0 0 0 3px rgba(233, 30, 140, 0.1) !important;
    outline: none !important;
}

/* === MESSAGE LIST === */
.messagelist tr.unread,
.messagelist tr.unread td {
    font-weight: 700 !important;
}

.messagelist tr.flagged td.flag,
.messagelist tr.flagged td {
    color: var(--hm-red) !important;
}

/* === ALERTS === */
.alert-success { background: #f0fff5 !important; color: #1a8a3a !important; border-color: rgba(50, 200, 100, 0.3) !important; }
.alert-danger, .alert-error { background: #fff0f5 !important; color: var(--hm-red) !important; border-color: rgba(192, 0, 58, 0.3) !important; }
.alert-warning { background: #fffaf0 !important; color: #c08400 !important; }
.alert-info { background: var(--hm-pink-pale) !important; color: var(--hm-pink-dark) !important; border-color: var(--hm-pink-border) !important; }

/* === SCROLLBARS === */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--hm-bg); }
::-webkit-scrollbar-thumb { background: var(--hm-pink); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--hm-pink-dark); }

/* === TABS === */
.tabbed .nav-tabs .nav-link.active,
.nav-tabs .nav-link.active {
    color: var(--hm-pink) !important;
    border-bottom: 3px solid var(--hm-pink) !important;
}

/* === POPUPS / DIALOGS === */
.ui-dialog, .popupmenu, .popover {
    border: 2px solid var(--hm-pink-border) !important;
    border-radius: 12px !important;
}

.ui-dialog .ui-dialog-titlebar {
    background: var(--hm-pink) !important;
    color: var(--hm-white) !important;
    border-radius: 10px 10px 0 0 !important;
}

/* === CHECKBOXES === */
input[type="checkbox"], input[type="radio"] {
    accent-color: var(--hm-pink) !important;
}

/* === TABLES === */
.records-table thead th, table.listing thead th {
    background: var(--hm-pink-pale) !important;
    color: var(--hm-text) !important;
    border-bottom: 2px solid var(--hm-pink-border) !important;
}

/* === PRODUCT NAME === */
#login-footer { color: var(--hm-pink-dark) !important; font-weight: 600 !important; }
