@tailwind base;
@tailwind components;
@tailwind utilities;

body {
    background-color: #e4e8ed;
    color: #2d3748;
}

/* ===== Stati interattivi neumorphism ===== */

/* Bottoni neo: si "premono" al click */
.neo-btn:active:not(:disabled) {
    box-shadow: inset 4px 4px 8px #a3b1c6, inset -4px -4px 8px #ffffff !important;
}

/* CTA primario: ciano brand #00aeef */
.neo-btn-primary {
    background: linear-gradient(145deg, #1ec3ff, #0096d1);
    box-shadow: 6px 6px 12px #a3b1c6, -6px -6px 12px #ffffff;
    color: #ffffff;
}
.neo-btn-primary:hover:not(:disabled) {
    box-shadow: 4px 4px 8px #a3b1c6, -4px -4px 8px #ffffff;
}
.neo-btn-primary:active:not(:disabled) {
    box-shadow: inset 3px 3px 6px #0086bb, inset -3px -3px 6px #2bc8ff !important;
}
.neo-btn-primary:disabled {
    background: #e4e8ed !important;
    color: #8899a8 !important;
    box-shadow: inset 4px 4px 8px #a3b1c6, inset -4px -4px 8px #ffffff !important;
    cursor: not-allowed;
}

/* Swatch colore selezionato */
.swatch-selected {
    box-shadow: inset 3px 3px 6px #a3b1c6, inset -3px -3px 6px #ffffff !important;
}

/* Viewport viewer 3D: flat neumorphism (no inset, no gradient) */
.viewer-viewport {
    background: #e4e8ed;
}

/* Slider neumorphism (range input) */
.neo-slider {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 8px;
    border-radius: 999px;
    background: #e4e8ed;
    box-shadow: inset 3px 3px 6px #a3b1c6, inset -3px -3px 6px #ffffff;
    outline: none;
    cursor: pointer;
}
.neo-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: linear-gradient(145deg, #1ec3ff, #0096d1);
    box-shadow: 3px 3px 6px #a3b1c6, -3px -3px 6px #ffffff;
    cursor: grab;
    border: none;
    transition: box-shadow 0.15s ease;
}
.neo-slider::-webkit-slider-thumb:active {
    cursor: grabbing;
    box-shadow: inset 2px 2px 4px #0086bb, inset -2px -2px 4px #2bc8ff;
}
.neo-slider::-moz-range-thumb {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: linear-gradient(145deg, #1ec3ff, #0096d1);
    box-shadow: 3px 3px 6px #a3b1c6, -3px -3px 6px #ffffff;
    cursor: grab;
    border: none;
}

/* Input e textarea */
.neo-input {
    background: transparent;
    box-shadow: inset 3px 3px 6px #a3b1c6, inset -3px -3px 6px #ffffff;
    border: none;
    transition: box-shadow 0.2s ease;
}
.neo-input:focus {
    box-shadow: inset 4px 4px 8px #a3b1c6, inset -4px -4px 8px #ffffff;
    outline: none;
}

/* Status badges */
.neo-badge-pending { color: #b45309; }
.neo-badge-paid    { color: #15803d; }
.neo-badge-shipped { color: #1e40af; }
.neo-badge-error   { color: #b91c1c; }
.neo-badge-admin   { color: #6d28d9; }

/* Alert */
.neo-alert-error {
    color: #b91c1c;
    box-shadow: inset 3px 3px 6px #a3b1c6, inset -3px -3px 6px #ffffff;
}
.neo-alert-success {
    color: #15803d;
    box-shadow: inset 3px 3px 6px #a3b1c6, inset -3px -3px 6px #ffffff;
}
.neo-alert-warn {
    color: #b45309;
    box-shadow: inset 3px 3px 6px #a3b1c6, inset -3px -3px 6px #ffffff;
}

/* Radio / checkbox moderni nella shell neumorphism */
.neo-radio-card {
    cursor: pointer;
    transition: box-shadow 0.2s ease;
}
.neo-radio-card input[type="radio"]:checked + .radio-indicator {
    box-shadow: inset 3px 3px 6px #a3b1c6, inset -3px -3px 6px #ffffff;
}

/* Loader neumorphic (spin) */
@keyframes neo-spin {
    to { transform: rotate(360deg); }
}
.neo-spinner {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #475569;
    animation: neo-spin 0.7s linear infinite;
}

/* Scrollbar stilizzate */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
    background: #c2ccda;
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover { background: #a3b1c6; }