/* Sewa Portal custom theme */

/* Light mode: red/maroon accent */
:root {
    --primary: #dc2626;
    --secondary: #7f1d1d;
    --accent: #fca5a5;
    --primary-fg: #fff;
    --header-bg: #7f1d1d;
    --header-link-color: #fff;
    --header-branding-color: #fca5a5;
    --breadcrumbs-bg: #991b1b;
    --breadcrumbs-link-fg: #fff;
    --button-bg: #dc2626;
    --default-button-hover-bg: #991b1b;
    --link-fg: #991b1b;
    --link-hover-color: #7f1d1d;
    --link-selected-fg: #dc2626;
}

/* Dark mode: darker red accent */
@media (prefers-color-scheme: dark) {
    :root {
        --primary: #991b1b;
        --secondary: #450a0a;
        --accent: #fca5a5;
        --primary-fg: #f7f7f7;
        --header-bg: #450a0a;
        --header-link-color: #fca5a5;
        --header-branding-color: #fca5a5;
        --breadcrumbs-bg: #450a0a;
        --link-fg: #f87171;
        --link-hover-color: #fca5a5;
        --link-selected-fg: #f87171;
        --button-bg: #991b1b;
        --default-button-hover-bg: #7f1d1d;
    }
}

html[data-theme="dark"] {
    --primary: #991b1b;
    --secondary: #450a0a;
    --accent: #fca5a5;
    --primary-fg: #f7f7f7;
    --header-bg: #450a0a;
    --header-link-color: #fca5a5;
    --header-branding-color: #fca5a5;
    --breadcrumbs-bg: #450a0a;
    --link-fg: #f87171;
    --link-hover-color: #fca5a5;
    --link-selected-fg: #f87171;
    --button-bg: #991b1b;
    --default-button-hover-bg: #7f1d1d;
}

/* Hide related widget wrapper action buttons */
.related-widget-wrapper .related-widget-wrapper-link,
.related-widget-wrapper [data-popup-opener],
.related-widget-wrapper .change-related,
.related-widget-wrapper .add-related,
.related-widget-wrapper .delete-related,
.related-widget-wrapper .view-related {
    display: none !important;
}

/* Fix select height */
select {
    height: auto !important;
    padding: 6px 10px !important;
}

/* Filters: move to top, collapsible */
#changelist .changelist-form-container {
    display: flex !important;
    flex-direction: column !important;
}
#changelist #changelist-filter {
    order: -1 !important;
    position: static !important;
    width: 100% !important;
    margin-bottom: 15px !important;
    float: none !important;
    border: 1px solid #ddd;
    padding: 10px;
    border-radius: 4px;
    flex: none !important;
    margin-left: 0 !important;
    background: #f8f8f8 !important;
}
#changelist .filtered, .change-list .filtered {
    min-height: auto !important;
}
#changelist #changelist-filter details {
    display: inline-block;
    margin-right: 15px;
    vertical-align: top;
}
#changelist #changelist-filter details summary {
    cursor: pointer;
    font-weight: bold;
}
#changelist-filter h2 {
    cursor: pointer;
}