.smi {
    border: 1px solid;
    border-radius: 10px;
    box-shadow: 4px 4px 4px rgba(0,0,0,0.25);
}

    .smi.lesser {
        box-shadow: 2px 2px 2px rgba(0,0,0,0.15) !important;
    }

    .smi.pointer {
        cursor: pointer;
    }

    .smi.active {
        box-shadow: inset 4px 4px 4px rgba(0,0,0,0.25);
    }

    .smi:disabled {
        opacity: 0.7;
        box-shadow: inset 4px 4px 4px rgba(0,0,0,0.25);
    }


button.smi:focus {
    outline: none;
}

button.smi:focus-visible {
    outline: none;
}

button.smi:focus-within {
    outline: none;
}

.toggle-button.smi {
    border: 1px solid;
    border-radius: 10px;
    box-shadow: 0px 4px 1px rgba(0,0,0,0.5);
    transition: 0.08s linear;
}

    .toggle-button.smi.pressed {
        box-shadow: 0px 1px 0px rgba(0,0,0,0.5);
        transform: translate(0px, 3px);
    }

.smi.no-active {
    background-color: inherit;
    box-shadow: inherit;
}


.borc-dg {
    border-color: var(--sam-dark-gray);
}