/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #f5f5f4;
}

::-webkit-scrollbar-thumb {
    background: #78350f;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #451a03;
}

body {
    font-family: 'Georgia', 'Times New Roman', serif;
}

h1,
h2,
h3,
h4 {
    letter-spacing: 0.05em;
}

.sans-serif {
    font-family: system-ui, -apple-system, sans-serif;
}

.chart-container {
    position: relative;
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    height: 500px;
    max-height: 600px;
}

.timeline-line::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 2px;
    background-color: #d6d3d1;
    transform: translateX(-50%);
    z-index: 0;
}

.fade-in {
    animation: fadeIn 0.5s ease-in;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Character Highlights - Will be dynamically handled but keeping classes for reference if needed or specific overrides */
.char-apicius {
    color: var(--color-apicius, #991b1b);
    font-weight: bold;
    border-bottom: 1px dotted var(--color-apicius, #991b1b);
    cursor: help;
}

.char-sejanus {
    color: var(--color-sejanus, #0f172a);
    font-weight: bold;
    border-bottom: 1px dotted var(--color-sejanus, #0f172a);
    cursor: help;
}

.char-apicata {
    color: var(--color-apicata, #7e22ce);
    font-weight: bold;
    border-bottom: 1px dotted var(--color-apicata, #7e22ce);
    cursor: help;
}

.char-tiberius {
    color: var(--color-tiberius, #b45309);
    font-weight: bold;
    border-bottom: 1px dotted var(--color-tiberius, #b45309);
    cursor: help;
}

.char-drusus {
    color: var(--color-drusus, #0f766e);
    font-weight: bold;
}

.char-livilla {
    color: var(--color-livilla, #be185d);
    font-weight: bold;
}

.char-mecenas {
    color: var(--color-mecenas, #4338ca);
    font-weight: bold;
}

/* Rigor Traffic Light */
.rigor-high {
    border-left: 6px solid #16a34a;
}

.rigor-medium {
    border-left: 6px solid #ca8a04;
}

.rigor-low {
    border-left: 6px solid #dc2626;
}

.rigor-badge-high {
    background-color: #dcfce7;
    color: #166534;
}

.rigor-badge-medium {
    background-color: #fef9c3;
    color: #854d0e;
}

.rigor-badge-low {
    background-color: #fee2e2;
    color: #991b1b;
}

/* Source Quote Styling */
.source-quote {
    font-family: 'Courier New', Courier, monospace;
    background-color: #fffbeb;
    /* Paper color */
    border: 1px solid #e7e5e4;
    border-left: 4px solid #b45309;
    padding: 12px;
    margin-top: 8px;
    font-size: 0.9rem;
    color: #292524;
    line-height: 1.5;
}

.source-quote u {
    background-color: #fde68a;
    /* Yellow highlighter */
    text-decoration: none;
    font-weight: bold;
}

.caesar-card {
    background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
    border: 2px solid #b45309;
    box-shadow: 0 10px 20px -3px rgba(180, 83, 9, 0.25);
    transform: scale(1.02);
}