/* ============================================================
 *  Android / mobile compat layer
 *
 *  Layout fixes (≤767px): all mobile browsers — safe for iOS Safari.
 *  Glass / blur fixes: html.platform-android only — desktop & Safari unchanged.
 * ============================================================ */

/* ── Mobile layout (all platforms) ── */
@media (max-width: 767px) {
    html {
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }

    body.app-dashboard,
    body.schedule-embed-body {
        overflow-x: hidden;
    }

    body.app-dashboard .section,
    body.app-dashboard .summary-cards,
    body.app-dashboard .search-filter-bar,
    body.app-dashboard .flash-messages {
        margin-left: 0.75rem;
        margin-right: 0.75rem;
    }

    body.app-dashboard .info-grid {
        grid-template-columns: 1fr;
    }

    body.app-dashboard .page-actions,
    body.app-dashboard .lift-overview-toolbar {
        flex-wrap: wrap;
    }

    /* Wide tables: horizontal scroll inside wrapper */
    .lift-table-container,
    .lift-overview-table-wrap,
    .table-wrapper,
    .device-table,
    .inspections-table-wrapper,
    .gateway-table,
    .equipment-table-wrapper {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        box-sizing: border-box;
    }

    .lift-table,
    .inspections-table,
    .device-table table,
    .gateway-table table {
        min-width: 560px;
        display: table;
        width: 100%;
    }

    .lift-overview-table-wrap .lift-table {
        min-width: 640px;
    }

    .lifts-table {
        min-width: 700px;
    }

    .lift-table th,
    .lift-table td,
    .inspections-table th,
    .inspections-table td {
        padding: 0.55rem 0.5rem;
        font-size: 0.85rem;
    }

    /* Charts: stable height on narrow viewports */
    .chart-inner {
        position: relative;
        width: 100%;
        min-height: 240px;
    }

    .chart-container canvas,
    .chart-wrapper canvas,
    .gateways-histogram-panel canvas,
    .chart-inner canvas {
        display: block;
        max-width: 100% !important;
    }

    .chart-container:not(.lift-overview-chart) .chart-inner,
    .chart-wrapper {
        min-height: 260px;
    }

    .chart-container:not(.lift-overview-chart) canvas,
    .chart-wrapper canvas {
        height: 260px !important;
        max-height: 45vh;
    }

    /* Common flex rows → stack */
    .dashboard-grid {
        grid-template-columns: 1fr !important;
    }

    .inspection-history-heading,
    .section-header,
    .equipment-filters-panel .equipment-filter-primary-row {
        flex-direction: column;
        align-items: stretch;
    }

    .equipment-filters-panel .filter-dropdown {
        width: 100%;
        max-width: 100%;
    }

    .equipment-filters-panel .equipment-filter-search {
        flex: 1 1 100%;
        min-width: 0;
        width: 100%;
    }

    /* Modals */
    .modal-content,
    .inspection-modal .modal-content {
        width: calc(100% - 1.25rem);
        max-height: 88vh;
    }

    .photos-gallery {
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    }

    /* NFC / tag standalone pages */
    body:not(.app-dashboard) .container {
        padding-left: 1rem;
        padding-right: 1rem;
        box-sizing: border-box;
    }
}

@media (max-width: 480px) {
    .chart-inner {
        min-height: 220px;
    }

    .chart-container:not(.lift-overview-chart) canvas,
    .chart-wrapper canvas {
        height: 220px !important;
    }
}

/* ── Android-only rendering fixes (Chrome Custom Tab, etc.) ── */
html.platform-android body::before {
    animation: none !important;
}

html.platform-android body.app-dashboard {
    background: #d4dff0;
}

html.platform-android body:not(.app-dashboard)::before {
    animation: none !important;
}

@media (max-width: 767px) {
  html.platform-android [class*="backdrop"],
  html.platform-android .top-utility-bar,
  html.platform-android .mobile-bottom-nav,
  html.platform-android .mobile-nav-sheet__panel,
  html.platform-android .controls,
  html.platform-android .section,
  html.platform-android .glass,
  html.platform-android .metric-card,
  html.platform-android .info-item,
  html.platform-android .search-filter-bar,
  html.platform-android .lift-table-container,
  html.platform-android .chart-container,
  html.platform-android .chart-wrapper,
  html.platform-android .page-actions,
  html.platform-android .lift-overview-toolbar,
  html.platform-android .lift-card,
  html.platform-android .equipment-card,
  html.platform-android .tech-info-bar,
  html.platform-android .glass-nav,
  html.platform-android table,
  html.platform-android .modal-overlay,
  html.platform-android .device-card,
  html.platform-android .alarm-stat,
  html.platform-android .lift-overview-shaft,
  html.platform-android .lift-overview-chart,
  html.platform-android .no-data,
  html.platform-android .help-section li,
  html.platform-android .export-menu,
  html.platform-android .scada-panel,
  html.platform-android .sensor-panel,
  html.platform-android .elevator-shaft,
  html.platform-android .crane-scada-mimic,
  html.platform-android .motor-panel,
  html.platform-android .inspections-table-wrapper,
  html.platform-android .login-wrapper,
  html.platform-android .login-card,
  html.platform-android .welcome-card,
  html.platform-android .feature-card,
  html.platform-android .device-detail-container,
  html.platform-android .device-l-reading-card,
  html.platform-android .nfc-info-card,
  html.platform-android .coordination-card,
  html.platform-android .app-nav__menu {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html.platform-android .section,
  html.platform-android .controls,
  html.platform-android .metric-card,
  html.platform-android .info-item,
  html.platform-android .search-filter-bar,
  html.platform-android .lift-table-container,
  html.platform-android .chart-container,
  html.platform-android .chart-wrapper,
  html.platform-android .page-actions,
  html.platform-android .lift-overview-toolbar,
  html.platform-android .glass,
  html.platform-android table,
  html.platform-android .inspections-table-wrapper,
  html.platform-android .no-data,
  html.platform-android .help-section li,
  html.platform-android .login-wrapper,
  html.platform-android .login-card,
  html.platform-android .welcome-card,
  html.platform-android .feature-card,
  html.platform-android .device-detail-container,
  html.platform-android .device-l-reading-card,
  html.platform-android .nfc-info-card {
    background: rgba(255, 255, 255, 0.94) !important;
  }

  html.platform-android .top-utility-bar {
    background: rgba(26, 26, 46, 0.96) !important;
  }

  html.platform-android .mobile-bottom-nav {
    background: rgba(255, 255, 255, 0.98) !important;
    box-shadow: 0 -2px 12px rgba(15, 35, 65, 0.12);
  }

  /* feDropShadow on SVG can smear on some Android GPUs — strip filter, keep geometry */
  html.platform-android .elevator-car svg g[filter],
  html.platform-android .lift-overview-car svg g[filter] {
    filter: none !important;
  }

  html.platform-android .elevator-car svg,
  html.platform-android .lift-overview-car svg,
  html.platform-android .crane-scada-mimic__svg {
    display: block;
    width: 100%;
    height: auto;
    visibility: visible;
    opacity: 1;
  }

  html.platform-android .crane-scada-mimic,
  html.platform-android .motor-panel {
    background: rgba(255, 255, 255, 0.94) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
    body::before {
        animation: none !important;
    }

    .lift-overview-car svg,
    .elevator-car svg {
        animation: none !important;
    }
}