smart-webcomponents-react/source/styles/components/smart.powerbutton.css

[](https://jqwidgets.com/license/)

.smart-power-button{padding:0;border-radius:100%;display:inline-block;width:var(--smart-power-button-default-width);height:var(--smart-power-button-default-width)}.smart-power-button .smart-input{border-radius:100%;outline:0;width:100%;height:100%;min-width:var(--smart-power-button-default-width);min-height:var(--smart-power-button-default-width);background-color:var(--smart-background);border-style:solid;box-sizing:border-box;border-width:var(--smart-border-width);border-color:var(--smart-border);display:block;position:relative;overflow:hidden}.smart-power-button .smart-input:after{content:var(--smart-icon-power);width:100%;height:100%;font-family:smart-icons;font-style:normal;font-weight:400;font-size:20px;text-decoration:inherit;font-variant:normal;text-transform:none;display:flex;flex-wrap:wrap;align-items:center;justify-content:center}.smart-power-button .smart-container{cursor:pointer;height:100%;position:relative;display:flex}.smart-power-button .smart-animation{pointer-events:none}.smart-power-button[focus]{outline:0}.smart-power-button[focus] .smart-input{outline:0;border:var(--smart-border-width) solid var(--smart-ui-state-border-focus);background:var(--smart-ui-state-focus);color:var(--smart-ui-state-color-focus)}.smart-power-button:hover .smart-input{border:var(--smart-border-width) solid var(--smart-ui-state-border-hover);background:var(--smart-ui-state-hover);color:var(--smart-ui-state-color-hover);transition:background-color .1s linear}.smart-power-button:active .smart-input{border:var(--smart-border-width) solid var(--smart-ui-state-border-active);background:var(--smart-ui-state-active);color:var(--smart-ui-state-color-active);transition:background-color .1s linear}.smart-power-button[disabled] .smart-container{cursor:initial}.smart-power-button[checked] .smart-input{background-color:var(--smart-primary);color:var(--smart-primary)}.smart-power-button[checked] .smart-input:after{color:#fff}.smart-power-button[readonly].active .smart-input,.smart-power-button[readonly]:active .smart-input,.smart-power-button[readonly]:hover .smart-input{color:initial;border:var(--smart-border-width) solid var(--smart-button-border);background:var(--smart-button-background);transition:none}smart-power-button.active .smart-input{border:var(--smart-border-width) solid var(--smart-ui-state-border-active);background:var(--smart-ui-state-active);color:var(--smart-ui-state-color-active);transition:background-color .1s linear}smart-power-button.raised{box-shadow:var(--smart-elevation-2)}smart-power-button[right-to-left]>.smart-container>.smart-input{direction:rtl}