/* =========================================================
   NOBTI Mobile Polish V1
   Mega Sprint B: Sprint 57 + 58
   Mobile polish + Map/Nearby UX final layer
   ========================================================= */

:root {
    --nobti-mobile-width: 430px;
    --nobti-bottom-nav-height: 96px;
    --nobti-safe-bottom: env(safe-area-inset-bottom, 0px);
}

/* General phone shell */
@media (hover: none) and (pointer: coarse), (max-width: 900px) {

    html,
    body {
        max-width: 100% !important;
        overflow-x: hidden !important;
        scroll-behavior: smooth;
    }

    body {
        min-height: 100vh;
        background: #f5f7fb !important;
        padding-bottom: calc(var(--nobti-bottom-nav-height) + var(--nobti-safe-bottom) + 22px) !important;
    }

    body.nobti-mobile-polish-ready {
        -webkit-tap-highlight-color: transparent;
    }

    body.nobti-mobile-polish-ready input,
    body.nobti-mobile-polish-ready select,
    body.nobti-mobile-polish-ready textarea {
        font-size: 16px !important;
    }

    /* Main page containers */
    main,
    .container,
    .container-fluid,
    .page-container,
    .places-container,
    .nearby-container,
    .report-container,
    .add-place-container,
    .dashboard-container,
    .profile-page,
    .legal-page,
    .guide-page,
    .search-pro-page,
    .map-v2-page,
    .prod-page,
    .perf-page,
    .export-page {
        max-width: min(100%, var(--nobti-mobile-width)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* Reduce huge hero sections on phone */
    .search-pro-hero,
    .map-v2-hero,
    .profile-hero,
    .legal-hero,
    .guide-hero,
    .prod-hero,
    .perf-hero,
    .export-hero,
    .how-hero-box,
    .nobti-launch-box,
    .nobti-home-nearby-box {
        padding: 18px !important;
        border-radius: 22px !important;
        margin-bottom: 14px !important;
    }

    .search-pro-hero h1,
    .map-v2-hero h1,
    .profile-hero h1,
    .legal-hero h1,
    .guide-hero h1,
    .prod-hero h1,
    .perf-hero h1,
    .export-hero h1,
    .how-hero-box h1,
    .nobti-launch-title {
        font-size: 1.85rem !important;
        line-height: 1.25 !important;
        margin-bottom: 8px !important;
    }

    .search-pro-hero p,
    .map-v2-hero p,
    .profile-hero p,
    .legal-hero p,
    .guide-hero p,
    .prod-hero p,
    .perf-hero p,
    .export-hero p,
    .how-hero-box p,
    .nobti-launch-text {
        font-size: 0.95rem !important;
        line-height: 1.65 !important;
    }

    /* Cards */
    .card,
    .search-pro-card,
    .map-v2-place-card,
    .map-v2-filter-card,
    .map-v2-map-card,
    .map-v2-actions-card,
    .profile-card,
    .profile-stat,
    .legal-card,
    .guide-card,
    .prod-card,
    .prod-stat,
    .perf-card,
    .export-card,
    .nearby-card,
    .place-card,
    .report-card,
    .selected-place-card,
    .sticky-report-card,
    .add-place-card {
        border-radius: 22px !important;
        box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06) !important;
    }

    /* Buttons */
    .btn,
    button,
    .nobti-nav-link,
    .nobti-admin-link {
        touch-action: manipulation;
    }

    .btn-lg {
        padding-top: 12px !important;
        padding-bottom: 12px !important;
    }

    /* Forms */
    .form-control,
    .form-select {
        min-height: 48px !important;
        border-radius: 15px !important;
    }

    textarea.form-control {
        min-height: 110px !important;
    }

    /* Horizontal chips */
    .map-v2-status-chips,
    .search-pro-status-chips,
    .status-filter-chips,
    .nearby-status-chips,
    .places-status-chips {
        display: flex !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        gap: 8px !important;
        padding: 4px 2px 12px !important;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .map-v2-status-chips::-webkit-scrollbar,
    .search-pro-status-chips::-webkit-scrollbar,
    .status-filter-chips::-webkit-scrollbar,
    .nearby-status-chips::-webkit-scrollbar,
    .places-status-chips::-webkit-scrollbar {
        display: none;
    }

    .map-v2-chip,
    .search-pro-chip,
    .status-chip,
    .nearby-chip,
    .places-chip {
        flex: 0 0 auto !important;
        scroll-snap-align: start;
        min-height: 44px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* Navbar */
    .nobti-navbar,
    .nobti-admin-navbar {
        width: 100% !important;
        max-width: 100% !important;
        padding: 10px 12px !important;
    }

    .nobti-navbar-inner,
    .nobti-admin-navbar-inner {
        width: 100% !important;
    }

    .nobti-brand-mark,
    .nobti-admin-brand-mark {
        width: 42px !important;
        height: 42px !important;
        border-radius: 16px !important;
    }

    .nobti-menu-button {
        min-height: 44px !important;
        padding: 8px 14px !important;
    }

    .nobti-navbar-links.is-open,
    .nobti-admin-links.is-open {
        max-height: 70vh;
        overflow-y: auto;
        padding-bottom: 8px;
    }

    /* Admin navbar compact */
    .nobti-admin-links .nobti-admin-link {
        flex: 1 1 calc(50% - 8px) !important;
        text-align: center !important;
        font-size: 0.82rem !important;
        padding: 9px 8px !important;
    }

    .nobti-admin-links .nobti-admin-danger {
        flex-basis: 100% !important;
    }

    /* Bottom navigation */
    .nobti-mobile-bottom-nav {
        position: fixed !important;
        left: 12px !important;
        right: 12px !important;
        bottom: calc(12px + var(--nobti-safe-bottom)) !important;
        width: auto !important;
        max-width: calc(100% - 24px) !important;
        z-index: 2500 !important;
        border-radius: 28px !important;
        box-shadow: 0 18px 48px rgba(15, 23, 42, 0.32) !important;
    }

    .nobti-mobile-nav-item {
        min-height: 62px !important;
    }

    .nobti-mobile-nav-icon {
        font-size: 1.25rem !important;
        line-height: 1 !important;
    }

    .nobti-mobile-nav-label {
        font-size: 0.72rem !important;
        line-height: 1.15 !important;
    }

    .nobti-mobile-nav-item.is-more,
    .nobti-mobile-nav-item:first-child {
        min-width: 72px !important;
        border-radius: 22px !important;
    }

    /* Back to top and install button */
    .nobti-back-to-top {
        left: 16px !important;
        bottom: calc(var(--nobti-bottom-nav-height) + var(--nobti-safe-bottom) + 20px) !important;
        width: 50px !important;
        height: 50px !important;
        z-index: 2400 !important;
    }

    .nobti-install-app-button {
        right: 16px !important;
        bottom: calc(var(--nobti-bottom-nav-height) + var(--nobti-safe-bottom) + 20px) !important;
        z-index: 2400 !important;
    }

    /* Footer compact on phone */
    .nobti-auto-footer {
        margin-top: 32px !important;
        padding-bottom: calc(var(--nobti-bottom-nav-height) + var(--nobti-safe-bottom) + 20px) !important;
    }

    .nobti-auto-footer-inner {
        gap: 12px !important;
    }

    .nobti-auto-footer-links {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        width: 100% !important;
        gap: 10px !important;
    }

    .nobti-auto-footer-links a {
        background: rgba(255, 255, 255, 0.06);
        border: 1px solid rgba(255, 255, 255, 0.08);
        border-radius: 14px;
        padding: 10px;
        text-align: center;
    }
}

/* =========================================================
   Map V2 final polish
   ========================================================= */

@media (hover: none) and (pointer: coarse), (max-width: 900px) {

    body.nobti-page-map .map-v2-page {
        padding-top: 14px !important;
    }

    body.nobti-page-map .map-v2-hero {
        text-align: right !important;
    }

    body.nobti-page-map .map-v2-filter-card {
        padding: 14px !important;
    }

    body.nobti-page-map .map-v2-filter-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    body.nobti-page-map .map-v2-stats {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
        margin-bottom: 12px !important;
    }

    body.nobti-page-map .map-v2-stat {
        min-height: 86px !important;
        padding: 14px !important;
    }

    body.nobti-page-map .map-v2-stat span {
        font-size: 0.88rem !important;
    }

    body.nobti-page-map .map-v2-stat strong {
        font-size: 2rem !important;
    }

    body.nobti-page-map .map-v2-alert {
        border-radius: 18px !important;
        padding: 13px !important;
        font-size: 0.92rem !important;
        line-height: 1.65 !important;
    }

    body.nobti-page-map .map-v2-actions-card {
        padding: 12px !important;
        margin-bottom: 12px !important;
    }

    body.nobti-page-map .map-v2-map-card {
        padding: 12px !important;
        border-radius: 24px !important;
        margin-top: 8px !important;
    }

    body.nobti-page-map .map-v2-map-header {
        gap: 10px !important;
        margin-bottom: 10px !important;
    }

    body.nobti-page-map .map-v2-map-title strong {
        font-size: 1.1rem !important;
    }

    body.nobti-page-map .map-v2-map-title span {
        font-size: 0.82rem !important;
    }

    body.nobti-page-map .map-v2-map-tools {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        width: 100% !important;
        gap: 8px !important;
    }

    body.nobti-page-map .map-v2-map-tools button {
        min-height: 42px !important;
        padding: 8px !important;
        font-size: 0.86rem !important;
    }

    body.nobti-page-map .map-v2-search-inside {
        margin-bottom: 10px !important;
    }

    body.nobti-page-map .map-v2-search-inside input {
        padding: 12px 16px !important;
        min-height: 50px !important;
    }

    body.nobti-page-map .map-v2-map-frame {
        border-radius: 22px !important;
        border: 1px solid #cbd5e1 !important;
        background: #dbe5f0 !important;
        min-height: 390px !important;
    }

    body.nobti-page-map #nobtiMapV2 {
        height: 430px !important;
        min-height: 430px !important;
        width: 100% !important;
        background: #dbe5f0 !important;
    }

    body.nobti-page-map .leaflet-container {
        border-radius: 22px !important;
        direction: ltr !important;
    }

    body.nobti-page-map .leaflet-container img,
    body.nobti-page-map .leaflet-container .leaflet-tile,
    body.nobti-page-map .leaflet-container .leaflet-marker-icon,
    body.nobti-page-map .leaflet-container .leaflet-marker-shadow {
        max-width: none !important;
        max-height: none !important;
    }

    body.nobti-page-map .leaflet-container .leaflet-tile {
        width: 256px !important;
        height: 256px !important;
    }

    body.nobti-page-map .leaflet-popup-content {
        direction: rtl !important;
        text-align: right !important;
        margin: 12px !important;
    }

    body.nobti-page-map .map-v2-popup {
        min-width: 220px !important;
        max-width: 260px !important;
    }

    body.nobti-page-map .map-v2-popup-actions {
        grid-template-columns: 1fr !important;
    }

    body.nobti-page-map .map-v2-legend {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
        padding: 12px !important;
        font-size: 0.9rem !important;
    }

    body.nobti-page-map .map-v2-results {
        grid-template-columns: 1fr !important;
    }

    body.nobti-page-map .map-v2-place-card {
        padding: 16px !important;
    }

    body.nobti-page-map .map-v2-place-card h3 {
        font-size: 1.08rem !important;
        padding-left: 82px !important;
    }

    body.nobti-page-map .map-v2-place-actions {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }

    body.nobti-page-map .map-v2-place-actions .btn {
        width: 100% !important;
        min-height: 42px !important;
    }
}

/* =========================================================
   Nearby final polish
   Generic selectors, works with current nearby variants
   ========================================================= */

@media (hover: none) and (pointer: coarse), (max-width: 900px) {

    body.nobti-page-nearby .nearby-container,
    body.nobti-page-nearby .nearby-page,
    body.nobti-page-nearby main {
        padding-top: 14px !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    body.nobti-page-nearby .nearby-hero,
    body.nobti-page-nearby .nearby-header,
    body.nobti-page-nearby .nearby-panel,
    body.nobti-page-nearby .nearby-filter-card,
    body.nobti-page-nearby .location-card,
    body.nobti-page-nearby .distance-card {
        border-radius: 22px !important;
        padding: 16px !important;
        margin-bottom: 12px !important;
    }

    body.nobti-page-nearby .nearby-hero h1,
    body.nobti-page-nearby .nearby-header h1 {
        font-size: 1.85rem !important;
        line-height: 1.25 !important;
    }

    body.nobti-page-nearby .nearby-actions,
    body.nobti-page-nearby .nearby-filter-actions,
    body.nobti-page-nearby .location-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    body.nobti-page-nearby .nearby-actions .btn,
    body.nobti-page-nearby .nearby-filter-actions .btn,
    body.nobti-page-nearby .location-actions .btn {
        width: 100% !important;
        min-height: 48px !important;
    }

    body.nobti-page-nearby .nearby-results,
    body.nobti-page-nearby .nearby-grid,
    body.nobti-page-nearby .nearby-list {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    body.nobti-page-nearby .nearby-card,
    body.nobti-page-nearby .nearby-result-card,
    body.nobti-page-nearby .place-distance-card {
        width: 100% !important;
        border-radius: 22px !important;
        padding: 16px !important;
    }

    body.nobti-page-nearby .nearby-card h2,
    body.nobti-page-nearby .nearby-card h3,
    body.nobti-page-nearby .nearby-result-card h2,
    body.nobti-page-nearby .nearby-result-card h3 {
        font-size: 1.12rem !important;
        line-height: 1.35 !important;
    }

    body.nobti-page-nearby .distance-badge,
    body.nobti-page-nearby .nearby-distance,
    body.nobti-page-nearby .status-badge {
        font-size: 0.86rem !important;
        border-radius: 999px !important;
        padding: 6px 10px !important;
    }

    body.nobti-page-nearby .nearby-card-actions,
    body.nobti-page-nearby .nearby-result-actions,
    body.nobti-page-nearby .place-card-actions {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }

    body.nobti-page-nearby .nearby-card-actions .btn,
    body.nobti-page-nearby .nearby-result-actions .btn,
    body.nobti-page-nearby .place-card-actions .btn {
        width: 100% !important;
        min-height: 42px !important;
    }

    body.nobti-page-nearby .nearby-map,
    body.nobti-page-nearby #nearbyMap,
    body.nobti-page-nearby .leaflet-container {
        min-height: 360px !important;
        height: 380px !important;
        border-radius: 22px !important;
        overflow: hidden !important;
    }

    body.nobti-page-nearby .leaflet-container img,
    body.nobti-page-nearby .leaflet-container .leaflet-tile {
        max-width: none !important;
        max-height: none !important;
    }

    body.nobti-page-nearby .leaflet-container .leaflet-tile {
        width: 256px !important;
        height: 256px !important;
    }
}

/* =========================================================
   Search / Report / Add place phone polish
   ========================================================= */

@media (hover: none) and (pointer: coarse), (max-width: 900px) {

    body.nobti-page-search .search-pro-filter-grid,
    body.nobti-page-report .report-option-grid,
    body.nobti-page-report .crowd-grid,
    body.nobti-page-report .time-grid,
    body.nobti-page-report .status-grid {
        grid-template-columns: 1fr !important;
    }

    body.nobti-page-search .search-pro-results {
        grid-template-columns: 1fr !important;
    }

    body.nobti-page-search .search-pro-actions,
    body.nobti-page-report .report-actions,
    body.nobti-page-add-place .add-place-actions {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }

    body.nobti-page-search .search-pro-actions .btn,
    body.nobti-page-report .report-actions .btn,
    body.nobti-page-add-place .add-place-actions .btn {
        width: 100% !important;
    }

    body.nobti-page-add-place #map,
    body.nobti-page-add-place .leaflet-container,
    body.nobti-page-add-place .add-place-map,
    body.nobti-page-add-place .place-map {
        height: 360px !important;
        min-height: 360px !important;
        border-radius: 22px !important;
    }

    body.nobti-page-add-place .leaflet-container img,
    body.nobti-page-add-place .leaflet-container .leaflet-tile {
        max-width: none !important;
        max-height: none !important;
    }

    body.nobti-page-add-place .leaflet-container .leaflet-tile {
        width: 256px !important;
        height: 256px !important;
    }
}

/* =========================================================
   Very small phones
   ========================================================= */

@media (max-width: 380px) {

    :root {
        --nobti-bottom-nav-height: 90px;
    }

    .nobti-mobile-bottom-nav {
        left: 8px !important;
        right: 8px !important;
        max-width: calc(100% - 16px) !important;
    }

    .nobti-mobile-nav-label {
        font-size: 0.64rem !important;
    }

    .nobti-mobile-nav-icon {
        font-size: 1.12rem !important;
    }

    body.nobti-page-map #nobtiMapV2 {
        height: 390px !important;
        min-height: 390px !important;
    }

    body.nobti-page-nearby .nearby-map,
    body.nobti-page-nearby #nearbyMap {
        height: 340px !important;
        min-height: 340px !important;
    }
}