@layer components{.windy-button{--windy-button-border:var( --windy-interactive-border,var(--windy-button-border-style,var(--windy-interactive-border-style)) var(--_color-border) var(--_border-width) );--windy-focus-ring-color:var(--windy-color-neutral-5);--_color-bg:var(--windy-button-color-bg,var(--windy-interactive-color-bg));--_color-border:var(--windy-button-color-border,var(--windy-interactive-color-border));--_padding-block:var(--windy-button-padding-block,.5lh);--_padding-inline:var(--windy-button-padding-inline,1.25lh);--_border-width:var(--windy-button-border-width,var(--windy-interactive-border-width));border:var(--windy-button-border);border-radius:var(--windy-button-radius,var(--windy-interactive-radius));padding-block:var(--_padding-block);padding-inline:var(--_padding-inline);color:var(--windy-button-color,var(--windy-interactive-color));background-color:var(--_color-bg);cursor:var(--windy-button-cursor,var(--windy-interactive-cursor));min-block-size:calc(var(--windy-icon-size) + var(--_padding-block)*2 + var(--_border-width)*2);font-size:var(--windy-button-font-size,var(--windy-step-0));font-weight:var(--windy-button-font-weight,500);line-height:var(--windy-button-line-height,var(--windy-leading-tight));transition:opacity .1s var(--windy-timing-function);-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation;display:inline-grid;grid-auto-flow:column;justify-content:center;align-items:center;gap:var(--windy-button-gutter,var(--windy-interactive-gutter))}.windy-button:hover,.windy-button[data-active=true]{background-color:color-mix(in srgb,var(--windy-color-neutral-5) 10%,var(--_color-bg))}.windy-button:disabled,.windy-button[data-disabled=true]{cursor:not-allowed;opacity:.5;transition-property:none}:is(.windy-button:disabled,.windy-button[data-disabled=true]):hover{background-color:var(--_color-bg)}.windy-button[data-block=true]{display:grid;inline-size:100%}.windy-button[data-pill=true]{--windy-button-radius:9999px}.windy-button[data-wide=true]{--windy-button-padding-inline:var(--windy-space-l-xl)}.windy-button[data-size=small]{--windy-button-font-size:var(--windy-step--1)}.windy-button[data-size=large]{--windy-button-font-size:var(--windy-step-1)}.windy-button:is([data-variant=success],[data-variant=warning],[data-variant=ok]){--csstools-color-scheme--light: ;color-scheme:dark}@media(prefers-color-scheme:light){.windy-button:is([data-variant=success],[data-variant=warning],[data-variant=ok]):where(:not([data-color-scheme=dark] *)){--windy-focus-ring-color:var(--windy-color-neutral-0)}}.windy-button:is([data-variant=success],[data-variant=warning],[data-variant=ok]):where([data-color-scheme=light] *){--windy-focus-ring-color:var(--windy-color-neutral-0)}.windy-button[data-variant=primary]{--windy-button-color-bg:var(--windy-color-primary)}.windy-button[data-variant=primary]:not([data-outlined=true]){--csstools-color-scheme--light:initial;color-scheme:light}@media(prefers-color-scheme:dark){.windy-button[data-variant=primary]:not([data-outlined=true]):where(:not([data-color-scheme=light] *)){--windy-focus-ring-color:var(--windy-color-neutral-0)}}.windy-button[data-variant=primary]:not([data-outlined=true]):where([data-color-scheme=dark] *){--windy-focus-ring-color:var(--windy-color-neutral-0)}.windy-button[data-variant=secondary]{--windy-button-color:var(--windy-color-text);--windy-button-color-bg:var(--windy-color-neutral-1);--windy-button-color-border:var(--windy-color-border);--windy-button-border-style:solid}.windy-button[data-variant=secondary]:where(:hover,[data-active=true]){background-color:color-mix(in srgb-linear,var(--windy-color-neutral-5) 10%,var(--_color-bg));border-color:color-mix(in srgb-linear,var(--windy-color-neutral-5) 10%,var(--_color-border))}.windy-button[data-variant=success]{--windy-button-color-bg:var(--windy-color-success)}.windy-button[data-variant=ok]{--windy-button-color-bg:var(--windy-color-ok)}.windy-button[data-variant=warning]{--windy-button-color-bg:var(--windy-color-warning)}.windy-button[data-variant=danger]{--windy-button-color-bg:var(--windy-color-danger)}.windy-button[data-variant=text]{--windy-button-color-bg:transparent;--windy-button-padding-block:.75em;--windy-button-padding-inline:.5em;--windy-button-color:var(--windy-color-primary)}.windy-button[data-variant=text]:-moz-any-link{--windy-button-color:var(--windy-color-link)}.windy-button[data-variant=text]:any-link{--windy-button-color:var(--windy-color-link)}.windy-button[data-variant=text]:hover,.windy-button[data-variant=text][data-active=true]{background-color:var(--windy-button-color-bg)}.windy-button[data-variant=text]:is(:hover:not(:disabled,[data-disabled=true]),:-moz-any-link) .label{text-decoration-line:underline}.windy-button[data-variant=text]:is(:hover:not(:disabled,[data-disabled=true]),:any-link) .label{text-decoration-line:underline}.windy-button[data-outlined=true]:where(:not([data-variant=text])){--windy-button-color:var(--_color-border);--windy-button-color-border:var(--_color-bg);--windy-button-border-style:solid;background-color:transparent}.windy-button[data-outlined=true]:where(:not([data-variant=text])):is(:hover,[data-active=true]){background-color:color-mix(in oklab,var(--_color-border) 15%,transparent)}.windy-button[data-outlined=true]:where(:not([data-variant=text])):is(:hover,[data-active=true]):is(:disabled,[data-disabled=true]){background-color:transparent}.windy-button[data-outlined=true][data-variant=secondary]{--windy-button-color:var(--windy-color-neutral-4);--windy-button-color-border:var(--windy-color-neutral-3)}.windy-button:has(.icon[data-position=prefix]){padding-inline-start:calc(var(--_padding-inline) - var(--windy-icon-size)*.2)}.windy-button:has(.icon[data-position=suffix]){padding-inline-end:calc(var(--_padding-inline) - var(--windy-icon-size)*.2)}.windy-button .disabled-reason{position:absolute;margin-block-end:var(--windy-space-2xs);padding:var(--windy-space-3xs);border-radius:var(--windy-radius-small);color:var(--windy-color-bg);background-color:var(--windy-color-neutral-4);font-size:var(--windy-button-disabled-reason-font-size,.75em);text-wrap:balance;line-height:var(--windy-button-disabled-reason-leading,inherit)}.windy-button:not(:disabled,[data-disabled=true]) .disabled-reason{display:none}.windy-button:not(:focus,:hover,:active) .disabled-reason{border:0;clip:rect(0 0 0 0);height:0;margin:0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}@supports not (anchor-name:--name-test){.windy-button:has(.disabled-reason){position:relative}.windy-button .disabled-reason{inset-block-end:100%;inset-inline-start:50%;transform:translate(-50%);inline-size:-moz-max-content;inline-size:max-content;max-inline-size:var(--windy-button-disabled-reason-max-width,30ch)}}@supports (anchor-name:--name-test){.windy-button{--disabled-reason-anchor-name:--reason-anchor}@supports not (anchor-scope:--scope-test){.windy-button:has(.disabled-reason):is(:focus,:hover,:active){anchor-name:var(--disabled-reason-anchor-name)}}@supports (anchor-scope:--scope-test){.windy-button:has(.disabled-reason){anchor-name:var(--disabled-reason-anchor-name);anchor-scope:var(--disabled-reason-anchor-name)}}.windy-button .disabled-reason{--max-width-ratio:var(--windy-button-disabled-reason-max-width-ratio,2.5);position-anchor:var(--disabled-reason-anchor-name);position-area:start span-all;position-try:start span-start,start span-end,flip-block,flip-start,inline-end span-all;max-inline-size:var( --windy-button-disabled-reason-max-width,clamp(20ch,calc(anchor-size()*var(--max-width-ratio)),40ch) )}}}
