{"version":3,"file":"Stepper.module.cjs","names":[],"sources":["../../../src/components/Stepper/Stepper.module.css"],"sourcesContent":[".stepper {\n    display: flex;\n    align-items: flex-start;\n    gap: var(--tempest-space-2);\n    width: 100%;\n    font-family: var(--tempest-font-sans);\n}\n\n.stepper.vertical {\n    flex-direction: column;\n    align-items: stretch;\n}\n\n.step {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    flex: 1;\n}\n\n.dot {\n    width: 28px;\n    height: 28px;\n    border-radius: 50%;\n    border: 2px solid var(--tempest-border-strong);\n    background-color: var(--tempest-bg);\n    color: var(--tempest-text-muted);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: var(--tempest-text-xs);\n    font-weight: var(--tempest-weight-bold);\n    flex-shrink: 0;\n    transition: var(--tempest-transition-color);\n}\n\n.step.completed .dot {\n    background-color: var(--tempest-primary);\n    border-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n\n.step.active .dot {\n    border-color: var(--tempest-primary-on-soft);\n    color: var(--tempest-primary-on-soft);\n    box-shadow: 0 0 0 4px var(--tempest-primary-soft);\n}\n\n.label {\n    font-size: var(--tempest-text-sm);\n    color: var(--tempest-text-muted);\n    font-weight: var(--tempest-weight-semibold);\n    line-height: var(--tempest-leading-snug);\n}\n\n.step.active .label,\n.step.completed .label {\n    color: var(--tempest-text);\n}\n\n.connector {\n    flex: 1;\n    height: 2px;\n    background-color: var(--tempest-border);\n    margin: 0 var(--tempest-space-1);\n    transition: background-color var(--tempest-duration-base) var(--tempest-ease-out);\n}\n\n.connector.completed {\n    background-color: var(--tempest-primary);\n}\n\n.stepper.vertical .connector {\n    width: 2px;\n    height: 24px;\n    margin: 0 0 0 13px;\n}\n\n/* Mobile — horizontal stepper becomes vertical automatically. */\n@media (max-width: 639.98px) {\n    .stepper:not(.vertical) {\n        flex-direction: column;\n        align-items: stretch;\n    }\n    .stepper:not(.vertical) .connector {\n        width: 2px;\n        height: 16px;\n        margin: 0 0 0 13px;\n    }\n}\n\n.labelGroup {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-1);\n    min-width: 0;\n}\n\n.description {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-text-subtle);\n}\n\n.trigger {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    padding: 0;\n    background: none;\n    border: 0;\n    font: inherit;\n    color: inherit;\n    cursor: pointer;\n    border-radius: var(--tempest-radius-sm);\n}\n\n.trigger:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: var(--tempest-focus-ring-offset);\n}\n"],"mappings":";"}