/* Krousty Factory store locator.
   Everything is scoped under .kf-loc, and every button sets its own colours for :hover and
   :focus, because the theme styles bare buttons and links (pink borders and backgrounds). */

.kf-loc{--kf-p:#702871;--kf-p-soft:#E5D3E5;--kf-o:#FFB14B;--kf-k:#161416;--kf-head:"fatbold",Anton,sans-serif;--kf-frame:4px solid var(--kf-k);font-family:Montserrat,sans-serif;color:var(--kf-k);width:100%}
.kf-loc *,.kf-loc *::before,.kf-loc *::after{box-sizing:border-box}
.kf-loc button{margin:0;border-radius:0;box-shadow:none;text-transform:none;letter-spacing:normal;line-height:normal;-webkit-appearance:none;appearance:none}

/* sizes follow the site's Elementor breakpoints: desktop >1366, laptop ≤1366, tablet ≤1024, mobile ≤767 */
.kf-loc .kf-loc__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:24px;height:700px}

/* list panel */
.kf-loc .kf-panel{background:var(--kf-p);border:var(--kf-frame);display:flex;flex-direction:column;min-height:0;min-width:0}
.kf-loc .kf-panel__top{padding:16px 16px 10px;border-bottom:2px solid rgba(255,255,255,.18);container-type:inline-size}
.kf-loc .kf-searchrow{display:flex;gap:6px}
.kf-loc .kf-search,.kf-loc .kf-search:focus{flex:1;min-width:0;height:auto;margin:0;border:0;border-radius:0;padding:12px 14px;background:#fff;font:600 14px Montserrat,sans-serif;color:var(--kf-k);outline:none;-webkit-appearance:none;appearance:none}
.kf-loc .kf-search:focus{box-shadow:inset 0 0 0 3px var(--kf-o)}
.kf-loc .kf-near,.kf-loc .kf-near:focus{flex:none;display:flex;align-items:center;gap:6px;border:0;background:var(--kf-o);color:var(--kf-k);font:800 11px Montserrat,sans-serif;text-transform:uppercase;letter-spacing:.3px;padding:0 12px;cursor:pointer;white-space:nowrap}
.kf-loc .kf-near svg{width:16px;height:16px;flex:none}
.kf-loc .kf-near:hover{background:#fff;color:var(--kf-k)}
.kf-loc .kf-near:focus-visible{outline:3px solid #fff;outline-offset:-3px}
.kf-loc .kf-near[aria-busy=true]{opacity:.7;cursor:progress}
.kf-loc .kf-filters{display:flex;gap:6px;margin-top:10px}
.kf-loc .kf-chip,.kf-loc .kf-chip:focus{flex:1 1 auto;font:800 11px Montserrat,sans-serif;text-transform:uppercase;letter-spacing:.3px;padding:8px 6px;border:1.5px solid #fff;background:transparent;color:#fff;cursor:pointer;white-space:nowrap}
.kf-loc .kf-chip__n{font-weight:600;opacity:.85}
.kf-loc .kf-chip:hover{border-color:var(--kf-o);background:transparent;color:var(--kf-o)}
.kf-loc .kf-chip[aria-pressed=true],.kf-loc .kf-chip[aria-pressed=true]:hover,.kf-loc .kf-chip[aria-pressed=true]:focus{background:var(--kf-o);border-color:var(--kf-o);color:var(--kf-k)}
.kf-loc .kf-chip:focus-visible{outline:3px solid var(--kf-o);outline-offset:2px}
.kf-loc .kf-status{color:var(--kf-o);font-size:12px;font-weight:700;margin-top:10px}
.kf-loc .kf-status:empty{display:none}
@container (max-width:370px){.kf-loc .kf-chip__n{display:none}}
@container (max-width:300px){.kf-loc .kf-near span{display:none}.kf-loc .kf-chip{font-size:10px}}

.kf-loc .kf-list{list-style:none;margin:0;padding:6px 16px 16px;overflow-y:auto;flex:1;scrollbar-color:var(--kf-o) transparent}
.kf-loc .kf-item{margin:0;padding:0;border-bottom:1px solid rgba(255,255,255,.18);color:#fff;list-style:none}
.kf-loc .kf-item__head,.kf-loc .kf-item__head:hover,.kf-loc .kf-item__head:focus{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:none;border:0;padding:12px;color:inherit;font:inherit;cursor:pointer;white-space:normal}
.kf-loc .kf-item__head:focus-visible{outline:3px solid var(--kf-o);outline-offset:-3px}
.kf-loc .kf-item__head:hover .kf-item__name{color:var(--kf-o)}
.kf-loc .kf-item__main{flex:1;min-width:0}
.kf-loc .kf-item__name{display:block;font-family:var(--kf-head);text-transform:uppercase;font-size:34px;line-height:1.02}
.kf-loc .kf-item__addr{display:block;font-size:14px;font-weight:600;color:var(--kf-p-soft);margin-top:3px;line-height:1.4}
/* distance: right-hand column, number over unit */
.kf-loc .kf-item__dist{flex:none;display:flex;flex-direction:column;align-items:flex-end;line-height:1;color:var(--kf-o)}
.kf-loc .kf-item__dist b{font-family:var(--kf-head);font-weight:400;font-size:26px}
.kf-loc .kf-item__dist small{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;margin-top:2px}
/* selected restaurant: white card lifted by a short orange offset */
.kf-loc .kf-item.is-active{background:#fff;color:var(--kf-k);border-bottom-color:transparent;margin:8px 4px 12px 0;box-shadow:4px 4px 0 var(--kf-o)}
.kf-loc .kf-item.is-active .kf-item__head{padding:16px 18px}
.kf-loc .kf-item.is-active .kf-item__name,.kf-loc .kf-item.is-active .kf-item__head:hover .kf-item__name{color:var(--kf-p)}
.kf-loc .kf-item.is-active .kf-item__addr{color:var(--kf-k);margin-top:5px}
.kf-loc .kf-item.is-active .kf-item__dist{color:var(--kf-p);padding-left:14px;border-left:2px solid #EDE3ED}
.kf-loc .kf-item.is-active .kf-item__dist b{font-size:34px}
/* separator under the selected card (one-column lists only; the 2-column tablet grid keeps its row lines) */
@media (min-width:1025px),(max-width:767px){.kf-loc .kf-item.is-active + .kf-item{border-top:1px solid rgba(255,255,255,.18)}}
.kf-loc .kf-empty{color:#fff;padding:20px 12px;font-weight:600;list-style:none}

/* map */
.kf-loc .kf-mapwrap{position:relative;min-height:0;min-width:0;border:var(--kf-frame);background:#EAE6E0;overflow:hidden}
.kf-loc .kf-map{position:absolute;inset:0;z-index:0}
.kf-loc .kf-map .maplibregl-ctrl-attrib{font-size:11px}
.kf-loc .kf-map .maplibregl-cooperative-gesture-screen{font-family:inherit;font-weight:700;font-size:18px;background:rgba(112,40,113,.75)}
.kf-loc .kf-map .maplibregl-ctrl-attrib a{color:#333}
.kf-loc .kf-zoom{position:absolute;top:12px;left:12px;z-index:2;display:flex;flex-direction:column;gap:3px}
.kf-loc .kf-zoom button,.kf-loc .kf-zoom button:focus{width:36px;height:36px;border:0;background:var(--kf-p);color:#fff;font:800 22px/1 Montserrat,sans-serif;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center}
.kf-loc .kf-zoom button:hover{background:var(--kf-k);color:#fff}
.kf-loc .kf-pin,.kf-loc .kf-pin:hover,.kf-loc .kf-pin:focus{display:block;background:none;border:0;padding:0;cursor:pointer;line-height:0}
.kf-loc .kf-pin svg{display:block;filter:drop-shadow(0 2px 3px rgba(22,20,22,.35));transition:transform .12s;transform-origin:50% 100%}
.kf-loc .kf-pin:hover svg{transform:scale(1.1)}
.kf-loc .kf-pin:focus-visible{outline:3px solid var(--kf-k);outline-offset:2px}
.kf-loc .kf-pin.is-active{z-index:3}
.kf-loc .kf-pin__label{position:absolute;left:50%;bottom:calc(100% + 6px);transform:translateX(-50%);background:var(--kf-p);color:#fff;font-family:var(--kf-head);text-transform:uppercase;font-size:15px;line-height:1.1;letter-spacing:.3px;white-space:nowrap;padding:6px 11px 5px;pointer-events:none;border:2px solid var(--kf-o)}
.kf-loc .kf-pin__label::after{content:"";position:absolute;left:50%;top:100%;margin-left:-6px;border:6px solid transparent;border-top-color:var(--kf-o)}
.kf-loc .kf-cluster,.kf-loc .kf-cluster:focus{width:42px;height:42px;background:var(--kf-o);color:var(--kf-p);border:3px solid var(--kf-p);display:flex;align-items:center;justify-content:center;font-family:var(--kf-head);font-size:18px;line-height:1;cursor:pointer;padding:0;transition:background .12s}
.kf-loc .kf-cluster:hover{background:#fff;color:var(--kf-p)}
.kf-loc .kf-origin{width:16px;height:16px;background:var(--kf-k);border:3px solid #fff;box-shadow:0 0 0 2px var(--kf-k)}
.kf-loc .kf-me{width:18px;height:18px;border-radius:50%;background:#2D7FF9;border:3px solid #fff;box-shadow:0 0 0 6px rgba(45,127,249,.25)}

/* order bar, same as the site's existing icon bar */
.kf-loc .kf-order{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:2;display:flex;gap:22px;align-items:center;background:var(--kf-p);border:4px solid var(--kf-o);padding:12px 24px}
.kf-loc .kf-order[hidden]{display:none}
.kf-loc .kf-order a{display:block;line-height:0;transition:transform .12s}
.kf-loc .kf-order a:hover{transform:translateY(-3px)}
.kf-loc .kf-order img{width:65px;height:65px;max-width:none;display:block;border:0;border-radius:0;box-shadow:none}

/* laptop */
@media (max-width:1366px){
 .kf-loc .kf-loc__grid{height:620px;gap:20px}
 .kf-loc .kf-item__name{font-size:28px}
 .kf-loc .kf-item__addr{font-size:13px}
 .kf-loc .kf-order img{width:54px;height:54px}
}

/* tablet: one column — search box, then map, then the list */
@media (max-width:1024px){
 .kf-loc .kf-loc__grid{display:flex;flex-direction:column;height:auto;gap:16px}
 .kf-loc .kf-panel{display:contents}
 .kf-loc .kf-panel__top{order:1;background:var(--kf-p);border:var(--kf-frame);padding:16px}
 .kf-loc .kf-mapwrap{order:2;height:490px;scroll-margin-top:12px}
 .kf-loc .kf-list{order:3;background:var(--kf-p);border:var(--kf-frame);overflow:visible;padding:10px 16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}
 .kf-loc .kf-item__name{font-size:26px}
}

/* mobile */
@media (max-width:767px){
 .kf-loc .kf-loc__grid{gap:12px}
 .kf-loc .kf-panel__top{padding:12px}
 .kf-loc .kf-mapwrap{height:340px}
 /* one column, about 5 restaurants visible (exact height set by locator.js), scroll for the rest */
 .kf-loc .kf-list{grid-template-columns:1fr;padding:6px 8px 6px 12px;overflow-y:auto;-webkit-overflow-scrolling:touch;max-height:470px}
 .kf-loc .kf-list::-webkit-scrollbar{width:8px}
 .kf-loc .kf-list::-webkit-scrollbar-track{background:rgba(255,255,255,.15)}
 .kf-loc .kf-list::-webkit-scrollbar-thumb{background:var(--kf-o)}
 .kf-loc .kf-item__name{font-size:30px}
 .kf-loc .kf-item__addr{font-size:14px}
 .kf-loc .kf-item__dist b{font-size:26px}
 .kf-loc .kf-item.is-active .kf-item__dist b{font-size:32px}
 .kf-loc .kf-order{gap:16px;padding:5px 20px;bottom:24px}
 .kf-loc .kf-order img{width:50px;height:50px}
 .kf-loc .kf-zoom button{width:32px;height:32px;font-size:20px}
}