/* WordPress-only rules on top of the prototype design system (app.css). */

.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--surface);padding:8px 12px;border-radius:8px}
.skip:focus{left:12px}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.anno{display:none!important} /* prototype spec notes never ship */

a.qf,a.cat-chip,a.chip,a.fchip,.st-link,.tb-item,a.tile,.sug-i,.article-card,a.box{text-decoration:none}

/* header menu links come from wp_nav_menu as bare <a> */
.nav a.on{background:var(--chip);border-radius:10px}

/* maps: raster tiles under the prototype's pins */
.mapbox,#catMap{position:relative;width:100%;height:100%;background:var(--map-water,#cfe4ea)}
.leaflet-container{font:inherit;background:var(--map-water,#cfe4ea)}
.leaflet-control-attribution{font-size:10.5px;background:rgb(255 255 255 / .8)!important}
.mc span{display:grid;place-items:center;border-radius:50%;background:var(--map-dot);color:#fff;font-weight:700;font-size:13px;border:3px solid rgb(255 255 255 / .9);box-shadow:0 2px 8px rgb(0 0 0 / .3);font-variant-numeric:tabular-nums}
.m8-pin.is-doc::before{background:var(--brand)}
.m8-pin.is-partner::before{background:var(--sun)}
.m8-pin.is-hover::before{background:var(--dark)}
.mmj-pop .leaflet-popup-content{margin:12px 14px;width:auto!important;min-width:200px}
.leaflet-container a{color:inherit}
.leaflet-container a.pc-btn.dark{color:var(--bg)}
.mmj-pop .leaflet-popup-content-wrapper{border-radius:14px;padding:0}
.mmj-pop .pc{box-shadow:none;border:0}
.pmap{height:300px;border-radius:14px;overflow:hidden;border:1px solid var(--line);position:relative}
.home-map{background:var(--map-water,#cfe4ea)}
.mtoggle{display:none}
@media (max-width:860px){
  body.is-cat .mtoggle{display:block;position:fixed;left:50%;transform:translateX(-50%);bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:75;border:0;border-radius:999px;background:var(--dark);color:var(--bg);font-weight:600;padding:12px 22px;box-shadow:0 6px 18px rgb(0 0 0 / .3)}
}

/* home: states */
.state-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:6px}
.st-link{display:flex;justify-content:space-between;gap:8px;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);text-decoration:none}
.st-link:hover{border-color:var(--brand)}

/* listing extras */
.city-list{max-height:420px;overflow:auto}
.cat-list .section{padding-block:22px 6px}
.cat-list .section h2{margin-bottom:12px;font-size:20px}
.faq details{margin-bottom:8px}
.faq summary{cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";float:right;color:var(--muted)}
.faq details[open] summary::after{content:"–"}
.faq p{margin:10px 0 0}
.pager-wrap .nav-links{display:flex;gap:6px;flex-wrap:wrap;margin-top:18px}
.pager-wrap .page-numbers{padding:8px 12px;border:1px solid var(--line);border-radius:10px;text-decoration:none}
.pager-wrap .page-numbers.current{background:var(--dark);color:var(--bg)}
button.pg-n{border:1px solid var(--line);background:var(--surface);cursor:pointer}

/* provider page */
.provider .clinic-head{padding-bottom:40px}
.prices td{padding:6px 0}
.prices td:last-child{text-align:right}
.rdist{display:grid;gap:4px;max-width:420px}
.rd-row{display:grid;grid-template-columns:32px 1fr 48px;gap:8px;align-items:center;font-size:13px}
.rd-bar{height:8px;border-radius:4px;background:var(--sunk);overflow:hidden}
.rd-bar i{display:block;height:100%;background:var(--sun)}
.rvswipe{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,320px);gap:12px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x mandatory}
.rvswipe>*{scroll-snap-align:start}
.actbar{display:none}
@media (max-width:860px){
  .mmj-provider .actbar{display:flex;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:var(--surface);border-top:1px solid var(--line)}
  .mmj-provider .actbar .btn{flex:1;justify-content:center}
  .mmj-provider .foot{padding-bottom:84px}
}

/* telehealth */
.tele-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px;margin-top:16px}
.tele-card{position:relative}
.tele-card .pc-stretch::after{content:"";position:absolute;inset:0}

/* forms */
.lead-form label{display:flex;flex-direction:column;gap:4px;font-size:14px;font-weight:500}
.lead-form input,.lead-form select,.lead-form textarea{padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}

/* blog */
.article{max-width:760px;margin:0 auto;padding-block:14px 48px}
.article h1{font-size:clamp(26px,3.4vw,38px);line-height:1.15}
.article .lead{font-size:17px;color:var(--muted);margin:0}
.article-cover img{width:100%;height:auto;border-radius:14px}
.prose{line-height:1.7}
.prose h2{margin:28px 0 10px}
.prose h3{margin:22px 0 8px}
.prose img{max-width:100%;height:auto;border-radius:12px}
.prose table{border-collapse:collapse;width:100%}
.prose td,.prose th{border:1px solid var(--line);padding:8px}
.article-card .cover img{width:100%;height:100%;object-fit:cover}
.foot-note{grid-column:1/-1;font-size:12.5px;margin:12px 0 0}

/* drawer chips are <label><input></label> (works without JS); the native control is visually hidden */
.fchip{position:relative;cursor:pointer}
.fchip input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.fchip:focus-within{outline:2px solid var(--brand);outline-offset:2px}
#fdForm{display:flex;flex-direction:column;flex:1;min-height:0}

/* Provider photos: hotlinked from Google Maps / Weedmaps, initials stay underneath as the fallback */
.pc-ph{overflow:hidden}
.pc-ph .pc-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pc-ph .pc-img.is-logo{inset:auto;width:56%;height:auto;max-height:70%;object-fit:contain;border-radius:10px;background:#fff;padding:6px}
.pc-ph .badge{z-index:1}
.ph-hero{position:relative;margin:0;border-radius:16px;overflow:hidden;background:var(--line,#e6e8e6);aspect-ratio:3/2;max-height:340px}
.ph-hero img{width:100%;height:100%;object-fit:cover;display:block}
.ph-hero img.is-logo{object-fit:contain;padding:12%;background:#fff}
.ph-hero figcaption{position:absolute;right:8px;bottom:8px;font-size:12px;background:rgba(0,0,0,.55);color:#fff;padding:3px 8px;border-radius:6px}
.ph-hero figcaption a{color:#fff}

/* contrast (Lighthouse / WCAG AA 4.5:1) */
.qf .num{opacity:.78}
.pc-link.is-off{opacity:1;color:var(--muted)}