#ayzal-ent-customizer {
    width: 100%;
    max-width: 1500px;
    margin: 30px auto;
    padding: 20px;
    box-sizing: border-box;
    font-family: Arial, sans-serif;
}

.ayzal-ent-customizer__layout {
    display: grid;
    grid-template-columns: 320px minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}

.ayzal-ent-customizer__sidebar {
    background: #ffffff;
    border: 1px solid #e3e6ea;
    border-radius: 14px;
    padding: 22px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
    position: sticky;
    top: 20px;
}

.ayzal-ent-customizer__title {
    margin: 0 0 20px;
    font-size: 28px;
    line-height: 1.2;
    font-weight: 700;
    color: #111827;
}

.ayzal-ent-customizer__tabs {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.ayzal-ent-tab {
    width: 100%;
    min-height: 48px;
    border: 1px solid #d9dee5;
    border-radius: 9px;
    background: #f7f8fa;
    color: #1f2937;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: 0.2s ease;
}

.ayzal-ent-tab:hover {
    background: #eef3f8;
    border-color: #b9c2cc;
}

.ayzal-ent-tab.is-active {
    background: #111827;
    color: #ffffff;
    border-color: #111827;
}

.ayzal-ent-customizer__preview {
    background: #ffffff;
    border: 1px solid #e3e6ea;
    border-radius: 14px;
    padding: 20px;
    min-height: 650px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
}

.ayzal-ent-dual-preview {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: start;
}

.ayzal-ent-preview-side {
    min-width: 0;
}

.ayzal-ent-preview-label {
    margin: 0 0 12px;
    text-align: center;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: #111827;
}

.ayzal-ent-customizer__stage {
    position: relative;
    width: 100%;
    min-height: 540px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background:
        linear-gradient(45deg, #f7f7f7 25%, transparent 25%),
        linear-gradient(-45deg, #f7f7f7 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, #f7f7f7 75%),
        linear-gradient(-45deg, transparent 75%, #f7f7f7 75%);
    background-size: 24px 24px;
    background-position: 0 0, 0 12px, 12px -12px, -12px 0;
    border: 1px solid #edf0f3;
    border-radius: 12px;
}

.ayzal-ent-customizer__stage--dual {
    min-height: 560px;
}

.ayzal-ent-customizer__stage--dual svg {
    transform: scale(0.94);
    transform-origin: center center;
}

.ayzal-ent-customizer__placeholder {
    font-size: 22px;
    font-weight: 600;
    color: #9ca3af;
    text-align: center;
}

.ayzal-ent-color-panel {
    margin-top: 18px;
}

.ayzal-ent-color-panel h3 {
    margin: 0 0 18px;
    font-size: 22px;
    font-weight: 700;
}

/* Compact suit-color swatch grid */
.ayzal-ent-color-controls {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px 10px;
    align-items: start;
}

.ayzal-ent-color-control {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    min-width: 0;
    margin: 0;
    padding: 0;
}

.ayzal-ent-color-control label {
    display: block;
    max-width: 100%;
    margin: 0;
    color: #374151;
    font-size: 12px;
    line-height: 1.1;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}

.ayzal-ent-color-control input[type="color"] {
    -webkit-appearance: none;
    appearance: none;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    flex: 0 0 36px;
    padding: 0 !important;
    margin: 0 !important;
    border: 1px solid #9ca3af !important;
    border-radius: 50% !important;
    overflow: hidden;
    cursor: pointer !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

.ayzal-ent-color-control input[type="color"]::-webkit-color-swatch-wrapper {
    padding: 2px;
}

.ayzal-ent-color-control input[type="color"]::-webkit-color-swatch {
    border: 0;
    border-radius: 50%;
}

.ayzal-ent-color-control input[type="color"]::-moz-color-swatch {
    border: 0;
    border-radius: 50%;
}

@media (max-width: 1180px) {
    .ayzal-ent-customizer__layout {
        grid-template-columns: 280px minmax(0, 1fr);
    }

    .ayzal-ent-customizer__stage--dual {
        min-height: 470px;
    }
}

@media (max-width: 991px) {
    .ayzal-ent-customizer__layout {
        grid-template-columns: 1fr;
    }

    .ayzal-ent-customizer__sidebar {
        order: 2;
        position: static;
    }

    .ayzal-ent-customizer__preview {
        order: 1;
        min-height: 540px;
    }

    .ayzal-ent-customizer__tabs {
        grid-template-columns: repeat(2, 1fr);
    }

    .ayzal-ent-customizer__stage--dual {
        min-height: 430px;
    }
}

@media (max-width: 700px) {
    .ayzal-ent-dual-preview {
        grid-template-columns: 1fr;
    }

    .ayzal-ent-customizer__stage--dual {
        min-height: 430px;
    }
}

@media (max-width: 600px) {
    #ayzal-ent-customizer {
        padding: 10px;
        margin: 15px auto;
    }

    .ayzal-ent-customizer__sidebar,
    .ayzal-ent-customizer__preview {
        padding: 14px;
        border-radius: 10px;
    }

    .ayzal-ent-customizer__title {
        font-size: 22px;
    }

    .ayzal-ent-customizer__tabs {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }

    .ayzal-ent-tab {
        font-size: 14px;
        min-height: 44px;
    }

    .ayzal-ent-customizer__stage--dual {
        min-height: 360px;
    }

    .ayzal-ent-customizer__placeholder {
        font-size: 20px;
    }
}

/* Suit design gallery */
.ayzal-ent-design-gallery {
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid #e5e7eb;
}

.ayzal-ent-design-gallery__heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.ayzal-ent-design-gallery__heading h3 {
    margin: 0 0 4px;
    color: #111827;
    font-size: 21px;
    line-height: 1.2;
}

.ayzal-ent-design-gallery__heading p {
    margin: 0;
    color: #6b7280;
    font-size: 13px;
}

.ayzal-ent-design-gallery__track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(130px, 160px);
    gap: 12px;
    overflow-x: auto;
    padding: 2px 2px 10px;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
}

.ayzal-ent-design-card {
    scroll-snap-align: start;
    display: grid;
    grid-template-rows: 130px auto;
    gap: 8px;
    min-width: 0;
    padding: 8px;
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    background: #ffffff;
    cursor: pointer;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.ayzal-ent-design-card:hover {
    border-color: #9ca3af;
    transform: translateY(-1px);
}

.ayzal-ent-design-card.is-active {
    border-color: #111827;
    box-shadow: 0 0 0 2px rgba(17, 24, 39, .08);
}

.ayzal-ent-design-card__image {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 8px;
    background:
        linear-gradient(45deg, #f7f7f7 25%, transparent 25%),
        linear-gradient(-45deg, #f7f7f7 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, #f7f7f7 75%),
        linear-gradient(-45deg, transparent 75%, #f7f7f7 75%);
    background-size: 16px 16px;
    background-position: 0 0, 0 8px, 8px -8px, -8px 0;
}

.ayzal-ent-design-card__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.ayzal-ent-design-card__title {
    display: block;
    overflow: hidden;
    color: #1f2937;
    font-size: 12px;
    line-height: 1.25;
    font-weight: 700;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 600px) {
    .ayzal-ent-design-gallery__track {
        grid-auto-columns: minmax(115px, 140px);
    }

    .ayzal-ent-design-card {
        grid-template-rows: 110px auto;
    }
}

/* v0.3.1 mobile-safe inline color palette */
.ayzal-ent-color-swatch {
    -webkit-appearance: none;
    appearance: none;
    width: 36px;
    height: 36px;
    min-width: 36px;
    min-height: 36px;
    padding: 2px;
    margin: 0;
    border: 1px solid #9ca3af;
    border-radius: 50%;
    background: var(--ayzal-swatch-color, #ffffff);
    box-shadow: inset 0 0 0 2px #ffffff, 0 1px 2px rgba(0,0,0,.08);
    cursor: pointer;
    touch-action: manipulation;
}

.ayzal-ent-color-control input[type="hidden"] {
    display: none !important;
}

.ayzal-ent-inline-palette {
    margin-top: 14px;
    padding: 12px;
    border: 1px solid #d9dee5;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(0,0,0,.08);
}

.ayzal-ent-inline-palette[hidden] { display: none !important; }

.ayzal-ent-inline-palette__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.ayzal-ent-inline-palette__title { font-size: 14px; color: #111827; }

.ayzal-ent-inline-palette__close {
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 8px;
    background: #f3f4f6;
    color: #111827;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
}

.ayzal-ent-inline-palette__colors {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 8px;
}

.ayzal-ent-inline-palette__color {
    -webkit-appearance: none;
    appearance: none;
    width: 30px;
    height: 30px;
    margin: auto;
    padding: 0;
    border: 1px solid #9ca3af;
    border-radius: 50%;
    background: var(--ayzal-palette-color);
    cursor: pointer;
    touch-action: manipulation;
}

.ayzal-ent-inline-palette__custom { margin-top: 12px; }
.ayzal-ent-inline-palette__custom > label {
    display: block;
    margin-bottom: 5px;
    font-size: 12px;
    font-weight: 700;
    color: #374151;
}
.ayzal-ent-inline-palette__custom > div {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
}
.ayzal-ent-inline-palette__hex {
    min-width: 0;
    height: 38px;
    padding: 0 10px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 16px;
}
.ayzal-ent-inline-palette__hex[aria-invalid="true"] { border-color: #dc2626; }
.ayzal-ent-inline-palette__apply {
    min-height: 38px;
    padding: 0 14px;
    border: 0;
    border-radius: 8px;
    background: #111827;
    color: #ffffff;
    font-weight: 700;
    cursor: pointer;
}

@media (max-width: 991px) {
    .ayzal-ent-customizer__layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .ayzal-ent-customizer__sidebar {
        order: 1;
        position: static;
        top: auto;
        width: 100%;
        max-width: none;
        box-sizing: border-box;
    }

    .ayzal-ent-customizer__preview {
        order: 2;
        width: 100%;
        min-height: 0;
        box-sizing: border-box;
    }

    .ayzal-ent-color-controls {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    #ayzal-ent-customizer {
        width: 100%;
        max-width: 100%;
        margin: 8px auto 24px;
        padding: 6px;
        overflow: visible;
    }

    .ayzal-ent-customizer__layout {
        display: flex;
        flex-direction: column;
        gap: 10px;
        min-width: 0;
    }

    .ayzal-ent-customizer__sidebar,
    .ayzal-ent-customizer__preview {
        width: 100%;
        min-width: 0;
        margin: 0;
        padding: 12px;
        overflow: visible;
    }

    .ayzal-ent-customizer__title {
        font-size: 20px;
        margin-bottom: 12px;
    }

    .ayzal-ent-customizer__tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
    }

    .ayzal-ent-tab {
        min-width: 0;
        min-height: 42px;
        padding: 6px;
        font-size: 13px;
    }

    .ayzal-ent-color-panel {
        margin-top: 14px;
    }

    .ayzal-ent-color-panel h3 {
        margin-bottom: 12px;
        font-size: 20px;
    }

    .ayzal-ent-color-controls {
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 10px 6px;
    }

    .ayzal-ent-color-swatch {
        width: 34px;
        height: 34px;
        min-width: 34px;
        min-height: 34px;
    }

    .ayzal-ent-color-control label {
        font-size: 11px;
    }

    /* Keep front and back compact on mobile instead of creating a very tall page. */
    .ayzal-ent-dual-preview {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .ayzal-ent-preview-label {
        margin-bottom: 6px;
        font-size: 13px;
        letter-spacing: .04em;
    }

    .ayzal-ent-customizer__stage,
    .ayzal-ent-customizer__stage--dual {
        min-height: 290px;
        height: 290px;
        border-radius: 8px;
    }

    .ayzal-ent-customizer__stage--dual svg {
        transform: none;
        max-height: 285px !important;
    }

    .ayzal-ent-design-gallery {
        margin-top: 14px;
        padding-top: 14px;
    }

    .ayzal-ent-design-gallery__heading {
        display: block;
        margin-bottom: 10px;
    }

    .ayzal-ent-design-gallery__heading h3 { font-size: 18px; }
    .ayzal-ent-design-gallery__track {
        width: 100%;
        max-width: 100%;
        grid-auto-columns: 120px;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
    }

    .ayzal-ent-inline-palette__colors {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
}

@media (max-width: 420px) {
    .ayzal-ent-customizer__sidebar,
    .ayzal-ent-customizer__preview {
        padding: 9px;
    }

    .ayzal-ent-color-controls {
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 8px 4px;
    }

    .ayzal-ent-color-swatch {
        width: 31px;
        height: 31px;
        min-width: 31px;
        min-height: 31px;
    }

    .ayzal-ent-customizer__stage,
    .ayzal-ent-customizer__stage--dual {
        min-height: 250px;
        height: 250px;
    }

    .ayzal-ent-customizer__stage--dual svg { max-height: 245px !important; }
}

/* Logo Module v0.4.0 */
.ayzal-ent-tool-panel {
    margin-top: 18px;
}

.ayzal-ent-tool-panel[hidden] {
    display: none !important;
}

.ayzal-ent-tool-panel h3 {
    margin: 0 0 8px;
    color: #111827;
    font-size: 22px;
}

.ayzal-ent-tool-help,
.ayzal-ent-logo-tip {
    margin: 0 0 14px;
    color: #6b7280;
    font-size: 12px;
    line-height: 1.45;
}

.ayzal-ent-logo-upload {
    display: grid;
    gap: 8px;
    margin-bottom: 14px;
}

.ayzal-ent-logo-file-name {
    display: block;
    color: #6b7280;
    font-size: 11px;
    line-height: 1.3;
    word-break: break-word;
}

.ayzal-ent-tool-field {
    display: grid;
    gap: 7px;
    margin: 0 0 14px;
    color: #374151;
    font-size: 13px;
    font-weight: 700;
}

.ayzal-ent-tool-field select,
.ayzal-ent-tool-field input[type="range"] {
    width: 100%;
}

.ayzal-ent-tool-field select {
    min-height: 42px;
    padding: 0 10px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    background: #fff;
    color: #111827;
}

.ayzal-ent-tool-button {
    min-height: 42px;
    padding: 9px 13px;
    border: 1px solid #111827;
    border-radius: 8px;
    background: #111827;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
}

.ayzal-ent-tool-button--secondary {
    background: #fff;
    color: #111827;
    border-color: #cbd5e1;
}

.ayzal-ent-tool-button--danger {
    background: #fff;
    color: #b91c1c;
    border-color: #fecaca;
}

.ayzal-ent-logo-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 12px;
}

.ayzal-ent-logo-overlay {
    position: absolute;
    z-index: 20;
    transform: translate(-50%, -50%);
    touch-action: none;
    cursor: grab;
    user-select: none;
    filter: drop-shadow(0 1px 1px rgba(0,0,0,.18));
}

.ayzal-ent-logo-overlay:active {
    cursor: grabbing;
}

.ayzal-ent-logo-overlay img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 100%;
    object-fit: contain;
    pointer-events: none;
    user-select: none;
}

@media (max-width: 600px) {
    .ayzal-ent-logo-actions {
        grid-template-columns: 1fr;
    }
}


/* Multi Logo Module v0.4.1 */
.ayzal-ent-logo-list{display:grid;gap:7px;margin:10px 0 14px;max-height:150px;overflow:auto}
.ayzal-ent-logo-list-item{display:flex;align-items:center;gap:8px;width:100%;padding:6px 8px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#111827;text-align:left;cursor:pointer}
.ayzal-ent-logo-list-item.is-active{border-color:#111827;box-shadow:0 0 0 1px #111827}
.ayzal-ent-logo-list-item img{width:32px;height:32px;object-fit:contain;background:#f8fafc;border-radius:5px}
.ayzal-ent-logo-list-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:700}
.ayzal-ent-logo-overlay.is-selected{outline:2px dashed #2563eb;outline-offset:4px}
.ayzal-ent-logo-actions{grid-template-columns:1fr 1fr 1fr}
@media(max-width:600px){.ayzal-ent-logo-actions{grid-template-columns:1fr}.ayzal-ent-logo-list{max-height:120px}}


/* Multi Logo Module v0.4.2: cross-preview drag + direct resize handle */
.ayzal-ent-logo-overlay.is-selected .ayzal-ent-logo-resize-handle {
    display: block;
}
.ayzal-ent-logo-resize-handle {
    display: none;
    position: absolute;
    right: -10px;
    bottom: -10px;
    width: 20px;
    height: 20px;
    padding: 0;
    border: 2px solid #ffffff;
    border-radius: 50%;
    background: #2563eb;
    box-shadow: 0 1px 5px rgba(0,0,0,.35);
    cursor: nwse-resize;
    touch-action: none;
    z-index: 3;
}
.ayzal-ent-logo-overlay.is-selected {
    cursor: move;
}
@media (max-width: 600px) {
    .ayzal-ent-logo-resize-handle {
        right: -13px;
        bottom: -13px;
        width: 26px;
        height: 26px;
    }
}


/* Multi Logo Module v0.4.3: keep logos inside Front/Back preview bounds */
.ayzal-ent-preview-stage {
    overflow: hidden;
}
.ayzal-ent-logo-overlay {
    max-width: 50%;
}


/* Logo Module v0.4.6: sleeve placement presets */
.ayzal-ent-logo-sleeve-fit{margin:12px 0;padding:10px;border:1px solid #dbe3ee;border-radius:10px;background:#f8fafc}
.ayzal-ent-logo-sleeve-fit-title{display:block;margin-bottom:8px;font-size:12px;font-weight:800;color:#1f2937}
.ayzal-ent-logo-sleeve-fit-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.ayzal-ent-logo-sleeve-fit-grid button{appearance:none;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:#172033;padding:8px 7px;font-size:11px;font-weight:700;line-height:1.2;cursor:pointer}
.ayzal-ent-logo-sleeve-fit-grid button:hover{border-color:#2563eb;background:#eff6ff;color:#1d4ed8}
.ayzal-ent-logo-sleeve-fit small{display:block;margin-top:8px;color:#64748b;font-size:10px;line-height:1.4}
@media(max-width:600px){.ayzal-ent-logo-sleeve-fit-grid{grid-template-columns:1fr 1fr}.ayzal-ent-logo-sleeve-fit-grid button{padding:9px 5px;font-size:10px}}


/* Text Module v0.5.0 */
.ayzal-ent-text-list{display:grid;gap:7px;margin:10px 0 14px;max-height:150px;overflow:auto}
.ayzal-ent-text-list-item{display:flex;align-items:center;gap:8px;width:100%;padding:8px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#111827;text-align:left;cursor:pointer}
.ayzal-ent-text-list-item.is-active{border-color:#111827;box-shadow:0 0 0 1px #111827}
.ayzal-ent-text-list-item>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700}
.ayzal-ent-text-list-index{display:grid;place-items:center;min-width:24px;height:24px;border-radius:50%;background:#f1f5f9;font-size:10px;font-weight:800}
.ayzal-ent-text-panel input[type="text"]{width:100%;min-height:42px;padding:8px 10px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#111827}
.ayzal-ent-text-panel input[type="color"]{width:100%;height:42px;padding:4px;border:1px solid #d1d5db;border-radius:8px;background:#fff;cursor:pointer}
.ayzal-ent-text-style-row{display:flex;gap:16px;margin:-2px 0 14px;font-size:12px;font-weight:700;color:#374151}
.ayzal-ent-text-style-row label{display:flex;align-items:center;gap:6px;cursor:pointer}
.ayzal-ent-text-actions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:12px}
.ayzal-ent-text-overlay{position:absolute;z-index:25;display:inline-flex;align-items:center;justify-content:center;width:max-content;max-width:none;height:auto;padding:0;margin:0;box-sizing:border-box;transform-origin:center center;touch-action:none;cursor:grab;user-select:none;line-height:1;white-space:nowrap;text-shadow:0 1px 1px rgba(255,255,255,.25)}
.ayzal-ent-text-overlay:active{cursor:grabbing}
.ayzal-ent-text-overlay.is-selected{outline:1.5px dashed #2563eb;outline-offset:2px}
.ayzal-ent-text-value{display:inline-block;width:max-content;max-width:none;padding:0;margin:0;line-height:.92;pointer-events:none;user-select:none}
.ayzal-ent-text-resize-handle{display:none;position:absolute;right:-8px;bottom:-8px;width:16px;height:16px;padding:0;border:2px solid #fff;border-radius:50%;background:#2563eb;box-shadow:0 1px 4px rgba(0,0,0,.3);cursor:nwse-resize;touch-action:none;z-index:3}
.ayzal-ent-text-overlay.is-selected .ayzal-ent-text-resize-handle{display:block}
@media(max-width:600px){.ayzal-ent-text-actions{grid-template-columns:1fr}.ayzal-ent-text-list{max-height:120px}.ayzal-ent-text-resize-handle{right:-10px;bottom:-10px;width:20px;height:20px}}

.ayzal-ent-text-placement{margin:12px 0;padding:10px;border:1px solid #dbe3ee;border-radius:10px;background:#f8fafc}
.ayzal-ent-text-placement-title{display:block;margin-bottom:8px;font-size:12px;font-weight:800;color:#1f2937}
.ayzal-ent-text-placement-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.ayzal-ent-text-placement-grid button{appearance:none;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:#172033;padding:8px 7px;font-size:11px;font-weight:700;line-height:1.2;cursor:pointer}
.ayzal-ent-text-placement-grid button:hover{border-color:#2563eb;background:#eff6ff;color:#1d4ed8}
.ayzal-ent-text-placement small{display:block;margin-top:8px;color:#64748b;font-size:10px;line-height:1.4}
@media(max-width:600px){.ayzal-ent-text-placement-grid{grid-template-columns:1fr 1fr}.ayzal-ent-text-placement-grid button{padding:9px 5px;font-size:10px}}


/* Text Module v0.5.3: keep the live Front/Back preview visible while editing long tool panels. */
@media (min-width: 992px) {
    .ayzal-ent-customizer__sidebar {
        position: static;
        top: auto;
    }

    .ayzal-ent-customizer__preview {
        position: sticky;
        top: 16px;
        align-self: start;
        max-height: calc(100vh - 32px);
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-gutter: stable;
        z-index: 5;
    }

    .ayzal-ent-customizer__preview::-webkit-scrollbar {
        width: 8px;
    }

    .ayzal-ent-customizer__preview::-webkit-scrollbar-thumb {
        background: #cbd5e1;
        border-radius: 999px;
    }
}

/* Tablet/mobile keep the normal document flow to avoid a cramped sticky preview. */
@media (max-width: 991px) {
    .ayzal-ent-customizer__preview {
        position: static;
        top: auto;
        max-height: none;
        overflow: visible;
    }
}


/* Patterns Module v0.6.1 */
.ayzal-ent-pattern-panel{padding-bottom:18px}
.ayzal-ent-pattern-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0 18px}
.ayzal-ent-pattern-card{appearance:none;border:1px solid #d8dee8;border-radius:10px;background:#fff;padding:8px;cursor:pointer;text-align:left;color:#172033;font-weight:700;transition:.15s ease}
.ayzal-ent-pattern-card:hover{border-color:#8ea1bd;transform:translateY(-1px)}
.ayzal-ent-pattern-card.is-active{border:2px solid #111827;padding:7px}
.ayzal-ent-pattern-card__preview{display:block;width:100%;height:54px;border-radius:7px;background-color:#f8fafc;background-size:18px 18px;border:1px solid #edf0f4;margin-bottom:6px}
.ayzal-ent-pattern-card[data-pattern="none"] .ayzal-ent-pattern-card__preview{background:linear-gradient(135deg,#fff 0 45%,#e5e7eb 45% 55%,#fff 55%)}
.ayzal-ent-pattern-panel .ayzal-ent-tool-button--danger{width:100%;margin-top:6px}
@media (max-width:767px){.ayzal-ent-pattern-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.ayzal-ent-pattern-card__preview{height:46px}}

/* v0.6.2 Pattern Areas + Digital Print Gallery */
.ayzal-ent-digital-pattern-heading{display:flex;flex-direction:column;gap:2px;margin:18px 0 8px;color:#172033}
.ayzal-ent-digital-pattern-heading strong{font-size:15px}
.ayzal-ent-digital-pattern-heading small{font-size:12px;color:#667085;font-weight:500}
.ayzal-ent-digital-pattern-empty{display:grid;gap:4px;padding:12px;border:1px dashed #cbd5e1;border-radius:10px;background:#f8fafc;margin:14px 0;color:#475467;font-size:12px}
.ayzal-ent-digital-pattern-empty strong{color:#172033;font-size:14px}
.ayzal-ent-pattern-card--digital small{display:block;margin-top:2px;color:#667085;font-size:10px;font-weight:600}
.ayzal-ent-pattern-gallery--digital .ayzal-ent-pattern-card__preview{background-repeat:repeat}