/* Header v2 (20.10): fold-out menus + cart drawer. Loaded only with the option reef_header_v2 (inc/header-v2.php). */

/* ---------- header row ---------- */
.rf-header-v2 .rf-wrap{gap:20px}
.rf-hact{display:flex;align-items:center;gap:8px}
.rf-cartbtn{position:relative;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border:1px solid var(--line);border-radius:999px;color:var(--navy);text-decoration:none;font-family:var(--mfe);font-size:15px;white-space:nowrap;transition:border-color var(--t)}
.rf-cartbtn:hover{border-color:var(--orange)}
.rf-cartbtn svg{width:22px;height:22px;fill:var(--navy)}
.rf-cartbtn-n{position:absolute;top:-7px;inset-inline-end:-5px;min-width:21px;height:21px;padding:0 6px;border-radius:11px;background:var(--orange);color:var(--navy);box-shadow:0 0 0 2px #fff;font:700 12.5px/21px system-ui,-apple-system,"Segoe UI",Arial,sans-serif;text-align:center}
.rf-cartbtn-n[hidden]{display:none}
.rf-hmenu{display:none}

/* ---------- desktop: bar + fold-out panels ---------- */
.rf-mnav{margin-inline:auto;align-self:stretch;display:flex;font-family:var(--mfe)}
.rf-mnav-head,.rf-mnav-foot{display:none}
.rf-mnav-nav{display:flex;align-self:stretch}
.rf-mnav-list{display:flex;align-items:stretch;gap:2px;list-style:none;margin:0;padding:0}
.rf-mi{display:flex;align-items:center;position:static}
.rf-mi-a{position:relative;display:inline-flex;align-items:center;padding:12px 12px;color:var(--navy);text-decoration:none;font-size:16px;border-radius:8px;transition:color var(--t)}
.rf-mi.has-panel > .rf-mi-a{padding-inline-end:2px}
.rf-mi-a::before{content:"";position:absolute;inset-inline:12px;bottom:4px;height:3px;border-radius:3px;background:var(--grad);transform:scaleX(0);transition:transform .25s ease}
.rf-mi-a:hover,.rf-mi:hover > .rf-mi-a,.rf-mi.open > .rf-mi-a{color:var(--orange-ink)}
.rf-mi-a:hover::before,.rf-mi-a[aria-current]::before,.rf-mi.is-cur > .rf-mi-a::before{transform:scaleX(1)}
.rf-mi-a[aria-current],.rf-mi.is-cur > .rf-mi-a{font-weight:700}
.rf-mi-t,.rf-col-t,.rf-hmenu,.rf-cartbtn,.rf-mnav-x,.rf-dw-x,.rf-qty button{-webkit-tap-highlight-color:transparent}
.rf-mi-t{display:inline-grid;place-items:center;width:26px;height:40px;margin-inline-end:6px;padding:0;background:none;border:0;border-radius:6px;color:var(--navy);cursor:pointer}
.rf-mi-t::after{content:"";width:7px;height:7px;border:solid currentColor;border-width:0 0 2px 2px;transform:rotate(-45deg);margin-top:-4px;opacity:.7;transition:transform .2s ease}
.rf-mi.open > .rf-mi-t::after,.rf-mi:hover > .rf-mi-t::after{transform:rotate(135deg);margin-top:4px}
.rf-mi-tl{display:none}

.rf-panel{position:absolute;inset-inline:0;top:100%;background:#fff;border-top:1px solid var(--line);box-shadow:0 30px 40px -28px rgba(6,2,32,.38);z-index:60;
  visibility:hidden;opacity:0;transform:translateY(-6px);transition:opacity .16s ease .12s,transform .16s ease .12s,visibility 0s linear .3s}
.rf-mi:hover > .rf-panel,.rf-mi.open > .rf-panel{visibility:visible;opacity:1;transform:none;transition-delay:.06s,.06s,0s}
.rf-mnav-list:hover .rf-mi:not(:hover):not(.open) > .rf-panel{transition-delay:0s,0s,.16s}
.rf-header .rf-panel-in{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:36px;min-height:0;align-items:start;padding-block:26px 20px}
.rf-header .rf-panel-areas .rf-panel-in{grid-template-columns:minmax(0,1fr)}
.rf-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px 30px;align-content:start}
.rf-panel-areas .rf-cols{grid-template-columns:repeat(7,minmax(0,1fr))}
.rf-panel-areas .rf-col:first-child{grid-column:span 2}
.rf-panel-areas .rf-col:first-child ul{columns:2;column-gap:24px}
.rf-col-h{margin:0 0 6px;padding-bottom:8px;border-bottom:1px solid var(--line);color:var(--navy);font-weight:700;font-size:15px}
.rf-col-h a{display:inline-block;padding-block:3px;color:inherit;text-decoration:none}
.rf-col-h a:hover{color:var(--orange-ink)}
.rf-col-t{display:none}
.rf-col ul{list-style:none;margin:0;padding:0}
.rf-col li{break-inside:avoid}
.rf-col li a{display:block;padding:6px 0;color:var(--slate);font-size:15px;line-height:1.35;text-decoration:none;transition:color var(--t)}
.rf-col li a:hover{color:var(--orange-ink)}
.rf-col li a[aria-current]{color:var(--navy);font-weight:700}
.rf-col li a[aria-current]::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--orange);margin-inline-end:7px;vertical-align:middle}
.rf-panel-shop .rf-cols{grid-template-columns:minmax(0,2.2fr) minmax(0,1fr)}
.rf-tiles{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.rf-tiles a{display:flex!important;align-items:center;gap:12px;padding:8px!important;border:1px solid var(--line);border-radius:14px;color:var(--navy)!important;font-weight:700;transition:border-color var(--t),box-shadow var(--t)}
.rf-tiles a:hover{border-color:var(--orange);box-shadow:0 10px 22px -16px rgba(6,2,32,.45)}
.rf-tile-img{flex:none;display:grid;place-items:center;width:58px;height:58px;border-radius:10px;background:var(--grey);overflow:hidden}
.rf-tile-img img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.rf-tile-img:empty::before{content:"";width:22px;height:22px;border-radius:6px;border:2px solid #D5D5DC}
.rf-tile-t{line-height:1.3}
.rf-panel-aside{align-self:start;background:#FFF7F1;border:1px solid #FFE0C8;border-radius:14px;padding:18px 18px 16px}
.rf-panel-aside .h{margin:0 0 6px;color:var(--navy);font-weight:700;font-size:17px}
.rf-panel-aside p{margin:0 0 12px;color:var(--slate);font-size:15px;line-height:1.5;font-family:var(--sys)}
.rf-pair-s{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rf-pair-s .btn{min-height:44px;padding:8px 10px;font-size:16px;border-radius:12px;box-shadow:none}
.rf-pair-s .btn svg{width:18px;height:18px}
.rf-panel-all{grid-column:1/-1;margin:0;padding-top:14px;border-top:1px solid var(--line)}
.rf-panel-all a{display:inline-block;padding-block:4px;color:var(--orange-ink);font-weight:700;font-size:15px;text-decoration:none}
.rf-panel-all a::after{content:" ←"}
.rf-panel-all a:hover{text-decoration:underline}

/* ---------- phone / tablet: drawer ---------- */
@media (max-width:1100px){
  .rf-header-v2 .rf-wrap{gap:10px}
  .rf-hact{margin-inline-start:auto;gap:8px}
  .rf-cartbtn{padding:8px 11px;border-radius:12px}
  .rf-cartbtn-l{display:none}
  .rf-hmenu{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:8px 13px;background:#fff;border:1px solid var(--line);border-radius:12px;color:var(--navy);font-family:var(--mfe);font-size:15px;cursor:pointer}
  .rf-hmenu svg{width:22px;height:22px;fill:currentColor}

  .rf-mnav{position:fixed;inset-block:0;inset-inline-start:0;width:min(420px,90vw);margin:0;flex-direction:column;background:#fff;z-index:2;box-shadow:0 0 40px rgba(6,2,32,.25);
    transform:translateX(100%);visibility:hidden;transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s linear .28s}
  html[dir="ltr"] .rf-mnav{transform:translateX(-100%)}
  html.rf-nav-open .rf-mnav{transform:none;visibility:visible;transition-delay:0s}
  html.rf-nav-open .rf-header{z-index:2147483000}
  .rf-scrim{position:fixed;inset:0;background:rgba(6,2,32,.5);z-index:1;opacity:0;visibility:hidden;transition:opacity .25s ease,visibility 0s linear .25s}
  html.rf-nav-open .rf-scrim{opacity:1;visibility:visible;transition-delay:0s}

  .rf-mnav-head{display:flex;align-items:center;justify-content:space-between;padding:10px 12px 10px 8px;padding-inline:20px 8px;border-bottom:1px solid var(--line);flex:none}
  .rf-mnav-head .h{margin:0;color:var(--navy);font-weight:700;font-size:19px}
  .rf-mnav-x,.rf-dw-x{display:grid;place-items:center;width:44px;height:44px;background:none;border:0;border-radius:10px;color:var(--navy);cursor:pointer}
  .rf-mnav-x svg{width:24px;height:24px;fill:currentColor}
  .rf-mnav-nav{display:block;flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .rf-mnav-list{display:block}
  .rf-mi{display:block;border-bottom:1px solid var(--line)}
  .rf-mi-a{display:flex;min-height:54px;padding:14px 20px;font-size:18px;border-radius:0}
  .rf-mi-a::before{display:none}
  .rf-mi-a[aria-current]{box-shadow:inset -4px 0 0 var(--orange)}
  .rf-mi.has-panel > .rf-mi-a{display:none}
  .rf-mi-t{display:flex;align-items:center;justify-content:space-between;width:100%;height:auto;min-height:54px;margin:0;padding:14px 20px;border-radius:0;font:inherit;font-size:18px;color:var(--navy);text-align:start}
  .rf-mi-tl{display:inline}
  .rf-mi-t::after{content:"+";width:auto;height:auto;border:0;transform:none;margin:0;font-size:24px;line-height:1;opacity:.75;transition:none}
  .rf-mi.open > .rf-mi-t::after,.rf-mi:hover > .rf-mi-t::after{transform:none;margin:0}
  .rf-mi.open > .rf-mi-t::after{content:"\2212"}
  .rf-mi.open > .rf-mi-t{font-weight:700}
  .rf-mi.is-cur > .rf-mi-t{box-shadow:inset -4px 0 0 var(--orange)}

  .rf-panel,.rf-mi:hover > .rf-panel{position:static;display:none;visibility:visible;opacity:1;transform:none;transition:none;box-shadow:none;border:0;background:var(--grey)}
  .rf-mi.open > .rf-panel{display:block}
  .rf-header .rf-panel-in{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:2px 20px 12px}
  .rf-panel-aside{display:none}
  .rf-panel-all{order:-1;border:0;padding:12px 0 6px}
  .rf-panel-all a{font-size:16px;padding-block:8px}
  .rf-cols,.rf-panel-areas .rf-cols{display:block}
  .rf-col{margin:0}
  .rf-col + .rf-col{margin-top:6px}
  .rf-col-h{margin:8px 0 0;padding:0 0 4px;border:0;color:#5B6370;font-size:14px;font-weight:700}
  .rf-col li a{padding:11px 0;font-size:16.5px;color:var(--navy)}
  .rf-col ul{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}
  .rf-panel-services .rf-col ul,.rf-panel-plain .rf-col ul{grid-template-columns:1fr}
  .rf-tiles{grid-template-columns:1fr 1fr;gap:8px;padding:4px 0 6px!important}
  .rf-tiles a{padding:6px!important;gap:10px;background:#fff;font-size:15px!important}
  .rf-tile-img{width:44px;height:44px}

  .rf-panel-areas .rf-col:first-child ul{columns:auto}
  /* areas: one row per region (the region page + a toggle for its cities) */
  .rf-col-acc{border-bottom:1px solid #E9E9EE}
  .rf-col-acc + .rf-col-acc{margin-top:0}
  .rf-col-acc .rf-col-h{display:flex;align-items:center;justify-content:space-between;margin:0;padding:0;color:var(--navy);font-size:16.5px}
  .rf-col-acc .rf-col-h a{flex:1;padding:12px 0}
  .rf-col-t{display:grid;place-items:center;width:44px;height:44px;background:none;border:0;color:var(--navy);cursor:pointer;font-size:22px;line-height:1}
  .rf-col-t::after{content:"+"}
  .rf-col-acc.open .rf-col-t::after{content:"\2212"}
  .rf-col-acc > div{display:none;padding:0 0 8px}
  .rf-col-acc.open > div{display:block}
  .rf-col-acc li a{padding:9px 0;font-size:16px;color:var(--slate)}

  .rf-mnav-foot{display:block;flex:none;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fff}
  .rf-mnav-foot p{margin:0 0 10px;color:var(--slate);font-size:14px;text-align:center;font-family:var(--sys)}
  .rf-mnav-foot .rf-pair{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .rf-mnav-foot .rf-pair .btn{min-height:50px;font-size:17px}
}
@media (max-width:380px){.rf-hmenu-l{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}.rf-hmenu{padding-inline:10px}} /* 21.10: visually hidden, not display:none, so the button keeps its name "תפריט" (axe button-name at 360) */
html.rf-lock,html.rf-lock body{overflow:hidden}

/* ---------- cart drawer ---------- */
.rf-dw{position:fixed;inset:0;z-index:2147483000;font-family:var(--mfe)}
.rf-dw[hidden]{display:none}
.rf-dw-bg{position:absolute;inset:0;background:rgba(6,2,32,.5);opacity:0;transition:opacity .25s ease}
.rf-dw-in{position:absolute;inset-block:0;inset-inline-end:0;width:min(440px,100%);display:flex;flex-direction:column;background:#fff;box-shadow:0 0 40px rgba(6,2,32,.25);transform:translateX(-100%);transition:transform .28s cubic-bezier(.2,.8,.2,1)}
html[dir="ltr"] .rf-dw-in{transform:translateX(100%)}
.rf-dw.is-open .rf-dw-bg{opacity:1}
.rf-dw.is-open .rf-dw-in{transform:none}
.rf-dw-head{display:flex;align-items:center;justify-content:space-between;padding:10px 8px;padding-inline:20px 8px;border-bottom:1px solid var(--line);flex:none}
.rf-dw-head .h{margin:0;color:var(--navy);font-weight:700;font-size:19px;outline:0}
.rf-dw-x{display:grid;place-items:center;width:44px;height:44px;background:none;border:0;border-radius:10px;color:var(--navy);cursor:pointer}
.rf-dw-x svg{width:24px;height:24px;fill:currentColor}
.rf-cd{flex:1;min-height:0;display:flex;flex-direction:column;transition:opacity .15s ease}
.rf-cd.is-busy{opacity:.55;pointer-events:none}
.rf-cd-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:4px 20px 16px}
.rf-cd-load{display:flex;gap:8px;justify-content:center;padding:48px 0}
.rf-cd-load i{width:9px;height:9px;border-radius:50%;background:var(--orange);opacity:.3;animation:rfdot 1s infinite ease-in-out}
.rf-cd-load i:nth-child(2){animation-delay:.15s}.rf-cd-load i:nth-child(3){animation-delay:.3s}
@keyframes rfdot{50%{opacity:1;transform:translateY(-3px)}}
.rf-cd-added{display:flex;align-items:center;gap:8px;margin:0;padding:11px 20px;background:#EEF9F1;border-bottom:1px solid #CDEBD6;color:#14532D;font-size:15.5px;font-weight:700;flex:none}
.rf-cd-added svg{width:18px;height:18px;fill:currentColor;flex:none}
.rf-cd-err{margin:12px 20px 0;padding:10px 12px;border-radius:10px;background:#FFF1E8;color:var(--navy);font-size:15px}
.rf-cd-err a{color:var(--orange-ink)}
.rf-cd-items{list-style:none;margin:0;padding:0}
.rf-cd-it{display:grid;grid-template-columns:76px minmax(0,1fr);gap:14px;padding:16px 0;border-bottom:1px solid var(--line)}
.rf-cd-img{display:block;width:76px;height:76px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.rf-cd-img img{width:100%;height:100%;object-fit:contain;display:block}
.rf-cd-txt{display:flex;flex-direction:column;gap:6px;min-width:0}
.rf-cd-name{color:var(--navy);font-size:16px;font-weight:700;line-height:1.35;text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
a.rf-cd-name:hover{color:var(--orange-ink)}
.rf-cd-meta{list-style:none;margin:0;padding:0;color:var(--slate);font-size:14px;line-height:1.45;font-family:var(--sys)}
.rf-cd-meta .k{color:var(--muted)}
.rf-cd-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:2px}
.rf-cd-price{color:var(--navy);font-size:17px;white-space:nowrap;unicode-bidi:isolate}
.rf-cd-q1{color:var(--muted);font-size:14px}
.rf-qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;background:#fff}
.rf-qty button{width:36px;height:36px;background:none;border:0;border-radius:50%;color:var(--navy);font-size:20px;line-height:1;cursor:pointer}
.rf-qty button:hover:not([disabled]){background:var(--grey)}
.rf-qty button[disabled]{opacity:.35;cursor:default}
.rf-qty output{min-width:26px;text-align:center;font-weight:700;color:var(--navy);font-size:16px}
.rf-cd-rm{align-self:flex-start;min-height:28px;padding:2px 0;background:none;border:0;color:var(--muted);font:inherit;font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.rf-cd-rm:hover{color:var(--orange-ink)}
.rf-cd-foot{flex:none;padding:14px 20px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fff;box-shadow:0 -10px 24px -18px rgba(6,2,32,.3)}
.rf-cd-total{display:flex;align-items:baseline;justify-content:space-between;margin:0 0 12px;color:var(--navy);font-size:16px}
.rf-cd-total b{font-size:21px;unicode-bidi:isolate}
.rf-cd-go{display:flex;width:100%;min-height:54px;font-size:19px}
.rf-cd-sec{display:flex;justify-content:center;align-items:center;gap:10px;margin:10px 0 0;color:var(--muted);font-size:15px}
.rf-cd-sec button,.rf-cd-sec a{min-height:36px;padding:4px 6px;background:none;border:0;color:var(--navy);font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.rf-cd-sec button:hover,.rf-cd-sec a:hover{color:var(--orange-ink)}
/* empty cart */
.rf-cd-empty-h{margin:22px 0 4px;color:var(--navy);font-size:20px;font-weight:700}
.rf-cd-sub-h{margin:18px 0 8px;color:var(--muted);font-size:14px;font-weight:700}
.rf-cd-sugg{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.rf-cd-sugg a{display:grid;grid-template-columns:64px minmax(0,1fr);gap:12px;align-items:center;padding:8px;border:1px solid var(--line);border-radius:14px;text-decoration:none;transition:border-color var(--t)}
.rf-cd-sugg a:hover{border-color:var(--orange)}
.rf-cd-sugg .rf-cd-img{width:64px;height:64px;border:0}
.rf-cd-sugg .rf-cd-price{font-size:15px;font-weight:700}
.rf-cd-sugg .rf-cd-price del{color:var(--muted);font-weight:400;margin-inline-end:6px}
.rf-cd-sugg .rf-cd-price ins{text-decoration:none}
.rf-cd-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.rf-cd-chips a{display:inline-flex;align-items:center;min-height:40px;padding:6px 14px;border:1px solid var(--line);border-radius:999px;color:var(--navy);font-size:15px;text-decoration:none}
.rf-cd-chips a:hover{border-color:var(--orange);color:var(--orange-ink)}

/* focus, motion, high-contrast modes */
.rf-mnav a:focus-visible,.rf-mnav button:focus-visible,.rf-hact a:focus-visible,.rf-hact button:focus-visible,.rf-dw a:focus-visible,.rf-dw button:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.rf-panel,.rf-mnav,.rf-scrim,.rf-dw-bg,.rf-dw-in,.rf-mi-t::after{transition:none!important}.rf-cd-load i{animation:none;opacity:.7}}
html.reef-hc-dark .rf-panel,html.reef-hc-dark .rf-mnav,html.reef-hc-dark .rf-dw-in,html.reef-hc-dark .rf-cd-foot,html.reef-hc-dark .rf-mnav-foot{background-color:#000!important}
html.reef-hc-light .rf-panel,html.reef-hc-light .rf-mnav,html.reef-hc-light .rf-dw-in,html.reef-hc-light .rf-cd-foot,html.reef-hc-light .rf-mnav-foot{background-color:#fff!important}