﻿/* site.selfserve.css
   Shared styles for Program banner + RequiredDocs upload UI
   Requires Bootstrap 5.2+ (uses --bs-* CSS variables)
*/

/* ----------------- Banner ----------------- */
.info-banner {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: .5rem;
}

    .info-banner .row.gx-2 {
        --bs-gutter-x: .5rem;
    }

    .info-banner .row.gy-1 {
        --bs-gutter-y: .25rem;
    }

    .info-banner .col-form-label {
        padding: 0;
        margin-bottom: 0;
    }

    .info-banner .form-control-plaintext {
        padding: 0;
        margin: 0;
    }

    .info-banner .section-title {
        letter-spacing: .06em;
    }

/* Accent variant (green, like #e2f3ea) */
.info-banner--success {
    background: var(--bs-success-bg-subtle);
    border-color: var(--bs-success-border-subtle);
}

/* Keep values on a single line (lg+) and ellipsize */
@media (min-width: 992px) {
    .info-banner .value-1line {
        display: block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

/* Optional pill for emphasized values */
.value-chip {
    display: inline-block;
    padding: .35rem .6rem;
    border: 1px solid var(--bs-border-color);
    border-radius: .375rem;
    font-weight: 600;
    background: var(--bs-body-bg);
}

/* ----------------- Tables & spacing helpers ----------------- */
.card-body-pad-x {
    padding-left: var(--bs-card-spacer-x);
    padding-right: var(--bs-card-spacer-x);
}

.table-shell table {
    margin-bottom: 0;
}

.table-shell thead th {
    border-top: none !important;
}

/* ----------------- Validation tweaks ----------------- */
.form-control.is-invalid {
    background-image: none !important;
    padding-right: var(--bs-form-control-padding-x) !important;
}

.form-select.is-invalid {
    background-image: var(--bs-form-select-bg-img) !important;
}

.invalid-feedback {
    display: none;
}

/* ----------------- Dropzone area ----------------- */
.dropzone-wrapper .dropzone-desc {
    padding-bottom: 15px;
}
/* gap inside the border */
.dropzone-wrapper .dz-file-list {
    margin-bottom: 6px;
}

.dropzone-wrapper .dz-file-list {
    max-height: none !important;
    overflow: visible !important; /* no scroll, auto-grow */
}

.dropzone-wrapper,
.dropzone-wrapper .dropzone-desc {
    height: auto !important;
    min-height: 160px;
    overflow: visible !important;
}

/* Optional: subtle highlight class (use instead of inline background) */
.bg-warning-soft {
    background: var(--bs-warning-bg-subtle);
}
