.notice-wrap .dotted-blank {
    border-bottom: 1px dotted #6c757d;
    padding: 0 .35rem;
    word-break: break-word;
}

.notice-wrap .accordion .btn-link {
    white-space: normal;
    word-break: break-word;
    text-decoration: none;
}

.notice-wrap .sig-img {
    max-width: 100%;
    height: auto;
    max-height: 90px;
}

.notice-wrap .person-card dt {
    font-size: .8rem;
    color: #6c757d;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 0;
}

.notice-wrap .person-card dd {
    margin-bottom: .6rem;
    word-break: break-word;
}

.notice-wrap .table td, .notice-wrap .table th {
    vertical-align: top;
}

@media (max-width: 575.98px) {
    .notice-wrap .modal-body-inner {
        padding: .5rem !important;
    }

    .notice-wrap .card-body {
        padding: .75rem;
    }

    .notice-wrap .notice-title {
        font-size: 1rem;
    }
}

/* ===== Mobile first: everything stacked ===== */
.filter-table,
.filter-table tbody {
    display: block;
    width: 100%;
    margin: 0;
}

    .filter-table tr {
        display: grid;
        grid-template-columns: 1fr; /* phone: 1 per row */
        gap: .5rem;
        width: 100%; /* FIX 1: Force the row container to span 100% of the table width */
    }

    .filter-table td {
        display: block;
        padding: 0;
        border: 0;
        min-width: 0;
        width: 100%; /* FIX 2: Force the grid items to expand across the cell track width */
    }

    /* FIX 3: Target BOTH input elements (.form-control) AND dropdown select elements (.form-select) */
    .filter-table .form-control,
    .filter-table .form-select,
    .filter-table select {
        width: 100% !important;
        max-width: 100% !important;
        display: block; /* Ensures they behave as full block layout components */
    }


/* Small tablets (>=576px): 2 per row, search takes the full row */
@media (min-width: 576px) {
    .filter-table tr {
        grid-template-columns: repeat(2, 1fr);
    }

    .filter-table .cell-search {
        grid-column: 1 / -1;
    }
}

/* Tablets / small laptops (>=992px): 4 per row */
@media (min-width: 992px) {
    .filter-table tr {
        grid-template-columns: repeat(4, 1fr);
    }

    .filter-table .cell-search {
        grid-column: span 2;
    }
}

/* Desktop (>=1200px): everything on one row */
@media (min-width: 1200px) {
    .filter-table tr {
        grid-template-columns: 1.4fr 1.4fr 1.4fr 1.4fr 1.4fr 1.4fr auto;
    }

    .filter-table .cell-search {
        grid-column: auto;
    }

    .filter-table .cell-clear {
        text-align: right;
    }
}

/*Accordian header design*/
/* Card Accordion Wrapper overrides */
.notice-accordion-header {
    background-color: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

/* Main button interaction area */
.btn-accordion-trigger {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    padding: 0.25rem 0.5rem !important;
    color: #1e293b !important;
    text-decoration: none !important;
    background-color: #ffffff;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
    border: none !important;
    width: 100%;
}

    /* Hover & Active System States */
    .btn-accordion-trigger:hover {
        background-color: #f8fafc;
    }

    .btn-accordion-trigger:focus,
    .btn-accordion-trigger:active {
        box-shadow: none !important;
        outline: none !important;
    }

/* Flex Grid Structure for Metadata properties */
.header-meta-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    flex-grow: 1;
}

.meta-block {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    /* Labels positioned neatly above data values */
    .meta-block .meta-label {
        font-size: 11px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: #64748b;
    }

    .meta-block .meta-value {
        font-size: 14px;
        font-weight: 500;
        color: #0f172a;
    }

/* Distinct emphasis handling for calendar dates */
.date-block .meta-value {
    color: #2563eb;
    font-weight: 600;
}

/* Interactive SVG chevron indicator transitions */
.accordion-arrow-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    transition: transform 0.2s ease, color 0.2s ease;
    padding-left: 1rem;
}

.btn-accordion-trigger:not(.collapsed) .accordion-arrow-icon {
    transform: rotate(-180deg);
    color: #2563eb;
}

/* Mobile Responsiveness adjustments */
@media (max-width: 576px) {
    .header-meta-flex {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
    }

    .btn-accordion-trigger {
        padding: 1rem !important;
    }
}