/* NJW-246 mobile certification override for /property/dashboard.
   Intentionally isolated to phone/tablet widths. Desktop dashboard is unchanged. */

@media (max-width: 768px){
  /* Keep the app header usable instead of squeezing desktop utility chips into a phone row. */
  body.wdv2-mounted .wd4-topbar{
    height:68px;
    min-height:68px;
    padding:0 12px;
    gap:10px;
  }
  body.wdv2-mounted .wd4-top-left,
  body.wdv2-mounted .wd4-top-right{gap:8px;min-width:0}
  body.wdv2-mounted .wd4-menu-btn{width:44px;height:44px;min-width:44px;border-radius:11px}
  body.wdv2-mounted .wd4-brand-mark{width:40px;height:40px;border-radius:11px}
  body.wdv2-mounted .wd4-brand-copy{display:none}
  body.wdv2-mounted .wd4-date-chip,
  body.wdv2-mounted .wd4-weather-chip{display:none}
  body.wdv2-mounted .wd4-icon-btn{width:44px;height:44px;min-width:44px}
  body.wdv2-mounted .wd4-user{padding:2px;margin-left:0}
  body.wdv2-mounted .wd4-user > i{display:none}
  body.wdv2-mounted .wd4-avatar{width:40px;height:40px}

  /* Welcome/actions become a vertical mobile workspace instead of a compressed desktop toolbar. */
  body.wdv2-mounted .wd4-welcome{
    min-height:0;
    padding:16px 14px 12px!important;
    display:grid;
    grid-template-columns:minmax(0,1fr);
    align-items:start;
    gap:12px;
  }
  body.wdv2-mounted .wd4-welcome-copy{min-width:0}
  body.wdv2-mounted .wd4-welcome-copy h1{font-size:22px;line-height:1.12;margin-bottom:6px;overflow-wrap:anywhere}
  body.wdv2-mounted .wd4-welcome-copy h1 span{font-size:18px}
  body.wdv2-mounted .wd4-welcome-actions,
  body.wdv2-mounted .wd4-page-actions{
    width:100%;
    justify-content:flex-start;
    gap:8px!important;
    flex-wrap:wrap;
  }
  body.wdv2-mounted .wd4-filter-select{min-height:44px;font-size:12px;max-width:100%}
  body.wdv2-mounted .wd4-add-btn,
  body.wdv2-mounted .wd4-export-btn,
  body.wdv2-mounted .wd4-grid-btn,
  body.wdv2-mounted .wd7-add-property{min-height:44px}

  /* Reduce desktop gutters and prevent the status rail from forcing horizontal overflow. */
  body.wdv2-mounted .wd4-canvas{padding:0 12px 88px!important}
  body.wdv2-mounted .wdv2-rail{
    margin:0 14px 14px;
    padding:0 0 12px;
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:10px;
  }
  body.wdv2-mounted .wdv2-rail-left,
  body.wdv2-mounted .wdv2-rail-right{
    width:100%;
    min-width:0;
    flex-wrap:wrap;
    gap:8px 12px;
  }
  body.wdv2-mounted .wdv2-freshness{white-space:normal;min-width:0}
  body.wdv2-mounted .wdv2-filter-chip{max-width:100%}

  /* Finger-safe dashboard card/map interactions. Desktop defaults are 25-36px. */
  body.wdv2-mounted .wd4-card-menu{
    width:44px;
    height:44px;
    right:4px;
    top:4px;
    font-size:15px;
    touch-action:manipulation;
  }
  body.wdv2-mounted .wd4-map-handle{
    width:44px;
    height:44px;
    min-width:44px;
    border-radius:11px;
    font-size:15px;
    touch-action:manipulation;
  }
  body.wdv2-mounted .leaflet-control-zoom a{
    width:44px!important;
    height:44px!important;
    line-height:42px!important;
    font-size:20px!important;
  }
  body.wdv2-mounted .wd4-map-legend{
    left:10px;
    bottom:10px;
    min-width:0;
    max-width:calc(100% - 20px);
    padding:10px 12px;
  }
  body.wdv2-mounted .wd4-map-legend div{
    min-height:30px;
    grid-template-columns:10px minmax(0,1fr) auto;
    gap:8px;
    font-size:11px;
  }
  body.wdv2-mounted .wd4-map-legend b{font-size:11px}
  body.wdv2-mounted .wd4-map-legend i{width:9px;height:9px}

  /* Agent Intel is a modal sheet on mobile; its dismiss control must be finger-safe. */
  body.wdv2-mounted .mobile-intel-close,
  body .mobile-intel-overlay .mobile-intel-close{
    width:44px;
    height:44px;
    min-width:44px;
    min-height:44px;
    right:8px;
    top:10px;
    touch-action:manipulation;
  }

  /* Add Property becomes a phone-native sheet instead of a desktop modal compressed into the viewport. */
  body.wdv2-mounted .wd7-add-modal{
    width:calc(100vw - 20px);
    max-height:calc(100dvh - 20px);
    padding:22px 16px calc(22px + env(safe-area-inset-bottom));
    border-radius:18px;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  body.wdv2-mounted .wd7-add-x{
    width:44px;
    height:44px;
    right:12px;
    top:12px;
    font-size:16px;
    touch-action:manipulation;
  }
  body.wdv2-mounted .wd7-add-modal h2{
    margin-right:52px;
    font-size:24px;
    overflow-wrap:anywhere;
  }
  body.wdv2-mounted .wd7-add-modal>p{font-size:13px;line-height:1.55}
  body.wdv2-mounted #wd7-add-form label{font-size:12px}
  body.wdv2-mounted .wd7-add-search input{
    min-height:48px;
    font-size:16px;
  }
  body.wdv2-mounted .wd7-add-search button{
    min-height:48px;
    font-size:12px;
  }
  body.wdv2-mounted .wd7-add-status{font-size:12px;line-height:1.45}
  body.wdv2-mounted .wd7-match-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.wdv2-mounted .wd7-match-metrics span{font-size:10px}
  body.wdv2-mounted .wd7-match-metrics strong{font-size:18px}
  body.wdv2-mounted .wd7-match-metrics small{font-size:9px}

  /* Profile, notification, invite, and widget overlays must remain readable and finger-safe on phones. */
  body.wdv2-mounted .wd6-pop{
    right:10px!important;
    top:76px!important;
    width:calc(100vw - 20px)!important;
    max-height:calc(100dvh - 88px);
  }
  body.wdv2-mounted .wd6-pop header{padding:14px 14px 12px}
  body.wdv2-mounted .wd6-pop header b{font-size:14px}
  body.wdv2-mounted .wd6-pop header small{font-size:11px}
  body.wdv2-mounted .wd6-pop header>button{
    min-width:44px;
    min-height:44px;
    padding:8px 10px;
    font-size:12px;
    touch-action:manipulation;
  }
  body.wdv2-mounted .wd6-pop nav a,
  body.wdv2-mounted .wd6-pop nav button{
    min-height:52px;
    padding:8px 9px;
  }
  body.wdv2-mounted .wd6-pop nav b{font-size:13px}
  body.wdv2-mounted .wd6-pop nav small{font-size:11px}
  body.wdv2-mounted .wd6-out,
  body.wdv2-mounted .wd6-nfoot{
    min-height:44px;
    font-size:12px;
    touch-action:manipulation;
  }
  body.wdv2-mounted .wd6-note{min-height:58px;padding:11px 14px}
  body.wdv2-mounted .wd6-note b{font-size:12px}
  body.wdv2-mounted .wd6-note small{font-size:11px}
  body.wdv2-mounted .wd6-note em{font-size:10px}
  body.wdv2-mounted .wd4-widget-pop{
    width:calc(100vw - 20px)!important;
    max-height:calc(100dvh - 20px)!important;
    padding:22px 16px calc(20px + env(safe-area-inset-bottom))!important;
  }
  body.wdv2-mounted .wd4-widget-pop h3{font-size:20px!important}
  body.wdv2-mounted .wd4-widget-pop>p{font-size:13px!important}
  body.wdv2-mounted .wd4-widget-option,
  body.wdv2-mounted .wd5-widget-option{min-height:58px!important;font-size:13px!important}
  body.wdv2-mounted .wd4-widget-option button,
  body.wdv2-mounted .wd5-widget-option button,
  body.wdv2-mounted .wd6-wclose,
  body.wdv2-mounted .wd6-x{
    min-width:44px;
    min-height:44px;
    height:44px!important;
    touch-action:manipulation;
  }
  body.wdv2-mounted .wd6-wclose{width:44px;right:12px;top:12px}
  body.wdv2-mounted .wd6-x{width:44px;right:12px;top:12px}
  body.wdv2-mounted .wd6-invite{
    width:calc(100vw - 20px);
    max-height:calc(100dvh - 20px);
    overflow:auto;
    padding:22px 16px calc(20px + env(safe-area-inset-bottom));
    overscroll-behavior:contain;
  }
  body.wdv2-mounted .wd6-invite h2{font-size:22px;margin-right:52px}
  body.wdv2-mounted .wd6-invite>p{font-size:13px}
  body.wdv2-mounted .wd6-invite label{font-size:11px}
  body.wdv2-mounted .wd6-invite input{height:48px;font-size:14px}
  body.wdv2-mounted .wd6-invite>div button,
  body.wdv2-mounted .wd6-invite footer a,
  body.wdv2-mounted .wd6-invite footer button{min-height:48px;height:auto;font-size:12px}

  /* Fixed sponsor/upgrade rail must sit above iOS home indicator and reserve matching content space. */
  body.wdv2-mounted .wdv2-sponsor-bar.wdv2-sponsor-bar-fixed{
    padding-bottom:env(safe-area-inset-bottom)!important;
  }
  body.wdv2-mounted.wdv2-has-sponsor-bar .wd4-canvas,
  body.wdv2-has-sponsor-bar .wd4-canvas{
    padding-bottom:calc(96px + env(safe-area-inset-bottom))!important;
  }
  body.wdv2-mounted .wdv2-sponsor-bar-fixed .wdv2-gt-link{
    min-height:72px;
  }

  /* The loading state must match the real mobile shell, otherwise first paint overflows before mount. */
  .wdv2-skel-top{height:68px;padding:0 12px;gap:10px}
  .wdv2-skel-top i{width:44px;height:44px;border-radius:11px}
  .wdv2-skel-top b{width:92px;height:20px}
  .wdv2-skel-top span{display:none}
  .wdv2-skel-welcome{padding:16px 14px 12px;display:block}
  .wdv2-skel-welcome>div{flex-wrap:wrap}
  .wdv2-skel-welcome>div:last-child{margin-top:12px}
  .wdv2-skel-welcome i{max-width:100%}
  .wdv2-skel-rail{padding:0 14px 12px;gap:8px;flex-wrap:wrap}
  .wdv2-skel-kpis,
  .wdv2-skel-analysis,
  .wdv2-skel-primary{grid-template-columns:1fr;padding:0 12px 12px;gap:12px}
  .wdv2-skel-primary aside{gap:12px}
  .wdv2-skel-table{margin:0 12px;height:300px}
}

@media (max-width: 480px){
  body.wdv2-mounted .wd7-add-search{grid-template-columns:minmax(0,1fr)}
  body.wdv2-mounted .wd7-add-search button{width:100%;min-height:48px}
  body.wdv2-mounted .wd7-match-head{padding:15px 12px 12px;gap:10px}
  body.wdv2-mounted .wd7-match-head h3{font-size:16px;overflow-wrap:anywhere}
  body.wdv2-mounted .wd7-match-foot{align-items:stretch;flex-direction:column}
}

@media (max-width: 420px){
  body.wdv2-mounted .wd4-topbar{padding:0 10px}
  body.wdv2-mounted .wd4-brand-mark{display:none}
  body.wdv2-mounted .wd4-welcome{padding-left:12px!important;padding-right:12px!important}
  body.wdv2-mounted .wd4-canvas{padding-left:10px!important;padding-right:10px!important}
  body.wdv2-mounted .wdv2-rail{margin-left:12px;margin-right:12px}
  body.wdv2-mounted .wd4-map-legend{left:8px;bottom:8px;max-width:calc(100% - 16px)}

  /* Narrow-phone readability: desktop metadata is 10-13px and becomes hard to scan on dense cards. */
  body.wdv2-mounted .brief{font-size:14px;line-height:1.6}
  body.wdv2-mounted .pr-sub{font-size:14px;line-height:1.45;overflow-wrap:anywhere}
  body.wdv2-mounted .pr-line{font-size:15px;line-height:1.6}
  body.wdv2-mounted .fig dt{font-size:12px;line-height:1.35}
  body.wdv2-mounted .fig dd em{font-size:12px;line-height:1.4}
  body.wdv2-mounted .pr-acts{gap:8px}
  body.wdv2-mounted .pr-acts a,
  body.wdv2-mounted .pr-acts button{
    min-height:44px;
    display:inline-flex;
    align-items:center;
    padding:8px 10px;
    font-size:14px;
    line-height:1.25;
    touch-action:manipulation;
  }

  .wdv2-skel-top b{display:none}
}