/* Custom styles for modal positioning */
.modal-dialog {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}

/* Specific class for top-positioned modals */
.modal-dialog-top {
    margin-top: 5vh !important;
    margin-bottom: 20px !important;
}

/* Mobile-specific adjustments */
@media (max-width: 767.98px) {
    .modal-dialog,
    .modal-dialog-top {
        margin-top: 10px !important;
        margin-bottom: 10px !important;
        max-height: 90vh;
        overflow-y: auto;
    }
    
    /* Ensure modal content doesn't overflow screen */
    .modal-content {
        max-height: calc(100vh - 20px);
        overflow-y: auto;
    }
}

/* Safari mobile modal scrolling fix */
@supports (-webkit-touch-callout: none) {
    .modal {
        -webkit-overflow-scrolling: touch;
    }
    
    .modal-body {
        -webkit-overflow-scrolling: touch;
        overflow-y: auto;
        max-height: calc(100vh - 200px);
    }
}

/* Safari date input fix */
input[type="date"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    max-width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    background-clip: padding-box;
    border-radius: 0.25rem;
}

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

/* Safari mobile form fixes */
input, select, textarea {
    border-radius: 0;
}

/* Fix Safari zoom on input focus */
input[type="text"], input[type="email"], input[type="password"], 
input[type="number"], input[type="tel"], textarea, select {
    font-size: 16px !important;
}

/* Safari button fixes */
button, input[type="submit"], input[type="button"] {
    -webkit-appearance: none;
    border-radius: 0.25rem;
}

/* Safari select dropdown fix */
select {
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 8px 10px;
    padding-right: 2.25rem;
}

/* Fix Safari sticky positioning */
.sticky-top {
    position: -webkit-sticky;
    position: sticky;
}

/* Fix for Bootstrap 4 modals */
.modal.fade .modal-dialog {
    transform: translate(0, -5px);
}

.modal.show .modal-dialog {
    transform: none;
}