/* ImageCropUploader: shared crop-аплоадер с фиксированным aspect ratio. */
.img-crop { display:flex; flex-direction:column; gap:12px; }
.img-crop__file { display:none; }

.img-crop__placeholder {
    border: 1.5px dashed #b8b8b8;
    border-radius: 16px;
    padding: 28px 18px;
    text-align: center;
    cursor: pointer;
    color: #666;
    background: #fafafa;
    transition: border-color .15s ease, background .15s ease;
}
.img-crop__placeholder:hover { border-color: #888; background: #f3f3f3; }
.img-crop__placeholder p { margin: 0 0 6px; font-size: 14px; }
.img-crop__hint { font-size: 12px; color: #999; }

.img-crop__editor { display:flex; flex-direction:column; gap:10px; align-items:flex-start; }

.img-crop__stage {
    position: relative;
    background-image:
        linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%),
        linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%);
    background-size: 16px 16px;
    background-position: 0 0, 8px 8px;
    background-color: #f3f3f3;
    border: 1px solid #cfcfcf;
    border-radius: 12px;
    overflow: hidden;
    cursor: grab;
    user-select: none;
}
.img-crop__stage:active { cursor: grabbing; }
.img-crop__img {
    position: absolute;
    top: 0;
    left: 0;
    max-width: none;
    pointer-events: none;
}

.img-crop__toolbar {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

.img-crop__btn {
    padding: 6px 12px;
    border-radius: 16px;
    border: 1px solid var(--darkBlue, #21212d);
    background: var(--darkBlue, #21212d);
    color: #fff;
    font-size: 13px;
    cursor: pointer;
    transition: opacity .15s ease;
}
.img-crop__btn:hover { opacity: 0.85; }
.img-crop__btn--ghost { background: transparent; color: var(--darkBlue, #21212d); }
.img-crop__btn--danger { background: #c75454; border-color: #c75454; }

.img-crop__range { flex: 1; min-width: 80px; }