/*
 * MapEditor — светлая тема.
 * Подключается после editor.css и переопределяет переменные,
 * когда у корневого элемента есть класс .me-light.
 */

.me-root.me-light {
    --me-bg: #f4f5f7;
    --me-panel: #ffffff;
    --me-panel-2: #f0f1f4;
    --me-border: #d9dce2;
    --me-text: #23272e;
    --me-text-dim: #69707c;
    --me-accent: #2f6fe4;
    --me-danger: #d64545;

    --me-hover: rgba(35, 39, 46, 0.06);
    --me-shadow: rgba(24, 28, 35, 0.18);
    --me-accent-soft: #7aa7f5;
    --me-cell-bg: #f6f7f9;
    --me-cell-border: #dde0e6;
    --me-cell-border-hover: #b8bec8;
    --me-cell-hover-bg: #eef1f5;
    --me-cell-on-bg: rgba(47, 111, 228, 0.12);
    --me-tooltip-bg: #26292f;

    --me-canvas-grid: rgba(35, 39, 46, 0.06);
    --me-canvas-grid-bold: rgba(35, 39, 46, 0.12);
    --me-canvas-section-fill: rgba(35, 39, 46, 0.03);
    --me-canvas-section-stroke: #a9afba;
    --me-canvas-row-label: #7c828d;
    --me-canvas-row-curve: rgba(105, 112, 124, 0.55);
    --me-canvas-hover: rgba(35, 39, 46, 0.45);
    --me-canvas-selection: #2f6fe4;
}


.me-root.me-light .me-btn.me-active,
.me-root.me-light .me-apply-btn:hover {
  color: var(--me-accent);
}

.me-root.me-light .me-tool.me-active,
.me-root.me-light .me-shape-kind.me-active,
.me-root.me-light .me-preview-btn.me-active,
.me-root.me-light .me-readonly-btn.me-active,
.me-root.me-light .me-ctxmenu-item:hover {
    color: #fff;
}

.me-root.me-light .me-btn.me-active:hover,
.me-root.me-light .me-tool.me-active:hover {
    background: var(--me-accent);
    color: #fff;
}

.me-root.me-light .me-buyer-tooltip {
  background: var(--me-tooltip-bg);
  border: 1px solid var(--me-cell-border);
  color: #ffffff;
}