/**
 * Safari Compatibility CSS Fixes
 * Addresses Safari-specific rendering issues
 */

/* Safari-specific backdrop-filter fix */
.modal,
.modal-overlay,
.about-modal,
.invite-modal,
.balance-pill {
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}

/* Safari 100vh Fix (Mobile) */
.is-ios body, 
.is-ios .auth-container,
.is-ios .dashboard-container {
    min-height: calc(var(--vh, 1vh) * 100);
}

/* Safari clamp() fallback using @supports */
@supports not (font-size: clamp(1rem, 2vw, 2rem)) {
    .auth-title, h1 { font-size: 24px; }
    .auth-subtitle, p { font-size: 14px; }
    .stat-number { font-size: 28px; }
    .balance-value { font-size: 20px; }
    .user-name-text { font-size: 18px; }
    
    .dashboard-container { padding: 15px; }
    .dashboard-header { padding: 20px; }
    .user-info-bar { padding: 15px 20px; }
}

/* Safari flexbox gap fallback - General */
.is-safari [style*="gap"],
.is-safari .user-info-bar,
.is-safari .user-info-left,
.is-safari .user-info-right,
.is-safari .balance-pill,
.is-safari .action-cards,
.is-safari .stats-container,
.is-safari .vip-plans,
.is-safari .actions-grid,
.is-safari .nav-container {
    gap: 0 !important;
}

.is-safari .user-info-bar > *,
.is-safari .user-info-left > *,
.is-safari .user-info-right > *,
.is-safari .balance-pill > *,
.is-safari .action-cards > *,
.is-safari .stats-container > *,
.is-safari .vip-plans > *,
.is-safari .actions-grid > *,
.is-safari .nav-container > * {
    margin: 8px;
}

/* Adjustments for specific containers to prevent double margin issues */
.is-safari .user-info-bar { margin-top: 20px; }
.is-safari .user-info-left > *:first-child { margin-left: 0; }
.is-safari .user-info-right > *:last-child { margin-right: 0; }

/* Safari grid gap fallback */
.is-safari .action-cards,
.is-safari .stats-container,
.is-safari .vip-plans {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
}

/* Safari transform and animation fixes */
.is-safari .action-card,
.is-safari .stat-card,
.is-safari .vip-card,
.is-safari .auth-card {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

/* Safari input appearance fixes */
.is-safari input[type="text"],
.is-safari input[type="password"],
.is-safari input[type="email"],
.is-safari input[type="number"],
.is-safari input[type="tel"],
.is-safari textarea,
.is-safari select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 8px;
}

/* Safari button appearance fixes */
.is-safari button,
.is-safari .btn,
.is-safari input[type="submit"],
.is-safari input[type="button"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-border-radius: 8px;
}

/* Safari position sticky fix */
.is-safari .dashboard-header,
.is-safari .content-header,
.is-safari .sticky-top {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 0;
    z-index: 100;
}

/* Safari border-radius with overflow bug fix */
.is-safari .vip-card,
.is-safari .action-card,
.is-safari .stat-card,
.is-safari .auth-card,
.is-safari .user-avatar-mini {
    -webkit-mask-image: -webkit-radial-gradient(white, black);
    mask-image: radial-gradient(white, black);
}

/* Safari fit-content fix */
.is-safari .user-code-badge,
.is-safari .balance-pill,
.is-safari .vip-badge {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

/* iOS Safari specific text size fix */
.is-ios body {
    -webkit-text-size-adjust: 100%;
}

/* iOS Safari tap highlight fix */
.is-ios a,
.is-ios button,
.is-ios .action-card {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* Safari flexbox min-height bug fix */
.is-safari .dashboard-container,
.is-safari .auth-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

/* Safari scrollbar styling for consistent look */
.is-safari ::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
.is-safari ::-webkit-scrollbar-track {
    background: #f1f1f1;
}
.is-safari ::-webkit-scrollbar-thumb {
    background: #FF6200;
    border-radius: 10px;
}

/* Safari modal display logic fix */
.is-safari .modal:not(.show),
.is-safari .modal-overlay:not(.show),
.is-safari .about-modal:not(.show),
.is-safari .invite-modal:not(.show) {
    display: none !important;
}

/* Ensure font smoothing on Safari */
.is-safari body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Print utility */
@media print {
    .is-safari .bottom-nav,
    .is-safari .no-print {
        display: none !important;
    }
}

