/**
 * Browser Compatibility CSS
 * Cross-browser fixes and vendor prefixes for maximum compatibility
 */

/* ==========================================================================
   Vendor Prefixes for Common Properties
   ========================================================================== */

/* Flexbox with vendor prefixes - ONLY ON SAFARI */
.is-safari .flex,
.is-safari [class*="flex-"] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

/* Transform with vendor prefixes - ONLY ON SAFARI */
.is-safari .transform,
.is-safari [class*="transform"],
.is-safari [class*="translate"],
.is-safari [class*="rotate"],
.is-safari [class*="scale"] {
    -webkit-transform: inherit;
    -ms-transform: inherit;
    transform: inherit;
}

/* Transition with vendor prefixes - ONLY ON SAFARI */
.is-safari .transition,
.is-safari [class*="transition"] {
    -webkit-transition: inherit;
    -o-transition: inherit;
    transition: inherit;
}

/* Animation with vendor prefixes */
@-webkit-keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ==========================================================================
   Safari-Specific Fixes
   ========================================================================== */

/* Fix Safari's default button appearance */
.is-safari button,
.is-safari input[type="button"],
.is-safari input[type="submit"],
.is-safari [role="button"] {
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;
}

/* Fix Safari's input styling */
.is-safari input,
.is-safari select,
.is-safari textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* Prevent Safari from auto-zooming on input focus (mobile) */
.is-ios input[type="text"],
.is-ios input[type="email"],
.is-ios input[type="password"],
.is-ios input[type="number"],
.is-ios select,
.is-ios textarea {
    font-size: 16px !important;
}

/* Fix Safari's sticky positioning */
.is-safari .analysis-table th {
    position: -webkit-sticky;
    position: sticky;
}

/* Improve font rendering on Safari/Mac */
.is-safari *,
.is-mac * {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Fix Safari's transform rendering issues */
.is-safari .card,
.is-safari .advanced-stat-card,
.is-safari [class*="hover:"] {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

/* ==========================================================================
   iOS-Specific Fixes
   ========================================================================== */

/* Fix iOS viewport height issues */
.is-ios body {
    min-height: -webkit-fill-available;
}

/* Remove iOS tap highlight */
.is-ios * {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* Fix iOS touch scrolling */
.is-ios .table-container,
.is-ios .overflow-auto,
.is-ios .overflow-y-auto {
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
}

/* Prevent iOS text size adjustment */
.is-ios body {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* Fix iOS button active states */
.is-ios button:active,
.is-ios [role="button"]:active {
    opacity: 0.8;
}

/* ==========================================================================
   Fallbacks for Unsupported Features
   ========================================================================== */

/* Fallback for backdrop-filter (use solid background) */
.no-backdrop-filter .tippy-box[data-theme~='marcus'] {
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* Fallback for CSS Grid (use flexbox) */
.no-grid .grid {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.no-grid .grid > * {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

/* Fallback for sticky positioning */
.no-sticky .analysis-table th {
    position: relative !important;
}

/* ==========================================================================
   Text Rendering and Typography Fixes
   ========================================================================== */

/* Prevent text from overlapping - ONLY apply to specific long-text elements */
.is-safari p,
.is-safari td,
.is-safari th,
.is-safari .description-text,
.is-ios p,
.is-ios td,
.is-ios th {
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* NOTE: Removed global word-wrap on all elements - was causing vertical text rendering */

/* Ensure consistent font rendering across browsers - ONLY ON SAFARI */
.is-safari body,
.is-mac body {
    font-feature-settings: "kern" 1;
    font-kerning: normal;
    -webkit-font-variant-ligatures: common-ligatures;
    font-variant-ligatures: common-ligatures;
}

/* ==========================================================================
   Form Element Consistency
   ========================================================================== */

/* Normalize form elements across browsers - ONLY ON SAFARI/iOS */
.is-safari input,
.is-safari select,
.is-safari textarea,
.is-safari button,
.is-ios input,
.is-ios select,
.is-ios textarea,
.is-ios button {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    margin: 0;
}

/* Fix select arrow on Safari */
.is-safari select {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.5rem center;
    background-size: 1.5em 1.5em;
    padding-right: 2.5rem;
}

/* ==========================================================================
   Animation Performance
   ========================================================================== */

/* Optimize animations for Safari */
.is-safari .animated-bar,
.is-safari .sparkline,
.is-safari [class*="animate-"] {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    will-change: transform, opacity;
}

/* Respect reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        -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;
        -o-transition-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ==========================================================================
   Dropdown and Modal Fixes
   ========================================================================== */

/* Fix dropdown positioning in Safari */
.is-safari .view-dropdown-content {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    will-change: transform, opacity;
}

/* Prevent text overflow in dropdowns - ONLY ON SAFARI */
.is-safari .view-dropdown-content {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.is-safari .view-dropdown-content .dropdown-item {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ==========================================================================
   Table Fixes
   ========================================================================== */

/* Fix table rendering on Safari */
.is-safari table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* Prevent table cell content from overlapping */
.is-safari td,
.is-safari th {
    vertical-align: middle;
    /* Removed word-break - was causing vertical text rendering */
}

/* ==========================================================================
   Shadow and Border Radius Fixes
   ========================================================================== */

/* Ensure shadows render consistently - ONLY ON SAFARI */
.is-safari .shadow,
.is-safari .shadow-sm,
.is-safari .shadow-md,
.is-safari .shadow-lg,
.is-safari .shadow-xl {
    -webkit-box-shadow: inherit;
}

/* Ensure border-radius renders consistently - ONLY ON SAFARI */
.is-safari .rounded,
.is-safari .rounded-sm,
.is-safari .rounded-md,
.is-safari .rounded-lg,
.is-safari .rounded-xl,
.is-safari .rounded-2xl,
.is-safari .rounded-3xl {
    -webkit-border-radius: inherit;
}

/* ==========================================================================
   Print Styles
   ========================================================================== */

@media print {
    /* Hide interactive elements when printing */
    button,
    .view-dropdown,
    nav,
    .no-print {
        display: none !important;
    }
    
    /* Ensure text is black for printing */
    * {
        color: #000 !important;
        background: #fff !important;
    }
}

/* ==========================================================================
   Accessibility Improvements
   ========================================================================== */

/* Improve focus visibility across browsers - ONLY ON SAFARI */
.is-safari *:focus,
.is-ios *:focus {
    outline: 2px solid #3182ce;
    outline-offset: 2px;
}

/* Hide outline when not using keyboard navigation - ONLY ON SAFARI */
.is-safari *:focus:not(:focus-visible),
.is-ios *:focus:not(:focus-visible) {
    outline: none;
}

/* Ensure focus is visible for keyboard users - ONLY ON SAFARI */
.is-safari *:focus-visible,
.is-ios *:focus-visible {
    outline: 2px solid #3182ce;
    outline-offset: 2px;
}