/* 
  Safari Only Fix - ใช้ media query เฉพาะ Safari
  Safari-specific media queries to fix text display issues
*/

/* Safari-only styles using -webkit-appearance */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    /* This targets all webkit browsers including Safari */
    
    .number-display-enhanced,
    .phone-number {
        color: #1B2951 !important;
        background: none !important;
        background-image: none !important;
        background-color: transparent !important;
        -webkit-text-fill-color: #1B2951 !important;
        -webkit-background-clip: initial !important;
        background-clip: initial !important;
        text-shadow: none !important;
        filter: none !important;
        opacity: 1 !important;
        font-weight: 900 !important;
    }
    
    .price-display-enhanced,
    .price {
        color: #B8860B !important;
        background: none !important;
        background-image: none !important;
        background-color: transparent !important;
        -webkit-text-fill-color: #B8860B !important;
        -webkit-background-clip: initial !important;
        background-clip: initial !important;
        text-shadow: none !important;
        filter: none !important;
        opacity: 1 !important;
        font-weight: 900 !important;
    }
}

/* Safari mobile specific using touch support */
@media screen and (max-width: 768px) and (-webkit-touch-callout: none) {
    /* This specifically targets iOS Safari */
    
    .number-display-enhanced,
    .phone-number {
        color: #1B2951 !important;
        -webkit-text-fill-color: #1B2951 !important;
        background: transparent !important;
        font-weight: 900 !important;
        text-rendering: optimizeLegibility !important;
        -webkit-font-smoothing: antialiased !important;
        -moz-osx-font-smoothing: grayscale !important;
    }
    
    .price-display-enhanced,
    .price {
        color: #B8860B !important;
        -webkit-text-fill-color: #B8860B !important;
        background: transparent !important;
        font-weight: 900 !important;
        text-rendering: optimizeLegibility !important;
        -webkit-font-smoothing: antialiased !important;
        -moz-osx-font-smoothing: grayscale !important;
    }
    
    /* Ensure cards have proper background */
    .number-card-glass,
    .recommended-numbers-grid .number-card-glass {
        background: #FFFFFF !important;
        background-color: #FFFFFF !important;
        background-image: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}

/* Safari desktop specific */
@media screen and (min-width: 769px) and (-webkit-min-device-pixel-ratio: 0) {
    .number-display-enhanced,
    .phone-number {
        color: #1B2951 !important;
        -webkit-text-fill-color: #1B2951 !important;
        background: none !important;
        font-weight: 900 !important;
    }
    
    .price-display-enhanced,
    .price {
        color: #B8860B !important;
        -webkit-text-fill-color: #B8860B !important;
        background: none !important;
        font-weight: 900 !important;
    }
}

/* Force override for any remaining gradient text */
@supports (-webkit-appearance: none) {
    .text-gradient.number-display-enhanced,
    .text-gradient.price-display-enhanced,
    .text-gradient.phone-number,
    .text-gradient.price {
        color: #1B2951 !important;
        background: none !important;
        -webkit-text-fill-color: #1B2951 !important;
        -webkit-background-clip: initial !important;
        background-clip: initial !important;
    }
    
    .text-shimmer.price-display-enhanced,
    .text-shimmer.price {
        color: #B8860B !important;
        background: none !important;
        -webkit-text-fill-color: #B8860B !important;
        -webkit-background-clip: initial !important;
        background-clip: initial !important;
        animation: none !important;
    }
}

/* High contrast mode for accessibility */
@media (prefers-contrast: high) {
    .number-display-enhanced,
    .phone-number,
    .price-display-enhanced,
    .price {
        color: #000000 !important;
        background: none !important;
        -webkit-text-fill-color: #000000 !important;
        -webkit-background-clip: initial !important;
        background-clip: initial !important;
        text-shadow: none !important;
        filter: none !important;
    }
}