/* Guide lines — positioned absolutely over the Cropper.js container */
.guide-line {
    position: absolute;
    height: 0;
    border-top: 2px dashed;
    z-index: 30;
    pointer-events: none;
    transition: top 0.05s ease-out;
}

.guide-forehead {
    border-color: #22c55e;
}

.guide-line-vertical {
    position: absolute;
    width: 0;
    border-left: 2px dashed;
    z-index: 30;
    pointer-events: none;
}

.guide-middle {
    border-color: #38bdf8;
}

.guide-chin {
    border-color: #f59e0b;
}

.guide-label {
    position: absolute;
    right: 4px;
    top: 4px;
    font-size: 10px;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 3px;
    background: rgba(0, 0, 0, 0.6);
    white-space: nowrap;
}

.guide-label-forehead {
    color: #22c55e;
}

.guide-label-chin {
    color: #f59e0b;
}

/* Cropper.js overrides */
.cropper-modal {
    background-color: rgba(0, 0, 0, 0.7) !important;
}

.cropper-view-box {
    outline: 2px solid rgba(99, 102, 241, 0.8) !important;
    outline-color: rgba(99, 102, 241, 0.8) !important;
}

.cropper-line,
.cropper-point {
    display: none !important;
}

.cropper-dashed {
    border-color: rgba(99, 102, 241, 0.4) !important;
}

::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #1e293b;
}

::-webkit-scrollbar-thumb {
    background: #475569;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #64748b;
}