/* assets/style.css - DigiFe Light SaaS Aesthetic */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

body {
    background-color: #f8fafc; /* tipico slate-50, neutro e riposante */
    font-family: 'Inter', sans-serif;
    color: #0f172a; /* slate-900 per il massimo contrasto della lettura */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
    vertical-align: middle;
}

/* Pannelli puliti stile Stripe, zero sfocature, flat */
.saas-panel {
    background: #ffffff;
    border: 1px solid #e2e8f0; /* slate-200 */
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px -1px rgba(0, 0, 0, 0.05); /* shadow-sm Tailwind base */
    border-radius: 1rem;
}

/* Hover morbido per le cards che si sollevano appena */
.hover-lift:hover {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.05);
    transform: translateY(-2px);
    border-color: #cbd5e1; /* slate-300 */
}

/* Transizione globale */
.transition-all-smooth { transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1); }

/* Animazione in entrata delle pagine */
.page-enter { animation: fadeUpSaas 0.3s ease-out forwards; }

@keyframes fadeUpSaas {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Loader moderno (Spin ring) */
.loader {
    border-top-color: #6366f1; /* indigo-500 */
    animation: spinner 0.8s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
@keyframes spinner { to { transform: rotate(360deg); } }

/* Barra di ricerca centrale minimal */
input.search-premium {
    outline: none;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.02);
}
input.search-premium:focus {
    border-color: #818cf8; /* indigo-400 */
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
    background: #ffffff;
}