/* Add job only: Traden tokens, compact bespoke form and save receipt. */
.job-create { --job-accent: #d4ff00; line-height: 1.35; }
.job-create .crm-create-modal__sheet { width: min(540px, 100%); }
.job-create .crm-create-modal__head { display: grid; grid-template-columns: 1fr auto 1fr; min-height: 58px; padding: .35rem 1.15rem; border-bottom: 0; }
.job-create .crm-create-modal__head h2 { font-size: 1.3rem; letter-spacing: -.04em; }
.job-create__cancel { justify-self: start; border: 0; background: none; color: var(--ds-text-soft); min-height: 44px; cursor: pointer; font: inherit; font-size: .9rem; }
.job-create .crm-create-form { padding: .25rem 1.15rem 0; }
.job-create__intro { margin: 0 0 .75rem; color: var(--ds-muted); font-size: .82rem; text-align: center; }
.job-create .crm-create-form__grid { display: flex; flex-direction: column; gap: .5rem; }
.job-create .crm-create-field { align-self: stretch; width: 100%; gap: .3rem; font-size: .9rem; }
.job-create .crm-create-field .auth-input { min-height: 46px; border-radius: 10px; padding: .65rem .85rem; font-size: 1rem; }
.job-create .crm-create-field textarea.auth-input { min-height: 60px; }
.job-create small { font-weight: 400; color: var(--ds-muted); font-size: .8rem; }
.job-create__icon { display: block; width: 24px; height: 24px; flex: 0 0 24px; }
.job-create:not(.is-enhanced) .job-create__customer-picker .job-create__customer-card { display: none; }
.job-create__customer-picker { position: relative; display: block; }
.job-create__customer-card { display: flex; align-items: center; gap: .75rem; min-height: 62px; padding: .5rem .75rem; border: 1px solid var(--ds-border-high); border-radius: 10px; background: var(--ds-surface-1); }
.job-create__customer-card > span:nth-child(2) { flex: 1; min-width: 0; }
.job-create__customer-card strong { display: block; font-size: .98rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.job-create__customer-card small { display: block; margin-top: .15rem; }
.job-create__avatar { display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 40px; border-radius: 50%; background: var(--ds-surface-3); font-size: .95rem; font-weight: 650; }
.job-create.is-enhanced .job-create__customer-picker select.auth-input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.job-create__customer-picker:focus-within { outline: 2px solid var(--ds-lime); outline-offset: 3px; border-radius: 10px; }
.job-create__customer-picker:has([aria-invalid=true]) .job-create__customer-card { border-color: var(--ds-danger); }
.job-create__location-label { font-size: .9rem; font-weight: 600; margin-bottom: -.45rem; }
.job-create__optional { margin: .3rem 0 -.45rem; font-size: 1.08rem; letter-spacing: -.02em; }
.job-create__optional small { margin-left: .25rem; }
.job-create__section { border: 0; border-bottom: 1px solid var(--ds-border); border-radius: 0; }
.job-create__section > summary { display: flex; align-items: center; gap: .85rem; list-style: none; cursor: pointer; padding: .5rem .15rem; min-height: 56px; }
.job-create__section > summary::-webkit-details-marker, .job-time > summary::-webkit-details-marker { display: none; }
.job-create__row-copy { flex: 1; min-width: 0; }
.job-create__row-copy strong { display: block; font-size: .94rem; font-weight: 600; }
.job-create__row-copy small { display: block; margin-top: .15rem; line-height: 1.4; }
.job-create__expand { transition: transform .18s ease; }
.job-create__section[open] > summary .job-create__expand { transform: rotate(45deg); }
.job-create__section-body { padding: .3rem 0 .85rem; display: grid; gap: .75rem; }
.job-create__location { border: 1px solid var(--ds-border-high); border-radius: 10px; }
.job-create__location > summary { padding: .75rem; gap: .65rem; }
.job-create__location-copy { flex: 1; min-width: 0; }
.job-create__location-copy strong { display: block; font-size: .86rem; font-weight: 550; line-height: 1.4; overflow-wrap: anywhere; }
.job-create__location-copy small { display: inline-block; margin-top: .25rem; font-size: .7rem; padding: .1rem .45rem; border-radius: 20px; background: var(--ds-surface-3); }
.job-create__change { color: var(--ds-lime); font-size: .8rem; font-weight: 550; }
.job-create__location .job-create__section-body { padding: .25rem .75rem .75rem; }
.job-create .job-create__status { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; padding: .25rem 0 .5rem; }
html .traden-app .job-create .job-create__status select.auth-input { grid-column: 2; justify-self: center; width: auto; max-width: 100%; min-height: 44px; border: 0; border-radius: 30px; background-color: var(--ds-surface-3); padding: .5rem 2rem .5rem .85rem; font-size: .85rem; }
.job-create .crm-create-form__actions { position: sticky; bottom: 0; margin: .65rem -1.15rem 0; padding: .75rem 1.15rem calc(.75rem + env(safe-area-inset-bottom)); background: var(--ds-surface-1); border-top: 1px solid var(--ds-border); z-index: 2; flex-shrink: 0; }
.job-create .crm-create-form__actions .btn { width: 100%; min-height: 50px; border-radius: 10px; font-size: 1rem; }
.job-create .crm-create-form__hint { margin: 0; font-size: .78rem; line-height: 1.5; }
.job-time > summary { padding: .8rem; border: 1px solid var(--ds-border); border-radius: 10px; cursor: pointer; }
.job-time__wheels { display: flex; justify-content: center; gap: 1.5rem; padding: .75rem 0; }
.job-time__wheel { width: 90px; height: 220px; overflow-y: auto; scroll-snap-type: y mandatory; padding-block: 88px; box-sizing: border-box; scrollbar-width: none; overscroll-behavior: contain; background: linear-gradient(transparent 88px, #d3dbc255 88px, #d3dbc255 132px, transparent 132px); }
.job-time__wheel::-webkit-scrollbar { display: none; }
.job-time__wheel [role=option] { height: 44px; display: grid; place-items: center; scroll-snap-align: center; font-size: 1.5rem; font-variant-numeric: tabular-nums; font-weight: 400; cursor: pointer; }
.job-time__wheel [aria-selected=true] { font-weight: 700; }
.job-time .btn { margin-top: .5rem; }

.job-created-confirmation { position: fixed; z-index: 10000; top: max(1rem, env(safe-area-inset-top)); left: 50%; transform: translateX(-50%); box-sizing: border-box; width: min(370px, calc(100% - 2rem)); padding: 1rem 2.5rem 1rem 1rem; border: 1px solid var(--ds-border); background: var(--ds-surface-1); color: var(--ds-text); border-radius: 18px; box-shadow: 0 12px 48px #0002; display: grid; grid-template-columns: 52px minmax(0, 1fr); align-items: center; column-gap: .8rem; animation: job-confirm-in .3s ease-out; }
.job-created-confirmation__check { grid-row: span 2; align-self: center; width: 52px; height: 52px; min-width: 52px; min-height: 52px; aspect-ratio: 1; box-sizing: border-box; border-radius: 50%; background: #d4ff00; color: #24300b; display: grid; place-items: center; }
.job-created-confirmation__check svg { display: block; width: 44px; height: 44px; overflow: visible; }
.job-created-confirmation__ring { stroke: currentColor; stroke-width: 1.5; stroke-dasharray: 132; stroke-dashoffset: 0; transform-origin: center; transform: rotate(-90deg); animation: job-ring-in .55s ease-out both; }
.job-created-confirmation__tick { stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 34; stroke-dashoffset: 0; animation: job-tick-in .3s .35s ease-out both; }
.job-created-confirmation strong { font-size: 1rem; align-self: end; line-height: 1.4; }
.job-created-confirmation > span:last-of-type { font-size: .8rem; color: var(--ds-muted); line-height: 1.5; align-self: start; }
.job-created-confirmation button { position: absolute; right: 0; top: 0; width: 44px; height: 44px; background: none; border: 0; color: inherit; font-size: 1.4rem; }
@keyframes job-confirm-in { from { opacity: 0; translate: 0 -12px; } to { opacity: 1; translate: 0 0; } }
@keyframes job-ring-in { from { stroke-dashoffset: 132; } to { stroke-dashoffset: 0; } }
@keyframes job-tick-in { from { stroke-dashoffset: 34; } to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) { .job-created-confirmation, .job-created-confirmation__ring, .job-created-confirmation__tick { animation: none; } .job-create__expand { transition: none; } }
@media (max-width: 640px) { .job-create .crm-create-modal__sheet { max-height: calc(100dvh - env(safe-area-inset-top)); border-radius: 20px 20px 0 0; } }