/* =========================================================
   Hair-Vision Help
   Estilos generales
   ========================================================= */


/* =========================================================
   Contenido de artículos históricos
   ========================================================= */

.knowledge-content {
    color: #334155;
    font-size: 1rem;
    line-height: 1.8;
    overflow-wrap: break-word;
}


/* Párrafos */

.knowledge-content p {
    margin: 0 0 1.25rem 0;
}


/* Títulos internos */

.knowledge-content h1,
.knowledge-content h2,
.knowledge-content h3,
.knowledge-content h4,
.knowledge-content h5 {
    color: #0f172a;
    font-weight: 700;
    line-height: 1.3;
    margin-top: 2rem;
    margin-bottom: 1rem;
}


.knowledge-content h1 {
    font-size: 1.875rem;
}


.knowledge-content h2 {
    font-size: 1.5rem;
}


.knowledge-content h3 {
    font-size: 1.25rem;
}


.knowledge-content h4,
.knowledge-content h5 {
    font-size: 1.125rem;
}


/* Negritas */

.knowledge-content strong,
.knowledge-content b {
    color: #1e293b;
    font-weight: 700;
}


/* Listas */

.knowledge-content ul,
.knowledge-content ol {
    margin-top: 1rem;
    margin-bottom: 1.5rem;
    padding-left: 2rem;
}


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


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


.knowledge-content li {
    margin-bottom: 0.5rem;
}


/* Enlaces */

.knowledge-content a {
    color: #2563eb;
    text-decoration: underline;
    text-underline-offset: 2px;
}


.knowledge-content a:hover {
    color: #1d4ed8;
}


/* =========================================================
   Imágenes
   ========================================================= */

.knowledge-content img {
    display: block;

    width: auto;
    max-width: 100%;
    height: auto;

    margin: 1.75rem auto;

    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;

    box-shadow:
        0 1px 3px rgba(0, 0, 0, 0.08),
        0 1px 2px rgba(0, 0, 0, 0.06);
}


/* =========================================================
   Tablas
   ========================================================= */

.knowledge-content table {
    width: 100%;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;

    border-collapse: collapse;

    overflow-x: auto;
}


.knowledge-content th,
.knowledge-content td {
    border: 1px solid #e2e8f0;

    padding: 0.75rem;

    text-align: left;
    vertical-align: top;
}


.knowledge-content th {
    background: #f8fafc;

    color: #1e293b;

    font-weight: 600;
}


/* =========================================================
   Citas
   ========================================================= */

.knowledge-content blockquote {
    margin: 1.5rem 0;

    padding:
        1rem
        1.25rem;

    border-left: 4px solid #3b82f6;

    background: #eff6ff;

    color: #334155;

    border-radius: 0 0.5rem 0.5rem 0;
}


/* Separador */

.knowledge-content hr {
    margin: 2rem 0;

    border: 0;
    border-top: 1px solid #e2e8f0;
}


/* =========================================================
   Eliminamos efectos indeseados del HTML histórico
   ========================================================= */

.knowledge-content div {
    max-width: 100%;
}


/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 640px) {

    .knowledge-content {
        font-size: 0.975rem;
        line-height: 1.75;
    }


    .knowledge-content img {
        margin-top: 1.25rem;
        margin-bottom: 1.25rem;
    }


    .knowledge-content table {
        font-size: 0.875rem;
    }
}

/* ---------------------------------------------------------
   Editor administrativo Jodit
--------------------------------------------------------- */

.jodit-container {
    border-radius: 0.75rem !important;
    overflow: hidden;
}

.jodit-workplace {
    background: #ffffff;
}

.jodit-wysiwyg {
    font-family:
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    font-size: 16px;
    line-height: 1.7;
}

.jodit-wysiwyg img {
    max-width: 100%;
    height: auto;
}