/* --- Shaarli Dark Mode User Customization --- */

:root {
    --bg-color: #1a1a1a;
    --card-bg: #242424;
    --text-main: #e0e0e0;
    --text-muted: #a0a0a0;
    --accent-color: #4a90e2;
    --border-color: #333333;
    --link-color: #64b5f6;
    --tag-bg: #3d3d3d;
}

.page-form {
    background-color: var(--card-bg) !important;
    color: var(--text-main) !important;
}

.page-form-complete .label-name {
    background-color: var(--card-bg) !important;
    color: var(--text-main) !important;
}

.page-form .window-title {
    background-color: var(--card-bg) !important;
}

/* Base Body Styles */
body {
    background-color: var(--bg-color) !important;
    color: var(--text-main) !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Header & Navigation */
#header, .header-main, #nav-main {
    background-color: var(--card-bg) !important;
    border-bottom: 1px solid var(--border-color) !important;
}

/* Link Cards / Entries */
.linklist-item, .shaare {
    background-color: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 8px;
    padding: 15px;
    margin-bottom: 20px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.3);
}

/* Typography */
a {
    color: var(--link-color) !important;
}

a:hover {
    color: var(--accent-color) !important;
    text-decoration: underline;
}

#shaarli-menu a {
    color: var(--text-main) !important;
}

.linklist-pages {
    color: var(--text-main) !important;
}

.linksperpage {
    color: var(--text-main) !important;
}

.linksperpage a {
    background-color: #378e7d !important;
}

.linklist-filters-text {
    color: var(--text-main) !important;
}

.linklist-filters a {
    background-color: #378e7d !important;
}

code { 
    background-color: #161616 !important;
}

.linklist-item-title {
    background-color: #2d2d2d !important;
    margin: -15px -15px 12px -15px; /* Pulls the color to the edges of the card */
    padding: 10px 15px;
    border-bottom: 1px solid #3d3d3d;
    border-radius: 8px 8px 0 0; /* Rounds only the top corners */    
}

.linklist-item-title a.linklist-real-url:visited .linklist-link {
    color: var(--main-color) !important;
}

.linklist-item-title a.linklist-real-url:hover .linklist-link {
    color: var(--main-color) !important;
    text-decoration: underline;
}

.linklist-item-title a, .pure-u-1 h2 a {
    color: var(--text-main) !important;
    font-weight: 600;
}

.linklist-item-description, .description {
    color: var(--text-muted) !important;
}

.linklist-item-infos {
        background-color: var(--card-bg) !important;
        color: var(--text-muted) !important;
}

/* Tags */
.label-tag, .tag-link {
    background-color: var(--tag-bg) !important;
    color: var(--text-main) !important;
    border-radius: 4px;
    padding: 2px 8px !important;
    border: none !important;
}

/* Forms & Inputs (Search Bar, Login) */
input[type="text"], input[type="password"], textarea, select {
    background-color: #2d2d2d !important;
    color: white !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 4px;
}

/* Buttons */
.button, button, .pure-button {
    background-color: var(--accent-color) !important;
    color: white !important;
    border: none !important;
    transition: opacity 0.2s;
}

.button:hover {
    opacity: 0.8;
}

/* Footer */
#footer {
    color: var(--text-muted) !important;
    border-top: 1px solid var(--border-color) !important;
}