/* ===== Base sizing ===== */
html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

body {
    margin-bottom: 60px;
}

/* ===== Focus ring to match Bootstrap ===== */
.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 0.1rem #fff, 0 0 0 0.25rem #258cfb;
}

/* ===== Utility bits you already had ===== */
.help-text {
    font-style: normal;
    color: #198754;
    display: inline-block;
    transition: color .2s ease;
}

    .help-text:hover {
        color: #495057;
    }

.owner-id {
    font-weight: 500;
    color: #555;
}

.module-name {
    font-size: 1rem;
    font-weight: 600;
    color: #333;
}

#resultBox {
    font-family: inherit;
    font-size: 1rem;
    color: #212529;
    background-color: #eafaea;
    border: 1px solid #ced4da;
    border-radius: .375rem;
    padding: .5rem .75rem;
    white-space: pre-wrap;
}

/* ======================================================================
   SECTION SPACING (Fix: make “Choose Models” match “Your Saved Modules”)
   ====================================================================== */
.section-sep {
    margin-top: 1.25rem !important; /* space above hr */
    margin-bottom: .75rem !important; /* hr -> heading */
}

.section-title {
    margin-top: 0 !important;
    margin-bottom: 1rem !important; /* heading -> content */
    font-weight: 600;
    font-size: 1.25rem;
    line-height: 1.4;
}

/* ======================================================================
   CHOOSE MODELS UX POLISH (scoped to #model-chooser to avoid leaks)
   ====================================================================== */

/* Prefer CSS vars instead of global !important overrides */
#model-chooser .accordion {
    --bs-accordion-btn-color: #0d6efd;
    --bs-accordion-active-color: #0d6efd;
    --bs-accordion-active-bg: #e7f1ff;
}

/* Keep Expand/Collapse button group visually aligned with the search box
   without relying on parent height. */
#model-chooser .cp-toolbar .btn-group > .btn {
    line-height: 1.1;
    padding-top: .375rem;
    padding-bottom: .375rem;
}

/* Optional: tighten the tiny “Selected: N” line a touch */
#model-chooser .cp-selected-count {
    margin-top: .125rem;
}

/* (If you want denser rows inside the chooser, keep this too)
#model-chooser .list-group-item { padding: .375rem .75rem; line-height: 1.2; }
*/


/* Tag badges in the prompt chooser */
.tag-badge {
    background-color: #f0f0f0; /* light gray background */
    color: #000; /* black text */
    font-weight: 500; /* slightly bold for readability */
}