/* ===== COMPATIBILIDAD CON SAFARI ===== */

/* Prefijos webkit para propiedades que Safari no soporta nativamente */

/* Flexbox fallbacks para Safari antiguo */
.flex-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.flex-item {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

/* Grid fallbacks */
.grid-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

/* Transform fallbacks */
.transform-element {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000;
    perspective: 1000;
}

/* Smooth scrolling fallback para Safari */
html {
    -webkit-overflow-scrolling: touch;
}

/* Fix para position sticky en Safari */
.sticky-element {
    position: -webkit-sticky;
    position: sticky;
}

/* Fix para backdrop-filter en Safari */
.backdrop-filter-element {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

/* Fix para scroll-snap en Safari */
.scroll-snap-container {
    -webkit-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}

.scroll-snap-item {
    -webkit-scroll-snap-align: start;
    scroll-snap-align: start;
}

/* Fix para user-select en Safari */
.no-select {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
}

/* Fix para touch-action en Safari */
.touch-manipulation {
    touch-action: manipulation;
    -webkit-touch-callout: none;
}

/* Fix para hyphens en Safari */
.hyphens-auto {
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

/* Fix para word-wrap en Safari */
.word-wrap {
    word-wrap: break-word;
    overflow-wrap: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

/* Fix para box-sizing en Safari */
.box-sizing-border {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/* Fix para border-radius en Safari */
.border-radius {
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

/* Fix para box-shadow en Safari */
.box-shadow {
    -webkit-box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    -moz-box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

/* Fix para text-shadow en Safari */
.text-shadow {
    -webkit-text-shadow: 0 1px 2px rgba(0,0,0,0.1);
    -moz-text-shadow: 0 1px 2px rgba(0,0,0,0.1);
    text-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

/* Fix para gradient en Safari */
.gradient-bg {
    background: -webkit-linear-gradient(top, #f8f9fa, #e9ecef);
    background: -moz-linear-gradient(top, #f8f9fa, #e9ecef);
    background: -ms-linear-gradient(top, #f8f9fa, #e9ecef);
    background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
}

/* Fix para animation en Safari */
@-webkit-keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.fade-in {
    -webkit-animation: fadeIn 0.3s ease-in-out;
    animation: fadeIn 0.3s ease-in-out;
}

/* Fix para transform3d en Safari */
.transform3d {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

/* Fix para will-change en Safari */
.will-change {
    -webkit-will-change: transform;
    will-change: transform;
}

/* Fix para contain en Safari */
.contain {
    contain: layout style paint;
    -webkit-contain: layout style paint;
}

/* Fix para clip-path en Safari */
.clip-path {
    -webkit-clip-path: inset(0 0 0 0);
    clip-path: inset(0 0 0 0);
}

/* Fix para mask en Safari */
.mask {
    -webkit-mask: url('mask.png');
    mask: url('mask.png');
}

/* Fix para filter en Safari */
.filter {
    -webkit-filter: blur(5px);
    filter: blur(5px);
}

/* Fix para appearance en Safari */
.no-appearance {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* Fix para tap-highlight-color en Safari */
.no-tap-highlight {
    -webkit-tap-highlight-color: transparent;
}

/* Fix para font-smoothing en Safari */
.font-smoothing {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Fix para text-size-adjust en Safari */
.text-size-adjust {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* Fix para overscroll-behavior en Safari */
.overscroll-behavior {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}

/* Fix para scrollbar en Safari */
.hide-scrollbar {
    -webkit-scrollbar: none;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.hide-scrollbar::-webkit-scrollbar {
    display: none;
}

/* Fix para focus-visible en Safari */
.focus-visible {
    outline: 2px solid #026751;
    outline-offset: 2px;
}

/* Fix para :focus-visible en Safari */
*:focus-visible {
    outline: 2px solid #026751;
    outline-offset: 2px;
}

/* Fix para :focus-visible en Safari con fallback */
*:focus {
    outline: 2px solid #026751;
    outline-offset: 2px;
}

/* Fix para prefers-reduced-motion en Safari */
@media (prefers-reduced-motion: reduce) {
    * {
        -webkit-animation-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        -webkit-animation-iteration-count: 1 !important;
        animation-iteration-count: 1 !important;
        -webkit-transition-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* Fix para dark mode en Safari */
@media (prefers-color-scheme: dark) {
    .dark-mode-support {
        background-color: #1a1a1a;
        color: #ffffff;
    }
}

/* Fix para high contrast en Safari */
@media (prefers-contrast: high) {
    .high-contrast-support {
        border: 2px solid currentColor;
    }
}

/* Fix para forced-colors en Safari */
@media (forced-colors: active) {
    .forced-colors-support {
        border: 1px solid ButtonText;
        background-color: ButtonFace;
        color: ButtonText;
    }
}

/* Estilos para clases aplicadas dinámicamente por JavaScript */
.safari-focus {
    outline: 2px solid #026751 !important;
    outline-offset: 2px !important;
}

.safari-mobile .testimonials-container,
.safari-mobile .winner-cards {
    -webkit-overflow-scrolling: touch !important;
    overflow-scrolling: touch !important;
}

.safari-ios {
    --vh: 1vh;
}

.safari-ios .hero {
    height: calc(var(--vh, 1vh) * 100) !important;
}

.safari-old a:focus,
.safari-old button:focus,
.safari-old input:focus,
.safari-old textarea:focus,
.safari-old select:focus,
.safari-old [tabindex]:focus {
    outline: 2px solid #026751 !important;
    outline-offset: 2px !important;
}

/* Mejorar rendimiento en Safari */
.safari-optimized {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000;
    perspective: 1000;
}

/* Fix para scroll en Safari */
.safari-scroll-fix {
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
}

/* Fix para touch en Safari */
.safari-touch-fix {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}

/* Fix para formularios en Safari */
.safari-form-fix {
    -webkit-appearance: none;
    appearance: none;
}

/* Fix para imágenes en Safari */
.safari-image-fix {
    -webkit-user-drag: none;
    user-drag: none;
}
