/**************************************************************************************************
 *  Project Name:       Stabilia WEB
 *  File:               dxHtmlEditor.css
 *  Description:        CSS
 * 
 *  Author:             GG
 *  Created:            06/03/2026 
 *  Last Modified:      06/03/2026
 *  Copyright:          © 2025 G3cube s.r.l. All rights reserved.
 * 
 *  Purpose:            CSS per dxHtmlEditor usato nelal visualizzazione dei file HTML (Help, Privacy, ecc. )
 *
 *  Changelog:
 *  ----------------------------------------------------------------------------------------------
 *  Date         Author   Ver   Description
 *  ----------   -------  ----  ------------------------------------------------------------------
 *  06/03/2026   GG       1.0   Creazione iniziale della unit
 *************************************************************************************************/

/* --------------------------------------------------------------------------------------------- */ 
/* BASE DOCUMENT */
/* --------------------------------------------------------------------------------------------- */ 

.dx-htmleditor-content {
  margin: 40px auto;
  max-width: 900px;
  padding: 0 20px;

  font-family: "Segoe UI", Calibri, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.6;
  color: #222;
}

.dx-htmleditor-content > :first-child {
  margin-top: 0 !important;;
}


/* --------------------------------------------------------------------------------------------- */ 
/* TITOLI */
/* --------------------------------------------------------------------------------------------- */ 

.dx-htmleditor-content h1 {
  font-size: 24px;
  font-weight: 600;
  color: #387FA4;
  margin: 0 0 16px 0 !important;
  padding-bottom: 8px;
  border-bottom: 2px solid #ccc;
}

.dx-htmleditor-content h2 {
  font-size: 20px;
  font-weight: 600;
  color: #387FA4;
  margin: 14px 0 14px 0 !important;
  padding-bottom: 6px;
  border-bottom: 1px solid #ddd;
}

.dx-htmleditor-content h3 {
  font-size: 17px;
  font-weight: 600;
  color: #387FA4;
  margin: 0 0 10px 0 !important;
}

.dx-htmleditor-content h4 {
  font-size: 15px;
  font-weight: 600;
  color: #387FA4;
  margin: 0 0 8px 0 !important;
}

.dx-htmleditor-content h5,
.dx-htmleditor-content h6 {
  font-size: 14px;
  font-weight: 600;
  color: #387FA4;
  margin: 0px 0 6px 0 !important; 
}


/* --------------------------------------------------------------------------------------------- */ 
/* PARAGRAFI */
/* --------------------------------------------------------------------------------------------- */ 

.dx-htmleditor-content p {
  margin: 0 0 6px 0 !important;;
}


/* --------------------------------------------------------------------------------------------- */ 
/* LISTE */
/* --------------------------------------------------------------------------------------------- */ 

.dx-htmleditor-content ul,
.dx-htmleditor-content ol {
  margin: 0 0 16px 28px !important;;
  padding: 0;
}

.dx-htmleditor-content li {
  margin-bottom: 6px !important;;
}


/* --------------------------------------------------------------------------------------------- */ 
/* TESTO ENFATIZZATO */
/* --------------------------------------------------------------------------------------------- */ 

.dx-htmleditor-content strong,
.dx-htmleditor-content b {
  font-weight: 600;
}

.dx-htmleditor-content em,
.dx-htmleditor-content i {
  font-style: italic;
}


/* --------------------------------------------------------------------------------------------- */ 
/* LINK */
/* --------------------------------------------------------------------------------------------- */ 

.dx-htmleditor-content a {
  color: #005a9e;
  text-decoration: none;
}

.dx-htmleditor-content a:hover {
  text-decoration: underline;
}


/* --------------------------------------------------------------------------------------------- */ 
/* BLOCCO CITAZIONE */
/* --------------------------------------------------------------------------------------------- */ 

.dx-htmleditor-content blockquote {
  margin: 16px 0;
  padding: 12px 16px;
  background: #f5f5f5;
  border-left: 4px solid #ccc !important;;
  font-style: italic;
}


/* --------------------------------------------------------------------------------------------- */ 
/* CODICE / MONOSPAZIO */
/* --------------------------------------------------------------------------------------------- */ 

.dx-htmleditor-content code {
  font-family: Consolas, "Courier New", monospace;
  font-size: 13px;
  background: #f2f2f2;
  padding: 2px 6px !important;;
  border-radius: 3px !important;;
}

.dx-htmleditor-content pre {
  font-family: Consolas, "Courier New", monospace;
  font-size: 13px;
  background: #f2f2f2;
  padding: 14px;
  overflow-x: auto;
  border-radius: 4px;
  margin: 16px 0 !important;;
}


/* --------------------------------------------------------------------------------------------- */ 
/* TABELLE */
/* --------------------------------------------------------------------------------------------- */ 

.dx-htmleditor-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 16px 0;
  font-size: 14px;
}

.dx-htmleditor-content th,
.dx-htmleditor-content td {
  border: 1px solid #ccc;
  padding: 8px 10px !important;;
  text-align: left;
}

.dx-htmleditor-content th {
  background: #f0f0f0;
  font-weight: 600;
}


/* --------------------------------------------------------------------------------------------- */ 
/* IMMAGINI */
/* --------------------------------------------------------------------------------------------- */ 

.dx-htmleditor-content img {
  max-width: 100%;
  height: auto;
  margin: 14px 0 !important;;
}


/* --------------------------------------------------------------------------------------------- */ 
/* LINEA ORIZZONTALE */
/* --------------------------------------------------------------------------------------------- */ 

.dx-htmleditor-content hr {
  border: none;
  border-top: 1px solid #ccc;
  margin: 30px 0 !important;;
}