/**
 * Styles pour TinyMCE
 */

/* Layout principal */
.container-fluid {
    padding: 0 20px;
}

/* Éditeur de contenu */
.content-editor {
    margin-bottom: 20px;
}

.editor-container {
    background-color: #fff;
    padding: 15px;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

/* Sidebar des paramètres */
.settings-sidebar {
    background-color: #f7f7f7;
    padding: 15px;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    margin-top: 20px;
}

/* Formulaires */
.form-group {
    margin-bottom: 15px;
}

h3 {
    margin-bottom: 15px;
}

.btn {
    margin-top: 15px;
}

/* Styles essentiels pour TinyMCE */
.tox-tinymce {
    width: 100%;
    height: 400px;
    border: 1px solid #ccc;
    margin-bottom: 15px;
}

.tox-tinymce--focused,
.tox-tinymce:focus-within {
    border-color: #ccc !important;
    box-shadow: none !important;
}

.tox-tinymce--focused .tox-edit-area__iframe,
.tox .tox-edit-area__iframe:focus {
    outline: none !important;
}

.tox .tox-edit-area::before,
.tox.tox-edit-focus .tox-edit-area::before {
    opacity: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
}

.tox .tox-collection__item[title="12px"] .tox-collection__item-label,
.tox .tox-collection__item[title="12"] .tox-collection__item-label,
.tox .tox-collection__item[aria-label="12px"] .tox-collection__item-label {
    font-size: 12px !important;
}
.tox .tox-collection__item[title="14px"] .tox-collection__item-label,
.tox .tox-collection__item[title="14"] .tox-collection__item-label,
.tox .tox-collection__item[aria-label="14px"] .tox-collection__item-label {
    font-size: 14px !important;
}
.tox .tox-collection__item[title="16px"] .tox-collection__item-label,
.tox .tox-collection__item[title="16"] .tox-collection__item-label,
.tox .tox-collection__item[aria-label="16px"] .tox-collection__item-label {
    font-size: 16px !important;
}
.tox .tox-collection__item[title="18px"] .tox-collection__item-label,
.tox .tox-collection__item[title="18"] .tox-collection__item-label,
.tox .tox-collection__item[aria-label="18px"] .tox-collection__item-label {
    font-size: 18px !important;
}
.tox .tox-collection__item[title="20px"] .tox-collection__item-label,
.tox .tox-collection__item[title="20"] .tox-collection__item-label,
.tox .tox-collection__item[aria-label="20px"] .tox-collection__item-label {
    font-size: 20px !important;
}
.tox .tox-collection__item[title="22px"] .tox-collection__item-label,
.tox .tox-collection__item[title="22"] .tox-collection__item-label,
.tox .tox-collection__item[aria-label="22px"] .tox-collection__item-label {
    font-size: 22px !important;
}
.tox .tox-collection__item[title="24px"] .tox-collection__item-label,
.tox .tox-collection__item[title="24"] .tox-collection__item-label,
.tox .tox-collection__item[aria-label="24px"] .tox-collection__item-label {
    font-size: 24px !important;
}
.tox .tox-collection__item[title="26px"] .tox-collection__item-label,
.tox .tox-collection__item[title="26"] .tox-collection__item-label,
.tox .tox-collection__item[aria-label="26px"] .tox-collection__item-label {
    font-size: 26px !important;
}

.tox-fullscreen .tox-tinymce,
.tox-fullscreen .tox-editor-container,
.tox-fullscreen .tox-editor-header,
.tox-fullscreen .tox-sidebar-wrap,
.tox-fullscreen .tox-edit-area,
.tox-fullscreen .tox-statusbar {
    border-radius: 0 !important;
}

/* Style pour la prévisualisation */
#page-preview {
    width: 100%;
    height: 300px;
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
    border: 1px solid #ccc;
    margin-bottom: 20px;
    padding: 10px;
    background-color: #fff;
}

/* --- STYLES POUR LES MODULES CMS --- */
.cms-module-placeholder {
    background-color: #e8f0fe;
    border: 1px dashed #1a73e8;
    color: #1a73e8;
    padding: 10px;
    margin: 10px 0;
    border-radius: 4px;
    font-family: monospace;
    font-size: 12px;
    cursor: default;
    user-select: none;
    display: block;
    position: relative;
}

.cms-module-placeholder::before {
    content: 'MODULE';
    display: block;
    font-weight: bold;
    font-size: 10px;
    color: #1557b0;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.cms-module-placeholder:hover {
    background-color: #d2e3fc;
    border-color: #174ea6;
}