/* Hofke Menu Manager v1.4.1 - public menu
 * Restores the visual presentation of the original Hofke menu while keeping
 * all data central in WordPress.
 */
.hmm-menu-breakout,
.hmm-menu-breakout *{box-sizing:border-box}

/* Break out of a narrow Astra/Gutenberg content column while keeping a safe
 * viewport margin. The inner menu still obeys the manager-selected max width. */
.hmm-menu-breakout{
  width:calc(100vw - 24px);
  max-width:calc(100vw - 24px);
  margin-left:calc(50% - 50vw + 12px);
  margin-right:calc(50% - 50vw + 12px);
}

.hmm-menu-wrap,
.hmm-menu-wrap *{box-sizing:border-box}

.hmm-menu-wrap{
  width:100%;
  max-width:var(--hmm-max-width,1440px);
  margin:0 auto;
  container-type:inline-size;
  container-name:hmm-menu;
  padding:20px 15px 60px;
  font-family:"Mulish",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:#1e293b;
}

/* Header */
.hmm-menu-header{text-align:center;margin-bottom:35px}
.hmm-kicker{
  text-transform:uppercase;
  letter-spacing:2.5px;
  font-size:.85rem;
  font-weight:700;
  color:#c5a059;
  display:block;
  margin-bottom:5px;
}
.hmm-menu-header h1{
  font-family:"Libre Baskerville",Georgia,serif;
  font-size:2.8rem;
  line-height:1.2;
  font-weight:400;
  color:#0f382c!important;
  margin:0 0 10px;
}
.hmm-divider{display:flex;align-items:center;justify-content:center;margin:15px 0}
.hmm-divider:before,.hmm-divider:after{content:"";height:1px;width:70px;background:#c5a059}
.hmm-divider span{padding:0 12px;font-size:1.1rem}
.hmm-menu-header>p{
  max-width:720px;
  margin:0 auto;
  font-size:1.05rem;
  line-height:1.6;
  color:#475569;
}

/* Friday theme nights */
.hmm-theme-banner{
  background:linear-gradient(135deg,#0f382c 0%,#1a5241 100%);
  color:#fff;
  border-radius:12px;
  padding:35px 30px;
  margin:0 0 40px;
  box-shadow:0 10px 25px rgba(15,56,44,.15);
}
.hmm-theme-badge{
  display:inline-block;
  background:#c5a059;
  color:#0f382c;
  font-weight:700;
  font-size:.8rem;
  text-transform:uppercase;
  letter-spacing:1px;
  padding:4px 12px;
  border-radius:20px;
  margin:0 0 12px;
}
.hmm-theme-banner>h2{
  font-family:"Libre Baskerville",Georgia,serif;
  color:#fff!important;
  font-size:1.9rem;
  line-height:1.25;
  font-weight:400;
  margin:0 0 8px;
}
.hmm-theme-sub{
  color:#e2e8f0!important;
  font-size:1rem;
  line-height:1.5;
  margin:0 0 25px;
}
.hmm-theme-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:16px;
  margin:0 0 25px;
}
.hmm-theme-card{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(197,160,89,.3);
  border-radius:8px;
  padding:16px;
  transition:transform .2s ease,background-color .2s ease;
  min-width:0;
}
.hmm-theme-card:hover{transform:translateY(-3px);background:rgba(255,255,255,.12)}
.hmm-theme-week{
  font-size:.75rem;
  line-height:1.35;
  color:#c5a059;
  text-transform:uppercase;
  font-weight:700;
  display:block;
  margin:0 0 4px;
}
.hmm-theme-card h3{
  font-family:"Libre Baskerville",Georgia,serif;
  color:#fff!important;
  font-size:1.15rem;
  line-height:1.3;
  font-weight:400;
  margin:0 0 6px;
}
.hmm-theme-card p{
  font-size:.85rem;
  line-height:1.45;
  color:#cbd5e1!important;
  margin:0;
}
.hmm-theme-action{text-align:center;margin-top:10px}
.hmm-theme-button{
  display:inline-block;
  background:#c5a059;
  color:#0f382c!important;
  font-weight:700;
  font-size:1rem;
  line-height:1.35;
  padding:14px 28px;
  border-radius:6px;
  text-decoration:none!important;
  box-shadow:0 4px 12px rgba(0,0,0,.15);
  transition:all .2s ease;
}
.hmm-theme-button:hover{background:#d8b268;color:#0f382c!important;transform:translateY(-2px)}

/* Search and category tabs */
.hmm-controls{margin-bottom:35px}
.hmm-search-wrap{
  position:relative;
  max-width:520px;
  margin:0 auto 25px;
  display:flex;
  align-items:center;
}
.hmm-search-icon{
  position:absolute;
  left:18px;
  font-size:1.1rem;
  color:#475569;
  pointer-events:none;
  z-index:2;
}
.hmm-search{
  width:100%!important;
  height:50px!important;
  padding:10px 48px!important;
  background:#fff!important;
  color:#0f172a!important;
  border:2px solid #cbd5e1!important;
  border-radius:25px!important;
  font-size:1rem!important;
  font-family:inherit!important;
  outline:none!important;
  box-shadow:0 4px 12px rgba(0,0,0,.05)!important;
  transition:all .2s ease-in-out!important;
  -webkit-text-fill-color:#0f172a!important;
}
.hmm-search:focus{border-color:#0f382c!important;box-shadow:0 0 0 4px rgba(15,56,44,.12)!important}
.hmm-search::placeholder{color:#64748b!important;opacity:1!important;-webkit-text-fill-color:#64748b!important}
.hmm-search-clear{
  position:absolute;
  right:12px;
  width:28px;
  height:28px;
  padding:0;
  background:#12a366;
  color:#fff!important;
  border:0;
  border-radius:50%;
  font-size:1.05rem;
  line-height:1;
  font-weight:700;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:transform .2s,background-color .2s;
  z-index:2;
}
.hmm-search-clear:hover{background:#0f382c;transform:scale(1.1)}
.hmm-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.hmm-tab{
  appearance:none;
  background:#f1f5f9;
  color:#475569;
  border:1px solid #e2e8f0;
  padding:8px 18px;
  border-radius:20px;
  font-family:inherit;
  font-size:.9rem;
  line-height:1.2;
  font-weight:600;
  cursor:pointer;
  transition:all .2s ease;
  white-space:nowrap;
}
.hmm-tab:hover{background:#e2e8f0;color:#0f382c}
.hmm-tab.is-active{background:#0f382c;color:#fff!important;border-color:#0f382c;box-shadow:0 3px 10px rgba(15,56,44,.2)}

/* Categories */
.hmm-category{margin-bottom:50px}
.hmm-category>h2{
  font-family:"Libre Baskerville",Georgia,serif;
  font-size:1.8rem;
  line-height:1.3;
  font-weight:400;
  color:#0f382c!important;
  border-bottom:2px solid #c5a059;
  padding:0 0 8px;
  margin:0 0 20px;
}
.hmm-category-subtitle{
  font-style:italic;
  color:#64748b;
  margin:-12px 0 20px;
  line-height:1.5;
}

.hmm-subcategory{margin-top:28px}
.hmm-subcategory-title{
  font-family:"Libre Baskerville",Georgia,serif;
  font-size:1.3rem;
  line-height:1.3;
  font-weight:400;
  color:#1a5241!important;
  margin:25px 0 15px;
}
.hmm-subcategory-subtitle{
  font-style:italic;
  color:#64748b;
  margin:-8px 0 15px;
  line-height:1.5;
}
.hmm-category>.hmm-grid+.hmm-subcategory{margin-top:32px}

/* Menu item cards - original Hofke styling with manager-selectable columns */
.hmm-grid{
  display:grid;
  gap:24px 35px;
  align-items:stretch;
}
.hmm-columns-1 .hmm-grid{grid-template-columns:minmax(0,1fr)}
.hmm-columns-2 .hmm-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.hmm-columns-3 .hmm-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.hmm-item{
  position:relative;
  background:#fff;
  padding:14px 16px;
  border-radius:8px;
  border:1px solid #f1f5f9;
  border-left:4px solid transparent;
  display:flex;
  gap:16px;
  align-items:flex-start;
  min-width:0;
  transition:all .2s ease;
}
.hmm-item:hover{border-left-color:#c5a059;box-shadow:0 4px 15px rgba(0,0,0,.04)}
.hmm-highlight-item{border-left-color:#c5a059}
.hmm-image-button{
  width:85px;
  height:85px;
  flex:0 0 85px;
  border:1px solid #e2e8f0;
  padding:0;
  background:transparent;
  cursor:pointer;
  border-radius:8px;
  overflow:hidden;
  transition:transform .2s ease;
}
.hmm-image-button:hover{transform:scale(1.05)}
.hmm-image-button img{width:100%;height:100%;display:block;object-fit:cover}
.hmm-item-content{flex:1 1 auto;min-width:0}
.hmm-item-head{
  display:flex;
  align-items:baseline;
  width:100%;
  min-width:0;
  margin-bottom:4px;
}
.hmm-name-wrap{
  flex:0 1 auto;
  min-width:0;
  line-height:1.35;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}
.hmm-name{
  font-weight:700;
  font-size:1.05rem;
  line-height:1.35;
  color:#0f172a;
}
.hmm-dots{
  flex:1 1 24px;
  min-width:18px;
  border-bottom:1px dotted #cbd5e1;
  margin:0 10px;
  transform:translateY(-2px);
}
.hmm-price{
  flex:0 0 auto;
  font-family:"Libre Baskerville",Georgia,serif;
  font-weight:700;
  font-size:1.05rem;
  line-height:1.35;
  color:#0f382c;
  white-space:nowrap;
}
.hmm-desc{margin:0}
.hmm-desc p{
  margin:0!important;
  padding:0!important;
  font-size:.88rem;
  line-height:1.45;
  color:#64748b;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}
.hmm-desc p+p{margin-top:5px!important}
.hmm-badge{
  display:inline-block;
  font-size:.7rem;
  line-height:1.35;
  font-weight:700;
  padding:2px 7px;
  border-radius:4px;
  margin-left:6px;
  vertical-align:middle;
  white-space:nowrap;
}
.hmm-badge-gold{background:#fef3c7;color:#92400e}
.hmm-badge-green{background:#dcfce7;color:#166534}
.hmm-badge-blue{background:#e0f2fe;color:#075985}
.hmm-no-results{text-align:center;padding:30px;color:#64748b;font-weight:600}

/* Lightbox */
.hmm-lightbox{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.86);
  z-index:999999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:30px;
}
.hmm-lightbox[hidden]{display:none}
.hmm-lightbox img{max-width:90vw;max-height:85vh;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.5)}
.hmm-lightbox-close{
  position:absolute;
  top:20px;
  right:25px;
  border:0;
  background:rgba(255,255,255,.15);
  color:#fff;
  width:44px;
  height:44px;
  padding:0;
  border-radius:50%;
  font-size:30px;
  line-height:1;
  cursor:pointer;
}

/* Keep the selected desktop layout while protecting readability at smaller widths.
 * The original layout needs roughly 460px per menu card; therefore 3 columns
 * fall back to 2 before the cards become cramped, then all layouts become 1. */
@container hmm-menu (max-width:1380px){
  .hmm-columns-3 .hmm-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@container hmm-menu (max-width:960px){
  .hmm-columns-2 .hmm-grid,
  .hmm-columns-3 .hmm-grid{grid-template-columns:1fr}
}

/* Fallback for older browsers without container queries. */
@media(max-width:1380px){
  .hmm-columns-3 .hmm-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:960px){
  .hmm-columns-2 .hmm-grid,
  .hmm-columns-3 .hmm-grid{grid-template-columns:1fr}
}

@media(max-width:768px){
  .hmm-menu-wrap{padding:15px 10px 45px}
  .hmm-menu-header{margin-bottom:28px}
  .hmm-menu-header h1{font-size:2.15rem}
  .hmm-theme-banner{padding:28px 22px;margin-bottom:32px}
  .hmm-theme-banner>h2{font-size:1.65rem}
  .hmm-columns-1 .hmm-grid,
  .hmm-columns-2 .hmm-grid,
  .hmm-columns-3 .hmm-grid{grid-template-columns:1fr}
  .hmm-tabs{justify-content:center}
}

@media(max-width:520px){
  .hmm-menu-header h1{font-size:1.9rem}
  .hmm-menu-header>p{font-size:.98rem}
  .hmm-theme-banner{padding:24px 18px}
  .hmm-theme-grid{grid-template-columns:1fr}
  .hmm-theme-card{padding:14px}
  .hmm-theme-button{width:100%;padding:13px 16px}
  .hmm-search-wrap{margin-bottom:20px}
  .hmm-tabs{gap:7px}
  .hmm-tab{padding:7px 13px;font-size:.84rem}
  .hmm-category{margin-bottom:38px}
  .hmm-category>h2{font-size:1.55rem}
  .hmm-item{padding:12px;gap:12px}
  .hmm-image-button{width:68px;height:68px;flex-basis:68px}
  .hmm-item-head{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:10px;align-items:start}
  .hmm-dots{display:none}
  .hmm-name-wrap{min-width:0}
  .hmm-name{font-size:.98rem}
  .hmm-price{font-size:.98rem;text-align:right}
  .hmm-badge{margin-left:0;margin-right:4px;margin-top:4px}
  .hmm-desc p{font-size:.84rem}
}

@media(max-width:380px){
  .hmm-item{gap:10px}
  .hmm-image-button{width:58px;height:58px;flex-basis:58px}
  .hmm-theme-banner>h2{font-size:1.45rem}
}
