.ayzal-lnc { max-width: 1100px; margin: 0 auto; padding: 20px 0; }
.ayzal-lnc__title { font-size: 22px; font-weight: 600; margin: 0 0 16px; color: #111827; }
.ayzal-lnc__layout { display: flex; gap: 24px; flex-wrap: wrap; align-items: flex-start; }

.ayzal-lnc__stage-wrap { flex: 1 1 500px; min-width: 320px; }
.ayzal-lnc__view-tabs { display: flex; gap: 8px; margin-bottom: 10px; }
.ayzal-lnc__view-tab { padding: 8px 18px; border: 1px solid #d9dee5; background: #f7f8fa; border-radius: 8px; cursor: pointer; font-size: 13px; font-weight: 600; color: #374151; }
.ayzal-lnc__view-tab.is-active { background: #111827; border-color: #111827; color: #fff; }

.ayzal-lnc__stage { position: relative; width: 100%; min-height: 480px; display: none; align-items: center; justify-content: center; overflow: hidden; background: #f7f8fa; border: 1px solid #edf0f3; border-radius: 12px; }
.ayzal-lnc__stage.is-active { display: flex; }
.ayzal-lnc__base-image { max-width: 100%; max-height: 480px; object-fit: contain; }
.ayzal-lnc__placeholder { color: #9aa2af; font-size: 14px; }

.ayzal-lnc__overlay { position: absolute; cursor: grab; touch-action: none; }
.ayzal-lnc__overlay:active { cursor: grabbing; }
.ayzal-lnc__overlay.is-selected { outline: 2px dashed #2563eb; outline-offset: 4px; }
.ayzal-lnc__overlay--logo { width: 15%; }
.ayzal-lnc__overlay--logo img { width: 100%; display: block; pointer-events: none; }
.ayzal-lnc__overlay--text span { white-space: nowrap; font-weight: 600; color: #111827; pointer-events: none; }
.ayzal-lnc__resize-handle { position: absolute; right: -8px; bottom: -8px; width: 16px; height: 16px; border-radius: 50%; background: #2563eb; border: 2px solid #fff; cursor: nwse-resize; display: none; }
.ayzal-lnc__overlay.is-selected .ayzal-lnc__resize-handle { display: block; }

.ayzal-lnc__sidebar { flex: 1 1 300px; min-width: 260px; }
.ayzal-lnc__section { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #e3e6ea; }
.ayzal-lnc__section h3 { font-size: 15px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; margin: 0 0 10px; color: #111827; }
.ayzal-lnc__field { margin-bottom: 10px; }
.ayzal-lnc__field label { display: block; margin-bottom: 4px; font-size: 12px; font-weight: 600; color: #374151; }
.ayzal-lnc__field select { display: block; width: 100%; padding: 9px 10px; border: 1px solid #d9dee5; border-radius: 8px; background: #fff; font-size: 13px; }

.ayzal-lnc__text-input { display: block; width: 100%; margin-bottom: 8px; padding: 9px 10px; border: 1px solid #d9dee5; border-radius: 8px; font-size: 13px; }
.ayzal-lnc__help { font-size: 11px; color: #9aa2af; margin: 6px 0 10px; }

.ayzal-lnc__btn { display: block; width: 100%; padding: 10px 16px; border: 1px solid #d9dee5; background: #f7f8fa; color: #374151; font-size: 13px; font-weight: 600; border-radius: 8px; cursor: pointer; margin-bottom: 8px; }
.ayzal-lnc__btn:hover { background: #eef3f8; }
.ayzal-lnc__btn--primary { background: #111827; border-color: #111827; color: #fff; text-transform: uppercase; letter-spacing: 0.03em; font-weight: 700; padding: 13px 16px; }
.ayzal-lnc__btn--primary:hover { background: #272f3d; }
.ayzal-lnc__btn--primary:disabled { opacity: 0.65; cursor: default; }

.ayzal-lnc__item-list { margin-top: 8px; }
.ayzal-lnc__item-row { display: flex; align-items: center; gap: 6px; padding: 6px 0; font-size: 12px; color: #374151; flex-wrap: wrap; }
.ayzal-lnc__item-row span { flex: 1 1 auto; }
.ayzal-lnc__item-remove { border: 1px solid #d9dee5; background: #fff; border-radius: 6px; padding: 3px 8px; font-size: 11px; cursor: pointer; color: #374151; }

.ayzal-lnc__message { margin: 10px 0 0; font-size: 13px; line-height: 1.5; min-height: 1em; }
.ayzal-lnc__message.is-success { color: #15803d; }
.ayzal-lnc__message.is-error { color: #b91c1c; }

.ayzal-logo-customizer-cta { margin: 16px 0; }
.ayzal-logo-customizer-cta__btn { display: inline-block; padding: 11px 20px; background: #111827; color: #fff !important; border-radius: 8px; text-decoration: none; font-weight: 600; }
.ayzal-logo-customizer-cta__btn:hover { background: #272f3d; }

@media (max-width: 780px) {
    .ayzal-lnc__stage { min-height: 320px; }
    .ayzal-lnc__base-image { max-height: 320px; }
}
