:root {
  --awp-studio-icon-xs: 16px;
  --awp-studio-icon-sm: 18px;
  --awp-studio-icon-toolbar: 22px;
  --awp-studio-icon-tool: 25px;
  --awp-studio-icon-large: 30px;
  --awp-studio-hit-toolbar: 38px;
  --awp-studio-hit-tool: 46px;
  --awp-studio-icon-fg: currentColor;
  --awp-studio-icon-active-bg: rgba(82, 88, 228, 0.16);
  --awp-studio-icon-active: #5258e4;
  --awp-studio-icon-danger: #dc2626;
}

.awp-studio-icon {
  display: block;
  width: var(--awp-studio-icon-toolbar);
  height: var(--awp-studio-icon-toolbar);
  flex: 0 0 auto;
  overflow: visible;
  color: var(--awp-studio-icon-fg);
  pointer-events: none;
  stroke-width: 1.5;
  shape-rendering: geometricPrecision;
}

.awp-studio-icon--color {
  stroke: none;
}

.awp-studio-icon--xs {
  width: var(--awp-studio-icon-xs);
  height: var(--awp-studio-icon-xs);
}

.awp-studio-icon--sm {
  width: var(--awp-studio-icon-sm);
  height: var(--awp-studio-icon-sm);
}

.awp-studio-icon--tool {
  width: var(--awp-studio-icon-tool);
  height: var(--awp-studio-icon-tool);
}

.awp-studio-icon--large {
  width: var(--awp-studio-icon-large);
  height: var(--awp-studio-icon-large);
}

img.awp-studio-icon--custom {
  object-fit: contain;
  object-position: center;
  stroke-width: 0;
  color: inherit;
}

.awp-studio-icon-button,
.awp-studio-toolbar-icon,
.awp-ps-guide-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.awp-studio-toolbar-group .awp-studio-toolbar-icon,
.awp-studio-align-toolbar .awp-studio-toolbar-icon,
.awp-ps-guide-btn {
  min-width: var(--awp-studio-hit-toolbar);
  min-height: var(--awp-studio-hit-toolbar);
}

.awp-studio-icon--tool,
.awp-studio-icon--large {
  stroke-width: 1.65;
}

.awp-studio-left-toolbar > .awp-studio-toolbar-icon .awp-studio-icon {
  width: var(--awp-studio-rail-btn-icon-size, var(--awp-studio-icon-tool));
  height: var(--awp-studio-rail-btn-icon-size, var(--awp-studio-icon-tool));
  flex: 0 0 var(--awp-studio-rail-btn-icon-size, var(--awp-studio-icon-tool));
  margin-inline: auto;
  stroke-width: 1.5;
}

.awp-studio-toolbar-icon:hover:not(:disabled):not(.awp-studio-float-color),
.awp-ps-guide-btn:hover:not(:disabled) {
  color: #334155;
  background: rgba(82, 88, 228, 0.09);
}

.awp-studio-toolbar-icon[aria-pressed="true"],
.awp-studio-toolbar-icon.is-active,
.awp-ps-guide-btn[aria-pressed="true"],
.awp-ps-guide-btn.is-active {
  color: var(--awp-studio-icon-active);
  background: var(--awp-studio-icon-active-bg);
  box-shadow: inset 0 0 0 1px rgba(82, 88, 228, 0.24);
}

/* Sağ araç rayı: bankacılık tarzı soft mavi hover / parlak turuncu aktif */
.awp-product-studio-mode .awp-studio-tools-rail .awp-studio-toolbar-icon:hover:not(:disabled),
.awp-product-studio-mode .awp-studio-tools-rail .awp-ps-guide-btn:hover:not(:disabled) {
  color: #fff !important;
  background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.28) inset,
    0 2px 6px rgba(37, 99, 235, 0.28) !important;
}

.awp-product-studio-mode .awp-studio-tools-rail .awp-studio-toolbar-icon[aria-pressed="true"],
.awp-product-studio-mode .awp-studio-tools-rail .awp-studio-toolbar-icon.is-active,
.awp-product-studio-mode .awp-studio-tools-rail .awp-ps-guide-btn[aria-pressed="true"],
.awp-product-studio-mode .awp-studio-tools-rail .awp-ps-guide-btn.is-active {
  color: #fff !important;
  background: linear-gradient(180deg, #fb923c 0%, #f97316 55%, #ea580c 100%) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.35) inset,
    0 2px 8px rgba(234, 88, 12, 0.32) !important;
}

.awp-studio-root:not(.awp-product-studio-mode) .awp-studio-left-toolbar > .awp-studio-toolbar-icon[aria-pressed="true"] {
  color: #fff;
  background: rgba(255, 255, 255, 0.13);
  box-shadow: inset 2px 0 0 rgba(255, 255, 255, 0.82);
}

.awp-studio-toolbar-icon:disabled,
.awp-ps-guide-btn:disabled,
.awp-studio-icon-button:disabled {
  opacity: 0.42;
  color: #64748b;
  cursor: not-allowed;
}

#awp-ps-tool-delete:hover:not(:disabled),
[data-studio-action="delete"]:hover:not(:disabled),
[data-action="delete"]:hover:not(:disabled),
.awp-studio-icon-button--danger:hover:not(:disabled) {
  color: var(--awp-studio-icon-danger);
  background: rgba(220, 38, 38, 0.09);
}

@media (max-width: 768px), (pointer: coarse) {
  .awp-studio-toolbar-group .awp-studio-toolbar-icon,
  .awp-studio-align-toolbar .awp-studio-toolbar-icon,
  .awp-ps-guide-btn,
  .awp-studio-icon-button {
    min-width: 44px;
    min-height: 44px;
  }

  .awp-studio-toolbar-group .awp-studio-icon,
  .awp-ps-guide-btn .awp-studio-icon {
    width: 24px;
    height: 24px;
  }

  .awp-studio-left-toolbar > .awp-studio-toolbar-icon {
    min-height: 40px;
  }

  .awp-studio-left-toolbar > .awp-studio-toolbar-icon .awp-studio-icon {
    width: var(--awp-studio-rail-btn-icon-size, 22px);
    height: var(--awp-studio-rail-btn-icon-size, 22px);
    flex-basis: var(--awp-studio-rail-btn-icon-size, 22px);
  }
}