/*
    version 1.0

*/
.tiny-editor-wrapper {
    width: 100%;
}

.tiny-editor-source {
    width: 100%;
    min-height: 200px;
}

.tox-tinymce {
    border-radius: 6px;
}

.tox-tinymce {
    border-width: 1px !important;
    border-radius: 4px !important;
}

.tox:not(.tox-tinymce-inline) .tox-editor-header {
    box-shadow: none !important;
    border-bottom: 1px solid #eee !important;
}
html.dark .tox:not(.tox-tinymce-inline) .tox-editor-header {
    border-color: #202123 !important;
}


/* knappar 

    background-color: var(--darktextboxbackground);

*/

/* Minska avstånd mellan knappar */
.tox .tox-toolbar__group {
    margin: 0 2px !important;
}

/* Minska spacing mellan knappar i grupp */
.tox .tox-tbtn {
    margin: 0 1px !important;
}

/* Minska gap i flex (TinyMCE 6 använder gap ibland) */
.tox .tox-toolbar,
.tox .tox-toolbar__primary {
    gap: 2px !important;
    background-image: none !important;
}

.tox .tox-edit-area::before {
    border: 1px solid #006ce7;
}
html.dark .tox .tox-edit-area::before {
    border: 1px solid #2266b5;
}


/* ===============================
   DARK MODE – TOOLBAR FIX
================================ */
/* hela editorn */
html.dark .tox-tinymce {
    background: #1e1e1e !important;
    border: 1px solid #2a2a2a !important;
}

.tox .tox-toolbar__group:first-child {
    padding: 0 3px 0 5px !important;
}

.tox .tox-toolbar__group:not(:first-child) {
    padding: 0 3px 0 3px !important;
    border-left: 1px solid #eee;
}

html.dark .tox .tox-toolbar__group:not(:first-child) {
    border-left: 1px solid #2a2a2a;
}

/* toolbar bakgrund */
html.dark .tox .tox-editor-header,
html.dark .tox .tox-toolbar,
html.dark .tox .tox-toolbar__primary {
    background: #1e1e1e !important;
    border-bottom: 1px solid #2a2a2a !important;
    padding-bottom: 3px !important;
}

/* knappar */
html.dark .tox .tox-tbtn {
    background: transparent !important;
    color: #e5e5e5 !important;
}

    /* hover */
html.dark .tox .tox-tbtn:hover {
    background: #2a2a2a !important;
}

/* aktiv knapp */
html.dark .tox .tox-tbtn--enabled,
html.dark .tox .tox-tbtn--active {
    background: #333 !important;
}

/* dropdown (Paragraph) */
.htmldark .tox .tox-tbtn--select {
    background: #1e1e1e !important;
    color: #e5e5e5 !important;
}

/* ikoner */
html.dark .tox .tox-tbtn svg {
    fill: #e5e5e5 !important;
}