:root {
    --coffee-900: #2c1a12;
    --coffee-800: #3b2417;
    --coffee-700: #5b3a26;
    --coffee-600: #7a4f33;
    --coffee-500: #9c6b44;
    --coffee-300: #c9a27e;
    --cream-100: #fbf6f0;
    --cream-200: #f3e9dd;
    --accent: #d98a3d;
    --text: #2b2018;
    --muted: #8a7a6c;
}

* { box-sizing: border-box; }

html, body {
    font-family: 'Vazirmatn', Tahoma, system-ui, sans-serif;
    background: var(--cream-100);
    color: var(--text);
    margin: 0;
    scroll-behavior: smooth;
}

a { text-decoration: none; color: inherit; }

/* ---------- Navbar ---------- */
.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: var(--coffee-900);
    color: var(--cream-100);
    box-shadow: 0 2px 12px rgba(0,0,0,.18);
}
.site-header .nav-inner {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .7rem 1.2rem;
    gap: 1rem;
}
.brand { display: flex; align-items: center; gap: .55rem; font-weight: 700; font-size: 1.35rem; color: var(--cream-100); }
.brand .logo { font-size: 1.6rem; }
.main-nav { display: flex; gap: .35rem; flex-wrap: wrap; }
.main-nav a {
    padding: .45rem .95rem;
    border-radius: .6rem;
    color: var(--cream-200);
    font-weight: 500;
    transition: background .15s, color .15s;
}
.main-nav a:hover { background: rgba(255,255,255,.08); color: #fff; }
.main-nav a.active { background: var(--accent); color: #2b1c0e; }
.nav-toggle { display: none; background: none; border: 0; color: var(--cream-100); font-size: 1.6rem; cursor: pointer; }

@media (max-width: 760px) {
    .nav-toggle { display: block; }
    .main-nav { display: none; position: absolute; top: 100%; inset-inline-start: 0; inset-inline-end: 0; background: var(--coffee-800); flex-direction: column; padding: .5rem 1rem 1rem; }
    .main-nav.open { display: flex; }
}

/* ---------- Slider ---------- */
.hero-slider { position: relative; max-width: 1200px; margin: 1.2rem auto; border-radius: 1.1rem; overflow: hidden; box-shadow: 0 10px 30px rgba(60,36,23,.18); }
.slides { position: relative; height: 360px; }
.slide { position: absolute; inset: 0; opacity: 0; transition: opacity .8s ease; }
.slide.active { opacity: 1; }
.slide img { width: 100%; height: 100%; object-fit: cover; }
.slide .caption {
    position: absolute; inset-inline-start: 0; inset-inline-end: 0; bottom: 0;
    background: linear-gradient(to top, rgba(28,16,10,.82), transparent);
    color: #fff; padding: 2.4rem 2rem 1.6rem; font-size: 1.5rem; font-weight: 700;
}
.slider-dots { position: absolute; bottom: .9rem; inset-inline-start: 50%; transform: translateX(50%); display: flex; gap: .4rem; }
.slider-dots button { width: 10px; height: 10px; border-radius: 50%; border: 0; background: rgba(255,255,255,.55); cursor: pointer; }
.slider-dots button.active { background: var(--accent); }
.slider-arrow { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,.35); color:#fff; border:0; width:42px; height:42px; border-radius:50%; font-size:1.2rem; cursor:pointer; }
.slider-arrow:hover { background: rgba(0,0,0,.55); }
.slider-arrow.prev { inset-inline-start: .8rem; }
.slider-arrow.next { inset-inline-end: .8rem; }
@media (max-width: 600px) { .slides { height: 220px; } .slide .caption { font-size: 1.1rem; padding: 1.4rem 1rem 1rem; } }

/* ---------- Layout sections ---------- */
.container-page { max-width: 1200px; margin: 0 auto; padding: 1rem 1.2rem 3rem; }
.section-head { display: flex; align-items: center; justify-content: space-between; margin: 2rem 0 1rem; }
.section-head h2 { font-size: 1.5rem; font-weight: 700; color: var(--coffee-800); margin: 0; display:flex; align-items:center; gap:.5rem; }
.section-head a { color: var(--accent); font-weight: 600; font-size: .95rem; }

/* ---------- Cards grid ---------- */
.cards-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1.2rem; }
.shop-card { background: #fff; border-radius: 1rem; overflow: hidden; box-shadow: 0 4px 16px rgba(60,36,23,.08); transition: transform .15s, box-shadow .15s; display:flex; flex-direction:column; }
.shop-card:hover { transform: translateY(-4px); box-shadow: 0 12px 26px rgba(60,36,23,.16); }
.shop-card .thumb { height: 165px; background: var(--cream-200); position: relative; }
.shop-card .thumb img { width: 100%; height: 100%; object-fit: cover; }
.shop-card .rating-badge { position:absolute; top:.6rem; inset-inline-end:.6rem; background: rgba(28,16,10,.78); color:#ffd9a0; padding:.2rem .55rem; border-radius:.55rem; font-size:.82rem; font-weight:600; }
.shop-card .body { padding: .85rem 1rem 1.1rem; display:flex; flex-direction:column; gap:.4rem; flex:1; }
.shop-card h3 { font-size: 1.12rem; font-weight: 700; margin: 0; color: var(--coffee-800); }
.shop-card .loc { color: var(--muted); font-size: .9rem; display:flex; align-items:center; gap:.3rem; }
.shop-card .meta { margin-top:auto; display:flex; align-items:center; justify-content:space-between; font-size:.85rem; color:var(--muted); }
.stars { color: var(--accent); letter-spacing: 1px; }

/* ---------- Filters ---------- */
.filters { background:#fff; border-radius:1rem; padding:1rem 1.2rem; box-shadow:0 4px 16px rgba(60,36,23,.08); display:grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap:.8rem; margin-bottom:1.4rem; }
.filters label { display:block; font-size:.85rem; font-weight:600; color:var(--coffee-700); margin-bottom:.3rem; }
.filters select, .filters input { width:100%; padding:.55rem .7rem; border:1px solid var(--cream-200); border-radius:.6rem; background:var(--cream-100); font-family:inherit; color:var(--text); }
.filters select:focus, .filters input:focus { outline:2px solid var(--coffee-300); }

/* ---------- States ---------- */
.loader { text-align:center; padding:2rem; color:var(--muted); }
.empty { text-align:center; padding:3rem 1rem; color:var(--muted); }
.spinner { width:34px; height:34px; border:3px solid var(--cream-200); border-top-color:var(--accent); border-radius:50%; animation:spin .8s linear infinite; margin:0 auto .6rem; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- Detail page ---------- */
.detail-hero { display:grid; grid-template-columns: 1.4fr 1fr; gap:1.2rem; margin:1.4rem 0; }
.detail-gallery .main-img { width:100%; height:340px; object-fit:cover; border-radius:1rem; }
.detail-thumbs { display:flex; gap:.6rem; margin-top:.6rem; flex-wrap:wrap; }
.detail-thumbs img { width:84px; height:64px; object-fit:cover; border-radius:.5rem; cursor:pointer; border:2px solid transparent; }
.detail-thumbs img.sel { border-color: var(--accent); }
.detail-info { background:#fff; border-radius:1rem; padding:1.4rem; box-shadow:0 4px 16px rgba(60,36,23,.08); }
.detail-info h1 { font-size:1.7rem; margin:0 0 .6rem; color:var(--coffee-900); }
.info-row { display:flex; gap:.5rem; padding:.5rem 0; border-bottom:1px dashed var(--cream-200); color:var(--coffee-700); }
.info-row .lbl { color:var(--muted); min-width:80px; }
.badge-soon { display:inline-block; background:var(--cream-200); color:var(--coffee-700); border-radius:.6rem; padding:.5rem .9rem; font-size:.9rem; }
@media (max-width: 800px) { .detail-hero { grid-template-columns: 1fr; } }

/* ---------- Footer ---------- */
.site-footer { background: var(--coffee-900); color: var(--cream-200); margin-top:2rem; }
.site-footer .inner { max-width:1200px; margin:0 auto; padding:2rem 1.2rem; display:grid; grid-template-columns: repeat(auto-fit,minmax(200px,1fr)); gap:1.5rem; }
.site-footer h4 { color:#fff; margin:0 0 .7rem; font-size:1.05rem; }
.site-footer a { color:var(--cream-200); display:block; padding:.2rem 0; }
.site-footer a:hover { color:var(--accent); }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); text-align:center; padding:1rem; font-size:.85rem; color:var(--coffee-300); }

/* ---------- Buttons ---------- */
.btn-coffee { background:var(--accent); color:#2b1c0e; border:0; border-radius:.6rem; padding:.55rem 1.2rem; font-weight:600; cursor:pointer; font-family:inherit; }
.btn-coffee:hover { filter:brightness(1.05); }
.btn-ghost { background:transparent; border:1px solid var(--coffee-300); color:var(--coffee-700); border-radius:.6rem; padding:.5rem 1rem; cursor:pointer; font-family:inherit; }

/* ---------- Account menu (navbar) ---------- */
.account-menu { display:flex; align-items:center; gap:.5rem; }
.acct-login { background:var(--accent); color:#2b1c0e; padding:.45rem 1rem; border-radius:.6rem; font-weight:600; }
.acct-login:hover { filter:brightness(1.05); }
.acct-user { color:var(--cream-100); padding:.4rem .7rem; border-radius:.6rem; background:rgba(255,255,255,.08); font-size:.9rem; }
.acct-logout { background:transparent; border:1px solid rgba(255,255,255,.3); color:var(--cream-200); border-radius:.6rem; padding:.4rem .8rem; cursor:pointer; font-family:inherit; font-size:.85rem; }
.acct-logout:hover { background:rgba(255,255,255,.1); }
@media (max-width:760px){ .account-menu { width:100%; justify-content:flex-start; padding-top:.4rem; } }

/* ---------- Auth / forms ---------- */
.auth-card { background:#fff; border-radius:1rem; padding:1.8rem; box-shadow:0 6px 22px rgba(60,36,23,.1); margin-top:1.5rem; }
.auth-card h1 { font-size:1.5rem; margin:0 0 .3rem; color:var(--coffee-900); }
.auth-sub { color:var(--muted); margin:0 0 1.2rem; font-size:.92rem; }
.auth-input { width:100%; padding:.6rem .8rem; border:1px solid var(--cream-200); border-radius:.6rem; background:var(--cream-100); font-family:inherit; color:var(--text); font-size:1rem; }
.auth-input:focus { outline:2px solid var(--coffee-300); }
.auth-input.code { letter-spacing:.5rem; text-align:center; font-size:1.3rem; }
.auth-btn { width:100%; margin-top:1rem; padding:.7rem; font-size:1rem; }
.auth-error { background:#fde8e8; color:#a23b3b; padding:.6rem .9rem; border-radius:.6rem; margin-top:1rem; font-size:.9rem; }
.auth-error.inline { background:transparent; padding:0; }
.auth-mobile-row { display:flex; justify-content:space-between; align-items:center; margin-bottom:1rem; color:var(--coffee-700); }
.link-btn { background:none; border:0; color:var(--accent); cursor:pointer; font-family:inherit; font-size:.9rem; margin-top:.6rem; }
label { display:block; font-size:.88rem; font-weight:600; color:var(--coffee-700); margin:.7rem 0 .3rem; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:.5rem 1rem; }
.form-grid .full { grid-column:1 / -1; }
@media (max-width:600px){ .form-grid { grid-template-columns:1fr; } }
.saved-ok { color:#2e7d32; font-weight:600; font-size:.9rem; }
.hint { color:var(--muted); font-size:.88rem; margin:0 0 .8rem; }

/* ---------- Status badge ---------- */
.status-badge { padding:.3rem .8rem; border-radius:.6rem; font-size:.85rem; font-weight:600; }
.status-badge.draft { background:var(--cream-200); color:var(--coffee-700); }
.status-badge.pending { background:#fff3cd; color:#9a7d00; }
.status-badge.ok { background:#e3f5e3; color:#2e7d32; }
.status-badge.rejected { background:#fde8e8; color:#a23b3b; }

/* ---------- Image gallery (owner) ---------- */
.upload-btn { display:inline-block; background:var(--coffee-700); color:#fff; padding:.55rem 1.1rem; border-radius:.6rem; cursor:pointer; font-weight:600; font-size:.9rem; }
.upload-btn:hover { background:var(--coffee-600); }
.img-gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:1rem; margin-top:1rem; }
.img-tile { position:relative; border-radius:.7rem; overflow:hidden; border:2px solid transparent; background:var(--cream-200); }
.img-tile.main { border-color:var(--accent); }
.img-tile img { width:100%; height:120px; object-fit:cover; display:block; }
.main-tag { position:absolute; top:.4rem; inset-inline-start:.4rem; background:var(--accent); color:#2b1c0e; font-size:.72rem; font-weight:700; padding:.15rem .5rem; border-radius:.4rem; }
.tile-btn { position:absolute; border:0; cursor:pointer; font-family:inherit; font-size:.72rem; padding:.2rem .5rem; border-radius:.4rem; }
.tile-btn.set-main { bottom:.4rem; inset-inline-start:.4rem; background:rgba(255,255,255,.92); color:var(--coffee-800); }
.tile-btn.del { bottom:.4rem; inset-inline-end:.4rem; background:rgba(180,40,40,.92); color:#fff; }

/* ---------- Admin panel ---------- */
.acct-admin { color:#ffd9a0; background:rgba(255,255,255,.08); padding:.4rem .7rem; border-radius:.6rem; font-size:.85rem; }
.acct-admin:hover { background:rgba(255,255,255,.15); }
.admin-nav { display:flex; gap:.4rem; flex-wrap:wrap; background:#fff; padding:.6rem; border-radius:.8rem; box-shadow:0 4px 14px rgba(60,36,23,.08); margin:1rem 0; }
.admin-nav a { padding:.45rem .9rem; border-radius:.6rem; color:var(--coffee-700); font-weight:500; font-size:.92rem; }
.admin-nav a:hover { background:var(--cream-100); }
.admin-nav a.active { background:var(--coffee-800); color:#fff; }

.stat-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:1rem; }
.stat-card { background:#fff; border-radius:.9rem; padding:1.1rem; text-align:center; box-shadow:0 4px 14px rgba(60,36,23,.08); display:flex; flex-direction:column; gap:.3rem; }
.stat-card .num { font-size:1.8rem; font-weight:700; color:var(--coffee-800); }
.stat-card span:last-child { color:var(--muted); font-size:.85rem; }
.stat-card.pending { background:#fff8e8; }
.stat-card.pending .num { color:#b8860b; }

.admin-table { display:flex; flex-direction:column; gap:.6rem; margin-top:.6rem; }
.admin-row { display:flex; align-items:center; gap:.9rem; background:#fff; border-radius:.8rem; padding:.7rem .9rem; box-shadow:0 3px 12px rgba(60,36,23,.06); flex-wrap:wrap; }
.row-thumb { width:54px; height:54px; border-radius:.6rem; object-fit:cover; background:var(--cream-200); flex-shrink:0; }
.row-main { display:flex; flex-direction:column; gap:.2rem; flex:1; min-width:140px; }
.row-main strong { color:var(--coffee-800); }
.row-main span { color:var(--muted); font-size:.85rem; }
.row-actions { display:flex; gap:.4rem; flex-wrap:wrap; }
.btn-coffee.sm, .btn-ghost.sm, .btn-reject.sm { padding:.35rem .75rem; font-size:.82rem; }
.btn-reject { background:#fde8e8; color:#a23b3b; border:0; border-radius:.6rem; padding:.5rem 1rem; cursor:pointer; font-family:inherit; font-weight:600; }
.btn-reject:hover { background:#f9d5d5; }

.filter-tabs { display:flex; gap:.4rem; margin:.6rem 0 1rem; flex-wrap:wrap; }
.filter-tabs button { background:#fff; border:1px solid var(--cream-200); color:var(--coffee-700); border-radius:.6rem; padding:.4rem .9rem; cursor:pointer; font-family:inherit; font-size:.88rem; }
.filter-tabs button.active { background:var(--coffee-800); color:#fff; border-color:var(--coffee-800); }

.admin-detail { background:var(--cream-100); border-radius:.7rem; padding:.9rem 1.1rem; margin:-.2rem 0 .4rem; }

.form-title { font-size:1.05rem; color:var(--coffee-800); margin:0 0 .8rem; }
.form-actions { margin-top:1rem; display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
.upload-row { display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
.upload-preview { width:70px; height:70px; object-fit:cover; border-radius:.5rem; }
.upload-preview.wide { width:160px; height:70px; }
.switch { display:flex; align-items:center; gap:.4rem; font-weight:400; color:var(--coffee-700); }

.geo-cols { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
@media (max-width:760px){ .geo-cols { grid-template-columns:1fr; } }
.geo-col { background:#fff; border-radius:.8rem; padding:1rem; box-shadow:0 3px 12px rgba(60,36,23,.06); }
.geo-col h3 { margin:0 0 .7rem; color:var(--coffee-800); font-size:1.05rem; }
.geo-add { display:flex; gap:.4rem; margin-bottom:.7rem; }
.geo-add .auth-input { padding:.4rem .6rem; }
.geo-item { display:flex; align-items:center; justify-content:space-between; padding:.45rem .6rem; border-radius:.5rem; cursor:pointer; }
.geo-item:hover { background:var(--cream-100); }
.geo-item.sel { background:var(--cream-200); font-weight:600; }
.geo-item small { color:var(--muted); }
.geo-item .x { background:none; border:0; color:#b04848; cursor:pointer; font-size:.9rem; }
.empty.sm { padding:1rem; font-size:.85rem; }

.role-tags { display:flex; gap:.3rem; flex-wrap:wrap; }
.role-tag { background:var(--cream-200); color:var(--coffee-700); border-radius:.5rem; padding:.2rem .6rem; font-size:.78rem; }

/* ---------- Public menu ---------- */
.menu-cat { font-size:1.15rem; color:var(--coffee-800); margin:1.4rem 0 .8rem; padding-bottom:.4rem; border-bottom:2px solid var(--cream-200); }
.menu-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:1rem; }
.menu-item { display:flex; align-items:center; gap:.8rem; background:#fff; border-radius:.8rem; padding:.7rem; box-shadow:0 3px 12px rgba(60,36,23,.06); }
.menu-item img { width:64px; height:64px; border-radius:.6rem; object-fit:cover; background:var(--cream-200); flex-shrink:0; }
.menu-item-body { display:flex; flex-direction:column; gap:.25rem; flex:1; }
.menu-item-name { font-weight:600; color:var(--coffee-800); }
.menu-item-price { color:var(--accent); font-weight:700; font-size:.9rem; }
.add-cart { white-space:nowrap; opacity:.6; }

/* ---------- Owner menu management ---------- */
.add-menu-row { display:flex; gap:.6rem; flex-wrap:wrap; align-items:center; }
.add-menu-row .auth-input { flex:1; min-width:150px; }
.menu-row { gap:.7rem; }
.price-edit { display:flex; align-items:center; gap:.3rem; }
.price-edit .auth-input { width:110px; padding:.4rem .5rem; }
.price-edit .unit { font-size:.8rem; color:var(--muted); }
.switch.sm { font-size:.82rem; gap:.25rem; }
.upload-inline { cursor:pointer; }

/* ---------- Reviews ---------- */
.review-form { background:#fff; border-radius:.9rem; padding:1.2rem; box-shadow:0 4px 16px rgba(60,36,23,.08); margin-bottom:1.2rem; }
.star-input { display:flex; align-items:center; gap:.2rem; margin-bottom:.7rem; }
.star-input .star { background:none; border:0; font-size:1.7rem; color:var(--cream-200); cursor:pointer; padding:0 .1rem; line-height:1; transition:color .1s; }
.star-input .star.on { color:var(--accent); }
.star-input .rating-hint { margin-inline-start:.6rem; color:var(--muted); font-size:.85rem; }
.review-login { background:var(--cream-100); border-radius:.7rem; padding:1rem; text-align:center; color:var(--coffee-700); margin-bottom:1rem; }
.review-login a { color:var(--accent); font-weight:600; }
.review-list { display:flex; flex-direction:column; gap:.8rem; }
.review-item { background:#fff; border-radius:.8rem; padding:.9rem 1.1rem; box-shadow:0 3px 12px rgba(60,36,23,.06); }
.review-head { display:flex; align-items:center; gap:.7rem; flex-wrap:wrap; }
.review-author { font-weight:600; color:var(--coffee-800); }
.review-date { color:var(--muted); font-size:.8rem; margin-inline-start:auto; }
.review-text { margin:.5rem 0 0; color:var(--coffee-700); line-height:1.9; }

/* ---------- Cart / toast ---------- */
.acct-cart { color:var(--cream-100); background:rgba(255,255,255,.08); padding:.4rem .55rem; border-radius:.6rem; font-size:1.1rem; }
.acct-cart:hover { background:rgba(255,255,255,.15); }
.cart-toast { position:fixed; bottom:1rem; inset-inline-start:50%; transform:translateX(50%); background:var(--coffee-800); color:#fff; padding:.7rem 1.1rem; border-radius:.8rem; display:flex; align-items:center; gap:1rem; box-shadow:0 6px 20px rgba(0,0,0,.25); z-index:60; }
.cart-toast a { color:var(--accent); font-weight:600; }
.toast-x { background:none; border:0; color:inherit; cursor:pointer; font-size:1rem; opacity:.7; }
.toast-x:hover { opacity:1; }
.cart-shop { color:var(--muted); margin-bottom:.8rem; }
.cart-items { display:flex; flex-direction:column; gap:.6rem; }
.cart-item { display:flex; align-items:center; gap:.8rem; background:#fff; border-radius:.8rem; padding:.6rem .8rem; box-shadow:0 3px 12px rgba(60,36,23,.06); }
.cart-item img { width:52px; height:52px; border-radius:.5rem; object-fit:cover; background:var(--cream-200); }
.cart-item-main { display:flex; flex-direction:column; flex:1; gap:.2rem; }
.cart-item-main .name { font-weight:600; color:var(--coffee-800); }
.cart-item-main .unit { color:var(--muted); font-size:.82rem; }
.qty { display:flex; align-items:center; gap:.5rem; }
.qty button { width:28px; height:28px; border-radius:.5rem; border:1px solid var(--cream-200); background:var(--cream-100); cursor:pointer; font-size:1rem; color:var(--coffee-700); }
.line-total { font-weight:700; color:var(--coffee-800); min-width:70px; text-align:start; }
.cart-footer { display:flex; align-items:center; justify-content:space-between; margin-top:1.2rem; flex-wrap:wrap; gap:1rem; }
.cart-total { font-size:1.05rem; color:var(--coffee-800); }
.cart-total strong { color:var(--accent); }

/* ---------- Payment ---------- */
.pay-card { background:#fff; border-radius:1rem; padding:2rem 1.6rem; box-shadow:0 6px 22px rgba(60,36,23,.1); text-align:center; margin-top:1.5rem; }
.pay-card h1 { font-size:1.4rem; color:var(--coffee-900); margin:.6rem 0; }
.pay-badge { display:inline-block; background:#fff3cd; color:#9a7d00; border-radius:.6rem; padding:.3rem .9rem; font-size:.85rem; font-weight:600; }
.pay-order { color:var(--muted); font-size:.9rem; }
.pay-amount { font-size:2rem; font-weight:700; color:var(--coffee-800); margin:.8rem 0; }
.pay-amount span { font-size:1rem; color:var(--muted); }
.pay-actions { display:flex; gap:1rem; justify-content:center; margin-top:1.2rem; flex-wrap:wrap; }
.pay-actions .btn-coffee, .pay-actions .btn-reject, .pay-actions .btn-ghost { padding:.7rem 1.4rem; }
.pay-fail-icon { width:64px; height:64px; border-radius:50%; background:#fde8e8; color:#a23b3b; font-size:2rem; display:flex; align-items:center; justify-content:center; margin:0 auto 1rem; }

/* ---------- Order ---------- */
.order-success { background:#fff; border-radius:1rem; padding:1.8rem; text-align:center; box-shadow:0 6px 22px rgba(60,36,23,.1); margin:1.2rem 0; border:2px solid #d8f0d8; }
.order-success.delivered { border-color:var(--accent); }
.order-success .check { width:60px; height:60px; border-radius:50%; background:#e3f5e3; color:#2e7d32; font-size:1.8rem; display:flex; align-items:center; justify-content:center; margin:0 auto .8rem; }
.order-success h2 { color:var(--coffee-900); margin:0 0 .6rem; }
.pickup-code { font-size:2.4rem; font-weight:800; letter-spacing:.4rem; color:var(--accent); background:var(--cream-100); border-radius:.8rem; padding:.6rem; margin:.6rem auto; display:inline-block; min-width:200px; }
.order-table { width:100%; border-collapse:collapse; margin-top:1rem; }
.order-table th, .order-table td { padding:.55rem .4rem; text-align:start; border-bottom:1px solid var(--cream-200); font-size:.9rem; }
.order-table thead th { color:var(--muted); font-weight:600; }
.order-table tfoot td { font-weight:700; color:var(--coffee-800); border-bottom:0; }
.order-link { text-decoration:none; }

/* ---------- Settlements ---------- */
.settle-amounts { display:flex; flex-direction:column; gap:.15rem; font-size:.85rem; text-align:start; }
.settle-amounts .payable { color:#2e7d32; }
.muted { color:var(--muted); font-size:.85rem; }

/* ---------- Order realtime / shop orders ---------- */
.order-success.ready-pulse { border-color:var(--accent); animation:pulse 1.4s ease-in-out infinite; }
.order-success.ready-pulse .check { background:#fff3cd; color:#b8860b; }
@keyframes pulse {
    0%, 100% { box-shadow:0 6px 22px rgba(60,36,23,.1); }
    50% { box-shadow:0 6px 30px rgba(217,138,61,.45); }
}
.shop-order .order-items-line { color:var(--coffee-600); font-size:.84rem; }
.deliver-code { width:140px; padding:.4rem .6rem; letter-spacing:.2rem; text-align:center; }

/* ---------- Brand logo ---------- */
.brand { gap:.6rem; }
.brand-mark { display:block; flex-shrink:0; filter:drop-shadow(0 2px 5px rgba(0,0,0,.3)); }
.brand-text { font-family:'Poppins','Vazirmatn',sans-serif; font-weight:700; font-size:1.5rem; letter-spacing:.3px; line-height:1; color:var(--cream-100); }
.brand-tld { color:var(--accent); font-weight:600; }
.foot-brand { display:flex; align-items:center; gap:.5rem; }
.foot-brand span { font-family:'Poppins','Vazirmatn',sans-serif; font-weight:700; font-size:1.25rem; color:#fff; }

/* ---------- App loading splash ---------- */
#app-loader {
    position:fixed; inset:0; z-index:9999;
    display:flex; align-items:center; justify-content:center;
    background:radial-gradient(circle at 50% 38%, #ffffff 0%, var(--cream-100) 55%, var(--cream-200) 100%);
    transition:opacity .55s ease, visibility .55s ease;
}
#app-loader.hidden { opacity:0; visibility:hidden; }
.app-loader-inner { display:flex; flex-direction:column; align-items:center; gap:1.1rem; }
.loader-mark { filter:drop-shadow(0 10px 22px rgba(91,58,38,.3)); animation:cupBob 2.4s ease-in-out infinite; }
@keyframes cupBob { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-6px); } }
.loader-word { font-family:'Poppins','Vazirmatn',sans-serif; font-weight:700; font-size:2rem; letter-spacing:.4px; color:var(--coffee-800); }
.loader-tld { color:var(--accent); }
.loader-bar { width:190px; height:5px; border-radius:4px; background:var(--cream-200); overflow:hidden; }
.loader-bar span { display:block; height:100%; width:42%; border-radius:4px; background:linear-gradient(90deg,var(--accent),var(--coffee-600)); animation:loadSlide 1.15s ease-in-out infinite; }
@keyframes loadSlide { 0% { transform:translateX(-130%); } 100% { transform:translateX(330%); } }
.loader-hint { color:var(--muted); font-size:.9rem; }
#app-loader .brand-steam path { opacity:0; animation:steamRise 2.2s ease-in-out infinite; }
#app-loader .brand-steam path:nth-child(2) { animation-delay:1.1s; }
@keyframes steamRise {
    0%   { opacity:0; transform:translateY(3px); }
    35%  { opacity:.85; }
    100% { opacity:0; transform:translateY(-5px); }
}