@import "./Button.css";

.o-ui {
    --o-ui-icon-button-height-2xs: var(--o-ui-global-scale-echo);
    --o-ui-icon-button-height-xs: var(--o-ui-global-scale-foxtrot);
}

/* ICON BUTTON */
.o-ui-icon-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: max-content;
    height: max-content;
}

/* SIZES */
.o-ui-icon-button.o-ui-button-2xs {
    min-height: var(--o-ui-icon-button-height-2xs);
}

.o-ui-icon-button.o-ui-button-xs {
    min-height: var(--o-ui-icon-button-height-xs);
}

/* SIZES | ROUNDED */
.o-ui-icon-button.o-ui-button-rounded.o-ui-button-2xs {
    min-width: var(--o-ui-global-scale-echo);
}

.o-ui-icon-button.o-ui-button-rounded.o-ui-button-xs {
    min-width: var(--o-ui-global-scale-foxtrot);
}

.o-ui-icon-button.o-ui-button-rounded.o-ui-button-sm {
    min-width: var(--o-ui-global-scale-golf);
}

.o-ui-icon-button.o-ui-button-rounded.o-ui-button-md {
    min-width: var(--o-ui-global-scale-hotel);
}

/* SIZES | CIRCULAR */
.o-ui-icon-button.o-ui-button-circular.o-ui-button-2xs {
    min-width: var(--o-ui-global-scale-echo);
}

.o-ui-icon-button.o-ui-button-circular.o-ui-button-xs {
    min-width: var(--o-ui-global-scale-foxtrot);
}

/* LOADING */
.o-ui-icon-button.o-ui-button-loading.o-ui-button-2xs:before {
    width: 0.75rem;
    height: 0.75rem;
}

.o-ui-icon-button.o-ui-button-loading.o-ui-button-xs:before {
    width: 0.825rem;
    height: 0.825rem;
}

/* INHERIT */
.o-ui-button-inherit.o-ui-button-solid .o-ui-button-icon {
    fill: var(--o-ui-global-white);
    opacity: .9;
}

.o-ui-icon-button .o-ui-button-icon,
.o-ui-icon-button .o-ui-button-icon .o-ui-icon {
    color: inherit;
    fill: currentColor;
}