/*
 * Company sign-up (/start) on the platform's dark sign-in design (auth.css, .ta-auth--platform).
 * Without JavaScript every step shows, one under the other; with it (.ta-wizard.is-js) one step at a time.
 * Logical properties only, so Arabic (RTL) and English (LTR) mirror cleanly.
 */
.ta-auth--platform.ta-signup .ta-main { flex-basis: 44%; }
.ta-auth--platform.ta-signup .ta-card { max-width: 560px; }
.ta-wizard { display: flex; flex-direction: column; gap: 1.25rem; }

/* steps */
.ta-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .4rem; counter-reset: step; }
.ta-steps li { display: flex; flex-direction: column; gap: .35rem; font-size: .78rem; color: var(--ta-muted); counter-increment: step; }
.ta-steps li::before { content: ""; height: 4px; border-radius: 4px; background: rgba(129,140,248,.18); transition: background .3s; }
.ta-steps li span::before { content: counter(step) ". "; }
.ta-steps li.is-done::before, .ta-steps li.is-current::before { background: linear-gradient(90deg, #4f46e5, #22d3ee); }
.ta-steps li.is-current { color: #fff; font-weight: 700; }
.ta-wizard:not(.is-js) .ta-steps { display: none; }

.ta-step { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: 1rem; }
.ta-step + .ta-step { padding-top: 1.25rem; border-top: 1px solid var(--ta-line); }
.ta-wizard.is-js .ta-step { display: none; padding-top: 0; border-top: 0; }
.ta-wizard.is-js .ta-step.is-current { display: flex; animation: taRise .45s cubic-bezier(.2,.8,.2,1) both; }
.ta-step-title { float: none; width: auto; margin: 0 0 .9rem; line-height: 1.4; font-size: 1.15rem; font-weight: 700; color: #fff; }
.ta-step-hint { margin: -.55rem 0 0; font-size: .88rem; color: var(--ta-muted); }

/* choices: sectors and plans */
.ta-choices { display: grid; gap: .6rem; }
.ta-choice { position: relative; display: block; margin: 0; cursor: pointer; }
.ta-choice > input { position: absolute; opacity: 0; inset-inline-start: 1rem; top: 1.2rem; width: 1px; height: 1px; }
.ta-choice-box { display: flex; align-items: flex-start; gap: .85rem; padding: .95rem 1rem; border-radius: 14px; border: 1.5px solid rgba(129,140,248,.2); background: #0a0f26; transition: border-color .2s, background .2s, box-shadow .2s; }
.ta-choice:hover .ta-choice-box { border-color: rgba(129,140,248,.45); }
.ta-choice > input:checked + .ta-choice-box { border-color: #818cf8; background: rgba(79,70,229,.16); box-shadow: 0 0 0 4px rgba(129,140,248,.14); }
.ta-choice > input:focus-visible + .ta-choice-box { outline: 2px solid #60a5fa; outline-offset: 2px; }
.ta-choice-ico { width: 44px; height: 44px; flex: none; border-radius: 12px; display: grid; place-items: center; font-size: 1.25rem; color: #a5b4fc;
    background: linear-gradient(145deg, rgba(79,70,229,.35), rgba(30,27,75,.6)); border: 1px solid rgba(129,140,248,.3); }
.ta-choice-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .2rem; }
.ta-choice-body strong { color: #fff; font-size: .98rem; }
.ta-choice-body small { color: var(--ta-muted); font-size: .84rem; line-height: 1.6; }
.ta-choice-tick { flex: none; width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid rgba(129,140,248,.35); display: grid; place-items: center; color: transparent; font-size: .8rem; margin-top: .2rem; }
.ta-choice > input:checked + .ta-choice-box .ta-choice-tick { background: #6366f1; border-color: #6366f1; color: #fff; }
.ta-plan-price { color: #c7d2fe; font-weight: 700; font-size: .9rem; }
.ta-plan-meta { display: flex; flex-wrap: wrap; gap: .35rem .9rem; font-size: .8rem; color: var(--ta-muted); }

/* a plan's modules */
.ta-modules { margin-top: -.25rem; border-radius: 12px; border: 1px solid rgba(129,140,248,.14); background: rgba(10,15,38,.6); }
.ta-modules > summary { cursor: pointer; padding: .6rem .9rem; font-size: .85rem; font-weight: 600; color: #93c5fd; list-style: none; display: flex; align-items: center; gap: .4rem; }
.ta-modules > summary::-webkit-details-marker { display: none; }
.ta-modules > summary .bi { transition: transform .2s; }
.ta-modules[open] > summary .bi { transform: rotate(180deg); }
.ta-modules-body { padding: 0 .9rem .8rem; display: flex; flex-direction: column; gap: .7rem; max-height: 320px; overflow: auto; }
.ta-modules-group h3 { margin: 0 0 .3rem; font-size: .8rem; font-weight: 700; color: #e2e8f0; display: flex; align-items: center; gap: .4rem; }
.ta-modules-group ul { margin: 0; padding-inline-start: 1.1rem; display: grid; gap: .15rem; font-size: .8rem; color: var(--ta-muted); }
.ta-sector-plans + .ta-sector-plans { margin-top: .75rem; }
.ta-sector-name { font-size: .82rem; color: var(--ta-muted); font-weight: 700; margin-bottom: .4rem; }
.ta-wizard.is-js .ta-sector-name { display: none; }
.ta-wizard.is-js .ta-sector-plans[hidden] { display: none; }

/* site address: <slug>.<domain> */
.ta-address { display: flex; align-items: stretch; direction: ltr; }
.ta-address .form-control { border-start-end-radius: 0 !important; border-end-end-radius: 0 !important; }
.ta-address-suffix { display: flex; align-items: center; padding: 0 .9rem; border-radius: 0 12px 12px 0; border: 1.5px solid rgba(129,140,248,.2); border-left: 0;
    background: rgba(129,140,248,.08); color: var(--ta-muted); font-size: .88rem; white-space: nowrap; max-width: 55%; overflow: hidden; text-overflow: ellipsis; }
.ta-address-status { min-height: 1.3em; margin-top: .4rem; font-size: .82rem; color: var(--ta-muted); }
.ta-address-status.is-ok { color: #86efac; }
.ta-address-status.is-bad { color: #fca5a5; }
.ta-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.ta-auth--platform .ta-card .form-select { background-color: #0a0f26 !important; border-color: rgba(129,140,248,.2) !important; color: #f1f5f9 !important; height: 54px; border-radius: 12px; }
.ta-auth--platform .ta-card .is-invalid { border-color: rgba(248,113,113,.7) !important; }
.ta-field-error { margin-top: .35rem; font-size: .82rem; color: #fca5a5; }

.ta-nav { display: flex; gap: .6rem; }
.ta-nav .ta-btn { flex: 1; }
.ta-btn--ghost { background: transparent !important; border: 1.5px solid rgba(129,140,248,.3); box-shadow: none !important; color: #e2e8f0; }
.ta-btn--ghost:hover { border-color: #818cf8; }
.ta-trial-note { display: flex; gap: .6rem; align-items: flex-start; padding: .8rem 1rem; border-radius: 12px; background: rgba(34,211,238,.08); border: 1px solid rgba(34,211,238,.25);
    color: #a5f3fc; font-size: .85rem; line-height: 1.6; }
.ta-hp { position: absolute !important; inset-inline-start: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* preparing */
.ta-prep { display: flex; flex-direction: column; gap: .7rem; margin: 0; padding: 0; list-style: none; }
.ta-prep li { display: flex; align-items: center; gap: .7rem; color: var(--ta-muted); font-size: .92rem; }
.ta-prep li .bi, .ta-prep li .spinner-border { flex: none; }
.ta-prep li.is-done { color: #86efac; }
.ta-prep li.is-current { color: #fff; }

@media (max-width: 575.98px) {
    .ta-grid2 { grid-template-columns: 1fr; }
    .ta-steps li span { font-size: .7rem; }
    .ta-address { flex-wrap: wrap; }
    .ta-address .form-control { border-radius: 12px 12px 0 0 !important; }
    .ta-address-suffix { max-width: none; width: 100%; border-radius: 0 0 12px 12px; border-left: 1.5px solid rgba(129,140,248,.2); border-top: 0; padding: .55rem .9rem; }
}
@media (prefers-reduced-motion: reduce) {
    .ta-wizard.is-js .ta-step.is-current { animation: none; }
}
