/* ============================================================
   CKEDITOR 5 THEME OVERRIDE
   - Light & Dark Theme Complete Set
   - Works with super-build + CDN + Blazor
   - Just toggle .ck-dark or .ck-light class on wrapper
   ============================================================ */
.ck-editor__editable.ck-content {
    font-size: 15px;
    line-height: 1.6;
}


/* 3) Raise CKEditor floating UI above MudDialog */
.ck.ck-balloon-panel,
.ck.ck-dropdown__panel,
.ck.ck-reset_all[role="dialog"] {
    z-index: 1600 !important;
}


.ck-content h1,
.ck-content h2,
.ck-content h3,
.ck-content h4,
.ck-content h5,
.ck-content h6 {
    margin-top: 0.4em !important; /* varsayılan ~1.2em */
    margin-bottom: 0.3em !important;
    line-height: 1.2 !important; /* daha kompakt görünüm */
}

.ck-content p {
    margin-top: 0.3em !important;
    margin-bottom: 0.3em !important;
    line-height: 1.2 !important; /* varsayılan 1.6 */
}

/* Liste (ul/li) satır boşlukları çok fazlaysa: */
.ck-content li {
    margin-top: 0.2em !important;
    margin-bottom: 0.2em !important;
    line-height: 1.2 !important;
}


/* Sola hizalı tablo */
.ck-content figure.table.align-left {
    margin-left: 0 !important;
    margin-right: auto !important;
}

/* Sağa hizalı tablo */
.ck-content figure.table.align-right {
    margin-left: auto !important;
    margin-right: 0 !important;
}

/* Ortada hizalı tablo (istersen bunu da bırakabilirsin) */
.ck-content figure.table.align-center{
    margin-left: auto !important;
    margin-right: auto !important;
}


.ck-content .ck-table-align-left {
    margin-left: 0 !important;
    margin-right: auto !important;
}

.ck-content .ck-table-align-center {
    margin-left: auto !important;
    margin-right: auto !important;
}

.ck-content .ck-table-align-right {
    margin-left: auto !important;
    margin-right: 0 !important;
}

/* Tabloyu tam genişlik yap (istersen) */
.ck-content table {
    width: 100% !important;
}

    /* Hücre içi padding’i azaltmak istersen: */
    .ck-content table td,
    .ck-content table th {
        padding: 4px 6px;
    }

/* ------------------------------------------------------------
   DEFAULT (Light Theme)
   ------------------------------------------------------------ 
.ck-light {
    --ck-color-base-background: #ffffff;
    --ck-color-base-border: #d1d1d1;
    --ck-color-base-foreground: #fafafa;
    --ck-color-focus-border: #1976d2;
    --ck-color-focus-outer-shadow: rgba(25, 118, 210, 0.1);
    --ck-color-text: #212121;
    --ck-color-shadow-drop: rgba(0, 0, 0, 0.08);
    --ck-color-shadow-inner: rgba(0, 0, 0, 0.12);
    --ck-color-button-default-background: #f0f0f0;
    --ck-color-button-default-hover-background: #e4e4e4;
    --ck-color-button-default-active-background: #d9d9d9;
    --ck-color-button-default-active-shadow: rgba(0, 0, 0, 0.1);
    --ck-color-button-default-disabled-background: #eeeeee;
    --ck-color-button-on-background: #e3f2fd;
    --ck-color-button-on-hover-background: #bbdefb;
    --ck-color-button-on-active-background: #90caf9;
    --ck-color-toolbar-background: #f3f3f3;
    --ck-color-toolbar-border: #cccccc;
    --ck-color-dropdown-panel-background: #ffffff;
    --ck-color-dropdown-panel-border: #dcdcdc;
    --ck-color-input-background: #ffffff;
    --ck-color-input-border: #c1c1c1;
    --ck-color-input-text: #212121;
    --ck-color-widget-blurred-border: #e0e0e0;
    --ck-color-widget-hover-border: #64b5f6;
    --ck-color-widget-editable-focus-background: #e3f2fd;
}

    /* CKEditor editable area for light theme */
   /* .ck-light .ck.ck-editor__main > .ck-editor__editable {
        background-color: #ffffff;
        color: #212121;
        border-color: #cccccc;
    }*/

/* ------------------------------------------------------------
   CKEditor + MudBlazor Theme Bridge
   ------------------------------------------------------------ */

.ck-wrapper {
    --ck-color-base-background: var(--mud-palette-surface);
    --ck-color-base-border: var(--mud-palette-lines-default);
    --ck-color-base-foreground: var(--mud-palette-background);
    --ck-color-focus-border: var(--mud-palette-primary);
    --ck-color-focus-outer-shadow: var(--mud-palette-background-grey);
    --ck-color-text: var(--mud-palette-text-primary);
    --ck-color-shadow-drop: var(--mud-palette-background-grey);
    --ck-color-shadow-inner: var(--mud-palette-background-grey);
    --ck-color-button-default-background: var(--mud-palette-surface);
    --ck-color-button-default-hover-background: var(--mud-palette-action-default-hover);
    --ck-color-button-default-active-background: var(--mud-palette-action-default);
    --ck-color-button-default-active-shadow: var(--mud-palette-background-grey);
    --ck-color-button-default-disabled-background: var(--mud-palette-background-grey);
    --ck-color-button-on-background: var(--mud-palette-primary-hover);
    --ck-color-button-on-hover-background: var(--mud-palette-primary);
    --ck-color-button-on-active-background: var(--mud-palette-primary-darken);
    --ck-color-toolbar-background: var(--mud-palette-surface);
    --ck-color-toolbar-border: var(--mud-palette-lines-default);
    --ck-color-dropdown-panel-background: var(--mud-palette-surface);
    --ck-color-dropdown-panel-border: var(--mud-palette-lines-default);
    --ck-color-input-background: var(--mud-palette-surface);
    --ck-color-input-border: var(--mud-palette-lines-inputs);
    --ck-color-input-text: var(--mud-palette-text-primary);
    --ck-color-widget-blurred-border: var(--mud-palette-lines-default);
    --ck-color-widget-hover-border: var(--mud-palette-primary);
    --ck-color-widget-editable-focus-background: var(--mud-palette-background);
    width: 100%;
}

/* ------------------------------------------------------------
   Light
   ------------------------------------------------------------ */

.ck-light .ck.ck-editor__main > .ck-editor__editable .ck-editor__nested-editable {
    background-color: var(--mud-palette-surface) !important;
    color: var(--mud-palette-text-primary) !important;
    border-color: var(--mud-palette-lines-default) !important;
}

/* ------------------------------------------------------------
   Dark
   ------------------------------------------------------------ */

.ck-dark .ck.ck-editor__main > .ck-editor__editable .ck-editor__nested-editable {
    background-color: var(--mud-palette-surface) !important;
    color: var(--mud-palette-text-primary) !important;
    border-color: var(--mud-palette-lines-default) !important;
}

.ck-dark .ck.ck-toolbar .ck-button {
    color: var(--mud-palette-text-primary) !important;
}

    .ck-dark .ck.ck-toolbar .ck-button:hover {
        background-color: var(--mud-palette-action-default-hover) !important;
    }

.ck-dark .ck-content a {
    color: var(--mud-palette-primary) !important;
}

.ck-dark .ck-content code {
    background-color: var(--mud-palette-background-grey) !important;
    color: var(--mud-palette-warning) !important;
}

.ck-dark .ck-editor__editable {
    scrollbar-color: var(--mud-palette-lines-default) var(--mud-palette-background);
}

/* ------------------------------------------------------------
   Shared refinements
   ------------------------------------------------------------ */

.ck-wrapper .ck.ck-toolbar {
    background-color: var(--ck-color-toolbar-background) !important;
    border-color: var(--ck-color-toolbar-border) !important;
}

.ck-wrapper .ck.ck-button,
.ck-wrapper .ck.ck-button .ck-icon {
    color: var(--mud-palette-text-primary);
}

    .ck-wrapper .ck.ck-button:hover {
        background-color: var(--mud-palette-action-default-hover) !important;
    }

.ck-wrapper .ck.ck-dropdown__panel {
    background-color: var(--ck-color-dropdown-panel-background) !important;
    border-color: var(--ck-color-dropdown-panel-border) !important;
    filter: none !important;
}

.ck-wrapper .ck.ck-input {
    background-color: var(--ck-color-input-background) !important;
    color: var(--ck-color-input-text) !important;
    border-color: var(--ck-color-input-border) !important;
}

.ck-wrapper .ck.ck-list {
    background-color: var(--mud-palette-surface) !important;
    color: var(--mud-palette-text-primary) !important;
}
.ck-dark .ck.ck-toolbar .ck-button,
.ck-dark .ck.ck-toolbar .ck-button:hover,
.ck-dark .ck.ck-toolbar .ck-button:focus,
.ck-dark .ck.ck-toolbar .ck-button:active,
.ck-dark .ck.ck-toolbar .ck-dropdown__button {
    box-shadow: none !important;
}