/* Safari-specific fixes */
@supports (-webkit-touch-callout: none) {
    html, body {
        height: -webkit-fill-available;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }

    .main-container {
        min-height: -webkit-fill-available;
        height: auto !important;
    }

    /* Fix for flexbox issues */
    .flex-container {
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        flex-direction: column;
    }

    /* Fix for sticky positioning */
    .sticky-element {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        z-index: 100;
    }

    /* Fix for overflow scrolling */
    .scroll-container {
        -webkit-overflow-scrolling: touch;
        overflow-y: auto;
        height: 100%;
        flex: 1 1 auto;
    }

    /* Fix for height calculations */
    .full-height {
        height: 100vh;
        height: -webkit-fill-available;
    }
}

/* Global fixes for all browsers */
* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* Fix for inconsistent button rendering */
button {
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
}

/* Fix for flex gap support */
.flex-gap {
    display: flex;
    gap: 1rem;
}
@supports not (gap: 1rem) {
    .flex-gap > * + * {
        margin-left: 1rem;
    }
}