/* کامپوننت‌های پایه مشترک v3 — افزایشی و عقب‌سازگار با کلاس‌های فعلی. */

.btn,.button,.button-ghost{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--control-height-md);border:var(--border-width) solid var(--action-primary-bg);background:var(--action-primary-bg);color:var(--action-primary-text);padding:10px var(--control-padding-inline);border-radius:var(--radius-pill);font:inherit;font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);line-height:1.45;cursor:pointer;text-decoration:none;transition:transform var(--motion-duration-normal) var(--motion-ease-standard),box-shadow var(--motion-duration-normal) var(--motion-ease-standard),background-color var(--motion-duration-fast) var(--motion-ease-standard),border-color var(--motion-duration-fast) var(--motion-ease-standard),color var(--motion-duration-fast) var(--motion-ease-standard)}
@media(hover:hover) and (pointer:fine){.btn:hover,.button:hover,.button-ghost:hover{transform:translateY(calc(-1 * var(--motion-distance-sm)));box-shadow:0 var(--motion-distance-md) 0 var(--color-brand-orange)}}
.btn:active,.button:active,.button-ghost:active{transform:translateY(0);box-shadow:none}
.btn:disabled,.button:disabled,.button-ghost:disabled,.btn[aria-disabled="true"],.button[aria-disabled="true"],.button-ghost[aria-disabled="true"]{border-color:var(--action-disabled-border);background:var(--action-disabled-bg);color:var(--action-disabled-text);opacity:.65;cursor:not-allowed;pointer-events:none;transform:none;box-shadow:none}
.btn[aria-busy="true"],.button[aria-busy="true"],.button-ghost[aria-busy="true"]{cursor:wait}
.btn[aria-busy="true"]::after,.button[aria-busy="true"]::after,.button-ghost[aria-busy="true"]::after{width:var(--icon-size-sm);height:var(--icon-size-sm);border:2px solid currentColor;border-inline-start-color:transparent;border-radius:50%;content:"";animation:ui-spin var(--motion-duration-loop) linear infinite}
.btn-primary,.button.primary{border-color:var(--action-brand-bg);background:var(--action-brand-bg);color:var(--action-brand-text)}
@media(hover:hover) and (pointer:fine){.btn-primary:hover,.button.primary:hover{border-color:var(--action-brand-bg-hover);background:var(--action-brand-bg-hover);box-shadow:0 var(--motion-distance-md) 0 var(--color-ink)}}
.btn-secondary,.button.secondary{border-color:var(--action-secondary-border);background:var(--action-secondary-bg);color:var(--action-secondary-text);box-shadow:none}
@media(hover:hover) and (pointer:fine){.btn-secondary:hover,.button.secondary:hover{background:var(--action-secondary-bg-hover);box-shadow:none}}
.btn-ghost,.button.ghost,.button-ghost{border-color:transparent;background:transparent;color:var(--action-secondary-text);box-shadow:none}
@media(hover:hover) and (pointer:fine){.btn-ghost:hover,.button.ghost:hover,.button-ghost:hover{background:var(--action-secondary-bg-hover);box-shadow:none}}
.btn-danger,.button.danger{border-color:var(--action-danger-bg);background:var(--action-danger-bg);color:var(--action-danger-text)}
@media(hover:hover) and (pointer:fine){.btn-danger:hover,.button.danger:hover{border-color:var(--action-danger-bg-hover);background:var(--action-danger-bg-hover);box-shadow:none}}
.btn-sm,.button.compact{min-height:var(--control-height-sm);padding:7px 14px;font-size:var(--font-size-xs)}
.btn-lg,.button.large{min-height:var(--control-height-lg);padding:12px var(--space-5);font-size:var(--font-size-base)}
.btn-icon,.button.icon-only{width:var(--control-height-md);min-width:var(--control-height-md);padding:0}
@keyframes ui-spin{to{transform:rotate(1turn)}}

.badge{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:var(--radius-pill);font-size:var(--font-size-xs);font-weight:var(--font-weight-black);line-height:1.6;white-space:nowrap}
.badge-success,.badge--success{background:var(--status-success-surface);color:var(--status-success-text)}
.badge-warning,.badge--warning{background:var(--status-warning-surface);color:var(--status-warning-text)}
.badge-danger,.badge--danger{background:var(--status-danger-surface);color:var(--status-danger-text)}
.badge-info,.badge--info{background:var(--status-info-surface);color:var(--status-info-text)}
.badge-neutral{background:var(--color-line);color:var(--color-muted)}

.card,.ui-card{background:var(--surface-card);border:var(--border-width) solid var(--border-default);border-radius:var(--radius-lg);padding:var(--space-6);box-shadow:var(--shadow-sm)}
.ui-card--subtle{background:var(--surface-subtle);box-shadow:none}.ui-card--inverse{background:var(--surface-inverse);color:var(--text-inverse)}
.ui-card--interactive{transition:transform var(--motion-duration-normal) var(--motion-ease-standard),box-shadow var(--motion-duration-normal) var(--motion-ease-standard)}
@media(hover:hover) and (pointer:fine){.ui-card--interactive:hover{transform:translateY(calc(-1 * var(--motion-distance-sm)));box-shadow:var(--shadow-md)}}

.field,.form-field{margin-block-end:var(--space-5)}
.field-label,.form-label{display:block;margin-block-end:7px;font-weight:var(--font-weight-bold)}
.field input,.field select,.field textarea,.form-control{width:100%;min-height:var(--control-height-md);border:var(--border-width) solid var(--border-strong);background:var(--surface-card);border-radius:var(--radius-sm);padding:12px 15px;font:inherit;color:var(--text-primary)}
.field textarea,.form-control:is(textarea){min-height:112px;resize:vertical}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible,.form-control:focus-visible{outline:var(--focus-ring-width) solid var(--border-focus);outline-offset:2px;border-color:var(--border-focus)}
.field input:disabled,.field select:disabled,.field textarea:disabled,.form-control:disabled{background:var(--action-disabled-bg);color:var(--action-disabled-text);cursor:not-allowed}
.field-help,.form-help{display:block;color:var(--text-secondary);font-size:.8rem;margin-block-start:6px}
.field-error:not(.field),.form-error,.errorlist{color:var(--status-danger-text);font-size:.85rem;margin-block-start:6px}
.field.field-error,.form-field.is-invalid{color:inherit}
.field.field-error input,.field.field-error select,.field.field-error textarea,.form-field.is-invalid .form-control{border-color:var(--status-danger-border)}

.message,.ui-message{margin-block:var(--space-4);padding:12px 16px;border:var(--border-width) solid var(--status-success-border);border-radius:var(--radius-md);background:var(--status-success-surface);color:var(--status-success-text);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold)}
.ui-message{border-color:var(--status-info-border);background:var(--status-info-surface);color:var(--status-info-text)}
.message.success,.ui-message--success,[data-status="success"].ui-message{border-color:var(--status-success-border);background:var(--status-success-surface);color:var(--status-success-text)}
.message.warning,.ui-message--warning,[data-status="warning"].ui-message{border-color:var(--status-warning-border);background:var(--status-warning-surface);color:var(--status-warning-text)}
.message.error,.message.danger,.ui-message--danger,[data-status="danger"].ui-message,[data-status="error"].ui-message{border-color:var(--status-danger-border);background:var(--status-danger-surface);color:var(--status-danger-text)}
.message.info,.ui-message--info,[data-status="info"].ui-message{border-color:var(--status-info-border);background:var(--status-info-surface);color:var(--status-info-text)}
.ui-status{display:inline-flex;align-items:center;gap:var(--space-2);min-height:32px;padding:4px 10px;border:var(--border-width) solid var(--border-default);border-radius:var(--radius-pill);background:var(--surface-subtle);color:var(--text-secondary);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold)}
.ui-status--success,.ui-status[data-status="success"]{border-color:var(--status-success-border);background:var(--status-success-surface);color:var(--status-success-text)}
.ui-status--warning,.ui-status[data-status="warning"]{border-color:var(--status-warning-border);background:var(--status-warning-surface);color:var(--status-warning-text)}
.ui-status--danger,.ui-status[data-status="danger"],.ui-status[data-status="error"]{border-color:var(--status-danger-border);background:var(--status-danger-surface);color:var(--status-danger-text)}
.ui-status--info,.ui-status[data-status="info"]{border-color:var(--status-info-border);background:var(--status-info-surface);color:var(--status-info-text)}

.ui-icon{display:inline-block;flex:none;width:var(--icon-size-md);height:var(--icon-size-md);fill:none;stroke:currentColor;stroke-width:var(--icon-stroke-width);stroke-linecap:round;stroke-linejoin:round;vertical-align:-.2em}
.ui-icon--sm{width:var(--icon-size-sm);height:var(--icon-size-sm)}.ui-icon--lg{width:var(--icon-size-lg);height:var(--icon-size-lg)}
[dir="rtl"] .ui-icon--directional{transform:scaleX(-1)}
.ui-icon-button{display:inline-grid;place-items:center;width:var(--control-height-md);height:var(--control-height-md);padding:0;border:var(--border-width) solid var(--border-default);border-radius:var(--radius-sm);background:var(--surface-card);color:var(--text-primary);cursor:pointer}

.theme-toggle{display:inline-flex;align-items:center;justify-content:center;width:var(--control-height-md);height:var(--control-height-md);border:var(--border-width) solid var(--border-default);border-radius:var(--radius-sm);background:var(--surface-card);color:var(--text-primary);cursor:pointer;font-size:1rem;line-height:1}
.theme-toggle:hover{background:var(--color-line)}

.help-affordance{position:fixed;inset-block-end:calc(var(--space-5) + env(safe-area-inset-bottom,0px));inset-inline-end:var(--space-5);z-index:var(--z-popover);display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:var(--radius-pill);background:var(--action-primary-bg);color:var(--action-primary-text);font-weight:var(--font-weight-bold);font-size:.82rem;text-decoration:none;box-shadow:var(--shadow-md)}
.help-affordance:hover{background:var(--color-brand-orange);color:var(--color-on-brand)}
@media(max-width:820px){.help-affordance{inset-inline-end:var(--space-3);inset-block-end:calc(76px + env(safe-area-inset-bottom,0px))}}

.wizard-draft-banner{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-block-end:var(--space-5);padding:12px 16px;border:1px solid var(--color-brand-orange);border-radius:var(--radius-md);background:var(--color-accent-surface);color:var(--color-ink);font-size:.85rem}
.wizard-draft-banner span{flex:1 1 auto;font-weight:var(--font-weight-bold)}
.wizard-draft-banner button{min-height:var(--control-height-md);border:var(--border-width) solid var(--text-primary);background:transparent;color:var(--text-primary);padding:6px 12px;border-radius:var(--radius-pill);font:inherit;font-weight:var(--font-weight-bold);cursor:pointer}
.wizard-draft-banner [data-draft-restore]{background:var(--color-panel-dark);color:#fff}

:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:var(--focus-ring-width) solid var(--border-focus);outline-offset:var(--focus-ring-offset)}

/* Shared route feedback for public, form, contract and management shells. */
.app-welcome[data-app-welcome]{display:none}
.welcome-pending,.navigation-pending{overflow:hidden}
.welcome-pending .app-welcome[data-app-welcome],.navigation-pending .app-welcome[data-app-welcome]{position:fixed;z-index:var(--z-loader);inset:0;display:grid;place-items:center;background:var(--color-panel-dark);color:#fff;overflow:hidden}
.app-welcome[data-app-welcome].is-leaving{animation:ui-loader-exit var(--motion-duration-slow) var(--motion-ease-exit) forwards}
.app-welcome[data-app-welcome] .welcome-brand{position:relative;z-index:2;display:grid;justify-items:center;gap:9px}
.welcome-pending .app-welcome[data-app-welcome] .welcome-brand,.navigation-pending .app-welcome[data-app-welcome] .welcome-brand{animation:ui-loader-rise var(--motion-duration-slow) var(--motion-ease-enter) both}
.app-welcome[data-app-welcome] .welcome-mark{display:grid;place-items:center;width:92px;height:92px;margin-block-end:12px;border-radius:27px;background:var(--color-brand-orange);color:var(--color-on-brand);box-shadow:0 24px 80px color-mix(in srgb,var(--color-brand-orange) 32%,transparent);font:900 2.35rem/1 Arial,sans-serif;transform:rotate(-4deg)}
.app-welcome[data-app-welcome] .welcome-brand strong{font:900 1.45rem/1 Arial,sans-serif;letter-spacing:.24em;text-indent:.24em}
.app-welcome[data-app-welcome] .welcome-brand small{color:#c4cbd6;font-size:.78rem}
.app-welcome[data-app-welcome] .welcome-orbit{position:absolute;border:1px solid rgba(255,255,255,.11);border-radius:50%;animation:ui-loader-roll 9s linear infinite}
.app-welcome[data-app-welcome] .orbit-one{width:min(70vw,620px);aspect-ratio:1}
.app-welcome[data-app-welcome] .orbit-two{width:min(92vw,820px);aspect-ratio:1;animation-direction:reverse;animation-duration:14s}
.app-welcome[data-app-welcome] .orbit-one::before,.app-welcome[data-app-welcome] .orbit-two::before{position:absolute;inset-block-start:50%;inset-inline-start:-6px;width:12px;height:12px;border-radius:50%;background:var(--color-brand-orange);box-shadow:0 0 25px var(--color-brand-orange);content:""}
.app-welcome[data-app-welcome] .welcome-progress{position:absolute;z-index:2;inset-block-end:max(38px,env(safe-area-inset-bottom));width:min(180px,48vw);height:3px;border-radius:4px;background:rgba(255,255,255,.14);overflow:hidden}
.app-welcome[data-app-welcome] .welcome-progress span{display:block;width:45%;height:100%;border-radius:inherit;background:var(--color-brand-orange);animation:ui-loader-progress 1s var(--motion-ease-standard) infinite}
@keyframes ui-loader-rise{from{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:none}}
@keyframes ui-loader-roll{to{transform:rotate(360deg)}}
@keyframes ui-loader-progress{from{transform:translateX(-120%)}to{transform:translateX(340%)}}
@keyframes ui-loader-exit{to{opacity:0;visibility:hidden;transform:scale(1.025)}}

.has-ui-reveal [data-ui-reveal]{opacity:0;transform:translateY(var(--motion-distance-md));transition:opacity var(--motion-duration-slow) var(--motion-ease-enter),transform var(--motion-duration-slow) var(--motion-ease-enter);transition-delay:var(--ui-reveal-delay,0ms)}
.has-ui-reveal [data-ui-reveal].is-visible{opacity:1;transform:none}

/* Installed mobile PWA: deliberate, accessible pull-to-refresh feedback. */
.pull-refresh[hidden]{display:none!important}.pull-refresh{--pull-distance:0px;--pull-progress:0;position:fixed;z-index:var(--z-toast,1200);inset-block-start:max(8px,env(safe-area-inset-top,0px));inset-inline-start:50%;display:flex;align-items:center;gap:9px;max-width:calc(100vw - 28px);padding:8px 13px;border:1px solid var(--border-default);border-radius:999px;background:var(--surface-card);background:color-mix(in srgb,var(--surface-card) 94%,transparent);color:var(--text-primary);box-shadow:var(--shadow-md);opacity:0;pointer-events:none;transform:translate(-50%,calc(-100% - 24px + var(--pull-distance)));transition:opacity var(--motion-duration-fast) var(--motion-ease-standard),transform var(--motion-duration-fast) var(--motion-ease-standard);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}[dir="rtl"] .pull-refresh{transform:translate(50%,calc(-100% - 24px + var(--pull-distance)))}.pull-refresh.is-visible{opacity:1}.pull-refresh__indicator{display:grid;width:25px;height:25px;flex:none;border-radius:50%;background:conic-gradient(var(--color-brand-orange) calc(var(--pull-progress) * 1turn),var(--color-line) 0);place-items:center}.pull-refresh__indicator i{width:17px;height:17px;border-radius:50%;background:var(--surface-card)}.pull-refresh__label{overflow:hidden;font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);text-overflow:ellipsis;white-space:nowrap}.pull-refresh__status{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.pull-refresh.is-ready .pull-refresh__indicator{box-shadow:0 0 0 3px var(--color-accent-surface)}.pull-refresh.is-refreshing .pull-refresh__indicator{background:transparent;border:3px solid var(--color-line);border-inline-start-color:var(--color-brand-orange);animation:ui-spin .7s linear infinite}.pull-refresh.is-refreshing .pull-refresh__indicator i{display:none}

@media(prefers-reduced-motion:reduce){.btn,.button,.button-ghost,.ui-card--interactive{transition:none}.btn:hover,.button:hover,.button-ghost:hover,.ui-card--interactive:hover{transform:none}.btn[aria-busy="true"]::after,.button[aria-busy="true"]::after,.button-ghost[aria-busy="true"]::after,.welcome-pending .app-welcome[data-app-welcome] *,.navigation-pending .app-welcome[data-app-welcome] *,.app-welcome[data-app-welcome].is-leaving,.pull-refresh.is-refreshing .pull-refresh__indicator{animation:none!important}.has-ui-reveal [data-ui-reveal]{opacity:1;transform:none;transition:none}.pull-refresh{transition:none}}
@media(forced-colors:active){.btn,.button,.button-ghost,.badge,.card,.ui-card,.ui-message,.ui-status,.field input,.field select,.field textarea,.form-control,.theme-toggle,.ui-icon-button,.wizard-draft-banner{border:1px solid CanvasText}:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid Highlight}}
