/*

This file is for page editing in particular.

When user edits a custom page content for a documentation, we need to ensure that the
visible styles are similar in the editor as well as in documentation. Thus, this file
is used: 
 - for the ckeditor in truugo2 (single page edit)
 - for the custom page content in edi-dir (web and print)
 - for the custom page content in truugo (web and print)

*/

@import url('./variables.css');

body {
  color: var(--text-color);
  font-family: 'Fira Sans', sans-serif;
}

/* Headers */

.cke_editable h1,
.cke_editable h2,
.cke_editable h3,
.user-content h1,
.user-content h2,
.user-content h3 {color: initial;}

.cke_editable h1, .user-content h1 { font-size: 1.15rem; }
.cke_editable h2, .user-content h2 { font-size: 1.10rem; }
.cke_editable h3, .user-content h3 { font-size: 1.05rem; }

/* Listings */

.cke_editable ul,
.cke_editable ol,
.user-content ul,
.user-content ol {
  text-align: left;
  margin-left: 2rem;
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}

.cke_editable ul,
.user-content ul {list-style-type: disc;}


/* Tables */
.cke_editable table,
.user-content table { caption-side: initial; border-collapse: collapse; }

.cke_editable table caption,
.user-content table caption { text-align: center; }

.cke_editable table thead, .cke_editable table tbody,
.user-content table thead, .user-content table tbody { border-width:0; }

.cke_editable table td, .cke_editable table th,
.user-content table td, .user-content table th { padding: 0.2em 0.4rem !important; border: 1px solid #757575; text-align: left;}

.cke_editable table th, .user-content table th { font-weight: bold; }

/* Other generic items */

.cke_editable p,
.user-content p {margin-top: 1rem; margin-bottom: 1rem;}

.cke_editable .hr, .user-content hr { width: 100%; border-style: inset; border-width: 1px; margin-top: 0.2rem; margin-bottom: 0.2rem; }

.cke_editable ol, .cke_editable ul, .user-content ol, .user-content ul { margin-left: 2rem; }