.team-template-thumb-frame {
  min-height: 120px;
}

/* Editor side panels — +20px จากค่าเดิมใน bundle (296 / 312) */
:root {
  --editor-left-dock-width: 316px;
  --editor-right-dock-width: 332px;
}

@media (max-width: 1280px) {
  :root {
    --editor-left-dock-width: 280px;
    --editor-right-dock-width: 300px;
  }
}

.layers-item-actions {
  gap: 2px;
  padding-right: 8px;
}

.layers-list .layers-item {
  cursor: grab;
  transition: background 0.12s ease, border-color 0.12s ease, opacity 0.12s ease;
}

.layers-list .layers-item.is-dragging {
  opacity: 0.45;
  cursor: grabbing;
}

.layers-list .layers-item.drag-over {
  border-color: #a78bfa !important;
  box-shadow: inset 0 0 0 1px rgba(167, 139, 250, 0.55);
  background: rgba(124, 58, 237, 0.18) !important;
}

.layers-drag-handle {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  margin-right: 2px;
  color: #94a3b8;
  font-size: 12px;
  line-height: 1;
  cursor: grab;
  user-select: none;
}

.layers-item-main {
  flex: 1;
  min-width: 0;
}

.team-template-thumb-image {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
}

.team-template-card .team-template-thumb-frame,
.my-template-card .team-template-thumb-frame {
  max-height: 220px;
}

.team-template-thumb-placeholder[data-bridge-thumb="1"] {
  background-color: #1e293b !important;
}

.team-template-thumb-placeholder[data-bridge-thumb="1"] span {
  visibility: hidden;
}

/* คลังร่วม modal — ปุ่มโหลด/แก้ไข/ลบ ขนาดเท่ากัน */
.shared-template-list-modal-grid .my-template-card-actions {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr)) !important;
  gap: 4px !important;
}

.shared-template-list-modal-grid .my-template-card-actions .backend-btn {
  width: 100% !important;
  min-width: 0 !important;
  font-size: 11px !important;
  padding: 5px 6px !important;
  line-height: 1.25 !important;
  white-space: nowrap;
}

.shared-template-list-modal-grid .my-template-card-actions .template-use-btn {
  flex: unset !important;
}

/* เทมเพลตของฉัน — ปุ่มใช้เทมเพลต / เผยแพร่ / ลบ แถวเดียว ตัวอักษรเล็ก */
.my-templates-panel .my-template-card-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 4px !important;
}

.my-templates-panel .my-template-card-actions .backend-btn {
  flex: 1 1 calc(33% - 4px) !important;
  min-width: 52px !important;
  width: auto !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  padding: 5px 4px !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.my-templates-panel .my-template-card-actions .template-use-btn {
  flex: 1.15 1 0 !important;
}

.my-templates-panel .my-template-card-actions .ip-user-publish-btn,
.my-templates-panel .my-template-card-actions .ip-user-unpublish-btn {
  flex: 0.85 1 0 !important;
  font-size: 10px !important;
  padding: 5px 4px !important;
}

.my-templates-panel .my-template-card-actions .ip-user-unpublish-btn {
  color: #fde68a !important;
  border-color: rgba(245, 158, 11, 0.45) !important;
}

.my-templates-panel .my-template-card-actions .my-template-delete-btn {
  flex: 0.65 1 0 !important;
}

/* modal compact thumb — ใช้อัตราส่วน canvas จริง ไม่บีบเป็น 168px คงที่ */
.shared-template-list-modal-grid .team-template-card.is-compact-thumb .team-template-thumb-frame.is-compact {
  width: 100% !important;
  height: auto !important;
  max-height: 220px !important;
  min-height: 0 !important;
  aspect-ratio: unset;
}

.shared-template-list-modal-grid .team-template-thumb-image {
  object-fit: contain !important;
  object-position: center center !important;
}

[data-canvas-inner] img {
  background: transparent !important;
}