/* Custom styles for ScriptDates app */

/* Ensure touch targets are large enough for mobile */
button,
input,
select {
    min-height: 44px;
}

/* Smooth transitions for interactive elements */
button,
input,
select {
    transition: all 0.2s ease-in-out;
}

/* Improve tap highlight color for mobile */
button,
input,
select {
    -webkit-tap-highlight-color: rgba(59, 130, 246, 0.3);
}

/* Custom focus styles for better accessibility */
input:focus,
select:focus {
    outline: none;
}

/* Smooth scrolling for the entire page */
html {
    scroll-behavior: smooth;
}

/* Prevent text selection on buttons for better mobile UX */
button {
    -webkit-user-select: none;
    user-select: none;
}

/* Enhanced date input styling */
input[type="date"] {
    position: relative;
    font-weight: 500;
    color: #1f2937;
    cursor: pointer;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    cursor: pointer;
    font-size: 1.1em;
    opacity: 0.7;
    transition: opacity 0.2s ease;
}

input[type="date"]::-webkit-calendar-picker-indicator:hover {
    opacity: 1;
}

input[type="date"]:hover {
    border-color: #93c5fd;
    background-color: #f8fafc;
}

/* Enhanced number input styling */
input[type="number"] {
    font-weight: 500;
    color: #1f2937;
    text-align: center;
}

input[type="number"]:hover {
    border-color: #93c5fd;
    background-color: #f8fafc;
}