/**
 * Editor UI density — yalnızca chrome.
 * Canvas / zoom / export ölçüleri bu dosyadan etkilenmez.
 */

html[data-awp-ui-density="compact"] {
  --awp-studio-icon-toolbar: 18px;
  --awp-studio-icon-sm: 16px;
  --awp-studio-icon-tool: 20px;
  --awp-studio-hit-toolbar: 34px;
  --popover-padding: 8px;
}

.awp-studio-root,
.awp-slider-studio {
  --ui-scale: 1;
  --control-height: 40px;
  --icon-size: 22px;
  --toolbar-height: 48px;
  --panel-width: 320px;
  --panel-padding: 12px;
  --control-gap: 8px;
  --popover-padding: 10px;
  --selection-handle-size: 9px;
  --selection-rotate-size: 28px;
  --awp-studio-dock-gap: 0px;
  --awp-studio-chrome-row-height: 48px;
  --awp-studio-tools-rail-width: 58px;
  --awp-studio-rail-btn-size: 40px;
  --awp-studio-rail-btn-gap: 6px;
  --awp-studio-rail-group-gap: 12px;
  --awp-studio-rail-icon-size: 22px;
  --awp-studio-icon-toolbar: 22px;
  --awp-studio-icon-tool: 25px;
  --awp-studio-hit-toolbar: 38px;
  --awp-studio-ctx-control-h: 32px;
  --awp-studio-left-rail-width: 76px;
  overflow: hidden;
}

/* Tasarım stüdyosu: slider compact yoğunluğundan bağımsız (eski chrome) */
.awp-product-studio-mode.awp-studio-root,
html[data-awp-ui-density="compact"] .awp-product-studio-mode.awp-studio-root {
  --ui-scale: 1;
  --control-height: 40px;
  --icon-size: 22px;
  --toolbar-height: 48px;
  --panel-width: 320px;
  --panel-padding: 12px;
  --control-gap: 8px;
  --popover-padding: 10px;
  --selection-handle-size: 9px;
  --selection-rotate-size: 28px;
  --awp-studio-chrome-row-height: 48px;
  --awp-studio-tools-rail-width: 58px;
  --awp-studio-rail-btn-size: 40px;
  --awp-studio-rail-btn-gap: 6px;
  --awp-studio-rail-group-gap: 12px;
  --awp-studio-rail-icon-size: 22px;
  --awp-studio-icon-toolbar: 22px;
  --awp-studio-icon-sm: 18px;
  --awp-studio-icon-tool: 25px;
  --awp-studio-hit-toolbar: 38px;
  --awp-studio-ctx-control-h: 32px;
  --awp-studio-left-rail-width: 88px;
}

/* Compact: ~0.75 chrome; hit-area ikon görselinden büyük kalır — yalnız slider */
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"],
html[data-awp-ui-density="compact"] .awp-studio-root:not(.awp-product-studio-mode) {
  --ui-scale: 0.75;
  --control-height: 32px;
  --icon-size: 18px;
  --toolbar-height: 38px;
  --panel-width: 292px;
  --panel-padding: 8px;
  --control-gap: 6px;
  --popover-padding: 8px;
  --selection-handle-size: 7px;
  --selection-rotate-size: 22px;
  --awp-studio-chrome-row-height: 38px;
  --awp-studio-tools-rail-width: 50px;
  --awp-studio-rail-btn-size: 34px;
  --awp-studio-rail-btn-gap: 6px;
  --awp-studio-rail-group-gap: 8px;
  --awp-studio-rail-icon-size: 18px;
  --awp-studio-icon-toolbar: 18px;
  --awp-studio-icon-sm: 16px;
  --awp-studio-icon-tool: 20px;
  --awp-studio-hit-toolbar: 34px;
  --awp-studio-ctx-control-h: 28px;
  --awp-studio-left-rail-width: 66px;
}

@media (pointer: coarse) {
  .awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] {
    --awp-studio-hit-toolbar: 36px;
    --awp-studio-rail-btn-size: 36px;
    --awp-studio-tools-rail-width: 50px;
  }
}

/* JS yokken: orta ekran / kısa yükseklik / tablet pointer */
@media (min-width: 769px) and (max-width: 1440px) {
  .awp-studio-root:not(.awp-product-studio-mode):not([data-ui-density="normal"]):not([data-ui-density="mobile"]) {
    --ui-scale: 0.75;
    --control-height: 32px;
    --icon-size: 18px;
    --toolbar-height: 38px;
    --panel-width: 292px;
    --panel-padding: 8px;
    --control-gap: 6px;
    --popover-padding: 8px;
    --selection-handle-size: 7px;
    --selection-rotate-size: 22px;
    --awp-studio-chrome-row-height: 38px;
    --awp-studio-tools-rail-width: 50px;
    --awp-studio-rail-btn-size: 34px;
    --awp-studio-rail-btn-gap: 6px;
    --awp-studio-rail-group-gap: 8px;
    --awp-studio-rail-icon-size: 18px;
    --awp-studio-icon-toolbar: 18px;
    --awp-studio-icon-tool: 20px;
    --awp-studio-hit-toolbar: 34px;
    --awp-studio-ctx-control-h: 28px;
    --awp-studio-left-rail-width: 66px;
  }
}

@media (min-width: 769px) and (max-height: 900px) {
  .awp-studio-root:not(.awp-product-studio-mode):not([data-ui-density="normal"]):not([data-ui-density="mobile"]) {
    --ui-scale: 0.75;
    --awp-studio-chrome-row-height: 38px;
    --awp-studio-tools-rail-width: 50px;
    --awp-studio-rail-btn-size: 34px;
    --awp-studio-rail-icon-size: 18px;
    --awp-studio-icon-toolbar: 18px;
    --awp-studio-hit-toolbar: 34px;
    --awp-studio-ctx-control-h: 28px;
    --selection-handle-size: 7px;
    --selection-rotate-size: 22px;
    --panel-padding: 8px;
    --control-gap: 6px;
  }
}

@media (pointer: coarse) and (min-width: 769px) and (max-width: 1920px) and (max-height: 1400px) {
  .awp-studio-root:not(.awp-product-studio-mode):not([data-ui-density="normal"]):not([data-ui-density="mobile"]) {
    --ui-scale: 0.75;
    --awp-studio-chrome-row-height: 38px;
    --awp-studio-tools-rail-width: 50px;
    --awp-studio-rail-btn-size: 36px;
    --awp-studio-rail-icon-size: 18px;
    --awp-studio-hit-toolbar: 36px;
    --awp-studio-ctx-control-h: 28px;
    --selection-handle-size: 7px;
    --selection-rotate-size: 22px;
  }
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-right-panel-wrap {
  left: var(--awp-studio-left-rail-width, 88px);
}

/* ——— Dock: dikey ray + açılan panel bitişik ——— */
.awp-product-studio-mode .awp-ps-flyouts,
.awp-product-studio-mode .awp-ps-color-flyouts,
.awp-product-studio-mode .awp-ps-keys-palette-host .awp-ps-guide-settings-panel,
.awp-product-studio-mode .awp-studio-tools-rail > .awp-ps-guide-settings-panel {
  right: calc(100% + var(--awp-studio-dock-gap, 0px)) !important;
}

.awp-product-studio-mode .awp-ps-flyout,
.awp-product-studio-mode .awp-ps-color-palette-panel.is-open {
  border-right: none;
  box-shadow: -2px 0 10px rgba(15, 23, 42, 0.06);
}

/* ——— Compact chrome ——— */
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-contextual-bar,
html[data-awp-ui-density="compact"] .awp-studio-contextual-bar {
  padding-left: 10px;
  padding-right: 10px;
  gap: var(--control-gap, 6px);
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-contextual-bar .awp-studio-toolbar-icon,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-contextual-bar .awp-studio-ctx-format {
  width: var(--awp-studio-ctx-control-h);
  height: var(--awp-studio-ctx-control-h);
  min-width: var(--awp-studio-hit-toolbar);
  min-height: var(--awp-studio-ctx-control-h);
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-contextual-bar .awp-studio-ctx-font-picker,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-contextual-bar .awp-studio-ctx-font,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-contextual-bar .awp-studio-ctx-effect,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-contextual-bar .awp-studio-font-picker-trigger {
  height: var(--awp-studio-ctx-control-h) !important;
  min-height: var(--awp-studio-ctx-control-h) !important;
  font-size: 12px !important;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-contextual-bar input[type="number"],
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-contextual-bar .awp-studio-ctx-size {
  height: var(--awp-studio-ctx-control-h);
  min-height: var(--awp-studio-ctx-control-h);
  font-size: 12px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-ps-fs-chrome {
  min-height: 40px;
  padding-left: 10px;
  padding-right: 10px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-device-nav {
  gap: 8px;
  padding: 4px 8px;
  margin-top: 4px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-device-nav-btn {
  padding: 4px 8px;
  min-height: 32px;
  font-size: 11px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-right-panel-content,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-properties-content {
  padding: var(--panel-padding);
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-prop-group-header {
  padding-top: 6px;
  padding-bottom: 4px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-prop-btn,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-align-chip,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-format-toggle,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-stroke-style-btn:not(.awp-studio-stroke-join-btn),
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-effect-chip {
  min-height: 28px;
  padding: 4px 6px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-stroke-style-btn:not(.awp-studio-stroke-join-btn) {
  height: 28px;
  padding: 0;
}

@media (pointer: coarse) {
  .awp-studio-root .awp-studio-stroke-style-btn:not(.awp-studio-stroke-join-btn),
  .awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-stroke-style-btn:not(.awp-studio-stroke-join-btn) {
    min-height: 44px;
    height: 44px;
  }
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-prop-select-trigger,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-right-panel input:not([type="color"]):not([type="checkbox"]):not([type="range"]),
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-right-panel select {
  min-height: 30px;
  height: 30px;
  font-size: 12px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-publish-panel select.awp-studio-select,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-publish-panel input.awp-studio-select {
  min-height: 42px;
  height: 42px;
  font-size: 13px;
  line-height: 1.45;
  padding: 8px 32px 8px 12px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-publish-panel input.awp-studio-select {
  padding-right: 12px;
}

html[data-awp-ui-density="compact"] .awp-studio-font-picker-panel,
html[data-awp-ui-density="compact"] .awp-studio-prop-select-menu,
html[data-awp-ui-density="compact"] .awp-studio-context-menu {
  padding: var(--popover-padding, 8px);
  font-size: 12px;
}

html[data-awp-ui-density="compact"] .awp-studio-font-picker-panel button,
html[data-awp-ui-density="compact"] .awp-studio-prop-select-menu button {
  min-height: 30px;
  padding: 4px 8px;
}

@media (min-width: 1181px) {
  .awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-left-toolbar {
    width: var(--awp-studio-left-rail-width) !important;
    min-width: var(--awp-studio-left-rail-width) !important;
    flex-basis: var(--awp-studio-left-rail-width) !important;
    padding: 6px 3px !important;
    gap: 4px !important;
  }

  .awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-right-panel {
    width: min(var(--panel-width), 28vw) !important;
    min-width: 0;
    max-width: 320px;
  }

  .awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"]
    .awp-studio-right-panel-wrap.awp-studio-right-panel--closed
    .awp-studio-right-panel {
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    flex: 0 0 0 !important;
  }
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-icon {
  width: var(--awp-studio-icon-toolbar);
  height: var(--awp-studio-icon-toolbar);
}

/* Selection handles: yalnızca görsel; bbox geometrisi aynı */
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle {
  width: var(--selection-handle-size);
  height: var(--selection-handle-size);
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.top-left,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.top-right,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.bottom-left,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.bottom-right {
  top: auto;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.top-left {
  top: -3.5px;
  left: -3.5px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.top-right {
  top: -3.5px;
  right: -3.5px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.bottom-left {
  bottom: -3.5px;
  left: -3.5px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.bottom-right {
  bottom: -3.5px;
  right: -3.5px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.left,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.right {
  width: 4px;
  height: 11px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.left {
  left: -2px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.right {
  right: -2px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.top,
.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.bottom {
  width: 11px;
  height: 4px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.top {
  top: -2px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-resize-handle.bottom {
  bottom: -2px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-selection-rotate {
  width: var(--selection-rotate-size);
  height: var(--selection-rotate-size);
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-selection-float-toolbar {
  padding: 3px 4px;
  gap: 2px;
}

.awp-studio-root:not(.awp-product-studio-mode)[data-ui-density="compact"] .awp-studio-selection-float-toolbar .awp-studio-toolbar-icon {
  width: var(--awp-studio-rail-btn-size);
  height: var(--awp-studio-rail-btn-size);
  min-width: var(--awp-studio-hit-toolbar);
  min-height: var(--awp-studio-hit-toolbar);
}

/* Mobile density: mevcut 768 layout’a dokunma */
.awp-studio-root[data-ui-density="mobile"] {
  --awp-studio-dock-gap: 0px;
}

.awp-studio-root[data-ui-density="mobile"] .awp-studio-selection-more,
.awp-studio-root[data-ui-density="mobile"] .awp-studio-selection-chrome-cluster .awp-studio-selection-rotate {
  width: 36px;
  height: 36px;
  min-width: 36px;
  min-height: 36px;
}

/* Slider (admin) chrome: ürün stüdyosu yoğunluğuna yaklaştır */
.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-left-toolbar {
  width: var(--awp-studio-left-rail-width, 76px) !important;
  min-width: var(--awp-studio-left-rail-width, 76px) !important;
  flex-basis: var(--awp-studio-left-rail-width, 76px) !important;
  padding: 8px 5px 10px !important;
  gap: 4px !important;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-left-toolbar > .awp-studio-toolbar-icon {
  min-height: 48px !important;
  padding: 6px 3px 5px !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 3px !important;
  gap: 2px !important;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-left-toolbar > .awp-studio-toolbar-icon:hover {
  border-radius: 3px !important;
  background: rgba(255, 255, 255, 0.14) !important;
  color: #fff !important;
  box-shadow: none !important;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-left-toolbar > .awp-studio-toolbar-icon[aria-pressed="true"] {
  border-radius: 3px !important;
  background: #4f46e5 !important;
  color: #fff !important;
  box-shadow: none !important;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-left-toolbar .dashicons,
.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-left-toolbar .awp-studio-rail-svg {
  width: 18px !important;
  height: 18px !important;
  font-size: 18px !important;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-rail-label {
  font-size: 7.5px !important;
  line-height: 1.1 !important;
  flex-basis: 2em !important;
  height: 2em !important;
  max-height: 2em !important;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-right-panel-title {
  font-size: 13px !important;
  letter-spacing: 0.01em;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-right-panel-content,
.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-properties-content {
  padding: 8px 10px !important;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-prop-group {
  margin-bottom: 6px;
  gap: 4px;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-prop-group-body {
  gap: 5px;
  padding-top: 5px;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-prop-group-header {
  height: 26px;
  padding: 0 6px;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-prop-group-title {
  font-size: 9px;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-properties-content .awp-studio-label {
  font-size: 9px;
  margin-bottom: 1px;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-effect-chips {
  gap: 3px;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-effect-chip {
  height: 26px;
  font-size: 10px;
  padding: 0 4px;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-prop-hint {
  font-size: 10px;
  line-height: 1.3;
  margin: 2px 0 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-prop-hint[hidden],
.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-publish-optional[hidden],
.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-publish-panel .awp-studio-prop-hint[hidden] {
  display: none !important;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-publish-panel .awp-studio-prop-hint {
  display: block;
  -webkit-line-clamp: unset;
  line-clamp: unset;
  overflow: visible;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-animation-content .awp-studio-animation-group {
  margin-bottom: 10px;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-animation-content .awp-studio-label {
  font-size: 10px;
  margin-bottom: 3px;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-animation-content .awp-studio-select {
  font-size: 12px;
  padding: 5px 8px;
  min-height: 32px;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-right-panel .button,
.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-animation-replay {
  min-height: 30px;
  height: auto;
  padding: 5px 10px;
  line-height: 1.2;
  border-radius: 8px;
  box-shadow: none;
  text-shadow: none;
  font-size: 12px;
}
