/*
 * Styles for content saved from CKEditor 5 (news, posts, comments). Loaded for every
 * visitor; ckeditor5.css only reaches logged-in users, so anything readers see belongs here.
 */
:root {
    --ck-image-style-spacing: 1.5em;

    /* -- Same values the CKEditor 5 build injects for the highlight plugin. ------------------- */

    --ck-highlight-marker-yellow: #fdfd77;
    --ck-highlight-marker-green: #63f963;
    --ck-highlight-marker-pink: #fc7999;
    --ck-highlight-marker-blue: #72cdfd;
    --ck-highlight-pen-red: #e91313;
    --ck-highlight-pen-green: #180;
}

.image-style-align-center,
.image-style-align-left,
.image-style-align-right,
.image-style-side {
    max-width: 50% !important;
}

.image-style-side {
    float: right;
    margin-left: var(--ck-image-style-spacing)
}

.image-style-align-left {
    float: left;
    margin-right: var(--ck-image-style-spacing)
}

.image-style-align-center {
    margin-left: auto;
    margin-right: auto
}

.image-style-align-right {
    float: right;
    margin-left: var(--ck-image-style-spacing)
}

.news-content figure.image {
	img {
		width: 100%;
	}

	figcaption {
		text-align: center;
	}
}

blockquote {
	margin: 10px 0;
	overflow: hidden;
    padding-right: 1.5em;
    padding-left: 1.5em;
    font-style: italic;
    border-left: 5px solid #ccc;
}

/* -- Font size and highlight classes, copied from the CKEditor 5 build. ---------------------- */

.text-tiny {
    font-size: .7em;
}

.text-small {
    font-size: .85em;
}

.text-big {
    font-size: 1.4em;
}

.text-huge {
    font-size: 1.8em;
}

.marker-yellow {
    background-color: var(--ck-highlight-marker-yellow);
}

.marker-green {
    background-color: var(--ck-highlight-marker-green);
}

.marker-pink {
    background-color: var(--ck-highlight-marker-pink);
}

.marker-blue {
    background-color: var(--ck-highlight-marker-blue);
}

.pen-red {
    color: var(--ck-highlight-pen-red);
    background-color: transparent;
}

.pen-green {
    color: var(--ck-highlight-pen-green);
    background-color: transparent;
}
