/* =============================================================
 * ForTrust — Django admin override
 * Applies the dwallet design tokens to Django's built-in admin
 * without rewriting its templates. All functionality stays intact.
 * ============================================================= */

/* Map Django admin's CSS vars to ours so every built-in style
 * automatically picks up our palette. */
:root, html[data-theme="light"] {
    --primary:                var(--dw-brand);
    --secondary:              var(--dw-brand-hover);
    --accent:                 var(--dw-brand);
    --primary-fg:             #fff;

    --body-fg:                var(--dw-text);
    --body-bg:                var(--dw-bg);
    --body-quiet-color:       var(--dw-text-muted);
    --body-loud-color:        var(--dw-text);

    --header-color:           var(--dw-text);
    --header-branding-color:  var(--dw-brand);
    --header-bg:              var(--dw-surface);
    --header-link-color:      var(--dw-text-muted);

    --breadcrumbs-fg:         var(--dw-text-muted);
    --breadcrumbs-link-fg:    var(--dw-text-muted);
    --breadcrumbs-bg:         var(--dw-surface-2);

    --link-fg:                var(--dw-brand);
    --link-hover-color:       var(--dw-brand-hover);
    --link-selected-fg:       var(--dw-brand-hover);

    --hairline-color:         var(--dw-border);
    --border-color:           var(--dw-border);

    --error-fg:               var(--dw-danger);
    --message-success-bg:     var(--dw-success-bg);
    --message-warning-bg:     var(--dw-warn-bg);
    --message-error-bg:       var(--dw-danger-bg);

    --darkened-bg:            var(--dw-surface-2);
    --selected-bg:            var(--dw-brand-bg);
    --selected-row:           var(--dw-brand-bg);

    --button-fg:              #fff;
    --button-bg:              var(--dw-brand);
    --button-hover-bg:        var(--dw-brand-hover);
    --default-button-bg:      var(--dw-brand);
    --default-button-hover-bg: var(--dw-brand-hover);
    --close-button-bg:        var(--dw-text-subtle);
    --close-button-hover-bg:  var(--dw-text-muted);
    --delete-button-bg:       var(--dw-danger);
    --delete-button-hover-bg: #b91c1c;

    --object-tools-fg:        #fff;
    --object-tools-bg:        var(--dw-brand);
    --object-tools-hover-bg:  var(--dw-brand-hover);
}

html[data-theme="dark"] {
    --body-fg:                var(--dw-text);
    --body-bg:                var(--dw-bg);
    --body-quiet-color:       var(--dw-text-muted);
    --header-bg:              var(--dw-surface);
    --header-color:           var(--dw-text);
    --breadcrumbs-bg:         var(--dw-surface-2);
    --darkened-bg:            var(--dw-surface-2);
    --border-color:           var(--dw-border);
    --link-fg:                var(--dw-brand);
}

/* Base typography */
body, body.login {
    font-family: var(--dw-font) !important;
    background: var(--dw-bg) !important;
    color: var(--dw-text) !important;
}

/* Top branding — our custom topbar replaces Django's header row */
#header {
    background: var(--dw-bg) !important;
    padding: 0 !important;
    border-bottom: 1px solid var(--dw-border);
}

.dw-admin-topbar {
    max-width: 1280px;
    margin: 0 auto;
    display: flex; align-items: center; gap: var(--dw-s-4);
    padding: var(--dw-s-3) var(--dw-s-5);
}
.dw-admin-topbar__brand {
    display: flex; align-items: center; gap: var(--dw-s-2);
    color: var(--dw-text); text-decoration: none;
    font-weight: 700;
}
.dw-admin-topbar__brand .dw-topbar__brand__logo {
    width: 28px; height: 28px;
    background: linear-gradient(135deg, var(--dw-brand), #8b5cf6);
    border-radius: var(--dw-r);
    display: grid; place-items: center;
    color: #fff; font-size: 14px;
}
.dw-admin-topbar__nav {
    display: flex; gap: var(--dw-s-2);
    flex: 1;
}
.dw-admin-topbar__nav a {
    color: var(--dw-text-muted); font-size: 14px;
    padding: var(--dw-s-2) var(--dw-s-3);
    border-radius: var(--dw-r);
    text-decoration: none; font-weight: 500;
    transition: background var(--dw-dur), color var(--dw-dur);
}
.dw-admin-topbar__nav a:hover { background: var(--dw-surface-2); color: var(--dw-text); }
.dw-admin-topbar__nav a.is-active { color: var(--dw-brand); background: var(--dw-brand-bg); }

/* User tools (logout, view site, change password) */
#user-tools {
    padding: 0 !important;
    font-size: 12px;
}
#user-tools a {
    border-bottom: 1px solid transparent !important;
    padding: 4px 10px;
    border-radius: var(--dw-r-sm);
    transition: background var(--dw-dur);
}
#user-tools a:hover { background: var(--dw-surface-2); }

/* Breadcrumbs */
div.breadcrumbs {
    background: var(--dw-surface-2) !important;
    color: var(--dw-text-muted) !important;
    padding: var(--dw-s-2) var(--dw-s-5) !important;
    font-size: 13px;
    border-bottom: 1px solid var(--dw-border);
}
div.breadcrumbs a { color: var(--dw-text-muted) !important; }
div.breadcrumbs a:hover { color: var(--dw-brand) !important; }

/* Main content area */
.content-wrapper, #content { background: var(--dw-bg) !important; }
#content { padding: var(--dw-s-5) !important; }
#content-main, #content-related { background: var(--dw-bg); }

/* Headings */
h1, h2, h3, h4, h5 { color: var(--dw-text); font-weight: 650; letter-spacing: -0.01em; }
#content h1 { font-size: 1.5rem; margin-bottom: var(--dw-s-4); }

/* Object tools (Add / History / View on site) */
.object-tools {
    margin-top: 0;
    margin-bottom: var(--dw-s-3);
}
.object-tools li a, .object-tools a.addlink, .object-tools a.historylink, .object-tools a.viewsitelink {
    background: var(--dw-surface) !important;
    color: var(--dw-text) !important;
    border: 1px solid var(--dw-border) !important;
    border-radius: var(--dw-r) !important;
    padding: 6px 14px !important;
    font-size: 13px !important;
    font-weight: 600;
    text-transform: none !important;
    transition: all var(--dw-dur);
}
.object-tools li a:hover {
    background: var(--dw-brand) !important;
    color: #fff !important;
    border-color: var(--dw-brand) !important;
}
.object-tools a.addlink::before {
    filter: none;
    color: var(--dw-brand);
}
.object-tools a.addlink:hover::before { color: #fff; }

/* Module box / changelist container */
.module, .module caption, div.module {
    background: var(--dw-surface);
    border: 1px solid var(--dw-border);
    border-radius: var(--dw-r);
    overflow: hidden;
    margin-bottom: var(--dw-s-4);
}
.module h2, .module caption, .inline-group h2 {
    background: var(--dw-surface-2) !important;
    color: var(--dw-text) !important;
    border-bottom: 1px solid var(--dw-border);
    padding: var(--dw-s-3) var(--dw-s-4);
    font-size: 13px !important;
    font-weight: 650 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

/* Dashboard app list */
#content-main .app-list > caption, #content-main h2 {
    background: var(--dw-surface-2) !important;
    color: var(--dw-text) !important;
    padding: var(--dw-s-3) var(--dw-s-4) !important;
    border-bottom: 1px solid var(--dw-border);
    border-radius: var(--dw-r) var(--dw-r) 0 0;
    font-weight: 650 !important;
}

/* Tables (changelist + other) */
table {
    border-collapse: separate !important;
    border-spacing: 0;
    background: var(--dw-surface);
}
table thead th {
    background: var(--dw-surface-2) !important;
    color: var(--dw-text) !important;
    border-bottom: 1px solid var(--dw-border) !important;
    font-size: 12px;
    font-weight: 600;
    padding: var(--dw-s-2) var(--dw-s-3) !important;
}
table tbody tr { transition: background var(--dw-dur); }
table tbody tr:hover { background: var(--dw-surface-2); }
table td, table th {
    border-bottom: 1px solid var(--dw-border) !important;
    padding: var(--dw-s-2) var(--dw-s-3) !important;
    color: var(--dw-text);
}
table tr.selected, table tr.selected td { background: var(--dw-brand-bg) !important; }

/* Changelist row striping */
.row1 { background: var(--dw-surface) !important; }
.row2 { background: var(--dw-bg) !important; }

/* Filters sidebar */
#changelist-filter {
    background: var(--dw-surface) !important;
    border: 1px solid var(--dw-border) !important;
    border-radius: var(--dw-r) !important;
    padding: var(--dw-s-4) !important;
    margin-left: var(--dw-s-4);
}
#changelist-filter h2, #changelist-filter h3 {
    background: transparent !important;
    border: 0 !important;
    color: var(--dw-text) !important;
    padding: 0 !important;
    font-size: 13px !important;
    font-weight: 650 !important;
    margin-bottom: var(--dw-s-2) !important;
}
#changelist-filter li.selected a { color: var(--dw-brand) !important; font-weight: 650; }
#changelist-filter li a { color: var(--dw-text-muted) !important; }

/* Search bar */
#toolbar {
    background: var(--dw-surface) !important;
    border: 1px solid var(--dw-border);
    border-radius: var(--dw-r);
    padding: var(--dw-s-2) var(--dw-s-3) !important;
}
#toolbar input[type="text"], #searchbar {
    background: var(--dw-bg) !important;
    color: var(--dw-text) !important;
    border: 1px solid var(--dw-border) !important;
    border-radius: var(--dw-r-sm) !important;
}
#toolbar input[type="submit"] {
    background: var(--dw-brand) !important;
    color: #fff !important;
    border: 0 !important;
    padding: 4px 14px !important;
    border-radius: var(--dw-r-sm) !important;
}

/* Form inputs */
input[type="text"], input[type="email"], input[type="password"], input[type="number"],
input[type="url"], input[type="date"], input[type="time"], input[type="datetime-local"],
input[type="search"], textarea, select {
    background: var(--dw-bg) !important;
    color: var(--dw-text) !important;
    border: 1px solid var(--dw-border) !important;
    border-radius: var(--dw-r-sm) !important;
    padding: var(--dw-s-2) var(--dw-s-3) !important;
    font-family: var(--dw-font) !important;
    transition: border-color var(--dw-dur), box-shadow var(--dw-dur);
}
input:focus, textarea:focus, select:focus {
    outline: 0 !important;
    border-color: var(--dw-brand) !important;
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--dw-brand) 20%, transparent) !important;
}
textarea { min-height: 80px; font-family: var(--dw-mono) !important; font-size: 13px !important; }

/* Buttons */
.button, input[type="submit"], input[type="button"], .submit-row input, a.button {
    background: var(--dw-brand) !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: var(--dw-r) !important;
    padding: var(--dw-s-2) var(--dw-s-4) !important;
    font-weight: 600 !important;
    font-family: var(--dw-font) !important;
    cursor: pointer;
    transition: all var(--dw-dur);
}
.button:hover, input[type="submit"]:hover, .submit-row input:hover {
    background: var(--dw-brand-hover) !important;
    transform: translateY(-1px);
}
.button.default, input[type="submit"].default, .submit-row input.default { background: var(--dw-brand) !important; }
.deletelink, .deletelink-box a.deletelink {
    background: var(--dw-danger) !important; color: #fff !important;
    padding: var(--dw-s-2) var(--dw-s-4) !important; border-radius: var(--dw-r) !important;
}
.deletelink:hover { background: #b91c1c !important; }

/* Submit row */
.submit-row {
    background: var(--dw-surface) !important;
    border: 1px solid var(--dw-border) !important;
    border-radius: var(--dw-r) !important;
    padding: var(--dw-s-3) var(--dw-s-4) !important;
    margin-top: var(--dw-s-4);
}

/* Fieldsets */
fieldset.module {
    background: var(--dw-surface);
    border: 1px solid var(--dw-border);
    border-radius: var(--dw-r);
}
.form-row { padding: var(--dw-s-3) var(--dw-s-4) !important; border-bottom: 1px solid var(--dw-border); }
.form-row:last-child { border-bottom: 0; }
.help, .form-row div.help, .help-block { color: var(--dw-text-muted) !important; font-size: 12px !important; }

/* Pagination */
.paginator {
    background: var(--dw-surface);
    border: 1px solid var(--dw-border);
    border-radius: var(--dw-r);
    padding: var(--dw-s-2) var(--dw-s-3);
    font-size: 13px;
}
.paginator a, .paginator .this-page {
    padding: 3px 10px; border-radius: var(--dw-r-sm);
    text-decoration: none;
}
.paginator .this-page { background: var(--dw-brand); color: #fff !important; }
.paginator a:hover { background: var(--dw-surface-2); }

/* Messages */
ul.messagelist li {
    padding: var(--dw-s-3) var(--dw-s-4) !important;
    border-radius: var(--dw-r) !important;
    font-weight: 500 !important;
}
ul.messagelist li.success { background: var(--dw-success-bg) !important; color: var(--dw-success) !important; }
ul.messagelist li.warning { background: var(--dw-warn-bg) !important; color: var(--dw-warn) !important; }
ul.messagelist li.error   { background: var(--dw-danger-bg) !important; color: var(--dw-danger) !important; }

/* Login page */
body.login { background: var(--dw-bg) !important; }
.login #container {
    background: var(--dw-surface) !important;
    border: 1px solid var(--dw-border);
    border-radius: var(--dw-r-lg);
    box-shadow: var(--dw-shadow-lg);
    padding: 0 !important;
    overflow: hidden;
}
.login #header {
    background: transparent !important;
    border-bottom: 1px solid var(--dw-border);
    padding: var(--dw-s-5) !important;
}
.login .form-row label { color: var(--dw-text-muted); }

/* Changeform tabs */
ul.inline-navigation { background: var(--dw-surface-2) !important; }

/* Footer */
#footer {
    background: var(--dw-surface);
    border-top: 1px solid var(--dw-border);
    margin-top: var(--dw-s-8);
}
#footer a { color: var(--dw-brand); }

/* DateHierarchy navigation */
.xfull, #changelist-form .actions {
    background: var(--dw-surface-2) !important;
    border: 1px solid var(--dw-border) !important;
    border-radius: var(--dw-r) !important;
    color: var(--dw-text) !important;
}

/* Select2 / autocomplete */
.select2-container--admin-autocomplete .select2-selection,
.select2-container--admin-autocomplete .select2-selection__rendered,
.select2-dropdown {
    background: var(--dw-bg) !important;
    color: var(--dw-text) !important;
    border-color: var(--dw-border) !important;
}

/* Collapse */
fieldset.collapsed h2 { background: var(--dw-surface-2) !important; }

/* Add / remove inline buttons */
.add-row a, .inline-deletelink {
    color: var(--dw-brand) !important;
    background: var(--dw-brand-bg) !important;
    padding: 4px 12px;
    border-radius: var(--dw-r-sm);
    text-decoration: none;
}

/* Override the pitch-black bg that dark mode admin uses for some blocks */
html[data-theme="dark"] #nav-sidebar,
html[data-theme="dark"] .module,
html[data-theme="dark"] #changelist-filter {
    background: var(--dw-surface) !important;
}
html[data-theme="dark"] table thead th {
    background: var(--dw-surface-2) !important;
}
