/* Tipografia Markdown per le spiegazioni didattiche */
.spiegazione-content {
    word-wrap: break-word;
}

.spiegazione-content > *:first-child {
    margin-top: 0;
}

.spiegazione-content > *:last-child {
    margin-bottom: 0;
}

.spiegazione-content h1,
.spiegazione-content h2,
.spiegazione-content h3,
.spiegazione-content h4 {
    font-weight: 700;
    line-height: 1.35;
    margin-top: 1.25rem;
    margin-bottom: 0.5rem;
}

.spiegazione-content h1 { font-size: 1.25rem; }
.spiegazione-content h2 { font-size: 1.125rem; }
.spiegazione-content h3 { font-size: 1rem; }
.spiegazione-content h4 { font-size: 0.9375rem; }

.spiegazione-content p {
    margin-bottom: 0.75rem;
}

.spiegazione-content ul,
.spiegazione-content ol {
    margin: 0.75rem 0;
    padding-left: 1.5rem;
}

.spiegazione-content ul {
    list-style-type: disc;
}

.spiegazione-content ol {
    list-style-type: decimal;
}

.spiegazione-content li {
    margin-bottom: 0.5rem;
    line-height: 1.55;
}

.spiegazione-content li > p {
    margin-top: 0.35rem;
    margin-bottom: 0.35rem;
}

.spiegazione-content li > p:first-child {
    margin-top: 0;
}

.spiegazione-content li > p:last-child {
    margin-bottom: 0;
}

.spiegazione-content ol > li::marker,
.spiegazione-content ul > li::marker {
    font-weight: 700;
    color: rgb(15, 23, 42);
}

.spiegazione-content strong {
    font-weight: 700;
}

.spiegazione-content em {
    font-style: italic;
}

.spiegazione-content code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.85em;
    background: rgba(15, 23, 42, 0.06);
    padding: 0.1em 0.35em;
    border-radius: 0.25rem;
}

.spiegazione-content pre {
    margin: 0.75rem 0;
    padding: 0.75rem 1rem;
    background: rgba(15, 23, 42, 0.05);
    border-radius: 0.75rem;
    overflow-x: auto;
}

.spiegazione-content pre code {
    background: none;
    padding: 0;
}

.spiegazione-content blockquote {
    margin: 0.75rem 0;
    padding-left: 0.875rem;
    border-left: 3px solid rgba(20, 184, 166, 0.45);
    color: inherit;
    opacity: 0.9;
}

.spiegazione-content .katex-display {
    margin: 0.75rem 0;
    overflow-x: auto;
    overflow-y: hidden;
}

/* Tabelle Markdown (GFM) */
.spiegazione-content .spiegazione-table-wrap {
    margin: 1rem 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid rgba(148, 163, 184, 0.35);
    border-radius: 0.75rem;
    background: #fff;
}

.spiegazione-content table {
    width: 100%;
    min-width: 32rem;
    border-collapse: collapse;
    font-size: 0.8125rem;
    line-height: 1.45;
}

.spiegazione-content thead {
    background: rgba(15, 23, 42, 0.04);
}

.spiegazione-content th {
    padding: 0.625rem 0.75rem;
    font-weight: 700;
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: rgb(51, 65, 85);
    border-bottom: 1px solid rgba(148, 163, 184, 0.35);
    white-space: nowrap;
}

.spiegazione-content td {
    padding: 0.625rem 0.75rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.18);
    vertical-align: top;
    color: rgb(71, 85, 105);
}

.spiegazione-content tbody tr:last-child td {
    border-bottom: none;
}

.spiegazione-content tbody tr:nth-child(even) {
    background: rgba(248, 250, 252, 0.85);
}

.spiegazione-content tbody tr:hover {
    background: rgba(240, 253, 250, 0.55);
}

.spiegazione-content th:first-child,
.spiegazione-content td:first-child {
    text-align: center;
    font-weight: 600;
    color: rgb(15, 23, 42);
}

.spiegazione-content th:not(:first-child),
.spiegazione-content td:not(:first-child) {
    text-align: center;
}

.spiegazione-content th:nth-child(2),
.spiegazione-content td:nth-child(2) {
    text-align: left;
    min-width: 9rem;
}
