/* Client dashboard and compact cards. Scoped: staff and desktop unchanged. */
.client-mobile{max-width:760px;margin:0 auto;min-height:100dvh;padding-bottom:calc(84px + env(safe-area-inset-bottom,0px));background:var(--bg)}
.client-mobile button{font:inherit;cursor:pointer}
.client-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px;border-bottom:1px solid var(--border)}
.client-brand{display:flex;align-items:center;gap:10px;min-width:0;border:0;background:none;color:var(--text);text-align:left;padding:0;min-height:44px}
.client-mobile .ghost{min-height:44px}
.client-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:16px 16px 0}
.client-toolbar h1{font-size:20px;line-height:1.25;margin:0;min-width:0;overflow-wrap:anywhere}
.client-themes{display:flex;gap:4px;flex-shrink:0}
.client-themes button{height:44px;width:40px;border:1px solid var(--border);border-radius:9px;color:var(--muted);background:var(--panel);font-size:21px}
.client-themes button.active{color:var(--accent-strong);border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.client-mobile .main{padding:14px 12px 24px;min-width:0}
.client-welcome{font-size:21px;font-weight:650;margin:4px 4px 3px;overflow-wrap:anywhere}
.client-intro{margin:0 4px 20px;color:var(--muted);font-size:13px}
.client-menu{display:grid;gap:10px}
.client-menu-item{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:12px;min-height:64px;padding:12px 14px;text-align:left;border:1px solid var(--border);border-radius:13px;background:var(--panel);color:var(--text);font-weight:600!important;font-size:16px!important}
.client-menu-item:hover{background:var(--panel-2)}
.client-menu-icon{height:36px;width:36px;display:grid;place-items:center;border-radius:10px;background:var(--panel-2);color:var(--accent-strong)}
.client-menu-icon svg{width:23px;height:23px}
.client-create{background:var(--accent);color:var(--accent-contrast);border-color:var(--accent)}
.client-create .client-menu-icon{background:transparent;color:inherit}
.client-create:hover{background:var(--accent-strong)}
.client-chevron{font-size:26px;font-weight:400}
.client-counter{min-width:32px;max-width:90px;overflow-wrap:anywhere;text-align:center;background:var(--panel-2);color:var(--muted);border-radius:8px;padding:5px 7px;font-size:14px;font-variant-numeric:tabular-nums}
.client-menu-item[data-client-queue="unread"] .client-counter.has-count{background:var(--accent);color:var(--accent-contrast)}
.client-count-note{font-size:12px;color:var(--muted);margin:18px 4px 10px;line-height:1.6}
.client-count-status{font-size:12px;color:var(--muted);min-height:20px;margin:0 4px 8px}
.client-refresh{display:block;margin:0 auto;font-size:12px!important}
.client-bottom{position:fixed;z-index:20;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:760px;display:grid;grid-template-columns:1fr 1fr;padding:7px 12px calc(7px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--border);background:var(--bg-raised)}
.client-bottom button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border:0;background:none;color:var(--accent-strong);font-size:13px}
.client-bottom svg{width:21px;height:21px}
.client-mobile button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.client-mobile .queue-result{background:none;border:0;overflow:visible}
.client-mobile .queue-tools{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:stretch}
.client-mobile .queue-tools .search-wrap{width:auto;max-width:none;min-width:0}
.client-mobile .queue-tools input{font-size:16px;min-height:44px}
.client-mobile .queue-tools select{font-size:14px;min-height:44px;max-width:140px;min-width:0;padding:8px}
.client-cards{display:grid;gap:8px}
.client-ticket{width:100%;min-width:0;display:grid;gap:5px;padding:10px 12px!important;text-align:left;background:var(--panel);border:1px solid var(--border);border-radius:11px;color:var(--text)}
.client-ticket:hover{background:var(--panel-2)}
.client-ticket-top,.client-ticket-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
.client-ticket-number{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);flex-shrink:0}
.client-ticket-subject{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;font-weight:650;font-size:15px;line-height:1.35}
.client-ticket-restaurant{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.client-ticket-date{color:var(--muted);font-size:11px;text-align:right}
.client-ticket .status-chip,.client-ticket .priority-chip{font-size:11px;padding:2px 6px;white-space:normal;overflow-wrap:anywhere;line-height:1.3}
.client-ticket .status-chip{max-width:70%;text-align:right}
.client-ticket .unread-dot{display:inline-block;margin:0}
.client-mobile .queue-pager{gap:6px;font-size:11px}
.client-mobile .queue-pager button{min-height:44px;padding:6px 8px}
.client-mobile .ticket-detail{max-width:100%}
.client-mobile .ticket-detail .detail-header,.client-mobile .ticket-detail .detail-facts,.client-mobile .ticket-detail .description-section,.client-mobile .ticket-detail .attachments-section,.client-mobile .ticket-detail .conversation,.client-mobile .sla-panel{margin-right:0}
.client-mobile .detail-header{display:block;padding:17px}
.client-mobile .detail-state{justify-content:flex-start;margin-top:12px}
.client-mobile .detail-facts{grid-template-columns:repeat(2,minmax(0,1fr));padding:14px 17px}
.client-mobile .form-grid{grid-template-columns:minmax(0,1fr)}
.client-mobile .form-grid .field.full{grid-column:auto}
.client-mobile .form-panel{padding:17px;max-width:100%}
.client-mobile .field input,.client-mobile .field select,.client-mobile .field textarea{font-size:16px;min-width:0}
@media(max-width:360px){.client-toolbar{align-items:flex-start;flex-direction:column}.client-menu-item{gap:8px;padding:10px 12px;font-size:15px!important}.client-mobile .queue-tools select{max-width:120px}.client-themes{align-self:flex-end}.client-welcome{font-size:19px}}
