*
{
    box-sizing:border-box;
}

html
{
    -webkit-text-size-adjust:100%;
}

body
{
    margin:0;
    background:#f4f4f6;
    color:#18181b;

    font-family:
        Inter,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}

a
{
    color:inherit;
}

.client-shell
{
    width:min(100%,720px);
    margin:auto;
    padding:14px 14px 40px;
}

.client-top
{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:14px;
}

.client-top h1
{
    margin:0;
    font-size:23px;
}

.client-top p
{
    margin:3px 0 0;
    color:#71717a;
    font-size:11px;
}

.client-back
{
    min-height:44px;
    padding:0 13px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid #e4e4e7;
    border-radius:13px;

    background:#fff;

    text-decoration:none;
    font-weight:900;
    font-size:11px;
}

.client-card
{
    margin-bottom:12px;
    padding:15px;

    border:1px solid #e4e4e7;
    border-radius:20px;

    background:#fff;
}

.client-card h2
{
    margin:0 0 12px;
    font-size:17px;
}

.client-muted
{
    color:#71717a;
    font-size:10px;
    line-height:1.5;
}

.client-field
{
    margin-bottom:12px;
}

.client-field label
{
    display:block;
    margin-bottom:5px;

    font-size:10px;
    font-weight:900;
}

.client-field input
{
    width:100%;
    min-height:50px;

    border:1px solid #e4e4e7;
    border-radius:14px;

    padding:0 13px;

    background:#fff;

    color:#18181b;

    font-size:15px;
}

.client-button
{
    width:100%;
    min-height:50px;

    border:0;
    border-radius:14px;

    background:#18181b;
    color:#fff;

    font-weight:950;
    cursor:pointer;
}

.client-error
{
    margin-bottom:12px;
    padding:11px 12px;

    border-radius:13px;

    background:#fee2e2;
    color:#991b1b;

    font-size:11px;
    font-weight:800;
}

.client-profile
{
    display:flex;
    align-items:center;
    gap:12px;
}

.client-avatar
{
    width:48px;
    height:48px;

    flex:none;

    display:grid;
    place-items:center;

    border-radius:15px;

    background:#ff5a36;
    color:#fff;

    font-size:20px;
    font-weight:950;
}

.client-profile strong
{
    display:block;
    font-size:17px;
}

.client-profile span
{
    display:block;
    margin-top:3px;

    color:#71717a;
    font-size:11px;
}

.client-stats
{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:8px;
    margin-top:13px;
}

.client-stat
{
    padding:12px;

    border-radius:14px;

    background:#f4f4f5;
}

.client-stat span
{
    display:block;

    color:#71717a;

    font-size:9px;
    font-weight:800;
}

.client-stat strong
{
    display:block;
    margin-top:4px;

    font-size:19px;
}

.client-section-title
{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;

    margin-bottom:10px;
}

.client-section-title h2
{
    margin:0;
}

.client-order
{
    padding:13px 0;
}

.client-order + .client-order
{
    border-top:1px solid #ececef;
}

.client-order-head
{
    display:flex;
    justify-content:space-between;
    gap:10px;
}

.client-order-number
{
    font-size:14px;
    font-weight:950;
}

.client-order-date
{
    margin-top:3px;

    color:#71717a;

    font-size:9px;
}

.client-order-total
{
    font-size:14px;
    font-weight:950;
}

.client-status
{
    display:inline-flex;
    align-items:center;

    min-height:23px;

    margin-top:7px;

    padding:0 8px;

    border-radius:999px;

    background:#f4f4f5;

    font-size:8px;
    font-weight:950;
}

.client-status.pending
{
    background:#ffebe6;
    color:#c2410c;
}

.client-status.accepted
{
    background:#e0e7ff;
    color:#3730a3;
}

.client-status.preparing
{
    background:#fef3c7;
    color:#92400e;
}

.client-status.ready
{
    background:#dcfce7;
    color:#166534;
}

.client-status.out_for_delivery
{
    background:#dbeafe;
    color:#1d4ed8;
}

.client-status.delivered
{
    background:#dcfce7;
    color:#166534;
}

.client-status.cancelled
{
    background:#fee2e2;
    color:#991b1b;
}

.client-items
{
    margin-top:10px;

    display:grid;
    gap:6px;
}

.client-item
{
    font-size:11px;
    font-weight:850;
}

.client-option
{
    margin-top:2px;
    padding-left:12px;

    color:#71717a;

    font-size:9px;
    font-weight:650;
}

.client-order-meta
{
    margin-top:9px;
    padding:9px 10px;

    border-radius:11px;

    background:#f4f4f5;

    color:#52525b;

    font-size:9px;
    line-height:1.45;
}

.client-order-link
{
    display:flex;
    align-items:center;
    justify-content:center;

    min-height:40px;

    margin-top:9px;

    border:1px solid #e4e4e7;
    border-radius:12px;

    background:#fff;

    text-decoration:none;

    font-size:10px;
    font-weight:900;
}

.client-address
{
    padding:11px 0;

    font-size:11px;
    line-height:1.5;
}

.client-address + .client-address
{
    border-top:1px solid #ececef;
}

.client-address strong
{
    display:block;
    margin-bottom:3px;
}

.client-logout
{
    display:flex;
    align-items:center;
    justify-content:center;

    min-height:46px;

    border-radius:14px;

    background:#fee2e2;
    color:#991b1b;

    text-decoration:none;

    font-size:11px;
    font-weight:950;
}

.client-empty
{
    padding:25px 10px;
    text-align:center;

    color:#71717a;
    font-size:11px;
}