/* ==========================================================================
   Theme Utilities and Overrides
   ========================================================================== */

:root {
  --color-white: #fff;
  --color-green: #006636;
  --color-green-dark: #005837;
  --color-green-deep: #00422a;
  --color-red: #9b1f21;
  --color-red-dark: #983130;
  --color-red-accent: #aa253f;
  --color-blue: #1c73bb;
  --color-yellow: #f1dc4b;
  --focus-ring: 3px solid var(--color-red-accent);
  --content-width: 720px;
  --wide-width: 1080px;
  --desktop-header: 1023px;
}

/* Main editor/content widths */
.wp-block {
  max-width: var(--content-width);
}

.wp-block[data-align="wide"] {
  max-width: var(--wide-width);
}

.wp-block[data-align="full"] {
  max-width: none;
}

.alignwide,
.alignfull {
  margin-block: 32px;
  margin-inline: calc(50% - 50vw);
  max-width: 100vw;
  width: 100vw;
}

@media (max-width: 920px) {
  .alignwide {
    margin-inline: calc((100vw - 920px) / 2);
    max-width: 920px;
    width: 920px;
  }
}

/* Accessibility */
:where(a, button, input, select, textarea, summary, [tabindex]:not([tabindex="-1"])):focus-visible {
  outline: var(--focus-ring);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* Spacing helpers */
.padding-small {
  padding: 1rem !important;
}

.padding-medium {
  padding: 2rem !important;
}

.padding-large {
  padding: 3rem !important;
}

.padding-y-small,
.padding-top-botton-small {
  padding-block: 1rem !important;
  padding-inline: 0 !important;
}

.padding-y-medium,
.padding-top-botton-medium {
  padding-block: 2rem !important;
  padding-inline: 0 !important;
}

.padding-y-large,
.padding-top-botton-large {
  padding-block: 3rem !important;
  padding-inline: 0 !important;
}

.no-margin,
.no-margin .kt-inside-inner-col {
  margin: 0 !important;
}

/* Media helpers */
.image-full-width,
.image-full-width * {
  height: auto !important;
  width: 100% !important;
}

/* Text helpers */
.text-big {
  font-size: 2rem !important;
  line-height: 1.25 !important;
}

.text-bigger-tight {
  font-size: clamp(2rem, 7vw, 4rem) !important;
  line-height: 1 !important;
}

.text-bigger {
  font-size: clamp(2rem, 7vw, 4rem) !important;
  line-height: 1.25 !important;
}

.text-biggest {
  font-size: clamp(4rem, 10vw, 7rem) !important;
  line-height: 1.14 !important;
}

.text-green {
  color: var(--color-green) !important;
}

.text-red {
  color: var(--color-red) !important;
}

.text-white {
  color: var(--color-white) !important;
}

/* Background helpers */
.bg-white {
  background-color: var(--color-white) !important;
}

.bg-red {
  background-color: var(--color-red-dark) !important;
}

.bg-green-gradient {
  background: linear-gradient(180deg, #006234, #014e27) !important;
}

.bg-red-gradient {
  background: linear-gradient(180deg, #e22532, #9f3030) !important;
}

.bg-red-gradient-darker {
  background: linear-gradient(180deg, #e72432, var(--color-red-dark)) !important;
}

.bg-circle-gradient {
  background: radial-gradient(#036637, #024e28);
  border-radius: 50%;
  padding: 18% 20%;
}

/* ==========================================================================
   Blank Landing Page
   ========================================================================== */

.page-template-blank-landing-page {
  background-color: var(--color-white) !important;
  margin-top: -32px;
}

.page-template-blank-landing-page :is(h1, h2, h3, h4, h5, h6) {
  font-family: "Open Sans", sans-serif;
}

.page-template-blank-landing-page .wp-block-column:not(:first-child),
.page-template-blank-landing-page .wp-block-column:nth-child(2n) {
  margin-left: 0 !important;
}

.page-template-blank-landing-page .wp-block-button__link {
  border-radius: 7px !important;
  min-width: 200px;
}

.page-template-blank-landing-page .container {
  margin-top: 0 !important;
}

.page-template-blank-landing-page .container .wp-block-image {
  display: block;
  margin: 0;
}

.page-template-blank-landing-page .container .wp-block-image img {
  display: block;
}

@media (max-width: 600px) {
  .page-template-blank-landing-page {
    margin-top: -46px !important;
  }

  .page-template-blank-landing-page .wp-block-button {
    margin-bottom: 0.5rem;
  }
}

/* ==========================================================================
   Blocks
   ========================================================================== */

.wp-block-separator.is-style-wide {
  max-width: 50%;
}

.wp-block-kadence-pane.kt-accordion-pane {
  margin: 0;
}

.ab-layout-column-wrap.ab-block-layout-column-gap-2.ab-is-responsive-column {
  gap: 2em;
}

/* ==========================================================================
   Header
   ========================================================================== */

@media (min-width: 1023px) {
  #header {
    align-items: center;
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
  }

  #header>* {
    flex: 1 auto;
  }

  #header .logo img {
    max-height: 69px;
  }

  #header .main-nav,
  #header .gift-cards,
  #header .mobile-btn {
    padding: 0;
  }

  #header .locs,
  #header .logo {
    margin: 0;
    text-align: center;
  }

  #header .locs .txt .btm,
  #header .main-nav {
    text-align: left;
  }

  #header .main-nav {
    flex-basis: 38%;
  }

  #header .gift-cards {
    flex-basis: 9%;
    margin-left: 26px;
    text-align: center;
  }

  #header .menu-order-online-container {
    flex-basis: 16%;
  }

  #header ul#menu-order-online {
    margin: 0;
  }

  #header ul#menu-order-online li {
    list-style: none;
    margin: 10%;
  }

  ul#menu-order-online li a {
    background-color: var(--color-green-dark);
    color: var(--color-white);
    display: block;
    padding: 16px 14px;
    text-align: center;
    text-transform: uppercase;
    width: 180px;
  }

  ul#menu-order-online li a:hover,
  ul#menu-order-online li a:focus-visible {
    background-color: var(--color-red-accent);
  }

  #header ul#menu-order-online li.online {
    position: relative;
  }

  #header ul#menu-order-online li.online a {
    cursor: pointer;
    font-size: 1.2rem;
    line-height: 1.25;
  }

  #header ul#menu-order-online li.online a button {
    background-color: var(--color-green-dark);
    font-weight: 700;
    padding: 1.5em;
    position: relative;
    text-align: center;
    text-transform: uppercase;
  }

  #header ul#menu-order-online li.online::after {
    background: transparent url("/burst.5e919fc3.svg") center / 100% no-repeat;
    color: yellow;
    content: "now";
    font-size: 0.75rem;
    line-height: 39px;
    min-height: 45px;
    min-width: 50px;
    padding: 1em 0.5em;
    pointer-events: none;
    position: absolute;
    right: 46px;
    text-shadow: 1px 0.5px 1px #202020;
    text-transform: uppercase;
    top: -32px;
  }

  #header .mobile-btn {
    float: none;
  }
}

@media (max-width: 1024px) {
  #header .main-nav {
    flex-basis: 49%;
  }

  #header ul#menu-order-online li.online a {
    font-size: 0.7rem;
  }
}

@media (max-width: 1023px) {
  #header .hide-for-desktop {
    float: right;
    padding-top: 25px;
  }

  #header .hide-for-desktop a {
    height: 31px;
    width: 21px;
  }

  #header .hide-for-desktop a span .online {
    display: block;
  }

  ul.primary-menu li.online a {
    background-color: var(--color-green-dark) !important;
    color: var(--color-white) !important;
  }

  ul#menu-order-online {
    display: none;
  }

  .mobile-loc,
  .mobile-menu-link {
    display: none !important;
  }

  .hide-for-mobile {
    display: none;
  }
}

/* ==========================================================================
   Page and Section Overrides
   ========================================================================== */

.location-landing .loc-item .info .txt .addy {
  padding-right: 1em;
}

.banner .swiper-num,
.banner .swiper-container-horizontal>.swiper-pagination-progressbar {
  display: none;
}

.delivery .item {
  overflow: hidden;
  position: relative;
}

.delivery .item span {
  align-items: center;
  background: #ae2023;
  color: var(--color-white);
  display: flex;
  justify-content: center;
  left: -50px;
  padding: 0.5em 1em;
  position: absolute;
  text-align: center;
  top: 20px;
  transform: rotate(-39deg);
}

.delivery .item span p {
  display: block;
  font-size: 0.75rem;
  line-height: 1rem;
  max-width: 65%;
}

section#gift-card-wrapper.block-2 .inner .item {
  padding: 0;
}

section#gift-card-wrapper.block-2 .inner .item span {
  left: -58px;
  padding: 0.5em 3em;
  top: 0;
}

section#gift-card-content {
  background: var(--color-blue);
}

section#gift-card-content .inner {
  padding-top: 0;
}

section#gift-card-content .inner p {
  color: var(--color-white);
}

.holstein-yellow,
.futura-yellow {
  color: var(--color-yellow);
  font-family: "futura-pt", sans-serif;
  font-size: clamp(3rem, 10vw, 6.25rem);
  line-height: 1.2;
}

@media (max-width: 700px) {
  .ebt-1 {
    display: none !important;
  }
}

@media (min-width: 700px) {
  .ebt-2 {
    display: none !important;
  }
}

.fa-twitter::before {
  background-image: url("https://miguelsjr.com/wp-content/uploads/2023/08/logo-green.png");
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  content: "" !important;
  display: block;
  height: 30px;
  margin: 7px auto 0;
  width: 23px;
}

a#showOptOut {
  color: var(--color-white);
}

/* Catering */
.page-id-1905 .catering_heading {
  padding-bottom: 0 !important;
}

@media (max-width: 800px) {
  .page-id-1905 .custom_advanced_columns>div {
    display: flex;
    flex-direction: column;
  }

  .page-id-1905 .catering_heading {
    text-align: center;
  }

  .page-id-2392 .is-style-grid-mobile-optimized>div {
    gap: 2em;
  }
}

/* Gift card alignment */
@media (min-width: 800px) {
  section.delivery.block-2 .delivery-options {
    align-content: center;
    align-items: center;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    justify-items: center;
    max-width: 1200px;
  }

  section.delivery.block-2 .delivery-options .inner {
    align-content: center;
    align-items: center;
    display: flex;
    flex-flow: row wrap;
    gap: 20px;
    justify-content: center;
    min-width: min(1400px, 100vw);
    padding: 40px;
  }

  section.delivery.block-2 .delivery-options .inner .item {
    height: 220px;
  }
}

/* Footer */
.footer .social-icons ul,
.footer .nav ul {
  align-items: center;
  display: flex;
}

.footer .social-icons ul {
  flex-flow: row nowrap;
  justify-content: center;
  list-style: none;
  margin: 0;
  text-align: right;
}

.footer .social-icons ul li a {
  height: 28px;
  width: 28px;
}

span.fab {
  font-size: 20px !important;
  line-height: 29px !important;
}

.footer .nav ul {
  align-content: center;
  flex-flow: row wrap;
  justify-content: space-between;
  padding: 0 20px;
}

.footer .nav ul li {
  padding: 0 20px 0 0;
}

.footer .social-icons .title {
  text-align: center;
}

@media (max-width: 1278px) {

  .footer .nav ul,
  .footer .logo {
    display: flex;
    flex-direction: column;
  }

  .footer .logo {
    align-items: center;
  }

  img.fsr-logo-footer {
    width: 100% !important;
  }
}

/* Banner */
@media (min-width: 768px) {
  .banner-item .banner-img.dt {
    display: block;
    height: 100%;
    object-fit: cover;
  }
}

/* Menu items */
.section.menu-items .content .menu-block {
  display: flex;
  flex-wrap: wrap;
  gap: 30px 20px;
}

.menu-block .menu-item {
  box-sizing: border-box;
  padding-bottom: 0;
  width: calc(50% - 10px);
}

.menucat-img .ab-block-layout-column-inner.ab-background-cover.ab-background-no-repeat {
  height: 270px;
  width: 270px;
}

.menu-gallery .swiper-slide .title {
  background-color: var(--color-green-deep);
  padding: 4px 6px;
}

/* Stories */
.story-archive .story-item .img img {
  display: block;
  height: 217px;
  object-fit: cover;
  width: 100%;
}

/* Careers */
.list-careers ul {
  margin-left: 15px !important;
}

.list-careers div,
.benefits div,
.our-why div,
.brands-cont div {
  margin: 0 !important;
}

.list-careers div.kt-inside-inner-col,
.benefits div.kt-inside-inner-col {
  margin: 0 !important;
  width: 100% !important;
}

.our-values {
  counter-reset: item;
}

.our-values li {
  align-items: center;
  counter-increment: item;
  display: flex;
  margin-bottom: 5px;
}

.our-values li::before {
  align-items: center;
  aspect-ratio: 1;
  background: var(--color-green-dark);
  border-radius: 50%;
  color: var(--color-white);
  content: counter(item);
  display: flex;
  height: 1.2em;
  justify-content: center;
  margin-right: 10px;
  padding: 15px;
  width: 1.2em;
}