/* Selfie generator — shares the haircut-style preview-grid styles via global CSS.
   Local overrides only. */

#prompt-influence-section .prompt-influence-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
}

#prompt-influence-section input[type="range"] {
    flex: 1;
}

.style-preview-card[data-location] .style-preview-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1;
    background: linear-gradient(135deg, rgba(106, 252, 255, 0.10), rgba(196, 184, 255, 0.12));
    border: 1px solid rgba(106, 252, 255, 0.18);
    border-radius: 8px;
    text-align: center;
    padding: 8px;
    font-size: 0.85em;
    color: #c4b8ff;
    font-weight: 500;
}

.style-preview-card[data-location].selected .style-preview-placeholder {
    border-color: #6afcff;
    background: linear-gradient(135deg, rgba(106, 252, 255, 0.25), rgba(196, 184, 255, 0.25));
    box-shadow: 0 0 0 2px rgba(106, 252, 255, 0.4);
    color: #fff;
}

.style-preview-card[data-location] .style-preview-label {
    display: none; /* placeholder already shows the label */
}