/* Products element, "Menu cards" layout. Everything runs on variables so Elementor's Style tab (Menu cards section) can change it. */
.bks-mc{--bks-mc-accent:var(--bks-cart,#c0002a);--bks-mc-bg:#f8eee9;--bks-mc-line:#e2d4cc;--bks-mc-lw:1px;--bks-mc-ls:solid;--bks-mc-text:#1f1a1a;--bks-mc-imgh:180px;--bks-mc-imgr:10px;--bks-mc-gap:16px;
 display:grid;grid-template-columns:repeat(var(--bks-mc-c,var(--bks-mc-cols,2)),minmax(0,1fr));background:var(--bks-mc-bg);border-radius:12px;overflow:hidden;color:var(--bks-mc-text)}
.bks-mc__item{display:grid;grid-template-columns:minmax(0,1fr) var(--bks-mc-img,var(--bks-mc-imgd,112px));gap:var(--bks-mc-gap);align-items:start;padding:22px 26px;border-bottom:var(--bks-mc-lw) var(--bks-mc-ls) var(--bks-mc-line);min-width:0;transition:background-color .15s ease}
.bks-mc__info{min-width:0;display:flex;flex-direction:column;gap:7px}
.bks-mc__name{margin:0;font-size:18px;line-height:1.25;font-weight:800;color:inherit}
.bks-mc__name a{color:inherit!important;text-decoration:none!important;-webkit-text-fill-color:currentColor}
.bks-mc__name a:hover{text-decoration:underline!important}
.bks-mc__tags{display:flex;flex-wrap:wrap;gap:6px}
.bks-mc__tag{white-space:nowrap;max-width:100%;display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:999px;font-size:12.5px;font-weight:600;line-height:1.4;color:#fff;background:#8a8f98}
.bks-mc__tag.is-blue{background:#5aa2f2}.bks-mc__tag.is-red{background:#f06b6b}.bks-mc__tag.is-green{background:#3fae6a}.bks-mc__tag.is-amber{background:#e0a226}.bks-mc__tag.is-teal{background:#1fa3a0}.bks-mc__tag.is-gold{background:#c9952b}
.bks-mc__tag svg{flex:none}
.bks-mc__desc{margin:0;font-size:13.5px;line-height:1.45;color:#3c3434}
.bks-mc__foot{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;margin-top:2px}
.bks-mc__price{color:var(--bks-mc-accent);font-weight:800;font-size:16px}
.bks-mc__price del{opacity:.55;font-weight:500}.bks-mc__price ins{text-decoration:none}
.bks-mc__price .woocommerce-Price-amount{color:inherit}
.bks-mc .bks-mc__add{all:unset;box-sizing:border-box;white-space:nowrap;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:7px 14px;border-radius:999px;background:var(--bks-mc-accent);color:#fff;-webkit-text-fill-color:currentColor;font-weight:700;font-size:13.5px;line-height:1.2;box-shadow:0 3px 10px color-mix(in srgb,var(--bks-mc-accent) 30%,transparent);transition:transform .12s ease,filter .12s ease,background-color .12s ease,color .12s ease}
.bks-mc .bks-mc__add:hover{filter:brightness(1.08);transform:translateY(-1px)}
.bks-mc .bks-mc__add:focus-visible{outline:2px solid var(--bks-mc-accent);outline-offset:2px}
.bks-mc .bks-mc__add.loading{opacity:.6;pointer-events:none}
.bks-mc .bks-mc__add.added::after{content:" \2713";margin-left:2px}
.bks-mc .added_to_cart{display:none!important} /* the cart opens by itself; no extra "View cart" link */
.bks-mc__out{font-size:13px;font-weight:700;color:#8a1010;background:#fde8e8;border-radius:999px;padding:5px 12px}
.bks-mc__img{display:block;width:var(--bks-mc-img,var(--bks-mc-imgd,112px));height:var(--bks-mc-img,var(--bks-mc-imgd,112px));border-radius:var(--bks-mc-imgr);overflow:hidden;background:#efe4dd}
.bks-mc__img img,.bks-mc__photo{width:100%!important;height:100%!important;object-fit:var(--bks-mc-fit,cover);display:block;margin:0!important;border-radius:0!important;box-shadow:none!important;transition:transform .35s ease}
.bks-mc__ph{display:grid;place-items:center;width:100%;height:100%;font-size:34px;font-weight:800;color:#b9a79b}
.bks-mc__item.is-out .bks-mc__img{filter:grayscale(.7);opacity:.7}
.bks-mc__none{padding:20px;text-align:center;opacity:.7}
.bks-products--cards .bks-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0 0 12px}
/* where the photo sits */
.bks-mc.is-img-left .bks-mc__item{grid-template-columns:var(--bks-mc-img,var(--bks-mc-imgd,112px)) minmax(0,1fr)}
.bks-mc.is-img-left .bks-mc__img,.bks-mc.is-img-top .bks-mc__img{order:-1}
.bks-mc.is-img-top .bks-mc__item{grid-template-columns:minmax(0,1fr)}
.bks-mc.is-img-top .bks-mc__img{width:100%;height:var(--bks-mc-imgh)}
.bks-mc.is-img-none .bks-mc__item{grid-template-columns:minmax(0,1fr)}
@media (max-width:1024px){.bks-mc{grid-template-columns:repeat(var(--bks-mc-ct,var(--bks-mc-tcols,2)),minmax(0,1fr))}}
@media (max-width:760px){.bks-mc{grid-template-columns:repeat(var(--bks-mc-cm,1),minmax(0,1fr))}.bks-mc__item{padding:16px;gap:12px}.bks-mc:not(.is-img-top):not(.is-img-none) .bks-mc__item{grid-template-columns:minmax(0,1fr) min(var(--bks-mc-img,var(--bks-mc-imgd,112px)),96px)}.bks-mc.is-img-left .bks-mc__item{grid-template-columns:min(var(--bks-mc-img,var(--bks-mc-imgd,112px)),96px) minmax(0,1fr)}.bks-mc:not(.is-img-top) .bks-mc__img{width:min(var(--bks-mc-img,var(--bks-mc-imgd,112px)),96px);height:min(var(--bks-mc-img,var(--bks-mc-imgd,112px)),96px)}.bks-mc__name{font-size:16.5px}}
.bks-mc,.bks-mc *{text-shadow:none}
.bks-mc__img,.bks-mc__img:hover{text-decoration:none!important;border:0}
/* many columns (4-6): smaller photo, tighter spacing, slightly smaller names; Elementor's Style tab settings still win */
.bks-mc.is-dense{--bks-mc-imgd:84px}
:where(.bks-mc.is-dense) .bks-mc__item{padding:18px 16px;gap:12px}
:where(.bks-mc.is-dense) .bks-mc__name{font-size:16px}
:where(.bks-mc.is-dense) .bks-mc__desc{font-size:13px}
.bks-mc:where(.is-dense) .bks-mc__add{padding:6px 11px;font-size:13px}
/* Photo beside the text (left or right), at any column count: the name, labels and description stay together as
   one natural stack next to the photo (no gap surprises - it's just the ordinary flex column below), and only the
   price/button row breaks out to run the full width of the card, under the photo too. The photo spans both rows
   (rather than being confined to row 1) so a tall photo next to a short text block doesn't push the price/button
   row down by its own height - the price row sits right after the text, with only a small, fixed gap. */
.bks-mc:is(.is-img-right,.is-img-left) .bks-mc__item{grid-template-rows:auto auto;row-gap:8px}
.bks-mc.is-img-right .bks-mc__info{grid-column:1;grid-row:1}
.bks-mc.is-img-right .bks-mc__item>.bks-mc__img{grid-column:2;grid-row:1}
.bks-mc.is-img-left .bks-mc__info{grid-column:2;grid-row:1}
.bks-mc.is-img-left .bks-mc__item>.bks-mc__img{grid-column:1;grid-row:1}
.bks-mc:is(.is-img-right,.is-img-left) .bks-mc__foot{grid-column:1/-1;grid-row:2;justify-content:space-between;margin-top:0;align-self:start}
/* "Separate cards with space between" (default): each dish its own card; the Style tab's colours, gaps, borders, corners and shadows still win */
.bks-mc:where(.is-sep){background:none;gap:18px;overflow:visible;border-radius:0}
:where(.bks-mc.is-sep) .bks-mc__item{background:var(--bks-mc-bg);border:var(--bks-mc-lw) var(--bks-mc-ls) var(--bks-mc-line);border-radius:14px;box-shadow:0 2px 10px rgba(0,0,0,.06);transition:box-shadow .2s ease,transform .2s ease,background-color .15s ease}
:where(.bks-mc.is-sep) .bks-mc__item:hover{box-shadow:0 8px 22px rgba(0,0,0,.1);transform:translateY(-2px)}
@media (max-width:760px){.bks-mc:where(.is-sep){gap:12px}}
@media (prefers-reduced-motion:reduce){:where(.bks-mc.is-sep) .bks-mc__item:hover{transform:none}}
