/* EatsOne V7.44 | order.html visual parity layer.
   Source of truth: original EatsOne_new_front_html_v1/order.html + assets/order.css.
   Presentation only: existing PHP data, events and payment/stock logic untouched.
   Included after every older order-specific CSS to resolve the existing !important cascade.
*/
body.order-front-v7{
  --e744-paper:#fffdf9;
  --e744-canvas:#f6f2eb;
  --e744-tan:#f4eadc;
  --e744-soft:#faf6f0;
  --e744-stroke:#e7dbcf;
  --e744-brown:#554134;
  --e744-ink:#342d29;
  --e744-muted:#786e64;
  background:var(--e744-canvas);
  color:var(--e744-ink);
  font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;
  line-height:1.65;
}
body.order-front-v7 .order-hybrid-page{
  background:var(--e744-canvas)!important;
  padding-top:28px!important;
}
body.order-front-v7 .order-hybrid-page>.section-inner{
  width:min(1300px,calc(100% - 54px))!important;
  max-width:1300px!important;
}
/* The supplied order.html uses one introductory panel, not a loose hero + toolbar. */
body.order-front-v7 .order-reference-intro-v744{
  display:flex;flex-direction:column;
  border:1px solid var(--e744-stroke);
  background:var(--e744-paper);
  border-radius:12px;
  overflow:visible;
  box-shadow:0 9px 26px rgba(59,40,17,.035);
  margin:0 0 16px;
  isolation:isolate;
}
body.order-front-v7 .order-reference-intro-v744>.order-hero-top{
  order:1;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(275px,315px)!important;
  gap:26px!important;
  align-items:center;
  margin:0!important;
  padding:26px 32px!important;
  background:linear-gradient(110deg,#f4eadc,#fcf8f1);
  border-radius:12px 12px 0 0;
}
body.order-front-v7 .order-hero-copy .kicker{
  font:600 10px/1.5 Arial,sans-serif!important;
  letter-spacing:.20em!important;
  margin:0 0 7px!important;
  color:#996a4b!important;
}
body.order-front-v7 .order-hero-copy .section-title{
  font:500 clamp(30px,3vw,36px)/1.35 "Noto Serif TC","Songti TC","PMingLiU",serif!important;
  letter-spacing:.085em!important;
  margin:0 0 7px!important;
  color:#2e2621!important;
}
body.order-front-v7 .order-front-intro{
  font:400 13px/1.8 "Noto Sans TC","PingFang TC",sans-serif!important;
  letter-spacing:0!important;
  margin:0!important;
  color:var(--e744-muted)!important;
}
body.order-front-v7 .order-hero-store.store-switcher-v150{
  border:1px solid #d9cbbc!important;
  border-radius:6px!important;
  background:#fffefa!important;
  box-shadow:none!important;
}
body.order-front-v7 .store-switch-trigger-v150{
  min-height:80px!important;
  padding:12px 15px!important;
  gap:10px!important;
}
body.order-front-v7 .store-switch-current-v150{gap:2px!important}
body.order-front-v7 .store-switch-current-v150 small{
  font:500 11px/1.5 "Noto Sans TC",sans-serif!important;
  color:#806f61!important;
}
body.order-front-v7 .store-switch-current-v150 strong{
  font:600 15px/1.5 "Noto Serif TC",serif!important;
  color:#3b312a!important;
}
body.order-front-v7 .store-switch-current-v150 [data-selected-store-hours-label]{
  font-size:11px!important;color:#88776b!important;
}
body.order-front-v7 .store-switch-action-v150{font-size:11px!important}
/* Move the original personal / group switch after order method, visually and only. */
body.order-front-v7 .order-reference-intro-v744>.ordering-mode-v233{
  order:3;
  margin:0!important;
  padding:14px 32px 19px!important;
  border-top:1px solid #e9dfd4!important;
  background:#fffdf9!important;
  box-shadow:none!important;
  border-radius:0 0 12px 12px!important;
}
body.order-front-v7 .order-reference-intro-v744>.ordering-mode-v233[hidden]{display:none!important}
body.order-front-v7 .order-reference-intro-v744>.order-toolbar-card{
  order:2;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  grid-template-areas:"method actions" "tabs tabs"!important;
  gap:14px!important;
  padding:20px 32px 23px!important;
  margin:0!important;
  background:#fffdf9!important;
  box-shadow:none!important;
  border:0!important;
  border-radius:0!important;
}
body.order-front-v7 .order-toolbar-card>.order-toolbar-brand,
body.order-front-v7 .order-toolbar-card>.order-search-tools{display:none!important}
body.order-front-v7 .order-toolbar-card>.order-front-method-heading{
  grid-area:method!important;
  display:grid!important;gap:2px!important;
  margin:0!important;padding:0!important;
}
body.order-front-v7 .order-front-method-heading .order-front-eyebrow,
body.order-front-v7 .order-front-menu-heading .order-front-eyebrow{
  font:600 10px/1.5 Arial,sans-serif!important;
  letter-spacing:.18em!important;
  color:#a27b60!important;
}
body.order-front-v7 .order-front-method-heading h3{
  font:500 21px/1.4 "Noto Serif TC","Songti TC",serif!important;
  letter-spacing:.035em!important;
  margin:3px 0 0!important;
}
body.order-front-v7 .order-toolbar-card>.order-quick-actions-v147{
  grid-area:actions!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-wrap:wrap!important;
  gap:8px!important;
}
body.order-front-v7 .order-quick-actions-v147 :is(a,button){
  border-radius:6px!important;
  font-size:12px!important;
}
body.order-front-v7 .order-toolbar-card>.order-mode-tabs{
  grid-area:tabs!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  padding:0!important;margin:0!important;
  border:0!important;
  background:transparent!important;
  border-radius:0!important;
  gap:9px!important;
}
body.order-front-v7 .order-mode-tabs button{
  min-width:0!important;
  min-height:47px!important;
  height:auto!important;
  padding:12px 6px!important;
  border:1px solid #d9cbbb!important;
  border-radius:6px!important;
  background:#faf6f0!important;
  color:#52463b!important;
  font:500 13px/1.5 "Noto Sans TC","PingFang TC",sans-serif!important;
  box-shadow:none!important;
  white-space:nowrap!important;
  transition:border-color .18s,background .18s!important;
}
body.order-front-v7 .order-mode-tabs button.active,
body.order-front-v7 .order-mode-tabs button[aria-pressed="true"]{
  background:#554134!important;border-color:#554134!important;color:#fff!important;
}
body.order-front-v7 .order-mode-tabs button:hover:not(.active):not([aria-pressed="true"]){border-color:#c78c64!important}
/* The active mode's real data inputs, directly after the unified introduction panel. */
body.order-front-v7 .order-extra-panel{
  margin:0 0 14px!important;
  padding:14px 18px!important;
  background:#fffdf9!important;
  border:1px solid #e7dbcf!important;
  border-radius:10px!important;
  box-shadow:none!important;
}
body.order-front-v7 .order-extra-panel :is(input,select,textarea){
  border-color:#d9cbbc;
  background:#fffefa;
  border-radius:6px;
}
body.order-front-v7 .order-extra-panel .delivery-compact-card,
body.order-front-v7 .order-extra-panel .order-info-card{
  box-shadow:none!important;
  border-color:#e6dcd0!important;
}
body.order-front-v7 .order-extra-panel .order-rule-card-v160{
  box-shadow:none!important;
  border-color:#e5d8c9!important;
  background:#fffdf9!important;
}
/* The service timeline is a compact information strip in the reference hierarchy. */
body.order-front-v7 .order-service-window-v154{
  margin:0 0 24px!important;
  background:#f3e9dc!important;
  box-shadow:none!important;
  border:1px solid #e3d2c0!important;
  border-radius:9px!important;
  padding:15px 19px!important;
}
body.order-front-v7 .order-service-now-v154{
  border:0!important;border-radius:8px!important;
  background:transparent!important;box-shadow:none!important;
  min-height:0!important;padding:8px!important;
}
body.order-front-v7 .order-service-clock-icon-v154{
  box-shadow:none!important;border-radius:50%!important;
  width:39px!important;height:39px!important;flex-basis:39px!important;
  background:#e8d3bc!important;color:#815739!important;
}
body.order-front-v7 .order-service-now-v154 h2{font-size:22px!important;font-weight:600!important}
body.order-front-v7 .order-service-foot-v154{padding-top:12px!important}
/* Product browsing: same calm 3-column rhythm as original order.html. */
@media(min-width:1081px){
  body.order-front-v7 .order-hybrid-grid{
    display:grid!important;
    grid-template-columns:225px minmax(0,1fr) 245px!important;
    gap:19px!important;
    align-items:start!important;
  }
}
body.order-front-v7 .order-left-sidebar,
body.order-front-v7 .order-right-sidebar{min-width:0!important}
body.order-front-v7 .order-left-sidebar .order-category-panel,
body.order-front-v7 .order-right-sidebar .order-cart-panel{
  border:1px solid #e7dcd0!important;
  border-radius:9px!important;
  background:#fffdf9!important;
  box-shadow:none!important;
  padding:17px!important;
}
body.order-front-v7 .order-left-sidebar .order-guide-card{
  border-radius:6px!important;
  background:#f1e5d9!important;
  color:#554134!important;
  box-shadow:none!important;
}
body.order-front-v7 .order-category-panel h2,
body.order-front-v7 .order-cart-panel .cart-panel-head h2{
  font:500 19px/1.45 "Noto Serif TC","Songti TC",serif!important;
  letter-spacing:.025em!important;
}
body.order-front-v7 .order-left-sidebar .order-category-list > a:not(.sub-category-link){
  border-radius:6px!important;
  min-height:43px!important;
  font-size:13px!important;
  font-weight:500!important;
  padding:7px 8px!important;
  margin:4px 0!important;
}
body.order-front-v7 .order-left-sidebar .order-category-list > a:not(.sub-category-link) > .order-category-thumb{
  width:32px!important;height:32px!important;flex-basis:32px!important;
  border-radius:6px!important;
}
body.order-front-v7 .order-left-sidebar .order-category-list .sub-category-link{
  margin-left:39px!important;
  min-height:31px!important;
  font-weight:400!important;
}
body.order-front-v7 .order-front-menu-heading{
  padding:0 0 16px!important;
  margin:0 0 14px!important;
}
body.order-front-v7 .order-front-menu-heading h2{
  font:500 26px/1.4 "Noto Serif TC","Songti TC",serif!important;
  letter-spacing:.07em!important;
  margin:5px 0 5px!important;
}
body.order-front-v7 .order-front-menu-heading p{font-size:12px!important;color:#86786a!important}
body.order-front-v7 .order-content-area>.order-search-tools{
  margin:0 0 15px!important;
  padding:0 0 12px!important;
  border-bottom:1px solid #e0d4c8!important;
}
body.order-front-v7 .order-search-box{background:#fffefa!important;border-radius:6px!important}
body.order-front-v7 .order-content-area>.order-search-tools .order-search-box{min-height:38px!important;border-color:#d9cbbc!important}
body.order-front-v7 .order-view-toggle button{border-radius:5px!important}
body.order-front-v7 .order-view-toggle button.is-active{background:#554134!important;color:#fff!important}
body.order-front-v7 .order-content-area .ocard-menu-section{
  margin:0 0 27px!important;
  border:0!important;
}
body.order-front-v7 .order-content-area .ocard-menu-section h2.order-category-heading-with-image{
  font:500 20px/1.45 "Noto Serif TC","Songti TC",serif!important;
  letter-spacing:.03em!important;
  gap:9px!important;
  margin:0 0 11px!important;
  padding:0 0 10px!important;
}
body.order-front-v7 .order-content-area .order-category-heading-image{
  width:45px!important;height:45px!important;flex:0 0 45px!important;
  border-radius:7px!important;
}
body.order-front-v7 .order-subcategory-tabs{margin:0 0 14px!important}
body.order-front-v7 .order-subcategory-tabs a{
  border:1px solid #dfd2c4!important;
  border-radius:999px!important;
  padding:6px 12px!important;
  font-size:12px!important;
  background:#fffdf9!important;
  color:#807366!important;
}
body.order-front-v7 .order-subcategory-tabs a.active{
  background:#f3e3d5!important;
  border-color:#c78a62!important;
  color:#794b31!important;
}
/* Keep the user's later explicit choice: list = exactly one product per row. */
body.order-front-v7 .order-content-area:not(.is-grid-view) .ocard-menu-section>.hybrid-product{
  display:grid!important;
  grid-template-columns:112px minmax(0,1fr) 36px!important;
  gap:12px!important;
  width:100%!important;
  min-height:125px!important;
  padding:10px!important;
  margin-bottom:10px!important;
  border:1px solid #e7ded3!important;
  border-radius:7px!important;
  background:#fffdf9!important;
  box-shadow:none!important;
}
body.order-front-v7 .order-content-area:not(.is-grid-view) .hybrid-product>img{
  width:112px!important;height:104px!important;object-fit:cover!important;
  border-radius:5px!important;
}
body.order-front-v7 .hybrid-product .hybrid-product-body{
  gap:4px!important;
  justify-content:center!important;
  min-width:0!important;
}
body.order-front-v7 .hybrid-product h3{
  font:500 15px/1.5 "Noto Serif TC","Songti TC",serif!important;
  color:#352b25!important;
  letter-spacing:.012em!important;
}
body.order-front-v7 .hybrid-product p{
  font:400 12px/1.6 "Noto Sans TC","PingFang TC",sans-serif!important;
  color:#86796d!important;
  margin:0!important;
  -webkit-line-clamp:2!important;
}
body.order-front-v7 .hybrid-product strong{
  font:650 15px/1.4 Arial,"Noto Sans TC",sans-serif!important;
  color:#63402e!important;
}
body.order-front-v7 .hybrid-plus{
  border-radius:50%!important;
  background:#efe0d0!important;
  color:#64412c!important;
  box-shadow:none!important;
}
body.order-front-v7 .hybrid-product:hover{
  border-color:#cdb49e!important;
  box-shadow:0 8px 20px rgba(57,38,13,.055)!important;
  transform:none!important;
}
/* In grid mode retain the existing image-first cards while matching the same design palette. */
body.order-front-v7 .order-content-area.is-grid-view .hybrid-product{
  background:#fffdf9!important;
  border:1px solid #e7ded3!important;
  border-radius:8px!important;
  box-shadow:none!important;
}
body.order-front-v7 .order-content-area.is-grid-view .hybrid-product>img{border-radius:6px!important}
body.order-front-v7 .order-cart-panel .checkout-btn{
  background:#4b392e!important;
  border-radius:6px!important;
  color:#fff!important;
}
/* Reference mobile behavior: stack store below title, keep modes readable. */
@media(max-width:1080px){
  body.order-front-v7 .order-hybrid-grid{display:block!important}
  body.order-front-v7 .order-reference-intro-v744>.order-hero-top{
    grid-template-columns:minmax(0,1fr) minmax(230px,300px)!important;
    padding:22px 24px!important;
  }
  body.order-front-v7 .order-reference-intro-v744>.order-toolbar-card{padding:20px 24px!important}
  body.order-front-v7 .order-reference-intro-v744>.ordering-mode-v233{padding:13px 24px 18px!important}
}
@media(max-width:720px){
  body.order-front-v7 .order-hybrid-page{padding-top:12px!important}
  body.order-front-v7 .order-hybrid-page>.section-inner{width:calc(100% - 28px)!important}
  body.order-front-v7 .order-reference-intro-v744{margin-bottom:12px;border-radius:10px}
  body.order-front-v7 .order-reference-intro-v744>.order-hero-top{
    display:block!important;
    padding:19px 18px!important;
    border-radius:10px 10px 0 0;
  }
  body.order-front-v7 .order-hero-copy .section-title{font-size:27px!important}
  body.order-front-v7 .order-front-intro{font-size:12px!important}
  body.order-front-v7 .order-hero-store.store-switcher-v150{margin:15px 0 0!important;width:100%!important}
  body.order-front-v7 .store-switch-trigger-v150{min-height:69px!important;padding:10px 12px!important}
  body.order-front-v7 .order-reference-intro-v744>.order-toolbar-card{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-areas:"method actions" "tabs tabs"!important;
    gap:10px!important;
    padding:17px 18px 19px!important;
  }
  body.order-front-v7 .order-front-method-heading h3{font-size:19px!important}
  body.order-front-v7 .order-toolbar-card>.order-quick-actions-v147{gap:4px!important}
  body.order-front-v7 .order-quick-actions-v147 :is(a,button){font-size:11px!important}
  body.order-front-v7 .order-mode-tabs{gap:5px!important}
  body.order-front-v7 .order-mode-tabs button{
    min-height:44px!important;padding:8px 3px!important;
    font-size:11px!important;
    white-space:normal!important;
    line-height:1.35!important;
  }
  body.order-front-v7 .order-reference-intro-v744>.ordering-mode-v233{padding:11px 18px 16px!important}
  body.order-front-v7 .order-extra-panel{padding:10px!important;margin-bottom:12px!important}
  body.order-front-v7 .order-service-window-v154{padding:12px!important}
  body.order-front-v7 .order-service-now-v154 h2{font-size:19px!important}
  body.order-front-v7 .order-front-menu-heading h2{font-size:23px!important}
  body.order-front-v7 .order-content-area:not(.is-grid-view) .ocard-menu-section>.hybrid-product{
    grid-template-columns:83px minmax(0,1fr) 30px!important;
    gap:9px!important;
    min-height:109px!important;
    padding:9px!important;
  }
  body.order-front-v7 .order-content-area:not(.is-grid-view) .hybrid-product>img{width:83px!important;height:88px!important}
  body.order-front-v7 .hybrid-product h3{font-size:14px!important}
  body.order-front-v7 .hybrid-product p{font-size:11px!important}
  body.order-front-v7 .hybrid-product strong{font-size:14px!important}
  body.order-front-v7 .hybrid-plus{width:29px!important;height:29px!important}
}
@media(max-width:360px){
  body.order-front-v7 .order-reference-intro-v744>.order-toolbar-card{
    grid-template-columns:1fr!important;
    grid-template-areas:"method" "tabs" "actions"!important;
  }
  body.order-front-v7 .order-toolbar-card>.order-quick-actions-v147{justify-content:flex-start!important}
  body.order-front-v7 .order-content-area:not(.is-grid-view) .ocard-menu-section>.hybrid-product{
    grid-template-columns:72px minmax(0,1fr) 28px!important;gap:7px!important;
  }
  body.order-front-v7 .order-content-area:not(.is-grid-view) .hybrid-product>img{width:72px!important;height:83px!important}
}
@media(prefers-reduced-motion:reduce){body.order-front-v7 .hybrid-product{transition:none!important}}