﻿/* =================================================================== */
/* Legal Authorities: category tabs, one collapsible card per source    */
/* holding a grid of citation blocks, and the drawer that lists the     */
/* services a clicked citation governs.                                 */
/* =================================================================== */

/* Category tabs: a uniform grid of bordered cards switching which
   sections are visible below. */
.auth-tabs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-bottom: 14px; }
.auth-tab { border: 1px solid var(--line-2); background: var(--surface); border-radius: 8px; padding: 12px 10px; font-size: 13.5px; color: var(--text-2); font-weight: 600; display: flex; align-items: center; justify-content: center; gap: 8px; text-decoration: none; transition: all .12s; text-align: center; box-shadow: var(--sd); font-family: inherit; cursor: pointer; }
    .auth-tab:hover { border-color: var(--gold-line); background: var(--gold-soft); color: var(--gold-ink); }
    .auth-tab.on { border-color: var(--gold); background: var(--gold-soft); color: var(--gold-ink); }
    .auth-tab .at-ct { font-family: var(--font-mono); font-size: 11px; background: var(--surface-3); color: var(--text-2); padding: 1px 7px; border-radius: 10px; font-weight: 700; }
    .auth-tab:hover .at-ct, .auth-tab.on .at-ct { background: #fff; color: var(--gold-ink); }

.auth-hint { font-size: 13px; color: var(--text-2); margin: 0 0 18px; }

.auth-cat[hidden] { display: none; }

/* Each source is a card whose header bar collapses it, so the
   collapsibility is visible at a glance. */
.auth-src { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--sd); margin-bottom: 18px; overflow: hidden; }
    .auth-src > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 12px; padding: 14px 18px; background: var(--surface-2); transition: background .12s; }
        .auth-src > summary::-webkit-details-marker { display: none; }
        .auth-src > summary:hover { background: var(--surface-3); }
    .auth-src[open] > summary { border-bottom: 1px solid var(--line); }
.as-label { font-family: var(--font-display); font-size: 16.5px; font-weight: 700; color: var(--text); letter-spacing: .1px; flex: 1; }
.as-ct { font-family: var(--font-mono); font-size: 12px; color: var(--text-2); font-weight: 600; white-space: nowrap; }
.as-chev { width: 17px; height: 17px; stroke: var(--text-2); transition: transform .18s; flex: none; }
.auth-src[open] .as-chev { transform: rotate(90deg); }
.auth-src-body { padding: 15px 17px 17px; }

/* Process-group sub-sections inside a source, collapsible like their
   parent so long sources organize by the work they govern. */
.auth-sub { border: 1px solid var(--surface-3); border-radius: 8px; margin-bottom: 10px; overflow: hidden; }
    .auth-sub:last-child { margin-bottom: 0; }
    .auth-sub > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: var(--surface-2); transition: background .12s; }
        .auth-sub > summary::-webkit-details-marker { display: none; }
        .auth-sub > summary:hover { background: var(--surface-3); }
.asb-label { font-size: 14px; font-weight: 650; color: var(--text); flex: 1; }
.asb-ct { font-family: var(--font-mono); font-size: 11.5px; color: var(--text-2); font-weight: 600; white-space: nowrap; }
.asb-chev { width: 15px; height: 15px; stroke: var(--text-2); transition: transform .18s; flex: none; }
.auth-sub[open] .asb-chev { transform: rotate(90deg); }
.auth-sub-body { padding: 11px 12px; }

/* Citation blocks: compact cards on a grid, each opening the drawer */
.cite-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(175px, 1fr)); gap: 10px; }
.cite-block { background: var(--gold-soft); border: 1px solid var(--gold-line); border-radius: 8px; padding: 12px 10px 11px; display: flex; flex-direction: column; align-items: center; gap: 4px; cursor: pointer; transition: all .12s; font-family: inherit; text-align: center; }
    .cite-block:hover { border-color: var(--gold); background: rgba(166,121,31,.19); transform: translateY(-1px); box-shadow: var(--sd); }
    .cite-block .cbk-cite { font-family: var(--font-mono); font-size: 14px; font-weight: 700; color: var(--gold-ink); line-height: 1.35; word-break: break-word; }
    .cite-block .cbk-ct { font-size: 12px; color: var(--text-2); font-weight: 600; }

/* Task rows: used by the citation drawer and the no-authority tab */
.auth-task-row { display: flex; align-items: center; gap: 12px; padding: 11px 13px; border-radius: 8px; transition: background .1s; text-decoration: none; }
    .auth-task-row:hover { background: var(--surface-2); }
    .auth-task-row .atr-id { font-family: var(--font-mono); font-size: 12px; font-weight: 600; color: var(--text-2); background: var(--surface); border: 1px solid var(--line); padding: 2px 8px; border-radius: 5px; flex: none; }
    .auth-task-row .atr-task { font-size: 13.5px; color: var(--text); flex: 1; min-width: 0; line-height: 1.4; }
    .auth-task-row .atr-grp { font-size: 12px; color: var(--text-2); white-space: nowrap; }

/* Wide official-source button at the top of the citation drawer; dark
   ink with white text so it reads instantly against the drawer canvas. */
.drawer-src-btn { display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; background: var(--ink); border: 1px solid var(--ink); color: #fff; font-size: 15px; font-weight: 700; padding: 13px 16px; border-radius: 9px; text-decoration: none; margin-bottom: 24px; box-shadow: var(--sd); transition: all .13s; letter-spacing: .01em; }
    .drawer-src-btn:hover { background: var(--ink-3); border-color: var(--gold-2); transform: translateY(-1px); box-shadow: var(--sd-md); }
    .drawer-src-btn .dsb-ext { color: var(--gold-bright); font-size: 14px; }

.drawer-task-list { background: var(--surface); border: 1px solid var(--line); border-radius: 9px; padding: 6px 8px; }
    .drawer-task-list .auth-task-row + .auth-task-row { border-top: 1px solid var(--surface-3); border-radius: 0; }
    .drawer-task-list .auth-task-row:first-child { border-radius: 8px 8px 0 0; }
    .drawer-task-list .auth-task-row:last-child { border-radius: 0 0 8px 8px; }

/* The no-authority tab: a plain list of the tasks that cite nothing */
.noauth-note { font-size: 13.5px; color: var(--text-2); margin: 0 0 12px; }
.noauth-box { background: var(--surface); border: 1px solid var(--line); border-radius: 9px; box-shadow: var(--sd); padding: 6px 8px; }

@media (max-width: 1180px) {
    .auth-tabs { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 760px) {
    .auth-tabs { grid-template-columns: repeat(2, 1fr); }
    .cite-grid { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
}
