/* Filter buttons exist on all sizes but only show on mobile */
.imc-ov-filterbtn,.imc-fa-filterbtn{display:none;align-items:center;gap:.4rem}
.imc-ov-filterbtn .imc-ov-count,.imc-fa-filterbtn b{background:#111827;color:#fff;border-radius:999px;padding:.05rem .45rem;font-size:.8em}

/* ---- Overview bottom bar (mobile) ---- */
.imc-ov-bottombar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:30;background:#fff;border-top:1px solid #e5e7eb;padding:.5rem max(.75rem,env(safe-area-inset-right)) max(.5rem,env(safe-area-inset-bottom)) max(.75rem,env(safe-area-inset-left));gap:.5rem;box-shadow:0 -4px 16px rgba(0,0,0,.06)}
.imc-ov-bottombar .imc-ov-btn{flex:1;justify-content:center;min-height:48px;font-size:1em}
body.imc-app-mode .imc-ov-bottombar{bottom:calc(58px + env(safe-area-inset-bottom))}   /* above the app tab bar */

/* ---- App shell nav (app mode only) ---- */
.imc-app-top{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:.6rem;min-height:52px;padding:0 .75rem;background:#fff;border-bottom:1px solid #e5e7eb}
.imc-app-top .imc-app-back{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;border-radius:10px;color:#111827;cursor:pointer}
.imc-app-top .imc-app-title{font-weight:700;font-size:1.05em;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imc-app-top .imc-app-user{font-size:.85em;color:#6b7280}
.imc-app-tabs{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:#fff;border-top:1px solid #e5e7eb;padding-bottom:env(safe-area-inset-bottom);box-shadow:0 -4px 16px rgba(0,0,0,.06)}
.imc-app-tabs a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.15rem;height:58px;text-decoration:none!important;color:#6b7280!important;font-size:.72em;font-weight:600}
.imc-app-tabs a.is-on{color:#2563eb!important}
.imc-app-tabs a.is-report span.imc-app-plus{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:#2563eb;color:#fff;margin-top:-22px;box-shadow:0 4px 12px rgba(37,99,235,.35)}
.imc-app-tabs a.is-report>svg{display:none}
.imc-app-tabs a.is-report .imc-app-plus svg{display:block}
body.imc-app-mode .imc-app-shell{padding-bottom:calc(66px + env(safe-area-inset-bottom))}
body.imc-app-mode .imc-ov-body{padding-bottom:5.5rem}
body.imc-app-mode .imc-ov-view-split.imc-ov-mobile-map .imc-ov-mapwrap{top:52px!important;bottom:calc(58px + env(safe-area-inset-bottom) + 4.6rem);height:calc(100dvh - 52px - 58px - 4.6rem - env(safe-area-inset-bottom))}

/* 311 Snap – mobile refinements (all pages) */
@media (max-width:760px){
  /* Inputs: 16px stops iOS zooming on focus; 44px tap targets */
  .imc-ov input,.imc-ov select,.imc-rf input,.imc-rf select,.imc-rf textarea,.imc-lg input,.imc-fa input,.imc-fa select,.imc-sg textarea{font-size:16px!important}
  .imc-ov-btn,.imc-rf-btn,.imc-lg-btn,.imc-sg-btn,.imc-fa-btn,.imc-ov-chip,.imc-mapctl button{min-height:44px}
  .imc-mapctl{top:8px;right:8px;gap:3px}
  .imc-mapctl button{width:36px!important;height:36px!important;font-size:18px!important;border-radius:7px!important}
  .imc-mapctl button svg{width:16px;height:16px}
  .imc-ov-mapwrap .gm-fullscreen-control,.imc-ov-mapwrap .imc-mapctl{top:8px}
  .imc-ov-mapwrap .gm-fullscreen-control{display:none!important}
  .imc-mapctl [data-act="city"]{display:none}                        /* fit-to-city is on the bottom bar's Map toggle path; keep the stack short */

  /* ---- Overview: issues first, filters behind a button, sticky actions ---- */
  .imc-ov-toolbar{position:sticky;top:0;z-index:20;background:#fff;padding:.5rem 0;margin:0 0 .5rem;border-bottom:1px solid var(--ov-line)}
  .imc-ov-search{flex:1 1 100%}
  .imc-ov-toolbar-right{width:100%;justify-content:space-between}
  .imc-ov-toolbar-right .imc-ov-btn-primary{display:none}          /* Report lives in the bottom bar */
  .imc-ov-viewtoggle{display:inline-flex}
  .imc-ov-chips{display:none}
  .imc-ov.is-filters-open .imc-ov-chips{display:flex}
  .imc-ov-filterbtn{display:inline-flex!important}
  .imc-ov-catselect .imc-ov-select{max-width:100%}
  .imc-ov-meta{padding:0 .1rem}
  .imc-ov-card{grid-template-columns:96px 1fr}
  .imc-ov-card-excerpt{-webkit-line-clamp:2}
  .imc-ov-card-addr{max-width:100%}
  .imc-ov-body{padding-bottom:0;gap:.75rem}
  .imc-ov{padding-bottom:5rem}                                            /* room for the bottom bar */
  .imc-ov-bottombar{display:flex!important}
  .imc-ov-fab{display:none!important}                                  /* replaced by the bottom bar toggle */
  .imc-ov-view-split .imc-ov-mapwrap{display:block;position:static}   /* map sits right under the list on phones */
  .imc-ov-view-split .imc-ov-map{height:52vh;min-height:300px}
  .imc-ov-view-map .imc-ov-map{height:calc(100dvh - 250px);min-height:360px}
  .imc-ov-view-list .imc-ov-mapwrap{display:none}
  .imc-ov-list:empty{display:none}
  .imc-ov-more{margin:.5rem 0}
  .imc-ov.imc-ov-mobile-map{container-type:normal}   /* layout containment would trap the fixed map inside the container */
  .imc-ov-view-split.imc-ov-mobile-map .imc-ov-mapwrap{display:block!important;position:fixed!important;top:0!important;left:0;right:0;bottom:4.6rem;height:calc(100dvh - 4.6rem);z-index:25;background:#fff;padding:0}
  .imc-ov-view-split.imc-ov-mobile-map .imc-ov-map{height:100%!important;min-height:0;border-radius:0;border:0}
  .imc-ov-view-split.imc-ov-mobile-map .imc-ov-legend{position:absolute;left:.5rem;right:.5rem;bottom:.5rem;background:rgba(255,255,255,.92);padding:.4rem .6rem;border-radius:10px;margin:0}
  .imc-ov-view-split.imc-ov-mobile-map .imc-ov-list{display:none}

  /* ---- Report form: sticky submit, taller map, location buttons full width ---- */
  .imc-rf-grid{gap:.9rem}
  .imc-rf-section{padding:.9rem 1rem 1rem;border-radius:12px}
  .imc-rf-addr{grid-template-columns:1fr 1fr}
  .imc-rf-addr .imc-rf-input{grid-column:1/-1}
  .imc-rf-addr .imc-rf-btn span{display:inline}
  .imc-rf-map{height:min(60vh,420px)!important}
  .imc-rf-foot{position:sticky;bottom:0;z-index:20;background:#fff;padding:.6rem 0 max(.6rem,env(safe-area-inset-bottom));margin-top:.6rem;border-top:1px solid var(--rf-line)}
  .imc-rf-foot .imc-rf-error{flex:1 1 100%}
  .imc-rf-submit{width:100%;min-width:0}
  .imc-rf-drop{padding:.8rem}

  /* ---- Single issue ---- */
  .imc-sg-media{min-height:200px;max-height:260px}
  .imc-sg-title{font-size:1.35em}
  .imc-sg-top-actions{width:100%;justify-content:flex-start}
  .imc-sg-map{height:240px}

  /* ---- Dashboard / staff: scrollable sticky tabs, filters behind a button, compact rows ---- */
  .imc-fa-tabs{display:flex!important;position:sticky;top:0;z-index:20;background:#fff;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:0}
  .imc-fa-tabs::-webkit-scrollbar{display:none}
  .imc-fa-tabs a{white-space:nowrap;padding:.7rem .75rem}
  .imc-fa-tabs .imc-fa-tab-right{margin-left:auto}
  .imc-fa-brand{font-size:1em}
  .imc-fa-tiles{display:flex;overflow-x:auto;gap:.4rem;padding-bottom:.3rem;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .imc-fa-tiles::-webkit-scrollbar{display:none}
  .imc-fa-tile{flex:0 0 auto;min-width:112px;padding:.5rem .7rem}.imc-fa-tile strong{font-size:1.2rem}
  .imc-fa-filters{display:none;flex-direction:column}
  .imc-fa-filters select,.imc-fa-filters input{width:100%!important;min-width:0}
  .imc-fa.is-filters-open .imc-fa-filters{display:flex}
  .imc-fa-filterbtn{display:inline-flex!important;margin-bottom:.6rem}
  .imc-fa-qrow{padding:.6rem}
  .imc-fa-detail-grid form{flex-direction:column;align-items:stretch}
  .imc-fa-detail-grid select,.imc-fa-detail-grid input[type=text]{width:100%!important;max-width:none}
  .imc-fa-cols{gap:1rem}

  /* ---- Login ---- */
  .imc-lg{padding:.5rem 0 1rem}.imc-lg-card{border:0;box-shadow:none;padding:1rem .25rem}
}


body.imc-app-mode .imc-fa-brand{display:none}
body.imc-app-mode .imc-ov-mobile-map .imc-ov-toolbar{visibility:hidden}

/* ---- Elementor / page-builder wrappers: don't let the section that holds a 311 page stay taller than its content.
        Only heights are touched (alignment/padding are left alone so widths stay intact). ---- */
@media (max-width:760px){
  .elementor-section:has(.imc-ov),.elementor-section:has(.imc-rf),.elementor-section:has(.imc-sg),.elementor-section:has(.imc-fa),.elementor-section:has(.imc-lg),
  .e-con:has(.imc-ov),.e-con:has(.imc-rf),.e-con:has(.imc-sg),.e-con:has(.imc-fa),.e-con:has(.imc-lg),
  .elementor-section:has(.imc-ov)>.elementor-container,.e-con:has(.imc-ov)>.e-con-inner,
  .elementor-column:has(.imc-ov),.elementor-widget-wrap:has(.imc-ov),
  main:has(.imc-ov),article:has(.imc-ov),.site-content:has(.imc-ov),.content-area:has(.imc-ov),.entry-content:has(.imc-ov),.page-content:has(.imc-ov){
    min-height:0!important;height:auto!important
  }
  body:has(.imc-ov) #content,body:has(.imc-ov) .site-main,body:has(.imc-ov) #primary,body:has(.imc-ov) main{min-height:0!important;flex-grow:0!important}
  .imc-ov{width:100%!important;max-width:100%!important;flex:1 1 100%!important;align-self:stretch!important}
  .elementor-widget:has(.imc-ov),.elementor-widget-container:has(.imc-ov){width:100%!important;max-width:100%!important}
}

@media (max-width:760px){.imc-fa-layout{display:block}.imc-fa-side{display:none}.imc-kpis{grid-template-columns:1fr 1fr}.imc-bar{grid-template-columns:minmax(90px,40%) 1fr auto}}