/**
 * Every Tower's Job (/strategies/tower-roles, cms/strategies-tower-roles.html): the search box,
 * the role accordions (native <details>, open without script) and the orange row hover.
 * Server pub/media/strategies/tower-roles.css; bump ?v= in the page after a change.
 * Tokens: the storefront's --color-bb-* (fallbacks are the same hex).
 */
.bbr-search { margin: 0 0 1.25rem; }
.bbr-search input {
    display: block;
    width: 100%;
    margin-top: .35rem;
    padding: .7rem 1rem;
    border: 1px solid var(--color-bb-line, #2a3756);
    border-radius: 10px;
    background: var(--color-bb-panel, #161f36);
    color: var(--color-bb-text, #e8ecf5);
    font-size: 1rem;
}
.bbr-search input:focus { outline: none; border-color: var(--color-bb-amber, #f59e0b); }
.bbr-search .bbr-count { margin: .4rem 0 0; font-size: .875rem; min-height: 1.2em; }
.bbr-none { padding: 1rem; border: 1px dashed var(--color-bb-line, #2a3756); border-radius: 10px; }

.bbr-group {
    margin: 0 0 .75rem;
    border: 1px solid var(--color-bb-line, #2a3756);
    border-radius: 10px;
    background: var(--color-bb-panel, #161f36);
    overflow: hidden;
}
.bbr-group[open] { border-color: var(--color-bb-amber, #f59e0b); }
.bbr-group > summary {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .85rem 1rem;
    cursor: pointer;
    list-style: none;
    font-weight: 700;
    color: var(--color-bb-text, #e8ecf5);
}
.bbr-group > summary::-webkit-details-marker { display: none; }
.bbr-group > summary:hover { color: var(--color-bb-amber-hi, #fbbf24); }
.bbr-group > summary .bbr-n { margin-left: auto; font-weight: 400; font-size: .875rem; color: var(--color-bb-muted, #9aa6c0); }
.bbr-group > summary::after {
    content: "+";
    flex: none;
    width: 1.5rem;
    text-align: center;
    font-size: 1.25rem;
    line-height: 1;
    color: var(--color-bb-amber, #f59e0b);
}
.bbr-group[open] > summary::after { content: "\2212"; }
.bbr-group .bbg-table-wrap { margin: 0; border-top: 1px solid var(--color-bb-line, #2a3756); }
.bbr-group .bbg-table { margin: 0; }

/* Light orange on hover */
.bbr-table tbody tr.bbr-row { transition: background-color .15s ease; }
.bbr-table tbody tr.bbr-row:hover td { background-color: rgb(245 158 11 / .17); }
.bbr-table tbody tr.bbr-row:hover td:first-child a { color: var(--color-bb-amber-hi, #fbbf24); }
.bbr-table mark { background: rgb(245 158 11 / .3); color: inherit; border-radius: 3px; padding: 0 .1em; }

/* Same column widths in every group */
.bbr-table { table-layout: fixed; width: 100%; min-width: 40rem; }
.bbr-table th:nth-child(1) { width: 20%; }
.bbr-table th:nth-child(2) { width: 8%; }
.bbr-table th:nth-child(3) { width: 40%; }
.bbr-table th:nth-child(4) { width: 32%; }

/* Phone: each row is a small card (tower and price, then the job, then the second strength) */
@media (max-width: 640px) {
    .bbr-group .bbg-table-wrap { overflow: visible; }
    .bbr-table { min-width: 0; table-layout: auto; }
    .bbr-table thead { display: none; }
    .bbr-table, .bbr-table tbody, .bbr-table tr.bbr-row, .bbr-table td { display: block; width: auto; }
    .bbr-table tr.bbr-row { display: grid; grid-template-columns: 1fr auto; gap: .2rem .75rem; padding: .7rem 1rem; border-bottom: 1px solid var(--color-bb-line, #2a3756); }
    .bbr-table tr.bbr-row[hidden] { display: none; }
    .bbr-table tr.bbr-row:last-child { border-bottom: 0; }
    .bbr-table td { padding: 0; border: 0; }
    .bbr-table td:nth-child(1) { font-weight: 700; }
    .bbr-table td:nth-child(3), .bbr-table td:nth-child(4) { grid-column: 1 / -1; }
    .bbr-table td:nth-child(4) { color: var(--color-bb-muted, #9aa6c0); }
    .bbr-table td:nth-child(4)::before { content: "Also: "; color: var(--color-bb-amber, #f59e0b); font-weight: 600; }
    .bbr-table tbody tr.bbr-row:hover, .bbr-table tbody tr.bbr-row:hover td { background-color: transparent; }
    .bbr-table tbody tr.bbr-row:hover { background-color: rgb(245 158 11 / .17); }
}