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

/* Custom styles for mobile-first design */
html, body {
    min-height: 100vh;
    -webkit-tap-highlight-color: transparent;
}

/* Touch-friendly interactions */
button, a, select, input {
    touch-action: manipulation;
}

/* Prevent text selection on UI elements */
.no-select {
    -webkit-user-select: none;
    user-select: none;
}

/* Loading spinner */
.loading-spinner {
    border: 3px solid rgba(255, 255, 255, 0.3);
    border-top-color: #10b981;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Hide scrollbar but allow scrolling */
.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.scrollbar-hide::-webkit-scrollbar {
    display: none;
}

/* Safe area for notched devices */
.safe-area-inset-bottom {
    padding-bottom: env(safe-area-inset-bottom);
}

.safe-area-inset-top {
    padding-top: env(safe-area-inset-top);
}