/* ── Doctrine Tracker Styles ──────────────────────────────── */

/* ── Category colour tokens ── */
:root {
    --cat-medical:                #ef4444;
    --cat-prophecy:               #f97316;
    --cat-biblical_interpretation:#3b82f6;
    --cat-organizational:         #8b5cf6;
    --cat-eschatology:            #06b6d4;
    --cat-practices:              #10b981;
}

/* ── Change-type colour tokens ── */
:root {
    --ct-origin:       #6b7280;
    --ct-modification: #3b82f6;
    --ct-reversal:     #ef4444;
    --ct-abandonment:  #f97316;
    --ct-rebranding:   #8b5cf6;
}

/* ── Layout ── */
.dt-container {
    padding-top: 1.5rem;
    padding-bottom: 4rem;
}

/* ── Controls ── */
.dt-controls {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.dt-search-wrap { width: 100%; max-width: 28rem; }

.dt-search {
    width: 100%;
    padding: .55rem .9rem;
    border: 1.5px solid var(--color-border);
    border-radius: 8px;
    background: var(--color-card);
    color: var(--color-text);
    font-size: .95rem;
    transition: border-color .15s;
    box-sizing: border-box;
}
.dt-search:focus { outline: none; border-color: var(--color-accent); }

.dt-filters { display: flex; flex-wrap: wrap; gap: .5rem; }

.dt-filter-btn {
    padding: .35rem .85rem;
    border: 1.5px solid var(--color-border);
    border-radius: 20px;
    background: transparent;
    color: var(--color-text-muted);
    font-size: .85rem;
    font-weight: 500;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
    white-space: nowrap;
}
.dt-filter-btn:hover { border-color: var(--color-accent); color: var(--color-accent); }
.dt-filter-btn.is-active { background: var(--color-accent); border-color: var(--color-accent); color: #fff; }
.dt-filter-btn.is-active[data-cat="medical"]                { background: var(--cat-medical);                border-color: var(--cat-medical); }
.dt-filter-btn.is-active[data-cat="prophecy"]               { background: var(--cat-prophecy);               border-color: var(--cat-prophecy); }
.dt-filter-btn.is-active[data-cat="biblical_interpretation"] { background: var(--cat-biblical_interpretation);border-color: var(--cat-biblical_interpretation); }
.dt-filter-btn.is-active[data-cat="organizational"]         { background: var(--cat-organizational);         border-color: var(--cat-organizational); }
.dt-filter-btn.is-active[data-cat="eschatology"]            { background: var(--cat-eschatology);            border-color: var(--cat-eschatology); }
.dt-filter-btn.is-active[data-cat="practices"]              { background: var(--cat-practices);              border-color: var(--cat-practices); }

/* ── Result count ── */
.dt-result-count {
    font-size: .82rem;
    color: var(--color-text-muted);
    margin-bottom: 1.25rem;
    min-height: 1.2em;
}

/* ── Doctrine card ── */
.dt-card {
    border: 1px solid var(--color-border);
    border-radius: 10px;
    background: var(--color-card);
    margin-bottom: .75rem;
    transition: box-shadow .15s;
    overflow: hidden;
}
.dt-card:hover { box-shadow: 0 2px 10px rgba(0,0,0,.07); }
.dt-card.is-hidden { display: none; }

/* ── Card header (clickable) ── */
.dt-card-header {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .9rem 1.1rem;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}
.dt-card-header:focus-visible {
    outline: 2px solid var(--color-accent);
    outline-offset: -2px;
}

.dt-card-cat-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
    background: var(--color-border);
}
[data-cat="medical"]                .dt-card-cat-dot { background: var(--cat-medical); }
[data-cat="prophecy"]               .dt-card-cat-dot { background: var(--cat-prophecy); }
[data-cat="biblical_interpretation"].dt-card-cat-dot { background: var(--cat-biblical_interpretation); }
[data-cat="organizational"]         .dt-card-cat-dot { background: var(--cat-organizational); }
[data-cat="eschatology"]            .dt-card-cat-dot { background: var(--cat-eschatology); }
[data-cat="practices"]              .dt-card-cat-dot { background: var(--cat-practices); }

.dt-card-title {
    flex: 1;
    font-size: .98rem;
    font-weight: 600;
    color: var(--color-heading);
    min-width: 0;
}

.dt-card-meta {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-shrink: 0;
}

.dt-card-rev-count {
    font-size: .75rem;
    font-weight: 600;
    color: var(--color-text-muted);
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: 20px;
    padding: .15rem .55rem;
    white-space: nowrap;
}

.dt-card-cat-badge {
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .03em;
    color: #fff;
    border-radius: 20px;
    padding: .2rem .55rem;
    white-space: nowrap;
}
[data-cat="medical"]                .dt-card-cat-badge { background: var(--cat-medical); }
[data-cat="prophecy"]               .dt-card-cat-badge { background: var(--cat-prophecy); }
[data-cat="biblical_interpretation"].dt-card-cat-badge { background: var(--cat-biblical_interpretation); }
[data-cat="organizational"]         .dt-card-cat-badge { background: var(--cat-organizational); }
[data-cat="eschatology"]            .dt-card-cat-badge { background: var(--cat-eschatology); }
[data-cat="practices"]              .dt-card-cat-badge { background: var(--cat-practices); }

.dt-card-chevron {
    font-size: .75rem;
    color: var(--color-text-muted);
    transition: transform .2s;
    flex-shrink: 0;
}
.dt-card.is-open .dt-card-chevron { transform: rotate(180deg); }

/* ── Card summary (visible when collapsed) ── */
.dt-card-summary {
    padding: 0 1.1rem .9rem 2.65rem;
    font-size: .86rem;
    color: var(--color-text-muted);
    line-height: 1.5;
    border-top: 1px solid var(--color-border);
    padding-top: .65rem;
}
.dt-card.is-open .dt-card-summary { display: none; }

/* ── Expanded body ── */
.dt-card-body {
    display: none;
    border-top: 1px solid var(--color-border);
    padding: 1.25rem 1.25rem 1.25rem 1.1rem;
}
.dt-card.is-open .dt-card-body { display: block; }

/* ── Revision chain ── */
.dt-chain {
    position: relative;
    padding-left: 2rem;
}
.dt-chain::before {
    content: '';
    position: absolute;
    left: .45rem;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--color-border);
}

.dt-revision {
    position: relative;
    margin-bottom: 1.25rem;
}
.dt-revision:last-child { margin-bottom: 0; }

/* Change-type dot */
.dt-revision::before {
    content: '';
    position: absolute;
    left: -1.6rem;
    top: .55rem;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 2px solid var(--color-card);
    background: var(--ct-origin);
    z-index: 1;
}
.dt-revision[data-ct="origin"]::before       { background: var(--ct-origin); }
.dt-revision[data-ct="modification"]::before { background: var(--ct-modification); }
.dt-revision[data-ct="reversal"]::before     { background: var(--ct-reversal); }
.dt-revision[data-ct="abandonment"]::before  { background: var(--ct-abandonment); }
.dt-revision[data-ct="rebranding"]::before   { background: var(--ct-rebranding); }

.dt-revision-header {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .35rem;
    flex-wrap: wrap;
}

.dt-revision-date {
    font-size: .78rem;
    font-weight: 600;
    color: var(--color-text-muted);
    white-space: nowrap;
}

.dt-ct-badge {
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    padding: .15rem .5rem;
    border-radius: 4px;
    color: #fff;
    white-space: nowrap;
}
.dt-ct-badge[data-ct="origin"]       { background: var(--ct-origin); }
.dt-ct-badge[data-ct="modification"] { background: var(--ct-modification); }
.dt-ct-badge[data-ct="reversal"]     { background: var(--ct-reversal); }
.dt-ct-badge[data-ct="abandonment"]  { background: var(--ct-abandonment); }
.dt-ct-badge[data-ct="rebranding"]   { background: var(--ct-rebranding); }

.dt-revision-pub {
    font-size: .75rem;
    color: var(--color-text-muted);
    font-style: italic;
}
.dt-revision-pub .dt-tbd {
    color: var(--cat-prophecy);
    font-style: normal;
    font-weight: 600;
}

.dt-revision-position {
    font-size: .9rem;
    font-weight: 600;
    color: var(--color-heading);
    line-height: 1.4;
    margin-bottom: .3rem;
}

.dt-revision-quote {
    font-size: .84rem;
    color: var(--color-text);
    line-height: 1.55;
    border-left: 3px solid var(--color-border);
    padding-left: .75rem;
    margin: .4rem 0 0 0;
    font-style: italic;
}
[data-ct="reversal"]     .dt-revision-quote { border-left-color: var(--ct-reversal); }
[data-ct="modification"] .dt-revision-quote { border-left-color: var(--ct-modification); }
[data-ct="abandonment"]  .dt-revision-quote { border-left-color: var(--ct-abandonment); }

/* ── Article link at bottom of body ── */
.dt-article-link {
    display: inline-block;
    margin-top: 1rem;
    font-size: .8rem;
    color: var(--color-accent);
    text-decoration: none;
    font-weight: 500;
    border-top: 1px solid var(--color-border);
    padding-top: .75rem;
    width: 100%;
}
.dt-article-link:hover { text-decoration: underline; }

/* ── No results ── */
.dt-no-results {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--color-text-muted);
    font-size: .95rem;
}

/* ── Responsive ── */
@media (max-width: 600px) {
    .dt-card-cat-badge { display: none; }
    .dt-card-header { gap: .5rem; }
    .dt-chain { padding-left: 1.5rem; }
    .dt-chain::before { left: .35rem; }
    .dt-revision::before { left: -1.15rem; }
}