/* Documentation page styles */
.custom-code {
    background-color: #f8f9fa;
    color: #212529;
    border-radius: 4px;
    border: 1px solid #ddd;
    font-family: 'Courier New', monospace;
    font-size: 0.95rem;
    white-space: pre-wrap;
    overflow-x: auto;
    padding: 10px;
}

.content-preview iframe {
    width: 100%;
    height: 180px;
}

.content-card {
    position: relative;
    border-radius: 8px;
    padding: 15px;
    background-color: #fdfdfd;
    min-height: 10px;
    overflow: hidden;
    border: 1px solid transparent;
}

.content-card .content-preview {
    overflow: hidden;
    font-size: 0.9rem;
    color: #333;
}

.content-preview h1,
.content-preview h2,
.content-preview h3,
.content-preview h4,
.content-preview h5,
.content-preview h6,
.content-preview ol,
.content-preview ul,
.content-preview li {
    font-size: initial; /* Resets to the default size */
}

/* Add styles for ordered and unordered lists */
.content-preview ol {
    list-style-type: decimal; /* Use decimal numbers for ordered lists */
    margin-left: 0;
    list-style-position: inside;
}

.content-preview ul {
    list-style-type: disc; /* Use bullet points for unordered lists */
    margin-left: 0;
    list-style-position: inside;
}

.content-preview li {
    position: relative; /* Position relative for absolute positioning of markers */
}

.content-preview h1 {
    font-size: 1.5rem; /* Example size for h1 */
}

.content-preview h2 {
    font-size: 1.25rem; /* Example size for h2 */
}

.content-preview h3 {
    font-size: 1rem; /* Example size for h3 */
}

.content-preview h4 {
    font-size: 0.8rem; /* Example size for h4 */
}

.content-preview h5 {
    font-size: 0.75rem; /* Example size for h5 */
}

.content-preview h6 {
    font-size: 0.6rem; /* Example size for h6 */
}