.process-consultation-action { display: flex; gap: 20px; align-items: center; justify-content: space-between; margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--color-line); }
.process-consultation-action .button { display: inline-flex; gap: 10px; align-items: center; }.process-consultation-action svg { width: 17px; }.process-consultation-action p { margin: 0; color: #667085; font-size: 14px; }
.process-grid [data-consultation-step] { cursor: pointer; }.process-grid [data-consultation-step]:focus-visible { z-index: 2; outline: 2px solid #155eef; outline-offset: -2px; }.process-step-tip { margin: 14px 0 0 !important; color: #155eef !important; font-size: 13px !important; font-weight: 600; line-height: 1.6 !important; }
.process-grid [data-consultation-step]::after { position: absolute; inset: -1px; z-index: 1; padding: 1px; border-radius: 3px; background: linear-gradient(90deg, transparent 0%, transparent 20%, #155eef 42%, #79adff 50%, #155eef 58%, transparent 80%, transparent 100%); background-size: 200% 100%; content: ""; opacity: 0; pointer-events: none; -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; }
.process-grid.is-status-idle [data-consultation-step="1"]::after, .process-grid.is-status-new [data-consultation-step="1"]::after, .process-grid.is-status-reviewing [data-consultation-step="2"]::after, .process-grid.is-status-awaiting_customer [data-consultation-step="3"]::after, .process-grid.is-status-follow_up [data-consultation-step="4"]::after { opacity: 1; animation: consultation-thread 2.8s linear infinite; }
.process-grid.is-status-new [data-consultation-step="1"], .process-grid.is-status-reviewing [data-consultation-step="2"], .process-grid.is-status-awaiting_customer [data-consultation-step="3"], .process-grid.is-status-follow_up [data-consultation-step="4"], .process-grid.is-status-completed [data-consultation-step="4"] { background: rgb(21 94 239 / 3%); }
.process-submission-notice { margin-top: 14px !important; color: #155eef !important; font-size: 12px !important; font-weight: 600; }
@keyframes consultation-thread { to { background-position: -200% 0; } }
.consultation-backdrop { position: fixed; inset: 0; z-index: 85; display: grid; overflow-y: auto; place-items: center; padding: 24px; background: rgb(0 0 0 / 62%); }.consultation-dialog { position: relative; width: min(680px, 100%); max-height: calc(100vh - 48px); overflow-y: auto; border-radius: var(--radius-card); background: var(--color-white); box-shadow: 0 24px 80px rgb(0 0 0 / 30%); }.consultation-close { position: absolute; top: 18px; right: 18px; z-index: 2; display: grid; width: 44px; min-height: 44px; padding: 0; place-items: center; border: 0; border-radius: var(--radius-control); background: #f1f1f1; cursor: pointer; }.consultation-close svg { width: 20px; }
.consultation-head { padding: 36px 42px 24px; border-bottom: 1px solid var(--color-line); }.consultation-head > p:first-child { margin: 0 0 10px; color: var(--color-primary); font-size: 11px; letter-spacing: .14em; }.consultation-head h2 { max-width: 500px; margin: 0; font-size: 32px; font-weight: 500; }.consultation-description { margin: 14px 0 0; color: #667085; line-height: 1.6; }
.consultation-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 30px 42px; }.consultation-field, .consultation-field-row { display: grid; gap: 8px; }.consultation-field-wide, .consultation-field-row, .consultation-privacy, .consultation-status { grid-column: 1 / -1; }.consultation-field-row { grid-template-columns: 1fr 1fr; gap: 16px; }.consultation-field label { font-size: 13px; font-weight: 600; }.consultation-field input, .consultation-field textarea { width: 100%; padding: 12px; border: 1px solid #bbb; border-radius: var(--radius-control); background: var(--color-white); }.consultation-field textarea { min-height: 148px; resize: vertical; }.consultation-field [aria-invalid="true"] { border-color: var(--color-error); }
.consultation-privacy { display: flex; gap: 10px; align-items: center; margin-top: 2px; line-height: 1.5; }.consultation-privacy input { width: 18px; height: 18px; margin: 0; flex: 0 0 18px; accent-color: var(--color-primary); }.consultation-status { min-height: 22px; margin: 0; color: var(--color-error); line-height: 1.5; }.consultation-actions { display: flex; justify-content: flex-end; padding: 20px 42px; border-top: 1px solid var(--color-line); }.consultation-actions .button:disabled { opacity: .65; cursor: wait; }body.consultation-open { overflow: hidden; }
@media (max-width: 650px) { .consultation-backdrop { align-items: end; padding: 0; }.consultation-dialog { width: 100%; max-height: 100vh; border-radius: 0; }.consultation-head, .consultation-fields, .consultation-actions { padding-right: 22px; padding-left: 22px; } }
@media (max-width: 560px) { .process-consultation-action, .consultation-field-row { display: grid; grid-template-columns: 1fr; }.process-consultation-action .button, .consultation-actions .button { justify-content: center; width: 100%; }.consultation-fields { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .process-grid.is-status-idle [data-consultation-step="1"]::after, .process-grid.is-status-new [data-consultation-step="1"]::after, .process-grid.is-status-reviewing [data-consultation-step="2"]::after, .process-grid.is-status-awaiting_customer [data-consultation-step="3"]::after, .process-grid.is-status-follow_up [data-consultation-step="4"]::after { animation: none; background-position: -100% 0; } }