/* FP-EC 既存WebOrder踏襲スタイル。色は --brand 等（テナント変数, layout で注入）。 */
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
body{font-family:"Roboto",-apple-system,"PingFang HK","Hiragino Sans","Microsoft JhengHei",sans-serif;background:#f7f7f7;color:#222}
a{text-decoration:none;color:inherit}
.app{max-width:480px;margin:0 auto;min-height:100vh;background:#f7f7f7;display:flex;flex-direction:column}

/* header (top.component 踏襲) */
.m-web_order_header{background:var(--brand);color:#fff;padding:9px 12px;display:flex;align-items:center;gap:10px;min-height:58px;position:sticky;top:0;z-index:5}
.workspace-logo{width:46px;height:46px;border-radius:50%;background:#fff;flex:0 0 auto;display:flex;align-items:center;justify-content:center;font-weight:900;font-style:italic;color:var(--brand);font-size:14px}
.branch-info{flex:1;min-width:0;font-size:15px;line-height:1.3}
.branch-info .ws{font-size:11px;opacity:.85}
.lang_change_icon{color:#fff;font-size:18px;padding:4px;cursor:pointer}
.lang-btn{display:flex;align-items:center;gap:4px;color:#fff;font-size:12px;font-weight:600;padding:5px 8px;border-radius:999px;border:1.5px solid rgba(255,255,255,.55);white-space:nowrap;flex:0 0 auto;transition:background .15s}
.lang-btn:hover{background:rgba(255,255,255,.18)}
.lang-btn .fa-globe{font-size:15px}
.wo-back{font-size:20px;font-weight:700;color:#fff;cursor:pointer}

.body{flex:1;overflow-y:auto}
.btn_back{background:none;border:none;color:var(--brand);font-size:13px;font-weight:600;padding:10px 12px;display:flex;align-items:center;gap:6px;cursor:pointer}

/* store select */
.filterbar{display:flex;gap:7px;padding:9px 10px;overflow-x:auto;background:#fff;border-bottom:1px solid #e6e6e6}
.chip{flex:0 0 auto;font-size:12px;padding:5px 12px;border-radius:999px;background:#f0f0f2;color:#555;cursor:pointer;white-space:nowrap}
.chip.on{background:var(--brand);color:#fff}
.store{background:#fff;padding:12px 14px;border-bottom:1px solid #eee;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:8px}
.store.closed{opacity:.5;pointer-events:none}
.store .nm{font-size:14px;font-weight:700}
.store .ad{font-size:11px;color:#777;margin-top:3px;line-height:1.4}
.store .hr{font-size:11px;margin-top:3px}
.store .hr.open{color:#2f8f4e}.store .hr.shut{color:#b33}
.store .go{color:var(--brand);font-size:16px}
.member-chip{background:var(--accent-bg);color:var(--brand);font-size:11px;padding:6px 12px;border-bottom:1px solid #eee}
.mid-error{background:#fff3cd;color:#8a6d3b;font-size:11px;padding:6px 12px;border-bottom:1px solid #eee}

/* start */
.m-start_area{background:#fff;flex:1;display:flex;flex-direction:column;align-items:center;padding:26px 20px;text-align:center;min-height:calc(100vh - 0px)}
.welcome{font-size:16px;color:var(--brand);font-weight:700;margin-top:10px}
.start-logo{width:100px;height:100px;border-radius:50%;background:var(--brand);display:flex;align-items:center;justify-content:center;color:#fff;font-style:italic;font-weight:900;font-size:32px;margin:20px 0 12px}
.start-branch{font-size:19px;font-weight:700;margin-bottom:22px}
.start_order_btn{width:100%}
.start_order_btn button,.btn-brand{width:100%;background:var(--brand);color:#fff;border:none;border-radius:5px;font-size:19px;padding:14px;font-weight:700;cursor:pointer;box-shadow:0 2px 4px rgba(0,0,0,.2)}
.start-globe{font-size:22px;color:var(--brand);cursor:pointer}
.start-globe-link{display:flex;align-items:center;gap:6px;margin:20px 0;color:var(--brand);font-size:13px;font-weight:600;padding:6px 14px;border:1.5px solid var(--brand);border-radius:999px;transition:background .15s}
.start-globe-link:hover{background:var(--accent-bg)}
.start-globe-label{font-size:12px;font-weight:700}
.slogan{margin-top:auto;color:#888;padding-top:24px}
.slogan_text{font-size:12px;margin-bottom:8px}
.poweredby{font-size:10px;color:#aaa}
.fp-logo{font-weight:900;font-style:italic;color:var(--brand);font-size:18px}

/* dishes */
.order_base_info{background:#fff;border-bottom:1px solid #e6e6e6;display:grid;grid-template-columns:1fr 1fr;font-size:11px;color:#555}
.order_base_info div{padding:7px 12px;border-bottom:1px solid #f0f0f0}
.order_base_info .colon{margin:0 3px}
.order_base_info .grand_total{color:var(--brand);font-weight:800}
.order_base_info .order_code{font-weight:700;color:#333}
.mat-tabs{display:flex;background:#fff;border-bottom:1px solid #e6e6e6;overflow-x:auto;position:sticky;top:58px;z-index:3}
.mat-tab{flex:1 0 auto;text-align:center;font-size:13px;padding:12px 16px;color:#666;cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap}
.mat-tab.on{color:var(--brand);border-bottom-color:var(--brand);font-weight:700}
.dish-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:7px}
.dishe-card{background:#fff;border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.14);overflow:hidden;cursor:pointer;display:flex;flex-direction:column}
.dishe-card:active{box-shadow:0 0 0 2px var(--brand)}
.dishe-image{height:130px;display:flex;align-items:center;justify-content:center;font-size:48px;color:#fff}
.dishe-desc{padding:9px 10px}
.p_name{font-size:13px;font-weight:600;line-height:1.3;color:#333}
.p_price{font-size:14px;font-weight:800;color:var(--brand);margin-top:6px}

/* bottom nav */
.bottom-nav{display:flex;background:#fff;border-top:1px solid #e6e6e6;height:60px;position:sticky;bottom:0}
.bottom-nav .tab{flex:1;border:none;background:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11px;color:#555;cursor:pointer;position:relative;text-decoration:none}
.bottom-nav .tab i{font-size:20px;color:var(--brand)}
.bottom-nav .badge{position:absolute;top:8px;right:50%;margin-right:-24px;background:#d9534f;color:#fff;font-size:9px;font-weight:700;border-radius:999px;min-width:16px;height:16px;display:flex;align-items:center;justify-content:center;padding:0 3px}
.bottom-nav .confirm{flex:1;background:var(--brand);color:#fff;font-size:15px;font-weight:700;display:flex;align-items:center;justify-content:center;border:none;cursor:pointer}

/* detail */
.detail-img{height:175px;display:flex;align-items:center;justify-content:center;font-size:66px;color:#fff}
.detail-pad{background:#fff;padding:13px 15px}
.detail-name{font-size:17px;font-weight:800}
.detail-price{font-size:17px;font-weight:800;color:var(--brand)}
.p_description{font-size:12px;color:#777;margin-top:6px;line-height:1.5}
.p_group_name{font-weight:700;font-size:13px;margin:15px 0 4px;padding-left:6px}
.p_group_name .req{color:#e53935;font-weight:700;font-size:11px}
.p_group_description{font-size:11px;color:#777;padding-left:6px;margin-bottom:4px}
.property_row{display:flex;align-items:center;justify-content:space-between;padding:10px 6px;border-bottom:1px solid #f0f0f0;font-size:13px}
.property_name{display:flex;align-items:center;gap:9px}
.property_name input{width:17px;height:17px;accent-color:var(--brand)}
.property_price{color:#555;font-size:12.5px}
.dishe_note{width:100%;border:1px solid #ddd;border-radius:6px;padding:9px;font-size:13px;resize:none;font-family:inherit;margin-top:4px}
.detailnav{align-items:center;padding:0 14px;gap:12px}
.num-input-number{display:flex;align-items:center;gap:12px}
.num-input-number i{font-size:26px;color:var(--brand);cursor:pointer}
.num-input__inner{width:40px;text-align:center;border:none;font-size:17px;font-weight:700;background:none}
.addcart{flex:1;background:var(--brand);color:#fff;border:none;border-radius:6px;padding:12px;font-weight:700;font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}
.num-input-number.sm i{font-size:21px}.num-input-number.sm .num-input__inner{width:32px;font-size:15px}

/* cart */
.flex-container{display:flex;align-items:center;background:#fff;border-bottom:1px solid #e6e6e6}
.flex-container .col1{flex:0 0 auto}.flex-container .col2{flex:1;text-align:center}.flex-container .col3{flex:0 0 60px}
.cart_title{font-size:15px;font-weight:700}
.dishInfo{background:#fff;margin:7px 0;border-top:1px solid #f0f0f0;border-bottom:1px solid #f0f0f0;padding:4px 14px}
.dish_row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;font-weight:700;font-size:14px;border-bottom:1px dashed #eee}
.property_row.sub{font-weight:400;font-size:12.5px;color:#555;border:none;padding:7px 0}
.input_quantity_row,.subtotal_row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;font-size:12.5px}
.subtotal_row .property_price{font-weight:800;color:#333}
.cart-total{background:#fff;margin-top:7px;padding:13px 15px;border-top:2px solid var(--brand)}
.cart-total .r{display:flex;justify-content:space-between;font-size:13px;padding:4px 0}
.cart-total .r.g{font-size:17px;font-weight:800;color:var(--brand);border-top:1px solid #e6e6e6;margin-top:5px;padding-top:8px}
.cart-total .dc{color:#c0392b}

/* payment / complete */
.pay-pad{background:#fff;padding:15px;flex:1}
.pay-sec{font-weight:700;font-size:13px;margin-bottom:6px}
.paym{display:flex;align-items:center;gap:11px;padding:11px 0;border-bottom:1px solid #f0f0f0;font-size:14px}
.paym .ic{width:34px;height:23px;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:10px;color:#fff;font-weight:700}
.field{width:100%;border:1px solid #ddd;border-radius:7px;padding:11px;font-size:14px;margin-top:9px;font-family:inherit}
.pay-btn{margin:14px;background:var(--brand);color:#fff;border:none;border-radius:6px;padding:14px;font-size:16px;font-weight:700;cursor:pointer;display:block;text-align:center}
.done-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;background:#fff}
.check{width:72px;height:72px;border-radius:50%;background:#2f8f4e;color:#fff;font-size:36px;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.pointcard{background:linear-gradient(135deg,var(--brand),var(--brand_d));color:#fff;border-radius:12px;padding:16px;width:100%;margin:16px 0}
.pointcard .lbl{font-size:11px;opacity:.9}.pointcard .big{font-size:30px;font-weight:900;margin:2px 0}
.muted{color:#888;font-size:12px}
.mockflag{position:fixed;left:8px;bottom:8px;background:#333;color:#fff;font-size:10px;padding:3px 8px;border-radius:6px;opacity:.6;z-index:10}