/* ==========================================================================
   Detail Page Components
   Shared styles for read/detail views across snapshots, preservations,
   attestations, and releases.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Hash Row — displays label + monospace value for hashes, CIDs, addresses.
   Works in both light cards and dark (bg-dark) on-chain proof cards.
   -------------------------------------------------------------------------- */

.detail-hash-row {
    padding: 0.75rem 1rem;
    border-radius: var(--crypto-radius-sm, 8px);
    background: rgba(128, 128, 128, 0.08);
}

.detail-hash-row label {
    display: block;
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--crypto-text-muted, var(--tblr-secondary));
    margin-bottom: 0.25rem;
}

.detail-hash-row .value {
    font-family: var(--crypto-font-mono, var(--tblr-font-monospace));
    font-size: 0.8125rem;
    word-break: break-all;
    line-height: 1.5;
}

/* Inside dark cards, labels should use white-tinted muted color */
.bg-dark .detail-hash-row label {
    color: rgba(255, 255, 255, 0.5);
}

.bg-dark .detail-hash-row .value {
    color: rgba(255, 255, 255, 0.9);
}

/* --------------------------------------------------------------------------
   ID Display — copyable code block for entity identifiers
   -------------------------------------------------------------------------- */

.detail-id-display {
    background: var(--tblr-bg-surface-secondary, rgba(0, 0, 0, 0.03));
    font-size: 0.8rem;
    letter-spacing: 0.01em;
}

/* --------------------------------------------------------------------------
   Command Display — CLI command blocks
   -------------------------------------------------------------------------- */

.detail-command-display {
    background: var(--tblr-bg-surface-secondary, rgba(0, 0, 0, 0.03));
    font-size: 0.8rem;
}

/* --------------------------------------------------------------------------
   Extra Small utility
   -------------------------------------------------------------------------- */

.extra-small {
    font-size: 0.7rem;
}