.xbec__button{justify-content:center;align-items:center;gap:var(--space-2);height:36px;padding:var(--space-2) var(--space-5);font-size:var(--text-sm);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast), opacity var(--transition-fast);border:none;font-weight:600;display:inline-flex;position:relative}.xbec__button>span{white-space:nowrap}.xbec__button:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.xbec__button:disabled,.xbec__button.is-disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.xbec__button.x-loading>:not(.xbec__button__loader){visibility:hidden}.xbec__button__loader{justify-content:center;align-items:center;display:flex;position:absolute;inset:0}@keyframes xbec-btn-spin{to{transform:rotate(360deg)}}.xbec__button__loader i{animation:.75s linear infinite xbec-btn-spin}.xbec__button.x-icon-only{flex-shrink:0;width:36px;padding:0}.xbec__button.x-icon-only.x-size-sm{width:28px;height:28px}.xbec__button.x-variant-primary{background:var(--color-accent);color:#fff}.xbec__button.x-variant-primary:hover:not(:disabled){background:var(--color-accent-hover)}.xbec__button.x-variant-primary:active:not(:disabled){background:var(--color-accent-active)}.xbec__button.x-variant-secondary{background:var(--color-100);color:var(--color-600)}.xbec__button.x-variant-secondary:hover:not(:disabled){background:var(--color-200)}@media (prefers-color-scheme:dark){.xbec__button.x-variant-secondary{background:var(--color-dark-700);color:var(--color-dark-200)}.xbec__button.x-variant-secondary:hover:not(:disabled){background:var(--color-dark-600)}}.xbec__button.x-variant-ghost{color:var(--color-600);background:0 0}.xbec__button.x-variant-ghost:hover:not(:disabled){background:var(--color-50)}@media (prefers-color-scheme:dark){.xbec__button.x-variant-ghost{color:var(--color-dark-300)}.xbec__button.x-variant-ghost:hover:not(:disabled){background:var(--color-dark-800)}}.xbec__button.x-variant-danger{background:var(--color-error);color:#fff}.xbec__button.x-variant-danger:hover:not(:disabled){background:var(--color-error-hover)}.xbec__button.x-variant-danger-ghost{color:var(--color-error);background:0 0}.xbec__button.x-variant-danger-ghost:hover:not(:disabled){background:var(--color-error-bg)}@media (prefers-color-scheme:dark){.xbec__button.x-variant-danger-ghost{color:#f87171}.xbec__button.x-variant-danger-ghost:hover:not(:disabled){background:var(--color-error-bg)}}.xbec__button.x-variant-warning{background:var(--color-warning);color:#fff}.xbec__button.x-variant-warning:hover:not(:disabled){background:var(--color-warning-hover)}.xbec__button.x-variant-warning-ghost{color:#a16207;background:0 0}.xbec__button.x-variant-warning-ghost:hover:not(:disabled){background:var(--color-warning-bg)}@media (prefers-color-scheme:dark){.xbec__button.x-variant-warning-ghost{color:#facc15}.xbec__button.x-variant-warning-ghost:hover:not(:disabled){background:var(--color-warning-bg)}}.xbec__button.x-size-sm{height:28px;padding:var(--space-1) var(--space-3);border-radius:var(--radius-sm);font-size:var(--text-xs)}.xbec__button.x-size-lg{height:auto;min-height:44px;padding:var(--space-3) var(--space-6);border-radius:var(--radius-lg);font-size:var(--text-base)}.xbec__button.x-size-compact{border-radius:.52rem;min-height:2.25rem;padding:.44rem .62rem}.xbec__button.x-variant-dark{background:var(--color-900);color:var(--color-50)}.xbec__button.x-variant-dark:hover:not(:disabled){background:var(--color-800)}@media (prefers-color-scheme:dark){.xbec__button.x-variant-dark{background:var(--color-dark-700);color:var(--color-dark-50)}.xbec__button.x-variant-dark:hover:not(:disabled){background:var(--color-dark-600);color:var(--color-dark-50)}}.xbec__button.x-variant-filter{background:var(--color-100);color:var(--color-600);transition:background-color var(--transition-fast), color var(--transition-fast)}.xbec__button.x-variant-filter:hover:not(:disabled):not(.is-disabled){background:var(--color-200)}.xbec__button.x-variant-filter.x-active{background:var(--color-accent);color:#fff}@media (prefers-color-scheme:dark){.xbec__button.x-variant-filter{background:var(--color-dark-700);color:var(--color-dark-200)}.xbec__button.x-variant-filter:hover:not(:disabled):not(.is-disabled){background:var(--color-dark-600)}.xbec__button.x-variant-filter.x-active{background:var(--color-accent);color:#fff}}.xbec__button.x-variant-text{color:var(--color-400);background:0 0}.xbec__button.x-variant-text:hover:not(:disabled):not(.is-disabled){color:var(--color-600)}@media (prefers-color-scheme:dark){.xbec__button.x-variant-text{color:var(--color-dark-400)}.xbec__button.x-variant-text:hover:not(:disabled):not(.is-disabled){color:var(--color-dark-200)}}.xbec__button.x-variant-subtle{color:var(--color-700);transition:background-color var(--transition-fast), color var(--transition-fast);background:0 0}.xbec__button.x-variant-subtle:hover:not(:disabled):not(.is-disabled),.xbec__button.x-variant-subtle.x-active{color:var(--color-900);background:#f7f0e0d1}@media (prefers-color-scheme:dark){.xbec__button.x-variant-subtle{color:var(--color-dark-300)}.xbec__button.x-variant-subtle:hover:not(:disabled):not(.is-disabled),.xbec__button.x-variant-subtle.x-active{color:var(--color-dark-50);background:#3d3628b8}}.xbec__button.x-variant-nav{text-align:left;width:100%;color:var(--color-700);transition:background-color var(--transition-fast), color var(--transition-fast);background:0 0;grid-template-columns:1rem minmax(0,1fr);place-items:center start;gap:.65rem;display:grid}.xbec__button.x-variant-nav:hover:not(:disabled):not(.is-disabled){color:var(--color-900);background:#f0e2c857}.xbec__button.x-variant-nav.x-active{color:var(--color-800);background:#e8c98a2e}.xbec__button.x-variant-nav.x-variant-strong{color:var(--color-800);background:#e8c98a33}@media (prefers-color-scheme:dark){.xbec__button.x-variant-nav{color:var(--color-dark-300)}.xbec__button.x-variant-nav:hover:not(:disabled):not(.is-disabled){color:var(--color-dark-50);background:#3d362899}.xbec__button.x-variant-nav.x-active{color:var(--color-dark-50);background:#fa912014}.xbec__button.x-variant-nav.x-variant-strong{color:var(--color-dark-50);background:#fa91201a}}.xbec__button.x-variant-menu-item{text-align:left;width:100%;color:var(--color-800);transition:background-color var(--transition-fast), color var(--transition-fast);background:0 0}.xbec__button.x-variant-menu-item:hover:not(:disabled):not(.is-disabled),.xbec__button.x-variant-menu-item:focus-visible,.xbec__button.x-variant-menu-item.x-active{color:var(--color-900);background:#f0e2c8b8;outline:none}@media (prefers-color-scheme:dark){.xbec__button.x-variant-menu-item{color:var(--color-dark-100)}.xbec__button.x-variant-menu-item:hover:not(:disabled):not(.is-disabled),.xbec__button.x-variant-menu-item:focus-visible,.xbec__button.x-variant-menu-item.x-active{color:var(--color-dark-50);background:#3d3628d1}}.xbec__button.x-variant-pill{background:var(--color-900);color:var(--color-50);padding:var(--space-2) var(--space-5);transition:background-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);border:none;border-radius:2rem;font-weight:600;box-shadow:0 1px 3px #1e1a141f}.xbec__button.x-variant-pill:hover:not(:disabled):not(.is-disabled){background:var(--color-800);transform:translateY(-.5px);box-shadow:0 2px 8px #1e1a142e}.xbec__button.x-variant-pill:active:not(:disabled):not(.is-disabled){transform:translateY(0);box-shadow:0 1px 2px #1e1a141f}.xbec__button.x-variant-pill.x-icon-only{border-radius:var(--radius-full);width:36px;padding:0}.xbec__button.x-variant-pill.x-icon-only.x-size-sm{width:28px}@media (prefers-color-scheme:dark){.xbec__button.x-variant-pill{background:var(--color-dark-100);color:var(--color-dark-900)}.xbec__button.x-variant-pill:hover:not(:disabled):not(.is-disabled){background:var(--color-dark-50)}}.xbec__button.x-variant-pill-light{color:var(--color-700);padding:var(--space-2) var(--space-5);transition:background-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);background:#f7f0e0b3;border:none;border-radius:2rem}.xbec__button.x-variant-pill-light:hover:not(:disabled):not(.is-disabled){background:#f0e2c8e6;transform:translateY(-.5px);box-shadow:0 2px 8px #1e1a141a}.xbec__button.x-variant-pill-light:active:not(:disabled):not(.is-disabled){transform:translateY(0);box-shadow:0 1px 2px #1e1a1414}.xbec__button.x-variant-pill-light.x-icon-only{border-radius:var(--radius-full);width:36px;padding:0}.xbec__button.x-variant-pill-light.x-icon-only.x-size-sm{width:28px}@media (prefers-color-scheme:dark){.xbec__button.x-variant-pill-light{color:var(--color-dark-200);background:#3d362899}.xbec__button.x-variant-pill-light:hover:not(:disabled):not(.is-disabled){color:var(--color-dark-50);background:#3d3628d9}}
