/*  COMMITTEES - what the three committee screens need beyond the console's cm* language.
 *
 *  Every selector starts .cte, so loading this beside ContentManager.css on a public page cannot
 *  restyle anything else on it - the same property that made the cm* extraction safe.
 */

/* A wide table scrolls sideways and keeps its columns rather than restacking on a phone. */
.cteScroll { overflow-x: auto; max-width: 100%; background-color: white; }
.cteScroll .cmTable { min-width: 620px; }

.cteButtons { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.cteButtons.cteTop { margin: 0 0 12px 0; }

/* The one button that destroys things, set apart from the ones beside it. */
.cmButton.cteDanger { margin-left: auto; color: #a12622; border-color: #d9a9a6; }
.cmButton.cteDanger:hover { background-color: #a12622; border-color: #a12622; color: white; }

.cteFilters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 12px 0; }

    .cteFilters select,
    .cteFilters input[type="text"],
    .cteFilters input[type="search"] {
        font-family: inherit;
        font-size: 13px;
        padding: 6px;
        border: 1px solid #ccc;
        background-color: white;
    }

    .cteFilters input[type="text"],
    .cteFilters input[type="search"] { min-width: 240px; }

.cteDescription { margin: 0 0 14px 0; font-size: 14px; line-height: 1.5; white-space: pre-line; max-width: 900px; }

/* The master's status line takes no room until it has something to say. */
.cteWrap .cmStatusBar:empty { min-height: 0; margin: 0; }

/* Types are edited in place: inputs sized to the column, not to the console form. */
.cteTypes input[type="text"],
.cteTypes input[type="number"] {
    font-family: inherit;
    font-size: 13px;
    padding: 5px;
    border: 1px solid #ccc;
    background-color: white;
    box-sizing: border-box;
}

.cteTypes input[type="text"] { width: 100%; min-width: 160px; }
.cteTypes input[type="number"] { width: 70px; }

/* ---- the public list ---- */

.cteDirectory { font-size: 14px; color: black; }

.cteGroup {
    padding: 2px 10px;
    background-color: #003366;
    color: white;
    font-size: 17px;
    font-weight: bold;
    margin: 14px 0 8px 0;
    box-sizing: border-box;
    text-transform: uppercase;
    clear: both;
}

.cteCommittee { margin: 4px 0 4px 10px; }
.cteCommittee summary { cursor: pointer; padding: 3px 0; }
.cteCommittee summary:focus-visible { outline: 2px solid #003366; outline-offset: 2px; }

.cteDetail { padding: 8px 10px 12px 14px; font-size: 13px; }

.cteDirectory table { border-collapse: collapse; width: max-content; max-width: none; }
.cteDirectory th { text-align: left; padding: 2px 14px 2px 0; font-weight: bold; }
.cteDirectory td { padding: 2px 14px 2px 0; vertical-align: top; }

.cteCenterLink { margin: 0 0 12px 0; }

/* .cmPanel sets its own display, which would otherwise beat the hidden attribute on the member form. */
.cteWrap [hidden] { display: none !important; }