.kblad-editor-modal .modal-content {
    height: 100vh;
    overflow: hidden;
}

.kblad-editor-modal .kblad-modal-header {
    min-height: 58px;
}

.kblad-editor-modal .min-w-0 {
    min-width: 0;
}

.kblad-editor-modal .kblad-toolbar {
    background: var(--bs-tertiary-bg, #f8f9fa);
}

.kblad-editor-modal .kblad-color-control {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    height: 31px;
    padding: 0 .45rem;
    border: 1px solid var(--bs-border-color);
    border-radius: .25rem;
    background: var(--bs-body-bg);
    font-size: .8rem;
}

.kblad-editor-modal .kblad-color-control input {
    width: 25px;
    height: 23px;
    padding: 0;
    border: 0;
    background: transparent;
}

.kblad-editor-modal .kblad-formula-bar {
    min-height: 38px;
    background: var(--bs-body-bg);
}

.kblad-editor-modal .kblad-name-box {
    width: 86px;
    padding: .45rem .75rem;
    border-right: 1px solid var(--bs-border-color);
    text-align: center;
    font-weight: 600;
}

.kblad-editor-modal .kblad-fx {
    color: var(--bs-secondary-color);
    font-style: italic;
    font-weight: 600;
}

.kblad-editor-modal .kblad-workspace {
    min-height: 0;
    overflow: hidden;
    background: #fff;
}

.kblad-editor-modal .kblad-grid-wrap {
    width: 100%;
    height: 100%;
    overflow: auto;
    overscroll-behavior: contain;
}

.kblad-editor-modal .kblad-grid {
    table-layout: fixed;
    width: max-content;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    color: #212529;
    background: #fff;
    user-select: none;
}

.kblad-editor-modal .kblad-grid th,
.kblad-editor-modal .kblad-grid td {
    box-sizing: border-box;
}

.kblad-editor-modal .kblad-column-header,
.kblad-editor-modal .kblad-row-header,
.kblad-editor-modal .kblad-corner {
    position: sticky;
    z-index: 3;
    height: 28px;
    padding: 0 .35rem;
    border-right: 1px solid #cfd4da;
    border-bottom: 1px solid #cfd4da;
    background: #f1f3f5;
    color: #59636e;
    text-align: center;
    font-size: .78rem;
    font-weight: 600;
}

.kblad-editor-modal .kblad-column-header {
    top: 0;
}

.kblad-editor-modal .kblad-row-header {
    left: 0;
    z-index: 2;
}

.kblad-editor-modal .kblad-corner {
    top: 0;
    left: 0;
    z-index: 5;
}

.kblad-editor-modal .kblad-column-resize,
.kblad-editor-modal .kblad-row-resize {
    position: absolute;
    z-index: 6;
}

.kblad-editor-modal .kblad-column-resize {
    top: 0;
    right: -3px;
    width: 7px;
    height: 100%;
    cursor: col-resize;
}

.kblad-editor-modal .kblad-row-resize {
    right: 0;
    bottom: -3px;
    width: 100%;
    height: 7px;
    cursor: row-resize;
}

.kblad-editor-modal .kblad-cell {
    position: relative;
    height: inherit;
    min-height: 28px;
    padding: 3px 6px;
    overflow: hidden;
    border-right: 1px solid #e0e3e6;
    border-bottom: 1px solid #e0e3e6;
    white-space: nowrap;
    text-overflow: ellipsis;
    outline: none;
    cursor: cell;
}

.kblad-editor-modal .kblad-cell.kblad-selected {
    background-color: #e7f1ff !important;
}

.kblad-editor-modal .kblad-cell.kblad-active {
    overflow: visible;
    box-shadow: inset 0 0 0 2px #0d6efd;
    z-index: 1;
}

.kblad-editor-modal .kblad-cell.kblad-formula-reference {
    background-color: #d1e7dd !important;
    box-shadow: inset 0 0 0 2px #198754;
}

.kblad-editor-modal .kblad-fill-handle {
    position: absolute;
    right: -3px;
    bottom: -3px;
    z-index: 10;
    width: 9px;
    height: 9px;
    border: 1px solid #fff;
    background: #0d6efd;
    cursor: crosshair;
}

.kblad-editor-modal .kblad-cell.kblad-fill-preview {
    background-color: #cfe2ff !important;
    box-shadow: inset 0 0 0 1px #0d6efd;
}

.kblad-editor-modal .kblad-cell.kblad-cell-bordered {
    box-shadow: inset 0 0 0 1px #343a40;
}

.kblad-editor-modal .kblad-cell.kblad-cell-bordered.kblad-active {
    box-shadow: inset 0 0 0 2px #0d6efd;
}

.kblad-editor-modal .kblad-formula-cell::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    border-top: 5px solid #198754;
    border-left: 5px solid transparent;
}

.kblad-editor-modal .kblad-error-cell {
    color: #dc3545 !important;
}

.kblad-editor-modal .kblad-cell-editor {
    position: absolute;
    inset: 0;
    z-index: 8;
    width: max(100%, 180px);
    min-width: 100%;
    height: 100%;
    padding: 2px 5px;
    border: 2px solid #0d6efd;
    outline: 0;
    background: #fff;
    color: #212529;
}

.kblad-editor-modal .kblad-statusbar {
    min-height: 28px;
    background: var(--bs-tertiary-bg, #f8f9fa);
}

[data-theme="dark"] .kblad-editor-modal .kblad-toolbar,
[data-theme="dark"] .kblad-editor-modal .kblad-statusbar,
[data-theme="dark"] .kblad-editor-modal .kblad-formula-bar {
    background: #202429;
}

@media (max-width: 767.98px) {
    .kblad-editor-modal .kblad-modal-header {
        align-items: flex-start;
        gap: .5rem;
    }

    .kblad-editor-modal .kblad-modal-header .btn {
        padding: .35rem .5rem;
        font-size: .8rem;
    }

    .kblad-editor-modal .kblad-toolbar {
        max-height: 112px;
        overflow-y: auto;
    }
}
