/* style.css */
body {
    -webkit-tap-highlight-color: transparent;
}

/* Material Floating Label Styling */
.material-input {
    @apply block w-full px-4 py-4 text-sm bg-slate-50 border border-slate-100 rounded-2xl focus:bg-white focus:border-indigo-500 focus:ring-4 focus:ring-indigo-500/10 outline-none transition-all;
}

.material-label {
    @apply absolute left-4 top-1/2 -translate-y-1/2 text-slate-400 text-xs font-bold uppercase tracking-widest pointer-events-none transition-all;
}

/* Input focus states for label */
.material-input:focus ~ .material-label,
.material-input:not(:placeholder-shown) ~ .material-label {
    @apply -top-2 left-3 bg-white px-2 text-indigo-600 text-[10px] translate-y-0;
}

/* Custom Scrollbar for One UI look */
.custom-scrollbar::-webkit-scrollbar {
    width: 4px;
}
.custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
    background: #e2e8f0;
    border-radius: 10px;
}

/* Modal Pop Animation */
@keyframes pop {
    0% { transform: scale(0.9); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}
.animate-pop {
    animation: pop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Toast Animation */
@keyframes toastIn {
    0% { transform: translateY(100%); opacity: 0; }
    100% { transform: translateY(0); opacity: 1; }
}
.animate-toast {
    animation: toastIn 0.4s cubic-bezier(0.17, 0.67, 0.83, 0.67);
}

/* Date Input Reset */
input[type="date"]::-webkit-calendar-picker-indicator {
    opacity: 0.3;
}