.p-color{color: #40547c;}
.color-1{color: #111827;}
.color-2{color: #6b7280;}
.color-3{color: #065f46;}
.fw-500{font-weight: 500;}
.uppercase{text-transform: uppercase;}
.capitalize{text-transform: capitalize;}
.blur{backdrop-filter: blur(3px);}
.blur-background{width: 100%;height: 100vh;}

/* Snack Bar */
.snackbar-box{min-width: 280px;max-width: 500px;border-radius: 6px;width: 100%;text-align: center;color: #fff;padding: 12px 12px;position: fixed;z-index: 10;margin: auto;bottom: 12px;font-size: 15px;left: 50%;transform: translate(-50%, 0);visibility: hidden;}
.show-snackbar{visibility: visible;-webkit-animation: fadein 0.5s, fadeout 0.5s 1.0s;animation: fadein 0.5s, fadeout 0.5s 1.0s;}
@-webkit-keyframes fadein {from {bottom: 0px; opacity: 0;} to {bottom: 12px; opacity: 1;}}
@keyframes fadein {from {bottom: 0px; opacity: 0;}to {bottom: 12px; opacity: 1;}}
@-webkit-keyframes fadeout {from {bottom: 12px; opacity: 1;} to {bottom: 0px; opacity: 0;}}
@keyframes fadeout {from {bottom: 12px; opacity: 1;}to {bottom: 0px; opacity: 0;}}


.toast-box{min-width: 300px;max-width: 500px;border-radius: 6px;text-align: center;color: #fff;padding: 12px 16px;position: fixed;display: inline-flex;z-index: 3;margin: auto;bottom: 12px;font-size: 15px;left: 50%;transform: translate(-50%, 0);background-color: #ff5057;visibility: hidden;}
.toast-text{line-height: 24px;margin-left: 8px;font-size: 14px;}
.toast-action-button{float: right;text-align: right;right: 16px;position: absolute;border: 1px solid rgb(255 255 255 / 50%);border-radius: 4px;padding: 2px 8px;font-size: 12px;font-weight: 500;line-height: 18px;cursor: pointer;background-color: rgb(255 255 255 / 9%);}