@media (max-width: 640px){
    #customer-account-sidebar{
        top:8px !important;
        right:-100vw !important;
        width:92vw !important;
        max-width:92vw !important;
        height:calc(100vh - 16px) !important;
        border-radius:22px 0 0 22px !important;
    }

    #customer-account-sidebar.sidebar-open{
        right:0 !important;
    }
}

@media (min-width: 641px){
    #customer-account-sidebar.sidebar-open{
        right:0 !important;
    }
}

.customer-account-sidebar{
    position:fixed;
    top:18px;
    right:-430px;
    width:390px;
    max-width:calc(100vw - 24px);
    height:calc(100vh - 36px);
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
    box-shadow:-12px 0 40px rgba(15,23,42,0.18);
    z-index:10001;
    transition:right .35s ease, opacity .25s ease;
    overflow:hidden;
    border-radius:26px 0 0 26px;
    border:1px solid rgba(99,102,241,.10);
    display:flex;
    flex-direction:column;
    visibility:visible;
    opacity:1;
    pointer-events:auto;
}

.customer-account-sidebar *{
    pointer-events:auto;
}

.customer-account-overlay{
    position:fixed;
    inset:0;
    background:rgba(15,23,42,.12);
    backdrop-filter:none;
    display:none;
    visibility:hidden;
    opacity:0;
    z-index:10000;
    pointer-events:auto;
}

.customer-sidebar-head{
    padding:22px 22px 18px 22px;
    background:linear-gradient(135deg,#315efb 0%,#6d3df5 55%,#7c3aed 100%);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    flex:0 0 auto !important;
}

.customer-sidebar-user{
    display:flex;
    align-items:center;
    gap:14px;
}

.customer-sidebar-avatar{
    width:56px;
    height:56px;
    border-radius:18px;
    background:rgba(255,255,255,.16);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    backdrop-filter:blur(6px);
}

.customer-sidebar-title{
    font-size:22px;
    font-weight:800;
    line-height:1.15;
}

.customer-sidebar-subtitle{
    font-size:14px;
    opacity:.92;
    margin-top:4px;
}

.customer-sidebar-close{
    border:none;
    background:rgba(255,255,255,.14);
    color:#fff;
    width:38px;
    height:38px;
    border-radius:999px;
    font-size:20px;
    cursor:pointer;
}

.customer-sidebar-menu{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    padding:16px 14px 12px 14px;
    border-bottom:1px solid #eef2ff;
    background:#fff;
    flex:0 0 auto !important;
}

.customer-sidebar-menu .acc-link{
    border:none;
    background:#f8fafc;
    color:#334155;
    padding:12px 14px;
    border-radius:16px;
    font-weight:700;
    font-size:14px;
    cursor:pointer;
    text-align:left;
    display:flex;
    align-items:center;
    gap:10px;
}

.customer-sidebar-menu .acc-link.active{
    background:#eef2ff;
    color:#4338ca;
}

.customer-sidebar-content{
    flex:1 1 auto !important;
    min-height:0 !important;
    height:calc(100% - 134px);
    overflow-y:auto !important;
    overflow-x:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    padding:16px;
    padding-right:10px !important;
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
}

.customer-sidebar-content::-webkit-scrollbar{
    width:8px;
}

.customer-sidebar-content::-webkit-scrollbar-thumb{
    background:#c7d2fe;
    border-radius:999px;
}

.customer-sidebar-content{
    scrollbar-width:thin;
    scrollbar-color:#c7d2fe transparent;
}

.customer-panel-card{
    background:#fff;
    border:1px solid #eef2ff;
    border-radius:20px;
    padding:18px;
    box-shadow:0 10px 24px rgba(15,23,42,.05);
}

.customer-panel-card h3{
    margin:0 0 10px 0;
    font-size:20px;
    color:#0f172a;
}

.customer-panel-card p{
    margin:0;
    color:#64748b;
    font-size:14px;
    line-height:1.6;
}

.customer-panel-kicker{
    font-size:12px;
    font-weight:700;
    color:#6366f1;
    text-transform:uppercase;
    letter-spacing:.08em;
    margin-bottom:8px;
}

.customer-profile-full{
    display:flex;
    flex-direction:column;
    gap:16px;
}

.customer-profile-avatar-wrap{
    display:flex;
    justify-content:center;
    align-items:center;
    padding-top:2px;
}

.customer-profile-avatar-lg{
    width:92px;
    height:92px;
    border-radius:50%;
    background:linear-gradient(180deg,#f8fafc 0%,#eef2ff 100%);
    border:1px solid #dbeafe;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    color:#9ca3af;
    font-size:42px;
    box-shadow:0 10px 25px rgba(15,23,42,.08);
}

.customer-profile-avatar-lg img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.customer-profile-card{
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
    border:1px solid #dbeafe;
    border-radius:24px;
    padding:18px 20px;
    box-shadow:0 10px 24px rgba(15,23,42,.05);
}

.customer-profile-row{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    padding:12px 0;
    border-bottom:1px solid #edf2ff;
}

.customer-profile-row:last-child{
    border-bottom:none;
}

.customer-profile-label{
    font-size:12px;
    color:#94a3b8;
    text-transform:uppercase;
    font-weight:800;
    letter-spacing:.04em;
}

.customer-profile-value{
    font-size:14px;
    color:#0f172a;
    font-weight:800;
    text-align:right;
    max-width:64%;
    word-break:break-word;
    line-height:1.6;
}

.customer-profile-rib{
    font-size:13px;
}

.customer-profile-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:8px 14px;
    border-radius:999px;
    font-size:12px;
    font-weight:800;
    white-space:nowrap;
}

.customer-profile-pill-active{
    background:rgba(16,185,129,.18);
    border:1px solid rgba(16,185,129,.28);
    color:#10b981;
}

.customer-profile-pill-warn{
    background:rgba(245,158,11,.16);
    border:1px solid rgba(245,158,11,.28);
    color:#d97706;
}

.customer-profile-rating-title{
    font-size:12px;
    color:#94a3b8;
    text-transform:uppercase;
    font-weight:800;
    letter-spacing:.04em;
    margin-bottom:12px;
}

.customer-profile-rating-stars{
    font-size:24px;
    letter-spacing:4px;
    color:#6366f1;
    margin-bottom:10px;
}

.customer-profile-rating-note{
    font-size:14px;
    color:#64748b;
    line-height:1.6;
}

.customer-wallet-full{
    display:flex !important;
    flex-direction:column !important;
    gap:16px !important;
}

.customer-wallet-hero{
    display:block !important;
    background:linear-gradient(135deg,#315efb 0%,#6d3df5 55%,#7c3aed 100%) !important;
    color:#fff !important;
    border-radius:24px !important;
    padding:20px !important;
    box-shadow:0 12px 28px rgba(79,70,229,.22) !important;
}

.customer-wallet-kicker{
    display:block !important;
    font-size:12px !important;
    text-transform:uppercase !important;
    letter-spacing:.08em !important;
    font-weight:800 !important;
    opacity:.92 !important;
    margin-bottom:8px !important;
    color:#fff !important;
}

.customer-wallet-balance-label{
    display:block !important;
    font-size:14px !important;
    opacity:.9 !important;
    margin-bottom:6px !important;
    color:#fff !important;
}

.customer-wallet-balance{
    display:block !important;
    font-size:30px !important;
    line-height:1.1 !important;
    font-weight:900 !important;
    margin-bottom:8px !important;
    color:#fff !important;
}

.customer-wallet-subline{
    display:block !important;
    font-size:13px !important;
    opacity:.9 !important;
    color:#fff !important;
}

.customer-wallet-card,
.customer-wallet-actions-card,
.customer-wallet-history-card{
    display:block !important;
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%) !important;
    border:1px solid #dbeafe !important;
    border-radius:24px !important;
    padding:18px 20px !important;
    box-shadow:0 10px 24px rgba(15,23,42,.05) !important;
}

.customer-wallet-row{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:space-between !important;
    gap:18px !important;
    padding:12px 0 !important;
    border-bottom:1px solid #edf2ff !important;
}

.customer-wallet-row:last-child{
    border-bottom:none !important;
}

.customer-wallet-label{
    display:block !important;
    font-size:12px !important;
    color:#94a3b8 !important;
    text-transform:uppercase !important;
    font-weight:800 !important;
    letter-spacing:.04em !important;
}

.customer-wallet-value{
    display:block !important;
    font-size:14px !important;
    color:#0f172a !important;
    font-weight:800 !important;
    text-align:right !important;
    max-width:64% !important;
    word-break:break-word !important;
    line-height:1.6 !important;
}

.customer-wallet-rib{
    font-size:13px !important;
}

.customer-wallet-pill{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:8px 14px !important;
    border-radius:999px !important;
    font-size:12px !important;
    font-weight:800 !important;
    white-space:nowrap !important;
}

.customer-wallet-pill-active{
    background:rgba(16,185,129,.18) !important;
    border:1px solid rgba(16,185,129,.28) !important;
    color:#10b981 !important;
}

.customer-wallet-pill-warn{
    background:rgba(245,158,11,.16) !important;
    border:1px solid rgba(245,158,11,.28) !important;
    color:#d97706 !important;
}

.customer-wallet-actions-title,
.customer-wallet-history-title{
    display:block !important;
    font-size:12px !important;
    color:#94a3b8 !important;
    text-transform:uppercase !important;
    font-weight:800 !important;
    letter-spacing:.04em !important;
    margin-bottom:14px !important;
}

.customer-wallet-actions-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
}

.customer-wallet-action-btn{
    border:none !important;
    text-decoration:none !important;
    background:#eef2ff !important;
    color:#4338ca !important;
    padding:14px 16px !important;
    border-radius:16px !important;
    font-weight:800 !important;
    font-size:14px !important;
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    justify-content:flex-start !important;
    cursor:pointer !important;
    width:100% !important;
}

.customer-wallet-action-btn:hover{
    background:#e0e7ff !important;
}

.customer-wallet-history-card{
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
    border:1px solid #dbeafe;
    border-radius:24px;
    padding:18px 20px;
    box-shadow:0 10px 24px rgba(15,23,42,.05);
}

.customer-wallet-history-list{
    display:flex !important;
    flex-direction:column !important;
    gap:12px !important;
}

.customer-wallet-history-item{
    display:flex !important;
    justify-content:space-between !important;
    align-items:flex-start !important;
    gap:14px !important;
    padding:12px 0 !important;
    border-bottom:1px solid #edf2ff !important;
}

.customer-wallet-history-item:last-child{
    border-bottom:none !important;
    padding-bottom:0 !important;
}

.customer-wallet-history-type{
    font-size:14px !important;
    font-weight:800 !important;
    color:#0f172a !important;
    margin-bottom:4px !important;
}

.customer-wallet-history-date{
    font-size:12px !important;
    color:#94a3b8 !important;
}

.customer-wallet-history-amount{
    font-size:14px !important;
    font-weight:900 !important;
    white-space:nowrap !important;
}

.customer-wallet-history-amount.is-credit{
    color:#16a34a !important;
}

.customer-wallet-history-amount.is-debit{
    color:#dc2626 !important;
}

.customer-wallet-history-empty{
    text-align:center !important;
    padding:14px 8px 4px !important;
    color:#94a3b8 !important;
    font-size:14px !important;
}

.customer-orders-full{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.customer-orders-hero{
    background:linear-gradient(135deg,#0f172a 0%,#1e293b 100%);
    color:#fff;
    border-radius:24px;
    padding:18px 20px;
    box-shadow:0 10px 28px rgba(15,23,42,.18);
}

.customer-orders-kicker{
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.08em;
    font-weight:800;
    opacity:.82;
    margin-bottom:6px;
}

.customer-orders-hero-title{
    font-size:24px;
    font-weight:900;
    line-height:1.1;
    margin-bottom:6px;
}

.customer-orders-hero-sub{
    font-size:14px;
    opacity:.88;
    line-height:1.5;
}

.customer-order-item{
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
    border:1px solid #dbeafe;
    border-radius:20px;
    padding:16px;
    box-shadow:0 8px 20px rgba(15,23,42,.05);
    display:flex;
    flex-direction:column;
    gap:12px;
}

.customer-order-top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
}

.customer-order-id{
    font-size:14px;
    font-weight:900;
    color:#0f172a;
    word-break:break-word;
}

.customer-order-date{
    margin-top:4px;
    font-size:12px;
    color:#94a3b8;
}

.customer-order-status{
    font-size:12px;
    padding:7px 11px;
    border-radius:999px;
    font-weight:800;
    white-space:nowrap;
    background:#eef2ff;
    color:#4338ca;
    border:1px solid #c7d2fe;
}

.status-assigned,
.status-accepted,
.status-matching{
    background:#eef2ff;
    color:#4338ca;
    border:1px solid #c7d2fe;
}

.status-preparing,
.status-ready_for_pickup,
.status-waiting_customer_input{
    background:#fef3c7;
    color:#b45309;
    border:1px solid #fcd34d;
}

.status-out_for_delivery,
.status-delivered,
.status-completed{
    background:#dcfce7;
    color:#15803d;
    border:1px solid #86efac;
}

.status-cancelled,
.status-rejected{
    background:#fee2e2;
    color:#b91c1c;
    border:1px solid #fca5a5;
}

.customer-order-meta-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.customer-order-meta-box{
    background:#fff;
    border:1px solid #edf2ff;
    border-radius:16px;
    padding:12px;
}

.customer-order-meta-box .label{
    font-size:11px;
    color:#94a3b8;
    text-transform:uppercase;
    font-weight:800;
    letter-spacing:.04em;
    margin-bottom:6px;
}

.customer-order-meta-box .value{
    font-size:14px;
    color:#0f172a;
    font-weight:800;
    line-height:1.5;
    word-break:break-word;
}

.customer-order-actions{
    margin-top:2px;
}

.order-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:#6366f1;
    color:#fff;
    font-size:13px;
    font-weight:800;
    padding:10px 14px;
    border-radius:12px;
    text-decoration:none;
    border:none;
}

.order-btn:hover{
    background:#4f46e5;
}

.customer-orders-empty{
    text-align:center;
    padding:28px 18px;
    color:#94a3b8;
    background:#fff;
    border:1px solid #dbeafe;
    border-radius:20px;
}

.customer-orders-empty-icon{
    font-size:28px;
    color:#c7d2fe;
    margin-bottom:10px;
}

.customer-orders-empty-title{
    font-size:16px;
    font-weight:900;
    color:#0f172a;
    margin-bottom:6px;
}

.customer-orders-empty-sub{
    font-size:14px;
    color:#64748b;
    line-height:1.5;
}

@media (max-width: 640px){
    .customer-mini-grid{
        grid-template-columns:1fr;
    }

    .customer-profile-row,
    .customer-wallet-row,
    .customer-order-top,
    .customer-wallet-history-item{
        flex-direction:column !important;
        align-items:flex-start !important;
        gap:8px !important;
    }

    .customer-profile-value,
    .customer-wallet-value{
        max-width:100% !important;
        text-align:left !important;
    }

    .customer-profile-avatar-lg{
        width:82px;
        height:82px;
        font-size:36px;
    }

    .customer-wallet-balance{
        font-size:26px !important;
    }

    .customer-order-meta-grid{
        grid-template-columns:1fr;
    }

    .customer-orders-hero-title{
        font-size:21px;
    }
}