/* Motoryar account surfaces. Scoped to the existing workspace; no behavior or permissions change. */
:root[data-theme=light]{--account-ink:#1f2024;--account-muted:#494a50;--account-line:#e8e9f1;--account-surface:#fff;--account-soft:#f8f9fe;--account-accent:var(--ui-accent-text);--account-radius:20px;--account-shadow:0 8px 24px rgba(30,64,120,.05)}
:root[data-theme=light] body #app .workspace{min-width:0}
:root[data-theme=light] body #app .workspace>section{min-width:0}
:root[data-theme=light] body #app .workspace>.sidebar{border-radius:20px!important;border-color:var(--account-line)!important;background:var(--account-surface)!important}
:root[data-theme=light] body #app .workspace .sidebar .console-nav-group h2{font-size:12px;line-height:1.8;color:var(--account-muted);margin:16px 12px 6px}
:root[data-theme=light] body #app .workspace .sidebar .console-nav-group a{min-height:44px;border-radius:12px;line-height:1.7;overflow-wrap:anywhere}
:root[data-theme=light] body #app .workspace .sidebar a:is(.active,[aria-current=page]){background:#eaf2ff!important;color:#0056c8!important}
:root[data-theme=light] body #app .workspace .console-welcome{gap:16px;margin-block:4px 24px}
:root[data-theme=light] body #app .workspace .console-welcome h2{font-size:clamp(20px,2vw,27px);line-height:1.7;overflow-wrap:anywhere}
:root[data-theme=light] body #app .workspace .console-metrics{gap:14px}
:root[data-theme=light] body #app .workspace .console-metric{border:1px solid var(--account-line);border-radius:var(--account-radius);background:var(--account-surface);color:var(--account-ink);box-shadow:var(--account-shadow);min-width:0;overflow-wrap:anywhere;transition:border-color .15s,box-shadow .15s}
:root[data-theme=light] body #app .workspace .console-metric>span:first-child{color:var(--account-muted);line-height:1.8}
:root[data-theme=light] body #app .workspace .console-metric strong{color:var(--account-ink);line-height:1.5;overflow-wrap:anywhere}
:root[data-theme=light] body #app .workspace .console-metric>span[aria-hidden=true]:last-child{display:none}
:root[data-theme=light] body #app .workspace .console-metric:hover{border-color:#6fbaff;box-shadow:0 10px 26px rgba(0,86,200,.09)}
:root[data-theme=light] body #app .workspace .console-metric:focus-visible,:root[data-theme=light] body #app .workspace :is(a,button,input,select,textarea):focus-visible{outline:3px solid #0056c8;outline-offset:3px}
:root[data-theme=light] body #app .workspace .console-metrics>.customer-wallet-shortcut{border:2px solid #006ffd!important;background:#eaf2ff!important}
:root[data-theme=light] body #app .workspace :is(.console-recent-order,.console-activity,.console-coverage-card){border-color:var(--account-line);border-radius:16px;background:var(--account-surface);min-width:0}
:root[data-theme=light] body #app .workspace :is(.console-facts>div){background:var(--account-soft);border-radius:12px}
:root[data-theme=light] body #app .workspace :is(input:not([type=checkbox]):not([type=radio]),textarea,select):not(:disabled):not([readonly]){color:#1f2024;background-color:#fff;max-width:100%;min-width:0}
:root[data-theme=light] body #app .workspace :is(input,textarea)::placeholder{color:#494a50;opacity:1}
@media(max-width:1023px){:root[data-theme=light] body #app .workspace .console-metrics{gap:10px}:root[data-theme=light] body #app .workspace .console-metric{padding:16px;border-radius:18px}}
@media(max-width:767px){:root[data-theme=light] body #app .workspace .console-welcome{align-items:stretch}:root[data-theme=light] body #app .workspace .console-welcome>.button{width:100%;justify-content:center;align-self:stretch}:root[data-theme=light] body #app .workspace .console-metric{min-height:132px;padding:14px}:root[data-theme=light] body #app .workspace .console-metric>span:first-child{font-size:13px}:root[data-theme=light] body #app .workspace .console-metric strong{font-size:clamp(21px,6vw,27px)}:root[data-theme=light] body #app .workspace :is(input:not([type=checkbox]):not([type=radio]),textarea,select):not(:disabled):not([readonly]){font-size:16px}}
@media(prefers-reduced-motion:reduce){:root[data-theme=light] body #app .workspace .console-metric{transition:none}}

/* Shared account surfaces used by customer, mechanic, provider, shop and admin workspaces. */
:root[data-theme=light] body.panel-view #app .workspace>section:not(:has(.notification-toolbar)) :is(.card,.order,.document-card,.skill-card,.bike-card,.history-entry,.finance-payment-item,.console-activity,.console-coverage-card){min-width:0;border-color:var(--account-line)!important;border-radius:18px;background:var(--account-surface)!important;color:var(--account-ink)!important;box-shadow:var(--account-shadow)}
:root[data-theme=light] body.panel-view #app .workspace>section:not(:has(.notification-toolbar)) :is(.card,.order,.document-card,.skill-card,.bike-card,.history-entry) :is(h2,h3,h4){color:var(--account-ink);line-height:1.7;overflow-wrap:anywhere}
:root[data-theme=light] body.panel-view #app .workspace>section :is(.console-facts,.form-grid,.finance-stats,.record-grid){min-width:0}
:root[data-theme=light] body.panel-view #app .workspace>section :is(.console-facts dd,.finance-stats strong,.order-top,.record-summary){overflow-wrap:anywhere;min-width:0}
:root[data-theme=light] body.panel-view #app .workspace>section :is(.field,label.field){min-width:0;line-height:1.8}
:root[data-theme=light] body.panel-view #app .workspace>section :is(input:not([type=checkbox]):not([type=radio]),textarea,select):not(:disabled):not([readonly]){background:#fff!important;color:#1f2024!important;border-color:var(--ui-control-border);min-width:0;max-width:100%}
:root[data-theme=light] body.panel-view #app .workspace>section :is(.button,.secondary){min-height:44px}
:root[data-theme=light] body.panel-view #app .workspace>section :is(.console-activity,.console-coverage-card) .order-top{gap:12px;align-items:start}
:root[data-theme=light] body.panel-view #app .workspace>section :is(.console-activity,.console-coverage-card) :is(h3,p){overflow-wrap:anywhere}
:root[data-theme=light] body.panel-view #app .workspace>section :is(.console-recent-order,.console-activity,.console-coverage-card):focus-within{outline:2px solid var(--account-accent);outline-offset:2px}
@media(max-width:767px){:root[data-theme=light] body.panel-view #app .workspace>section:not(:has(.notification-toolbar)) :is(.card,.order,.document-card,.skill-card,.bike-card,.history-entry,.console-activity,.console-coverage-card){border-radius:16px}:root[data-theme=light] body.panel-view #app .workspace>section :is(.console-recent-order,.console-activity,.console-coverage-card){min-width:0}:root[data-theme=light] body.panel-view #app .workspace>section :is(input:not([type=checkbox]):not([type=radio]),textarea,select):not(:disabled):not([readonly]){font-size:16px}}

/* Visual alignment with the reviewed account mock: existing real menu and data remain authoritative. */
@font-face{font-family:MotoryarPanelVazirmatn;src:url('/assets/fonts/Vazirmatn.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
:root[data-theme=light] body.panel-view{--font-product:MotoryarPanelVazirmatn,Tahoma,sans-serif}
:root[data-theme=light] body.panel-view #app .workspace .console-metric{display:flex;flex-direction:column;align-items:stretch;gap:10px;padding:16px 18px;min-height:154px}
:root[data-theme=light] body.panel-view #app .workspace .console-metric strong{margin-block-start:auto;font-size:clamp(22px,2.5vw,28px);font-weight:700}
:root[data-theme=light] body.panel-view #app .workspace .console-metric>span:first-child{font-size:13px;font-weight:600}
:root[data-theme=light] body.panel-view #app .workspace .console-metric .account-metric-icon{margin-block-end:0}
:root[data-theme=light] body.panel-view #app .workspace .console-welcome>.button{border-radius:15px;min-height:48px}
:root[data-theme=light] body.panel-view #app .workspace>section:not(:has(.notification-toolbar)) .panel-heading h2{font-size:18px;line-height:1.7}
:root[data-theme=light] body.panel-view #app .workspace .console-recent-order{min-width:0;overflow-wrap:anywhere}
/* Existing account-navigation dialog becomes a right-side drawer, without changing the dialog controller. */
@media(max-width:1023px){
 :root[data-theme=light] body.panel-view #app dialog.record-dialog:has(.sidebar)[open]{display:flex!important;flex-direction:column;position:fixed!important;inset:0 0 0 auto!important;margin:0!important;width:min(380px,calc(100vw - 32px))!important;max-width:none!important;height:100vh!important;height:100dvh!important;max-height:none!important;max-block-size:none!important;border:0!important;border-radius:22px 0 0 22px!important;box-shadow:-12px 0 45px #1f202424!important}
 :root[data-theme=light] body.panel-view #app dialog.record-dialog:has(.sidebar)>.record-dialog-heading{padding: max(16px,env(safe-area-inset-top)) 18px 16px!important}
 :root[data-theme=light] body.panel-view #app dialog.record-dialog:has(.sidebar)>.record-dialog-body{min-height:0!important;flex:1 1 auto!important;overflow-y:auto!important;overscroll-behavior:contain;padding:4px 14px calc(20px + env(safe-area-inset-bottom))!important}
 :root[data-theme=light] body.panel-view #app dialog.record-dialog:has(.sidebar) .console-nav-group a{min-height:48px!important;line-height:1.8!important}
 :root[data-theme=light] body.panel-view #app .workspace .console-metric{min-height:138px;padding:14px}
}
:root[data-theme=light] body.panel-view #app .workspace .console-metric .account-metric-icon{order:0}
:root[data-theme=light] body.panel-view #app .workspace .console-metric>span:first-child:not(.account-metric-icon){order:1}
:root[data-theme=light] body.panel-view #app .workspace .console-metric>strong{order:2}

/* Keep state-bearing record boundaries distinct from decorative card borders. */
:root[data-theme=light] body.panel-view #app .workspace [data-record-tone="positive"]{border-inline-start-color:var(--ui-success,#298267)!important}
:root[data-theme=light] body.panel-view #app .workspace [data-record-tone="negative"]{border-inline-start-color:var(--ui-danger,#ed3241)!important}
:root[data-theme=light] body.panel-view #app .workspace [data-record-tone="warning"]{border-inline-start-color:#e86339!important}
:root[data-theme=light] body.panel-view #app .sidebar>.panel-identity{display:flex;align-items:center;gap:11px;padding:8px 10px 18px;margin-bottom:8px;border-bottom:1px solid #e8e9f1;min-width:0}
:root[data-theme=light] body.panel-view #app .panel-identity-avatar{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:14px;background:#eaf2ff;color:#0056c8;font-weight:700}
:root[data-theme=light] body.panel-view #app .panel-identity-details{display:grid;gap:2px;min-width:0}
:root[data-theme=light] body.panel-view #app .panel-identity-details strong{font-size:13px;line-height:1.7;overflow-wrap:anywhere}
:root[data-theme=light] body.panel-view #app .panel-identity-details small{font-size:12px;color:#494a50;line-height:1.7}