/* Greenbeat dietary preference system — V223 redesign */
.dietary-preferences-panel{
  margin:22px 0 30px;
  padding:16px 18px 18px;
  border:1px solid #d8ddd6;
  border-radius:20px;
  background:#fff;
  box-shadow:0 1px 0 rgba(17,38,26,.03);
}
.dietary-preferences-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
}
.dietary-preferences-title-wrap{
  display:flex;
  align-items:flex-start;
  gap:14px;
}
.dietary-preferences-title-icon{
  flex:none;
  width:32px;
  height:32px;
  color:#2b6b45;
  margin-top:2px;
}
.dietary-preferences-title-icon svg{
  width:100%;
  height:100%;
  display:block;
  stroke:currentColor;
  fill:none;
  stroke-width:2.1;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.dietary-preferences-title{
  margin:0;
  color:#19382a;
  font-size:18px;
  line-height:1.12;
  font-weight:800;
  letter-spacing:.02em;
  text-transform:uppercase;
}
.dietary-preferences-copy{
  margin:7px 0 0;
  color:#95a098;
  font-size:11px;
  line-height:1.35;
  font-weight:700;
}
.dietary-preferences-clear{
  flex:none;
  border:0;
  background:transparent;
  color:#bcc6bb;
  padding:8px 0 0;
  font:800 11px/1 Arial,Helvetica,sans-serif;
  letter-spacing:.06em;
  text-decoration:underline;
  text-underline-offset:2px;
  cursor:pointer;
}
.dietary-preferences-clear:disabled{opacity:.35;cursor:default}
.dietary-preference-grid{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.dietary-preference-button{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:44px;
  padding:10px 16px;
  border:1.5px solid #c9d2c7;
  border-radius:999px;
  background:#fff;
  color:#1f4030;
  font:800 11px/1 Arial,Helvetica,sans-serif;
  letter-spacing:.025em;
  text-transform:uppercase;
  cursor:pointer;
  transition:border-color .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease;
}
.dietary-preference-button:hover,
.dietary-preference-button:focus-visible{
  border-color:#96b49e;
  box-shadow:0 0 0 3px rgba(21,148,71,.08);
  outline:none;
}
.dietary-pref-icon{
  width:18px;
  height:18px;
  flex:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:currentColor;
}
.dietary-pref-icon svg{
  width:100%;
  height:100%;
  display:block;
  stroke:currentColor;
  fill:none;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.dietary-pref-label{
  display:inline-block;
  white-space:nowrap;
}
.dietary-pref-check{
  width:24px;
  height:24px;
  margin-left:2px;
  border-radius:50%;
  background:#fff;
  color:#1f6e40;
  flex:none;
  display:none;
  align-items:center;
  justify-content:center;
  box-shadow:0 1px 3px rgba(0,0,0,.08);
}
.dietary-pref-check svg{
  width:13px;
  height:13px;
  display:block;
  stroke:currentColor;
  fill:none;
  stroke-width:3;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.dietary-preference-button[aria-pressed="true"]{
  border-color:#1b6d3b;
  background:linear-gradient(135deg,#1f7a42 0%, #1d5f39 100%);
  color:#fff;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.dietary-preference-button[aria-pressed="true"] .dietary-pref-check{display:inline-flex;}
.dietary-preferences-warning{
  margin:12px 0 0;
  color:var(--muted,#6d756f);
  font-size:10px;
  line-height:1.45;
}

.gb-dietary-active-bar{
  margin:0 0 22px;
  padding:10px 12px;
  border:1px solid #c9dbce;
  border-radius:12px;
  background:#f4faf5;
  font-size:11px;
  line-height:1.45;
  color:var(--ink,#18221c);
}
.gb-dietary-active-bar strong{font-weight:800}
.gb-dietary-active-bar a{
  color:var(--g,#159447);
  font-weight:800;
  text-decoration:none;
  margin-left:6px;
}

.dietary-unavailable{
  position:relative !important;
  opacity:.43 !important;
  filter:saturate(.55) !important;
}
.dietary-unavailable::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:24;
  background:rgba(255,255,255,.18);
  pointer-events:none;
}
.dietary-unavailable-label{
  position:absolute;
  left:8px;
  right:8px;
  bottom:8px;
  z-index:30;
  padding:6px 7px;
  border-radius:9px;
  background:rgba(255,255,255,.96);
  border:1px solid #d8ded9;
  color:#7b3f3f;
  font:800 9px/1.2 Arial,Helvetica,sans-serif;
  letter-spacing:.02em;
  text-align:center;
  text-transform:uppercase;
  pointer-events:none;
  box-shadow:0 2px 8px rgba(0,0,0,.05);
}
.dietary-unavailable button:not(.allergen-info-btn),
button.dietary-unavailable{
  cursor:not-allowed !important;
}

@media(max-width:650px){
  .dietary-preferences-panel{
    margin:18px 0 24px;
    padding:14px;
    border-radius:18px;
  }
  .dietary-preferences-head{display:block;margin-bottom:10px}
  .dietary-preferences-title-wrap{gap:12px}
  .dietary-preferences-title-icon{width:26px;height:26px;margin-top:1px}
  .dietary-preferences-title{font-size:15px}
  .dietary-preferences-copy{font-size:11px;margin-top:5px}
  .dietary-preferences-clear{margin-top:8px;padding-top:0}
  .dietary-preference-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }
  .dietary-preference-button{
    width:100%;
    min-width:0;
    min-height:44px;
    padding:9px 9px;
    gap:7px;
    font-size:9px;
    line-height:1.12;
    justify-content:flex-start;
  }
  .dietary-pref-icon{width:14px;height:14px}
  .dietary-pref-check{width:18px;height:18px;margin-left:auto}
  .dietary-pref-check svg{width:10px;height:10px}
  .dietary-preferences-warning{font-size:9px}
  .gb-dietary-active-bar{font-size:10px;margin-bottom:16px}
  .dietary-unavailable-label{font-size:8px;left:6px;right:6px;bottom:6px;padding:5px 4px}
}

/* V167: mobile-only compact Dietary Preferences launcher + modal. */
.dietary-mobile-trigger,
.dietary-mobile-dialog{display:none;}

@media(max-width:650px){
  .dietary-mobile-trigger{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-height:44px;
    margin:18px 0 24px;
    padding:10px 16px;
    border:1px solid var(--line,#dde4de);
    border-radius:99px;
    background:#fff;
    color:var(--ink,#18221c);
    font:800 12px/1 Arial,Helvetica,sans-serif;
    letter-spacing:.035em;
    text-transform:uppercase;
    cursor:pointer;
  }
  .dietary-mobile-trigger.has-active-preferences{
    border-color:var(--g,#159447);
    color:var(--g,#159447);
  }

  /* Hide the full preference panel from the Start page until the launcher is opened. */
  main > .content > #dietary-preferences-panel{display:none !important;}

  .dietary-mobile-dialog[open]{
    display:block;
    width:min(460px,calc(100vw - 24px));
    max-width:none;
    margin:auto;
    padding:0;
    border:0;
    border-radius:20px;
    background:#fff;
    color:var(--ink,#18221c);
    box-shadow:0 24px 70px rgba(0,0,0,.24);
    overflow:hidden;
  }
  .dietary-mobile-dialog::backdrop{background:rgba(19,30,23,.48);}
  .dietary-mobile-dialog-card{padding:0;}
  .dietary-mobile-dialog-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:16px 16px 13px;
    border-bottom:1px solid var(--line,#dde4de);
  }
  .dietary-mobile-dialog-head h2{
    margin:0;
    font-size:14px;
    line-height:1.1;
    font-weight:800;
    letter-spacing:.035em;
  }
  .dietary-mobile-dialog-close{
    width:38px;
    height:38px;
    flex:none;
    display:grid;
    place-items:center;
    padding:0;
    border:1px solid var(--line,#dde4de);
    border-radius:50%;
    background:#fff;
    color:var(--ink,#18221c);
    font:400 25px/1 Arial,Helvetica,sans-serif;
    cursor:pointer;
  }
  .dietary-mobile-dialog-body{padding:14px 14px 18px;}
  .dietary-mobile-dialog-body #dietary-preferences-panel{
    display:block !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }
  .dietary-mobile-dialog-body .dietary-preferences-head{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    min-height:20px;
    margin:0 0 10px !important;
  }
  .dietary-mobile-dialog-body .dietary-preferences-head > div{display:none !important;}
  .dietary-mobile-dialog-body .dietary-preferences-clear{margin:0 !important;}
  .dietary-mobile-dialog-body .dietary-preference-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }
  .dietary-mobile-dialog-body .dietary-preference-button{
    width:100% !important;
    min-width:0 !important;
    min-height:44px !important;
    padding:9px 9px !important;
    font-size:9px !important;
    line-height:1.12 !important;
  }
  .dietary-mobile-dialog-body .dietary-preferences-warning{display:none !important;}
}

/* V1033: desktop/full-size Dietary Preferences sizing/layout.
   Two rows of five larger controls, while preserving the V1032 panel footprint.
   Mobile (<=650px) remains exactly as approved in V1032. */
@media(min-width:651px){
  .dietary-preference-grid{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    column-gap:8px;
  }
  .dietary-preference-button{
    width:100%;
    min-width:0;
    padding-left:4px;
    padding-right:4px;
    gap:3px;
    font-size:12px;
    line-height:1.05;
    justify-content:flex-start;
  }
  .dietary-pref-icon{
    width:20px;
    height:20px;
  }
  .dietary-pref-label{
    min-width:0;
    white-space:normal;
    overflow-wrap:anywhere;
    line-height:1.05;
  }
}

@media(min-width:800px){
  .dietary-preference-button{
    gap:3px;
    font-size:13px;
  }
  .dietary-pref-icon{
    width:21px;
    height:21px;
  }
}

/* Preserve V1032's overall panel height at every non-mobile layout width.
   The original flex layout naturally used 2, 3, or 4 rows depending on viewport;
   V1033 always uses two rows, so row height is adjusted to keep the same grid height. */
@media(min-width:651px) and (max-width:852px),
       (min-width:1032px) and (max-width:1244px){
  .dietary-preference-grid{
    grid-template-rows:repeat(2,70px);
    row-gap:12px;
  }
  .dietary-preference-button{
    min-height:70px;
    height:70px;
    padding-top:10px;
    padding-bottom:10px;
  }
}

@media(min-width:853px) and (max-width:950px),
       (min-width:1245px){
  .dietary-preference-grid{
    grid-template-rows:repeat(2,44px);
    row-gap:10px;
  }
  .dietary-preference-button{
    min-height:44px;
    height:44px;
    padding-top:8px;
    padding-bottom:8px;
  }
}

@media(min-width:951px) and (max-width:1031px){
  .dietary-preference-grid{
    grid-template-rows:repeat(2,98px);
    row-gap:10px;
  }
  .dietary-preference-button{
    min-height:98px;
    height:98px;
    padding-top:12px;
    padding-bottom:12px;
  }
}

/* Keep the longest single-word label comfortable at mid-size desktop widths,
   while still increasing it from V1032's 11px. */
@media(min-width:800px) and (max-width:1244px){
  .dietary-preference-button[data-dietary-pref="vegetarian"] .dietary-pref-label{
    font-size:12px;
  }
}

/* V1036: desktop-only custom Gluten icon replacement.
   Preserve the existing V1033 layout, size, and icon-to-text spacing.
   Mobile remains frozen and unchanged. */
@media (min-width:651px){
  .dietary-preference-button[data-dietary-pref="avoid-gluten"] .dietary-pref-icon{
    background-image:url("assets/dietary-icon-gluten-v1036.jpg");
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
  }
  .dietary-preference-button[data-dietary-pref="avoid-gluten"] .dietary-pref-icon > svg{
    opacity:0;
  }
}

/* V1037: desktop-only custom Nuts icon replacement.
   Preserve the existing V1036 layout, size, and icon-to-text spacing.
   Mobile remains frozen and unchanged. */
@media (min-width:651px){
  .dietary-preference-button[data-dietary-pref="avoid-nuts"] .dietary-pref-icon{
    background-image:url("assets/dietary-icon-nuts-v1037.jpg");
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
  }
  .dietary-preference-button[data-dietary-pref="avoid-nuts"] .dietary-pref-icon > svg{
    opacity:0;
  }
}

/* V1038: desktop-only custom Seeds icon replacement.
   Preserve the existing V1037 layout, size, and icon-to-text spacing.
   Mobile remains frozen and unchanged. */
@media (min-width:651px){
  .dietary-preference-button[data-dietary-pref="avoid-seeds"] .dietary-pref-icon{
    background-image:url("assets/dietary-icon-seeds-v1038.jpg");
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
  }
  .dietary-preference-button[data-dietary-pref="avoid-seeds"] .dietary-pref-icon > svg{
    opacity:0;
  }
}

/* V1039: desktop-only custom Eggs icon replacement.
   Preserve the existing V1038 layout, size, and icon-to-text spacing.
   Mobile remains frozen and unchanged. */
@media (min-width:651px){
  .dietary-preference-button[data-dietary-pref="avoid-eggs"] .dietary-pref-icon{
    background-image:url("assets/dietary-icon-eggs-v1039.jpg");
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
  }
  .dietary-preference-button[data-dietary-pref="avoid-eggs"] .dietary-pref-icon > svg{
    opacity:0;
  }
}

/* V1040: desktop-only custom Fish icon replacement.
   Preserve the existing V1039 layout, size, and icon-to-text spacing.
   Mobile remains frozen and unchanged. */
@media (min-width:651px){
  .dietary-preference-button[data-dietary-pref="avoid-fish"] .dietary-pref-icon{
    background-image:url("assets/dietary-icon-fish-v1040.jpg");
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
  }
  .dietary-preference-button[data-dietary-pref="avoid-fish"] .dietary-pref-icon > svg{
    opacity:0;
  }
}

/* V1041: desktop-only custom Sesame icon replacement.
   Preserve the existing V1040 layout, size, and icon-to-text spacing.
   Mobile remains frozen and unchanged. */
@media (min-width:651px){
  .dietary-preference-button[data-dietary-pref="avoid-sesame"] .dietary-pref-icon{
    background-image:url("assets/dietary-icon-sesame-v1041.jpg");
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
  }
  .dietary-preference-button[data-dietary-pref="avoid-sesame"] .dietary-pref-icon > svg{
    opacity:0;
  }
}

/* V1042: desktop-only custom Shellfish icon replacement.
   Preserve the existing V1041 layout, size, and icon-to-text spacing.
   Mobile remains frozen and unchanged. */
@media (min-width:651px){
  .dietary-preference-button[data-dietary-pref="avoid-shellfish"] .dietary-pref-icon{
    background-image:url("assets/dietary-icon-shellfish-v1042.jpg");
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
  }
  .dietary-preference-button[data-dietary-pref="avoid-shellfish"] .dietary-pref-icon > svg{
    opacity:0;
  }
}

/* V1043: desktop-only custom Dairy icon replacement.
   Preserve the existing V1042 layout, size, and icon-to-text spacing.
   Mobile remains frozen and unchanged. */
@media (min-width:651px){
  .dietary-preference-button[data-dietary-pref="avoid-dairy"] .dietary-pref-icon{
    background-image:url("assets/dietary-icon-dairy-v1043.jpg");
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
  }
  .dietary-preference-button[data-dietary-pref="avoid-dairy"] .dietary-pref-icon > svg{
    opacity:0;
  }
}

/* V1044: desktop-only custom Vegan icon replacement.
   Preserve the existing V1043 layout, size, and icon-to-text spacing.
   Mobile remains frozen and unchanged. */
@media (min-width:651px){
  .dietary-preference-button[data-dietary-pref="vegan"] .dietary-pref-icon{
    background-image:url("assets/dietary-icon-vegan-v1044.jpg");
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
  }
  .dietary-preference-button[data-dietary-pref="vegan"] .dietary-pref-icon > svg{
    opacity:0;
  }
}

/* V1045: desktop-only custom Vegetarian icon replacement.
   Preserve the existing V1044 layout, size, and icon-to-text spacing.
   Mobile remains frozen and unchanged. */
@media (min-width:651px){
  .dietary-preference-button[data-dietary-pref="vegetarian"] .dietary-pref-icon{
    background-image:url("assets/dietary-icon-vegetarian-v1045.jpg");
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
  }
  .dietary-preference-button[data-dietary-pref="vegetarian"] .dietary-pref-icon > svg{
    opacity:0;
  }
}

/* V1046: desktop-only dietary icon sizing/spacing refinement.
   Increase dietary preference icons by ~50%, double the icon-to-text distance,
   and nudge the icons slightly to the right. Preserve all other layout and keep mobile frozen. */
@media (min-width:651px){
  .dietary-preference-button{
    padding-left:10px;
  }
  .dietary-preference-button .dietary-pref-icon{
    width:30px;
    height:30px;
    margin-left:4px;
  }
  .dietary-preference-button{
    gap:6px;
  }
}

@media (min-width:800px){
  .dietary-preference-button .dietary-pref-icon{
    width:32px;
    height:32px;
    margin-left:4px;
  }
  .dietary-preference-button{
    gap:6px;
    padding-left:10px;
  }
}

/* V1047: desktop-only fish icon replacement using updated user-provided image.
   Preserve the current V1046 icon sizing, spacing, and placement so the fish icon remains consistent with the rest. */
@media (min-width:651px){
  .dietary-preference-button[data-dietary-pref="avoid-fish"] .dietary-pref-icon{
    background-image:url("assets/dietary-icon-fish-v1047.jpg");
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
  }
}

/* V1048: desktop-only fish icon replacement using revised user-provided image.
   Preserve the current V1046/V1047 icon sizing, spacing, and placement so the fish icon remains consistent with the rest. */
@media (min-width:651px){
  .dietary-preference-button[data-dietary-pref="avoid-fish"] .dietary-pref-icon{
    background-image:url("assets/dietary-icon-fish-v1048.jpg");
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
  }
}

/* V1075: mobile-only Dietary Preferences overlay icon refresh.
   Replaces all 10 overlay icons with the user-provided artwork while preserving
   button sizes, text, spacing, and desktop behavior. */
@media(max-width:650px){
  .dietary-mobile-dialog-body .dietary-preference-button .dietary-pref-icon{
    background-repeat:no-repeat !important;
    background-position:center center !important;
    background-size:contain !important;
  }
  .dietary-mobile-dialog-body .dietary-preference-button .dietary-pref-icon > svg{
    opacity:0 !important;
  }
  .dietary-mobile-dialog-body .dietary-preference-button[data-dietary-pref="avoid-gluten"] .dietary-pref-icon{
    background-image:url("assets/dietary-mobile-gluten-v1075.png") !important;
  }
  .dietary-mobile-dialog-body .dietary-preference-button[data-dietary-pref="avoid-nuts"] .dietary-pref-icon{
    background-image:url("assets/dietary-mobile-nuts-v1075.png") !important;
  }
  .dietary-mobile-dialog-body .dietary-preference-button[data-dietary-pref="avoid-fish"] .dietary-pref-icon{
    background-image:url("assets/dietary-mobile-fish-v1075.png") !important;
  }
  .dietary-mobile-dialog-body .dietary-preference-button[data-dietary-pref="avoid-shellfish"] .dietary-pref-icon{
    background-image:url("assets/dietary-mobile-shellfish-v1075.png") !important;
  }
  .dietary-mobile-dialog-body .dietary-preference-button[data-dietary-pref="avoid-dairy"] .dietary-pref-icon{
    background-image:url("assets/dietary-mobile-dairy-v1075.png") !important;
  }
  .dietary-mobile-dialog-body .dietary-preference-button[data-dietary-pref="avoid-seeds"] .dietary-pref-icon{
    background-image:url("assets/dietary-mobile-seeds-v1075.png") !important;
  }
  .dietary-mobile-dialog-body .dietary-preference-button[data-dietary-pref="avoid-eggs"] .dietary-pref-icon{
    background-image:url("assets/dietary-mobile-eggs-v1075.png") !important;
  }
  .dietary-mobile-dialog-body .dietary-preference-button[data-dietary-pref="avoid-sesame"] .dietary-pref-icon{
    background-image:url("assets/dietary-mobile-sesame-v1075.png") !important;
  }
  .dietary-mobile-dialog-body .dietary-preference-button[data-dietary-pref="vegan"] .dietary-pref-icon{
    background-image:url("assets/dietary-mobile-vegan-v1075.png") !important;
  }
  .dietary-mobile-dialog-body .dietary-preference-button[data-dietary-pref="vegetarian"] .dietary-pref-icon{
    background-image:url("assets/dietary-mobile-vegetarian-v1075.png") !important;
  }
  /* Selected buttons are dark green; keep the new artwork legible by rendering it white. */
  .dietary-mobile-dialog-body .dietary-preference-button[aria-pressed="true"] .dietary-pref-icon{
    filter:brightness(0) invert(1) !important;
  }
}


/* V1076: mobile-only Dietary Preferences overlay icon sizing/spacing refinement.
   Increase the custom overlay icons by about 80% without clipping, and create
   more distance between the icon and the label. Desktop and non-overlay behavior unchanged. */
@media(max-width:650px){
  .dietary-mobile-dialog-body .dietary-preference-button{
    min-height:50px !important;
    padding:8px 12px !important;
    gap:14px !important;
    justify-content:flex-start !important;
  }
  .dietary-mobile-dialog-body .dietary-preference-button .dietary-pref-icon{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    min-height:32px !important;
    max-width:32px !important;
    max-height:32px !important;
    flex:0 0 32px !important;
  }
  .dietary-mobile-dialog-body .dietary-preference-button .dietary-pref-label{
    display:inline-block !important;
    white-space:nowrap !important;
  }
}

/* V1077: mobile-only Shellfish spacing micro-fix.
   Pull only the AVOID SHELLFISH label closer to its icon so it stays comfortably inside the pill. */
@media(max-width:650px){
  .dietary-mobile-dialog-body .dietary-preference-button[data-dietary-pref="avoid-shellfish"]{
    gap:8px !important;
  }
}

/* V1078: mobile-only Shellfish spacing micro-fix #2.
   Pull only the AVOID SHELLFISH label even closer to the icon. */
@media(max-width:650px){
  .dietary-mobile-dialog-body .dietary-preference-button[data-dietary-pref="avoid-shellfish"]{
    gap:3px !important;
  }
}
