/* CSS for Reactor UI Rule Sets tab */
/* Version 25278 */

div#tab-rules div.re-listhead {
    /* See/match re-listport-head in reactor-ui.css */
    min-height: 42px;
    padding: 0px 0px 4px 0px;
    background-color: var(--bs-tertiary-bg);
    border-bottom: 1px dotted var(--bs-border-color);
}
div#tab-rules div.re-listhead span#rulesetname {
    /* See/match re-listport-head in reactor-ui.css */
    font-size: 1.5rem;
    font-weight: bold;
}

div#tab-rules div.re-sectionhead {
    border: 1px solid var(--re-border-color);
    border-radius: 8px;
    padding: 4px 2px;
    margin-top: 12px;
    margin-bottom: 0;
    vertical-align: middle;
    min-height: 2.5em;
}
div#tab-rules div.re-sectionhead h6 { font-size: 1.25rem; font-weight: bold; line-height: 1em; margin: 0 0; }
div#tab-rules div.re-sectionhead h6:has( > a[aria-expanded="true"] ) { border-bottom: none !important; }

div#tab-rules div.reaction-list-head span { font-size: 1.5rem; font-weight: bold; }
div#tab-rules div#rules { background-color: var(--bs-body-bg); overflow: auto; min-height: 35vh; }
div#tab-rules div#rules .re-rule {
    min-height: 2rem;
    font-size: 0.85rem;
    border-bottom: 1px dotted var(--re-border-color);
    padding: 4px 4px;
}
div#tab-rules div#rules .re-rule:hover { background-color: var(--bs-secondary-bg) !important; }
div#tab-rules button.ruleEnable i.bi-toggle-on { color: var(--bs-success); }
div#tab-rules button.ruleEnable i.bi-toggle-off { color: var(--bs-danger); }

div#tab-rules a[data-bs-toggle="collapse"] { text-decoration: none; color: initial; }

/* Rule status display formatting */
div#tab-rules .card .row { margin: 0 0; }
div#tab-rules div.reactorgroup { position: relative; margin: 0 0; width: 100%; }
div#tab-rules div.grouptitle { color: var(--bs-primary); background-color: var(--bs-primary-bg-subtle); min-height: 32px; line-height: 2em; border: 2px solid var(--bs-border-color); border-radius: 0; margin-right: 0; }
div#tab-rules div.grouptitle span.re-title { margin-left: 1rem; }
div#tab-rules .grouptitle.truestate { background-color: var(--bs-success-bg-subtle); color: var(--bs-success); }
div#tab-rules div.grpbody { position: relative; padding: 0 0; margin-left: 64px; }
div#tab-rules div.grpcond { list-style: none; padding: 0 0; margin: 0 0 0 -17px; }
div#tab-rules div.condind { font-size: 1rem; background-color: var(--bs-body-bg); }
div#tab-rules .cond { position: relative; min-height: 2rem; margin: 8px 0; padding: 4px 0; border-radius: 0; border: 1px solid var(--bs-border-color); background-color: var(--bs-body-bg); }
div#tab-rules .cond.truestate { color: var(--bs-success); font-weight: bold; }
/* div#tab-rules .cond.falsestate { } */
div#tab-rules .grpcond > *::before, .grpcond > *::after { content: "";  position: absolute; left: -25px; width: 25px; border-style: solid; border-width: 0px 0px 3px 3px; }
div#tab-rules .grpcond > *:first-child::before { top: 0px; height: 18px; border-color: var(--bs-border-color); display: block; }
div#tab-rules .grpcond > *::before { display: none; }
div#tab-rules .grpcond > *::after { top: 18px; height: calc(100% + 0px); border-color: var(--bs-border-color); }
div#tab-rules .grpcond > *:last-child::after { display: none; }

div#tab-rules div.cond.reactor-timing { animation: pulse 2s infinite; }
@keyframes pulse { 0% { background-color: var(--bs-body-bg); } 50% { background-color: var(--bs-success-bg-subtle); } 100% { background-color: var(--bs-body-bg); } }

div#tab-rules div.expr-status {}
div#tab-rules div.expr-status div.expr-status-title { color: var(--bs-primary); background-color: var(--bs-primary-bg-subtle); min-height: 2rem; border: 1px solid var(--bs-border-color); padding: 4px 4px; }
div#tab-rules div.expr-status div.expr-status-expr { background-color: var(--bs-body-bg); border: 1px solid var(--bs-dark-border-subtle); padding: 4px 4px; }
div#tab-rules div.expr-status div.expr-status-expr div.expr-expr, div#tab-rules div.expr-status div.expr-status-expr div.expr-value {
    font-family: monospace;
    font-size: 1rem;
    line-height: 1.5em;
    max-height: 6em;
    overflow: hidden;
}
div#tab-rules div.expr-name { min-width: 8vw; }

div#tab-rules div.re-rule i.trouble-icon {
    color: var(--bs-warning) !important;
}

div#tab-rules div.re-rule.rule-disabled .re-rulename { color: var(--bs-tertiary-color); }
div#tab-rules div.re-rule.rule-attention { border-left: 3px solid var(--bs-yellow); }
div#tab-rules span.rule-override-state { margin-right: 1em; }

/* A lot of this mirrors div#rules and related, and should be unified */
div#tab-rules div#reactions { background-color: var(--bs-body-bg); overflow: auto; min-height: 480px; }
div#tab-rules div#reactions div.row {
    min-height: 2rem;
    font-size: 0.85rem;
    border-bottom: 1px dotted var(--bs-border-color);
    padding: 4px 4px;
}
div#tab-rules div#reactions div.row:hover { background-color: var(--bs-secondary-bg) !important; }
