.btn{text-transform:capitalize;cursor:pointer;letter-spacing:1px;border:none;border-radius:6px;justify-content:center;align-items:center;gap:10px;padding:12px 10px;display:flex}.btn.update,.icon-button.update{--main-color:#0ea5e9;--hover-color:#0284c7;--transparent-color:#0ea5e930}.btn.delete,.icon-button.delete{--main-color:#e61313;--hover-color:#8b2222;--transparent-color:#eb040423}.btn.save,.icon-button.save{--main-color:#1b944d;--hover-color:#19703d;--transparent-color:#1b944d1f}.btn.cancel,.icon-button.cancel{--main-color:#5a5a5a;--hover-color:#464646;--transparent-color:#5a5a5a21}.btn.transparent{background-color:var(--transparent-color);color:var(--main-color)}.btn.transparent:hover{background-color:var(--main-color);color:#fff}.btn.contained{background-color:var(--main-color);color:#fff;border:1px solid #0000}.btn.contained:hover{background-color:var(--hover-color)}.btn.outlined{border:solid 1px var(--main-color);color:var(--main-color);z-index:1;background-color:#0000;position:relative;overflow:hidden}.btn.outlined:hover{color:#fff}.btn.outlined:before{content:"";z-index:-1;transition:all .4s;position:absolute}.btn.outlined:hover:before{box-shadow:0 0 0 250px var(--main-color)}button.sending:disabled{opacity:.9}.btn.sending article{border:3px solid;border-radius:50%;width:15px;height:15px;animation:1s linear infinite loader;display:block}.btn.sending.contained article{border-color:#fff #fff #fff #9b9b9b}.btn.sending.outlined article{border-color:var(--btn-bg) var(--btn-bg) var(--btn-bg) #9b9b9b}.icon-button{cursor:pointer;width:40px;height:40px;color:var(--font-color);background-color:#0000;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:17px;display:flex;position:relative}.icon-button .icon-button-hover{color:#fff;opacity:0;pointer-events:none;z-index:1;background-color:#222;width:max-content;max-width:130px;padding:5px 6px;font-size:12px;position:absolute}.icon-button-hover.bottom{top:100%;left:50%;transform:translate(-50%)}.icon-button-hover.top{top:-85%;left:50%;transform:translate(-50%)}.icon-button-hover.rigth{top:50%;left:50px;transform:translateY(-50%)}.icon-button-hover.left{top:50%;right:45px;transform:translateY(-50%)}.icon-button:hover .icon-button-hover{opacity:1}.icon-button:not(.body-color,.secondry-color).contained{background-color:var(--main-color);color:#fff}.icon-button:not(.body-color,.secondry-color).contained:hover{background-color:var(--hover-color)}.icon-button:not(.body-color,.secondry-color).outlined{border:solid 2px var(--main-color);color:var(--main-color);background-color:#0000}.icon-button:not(.body-color,.secondry-color).outlined:hover{background-color:var(--main-color);color:#fff;border-color:#0000}.icon-button:not(.body-color,.secondry-color).transparent{background-color:var(--transparent-color);color:var(--main-color)}.icon-button:not(.body-color,.secondry-color).transparent:hover{background-color:var(--main-color);color:#fff}.icon-button.body-color{background-color:var(--body-color)}.icon-button.secondry-color{background-color:var(--section-color)}.icon-button:not(.main):hover{background-color:var(--border-color)}.icon-button-hover:before{content:"";background:#000;border-radius:50%;width:10px;height:10px;position:absolute}.icon-button-hover.bottom:before{top:-3px;left:50%;transform:translate(-50%)}.icon-button-hover.top:before{bottom:-3px;left:50%;transform:translate(-50%)}.icon-button-hover.left:before{top:50%;right:-3px;transform:translateY(-50%)}.icon-button-hover.right:before{top:50%;left:-3px;transform:translateY(-50%)}@media (width<=800px){.icon-button{width:30px;height:30px;font-size:14px}.icon-button .icon-button-hover{font-size:11px}.btn{letter-spacing:0;gap:8px 6px;padding:10px;font-size:13px}}@media (width<=500px){.icon-button{width:27px;height:27px;font-size:13px}.icon-button .icon-button-hover{font-size:10px}.btn{gap:6px 5px;padding:8px;font-size:11px}}