.card {
    box-shadow: rgb(0 0 0 / 5%) 0rem 1.25rem 1.6875rem 0rem;
    border-radius: 1rem;
    border: none;
}
/* Input */
.form-control {
    border-color: #d2d6da;
    border-radius: 8px;
}

.invalid-feedback {
    color: #ea0606;
}

.form-control:focus {
    border-color: #35d1f5;
    box-shadow: #81e3f9 0rem 0rem 0rem 0.125rem;
    outline: 0px;
}

.form-control.ng-invalid.ng-touched:focus{
    border-color: #fd5c70;
    box-shadow: rgb(253 92 112 / 60%) 0rem 0rem 0rem 0.125rem;
    outline: 0px;
}

.form-control.ng-invalid.ng-touched {
    /* border-color: #dc3545; */
    border-color: #fd5c70;
    padding-right: calc(1.5em + .75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23fd5c70' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23fd5c70' stroke='none'/%3e%3c/svg%3e");
    /* background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e"); */
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem)
}
/* Buttons */

.btn {    
    transition: all 150ms ease-in 0s;
    border-radius: 9px;
}

.btn:hover {
    transform: scale(1.02);
}

.btn-primary,
.btn-primary:hover,
.btn-light,
.btn-light:hover,
.btn-success,
.btn-success:hover,
.btn-secondary,
.btn-secondary:hover,
.btn-danger,
.btn-danger:hover,
.btn-warning,
.btn-warning:hover,
.btn-info,
.btn-info:hover,
.btn-dark,
.btn-dark:hover {
    background-color: none;
    border: none;
    border-color: none;
}

.btn-primary {    
    box-shadow: rgb(0 0 0 / 11%) 0rem 0.25rem 0.4375rem -0.0625rem, rgb(0 0 0 / 7%) 0rem 0.125rem 0.25rem -0.0625rem;    
    background-image: linear-gradient(310deg, rgb(121, 40, 202), rgb(255, 0, 128));
}

.btn-primary:hover {    
    box-shadow: rgb(0 0 0 / 9%) 0rem 0.1875rem 0.3125rem -0.0625rem, rgb(0 0 0 / 7%) 0rem 0.125rem 0.3125rem -0.0625rem;
}

.btn-light {
    color: #3a416f;
    box-shadow: rgb(0 0 0 / 11%) 0rem 0.25rem 0.4375rem -0.0625rem, rgb(0 0 0 / 7%) 0rem 0.125rem 0.25rem -0.0625rem;    
    background-image: linear-gradient(310deg, rgb(206, 212, 218), rgb(235, 239, 244));
    border: none;
}
.btn-light:hover {
    color: inherit;
    box-shadow: rgb(0 0 0 / 9%) 0rem 0.1875rem 0.3125rem -0.0625rem, rgb(0 0 0 / 7%) 0rem 0.125rem 0.3125rem -0.0625rem;
    border: none;       
}

.btn-success {
    box-shadow: rgb(0 0 0 / 11%) 0rem 0.25rem 0.4375rem -0.0625rem, rgb(0 0 0 / 7%) 0rem 0.125rem 0.25rem -0.0625rem;    
    background-image: linear-gradient(310deg, rgb(23, 173, 55), rgb(152, 236, 45));    
}

.btn-success:hover {
    box-shadow: rgb(0 0 0 / 9%) 0rem 0.1875rem 0.3125rem -0.0625rem, rgb(0 0 0 / 7%) 0rem 0.125rem 0.3125rem -0.0625rem;    
}

.btn-secondary {
    box-shadow: rgb(0 0 0 / 11%) 0rem 0.25rem 0.4375rem -0.0625rem, rgb(0 0 0 / 7%) 0rem 0.125rem 0.25rem -0.0625rem;    
    background-image: linear-gradient(310deg, rgb(98, 117, 148), rgb(168, 184, 216));    
}

.btn-secondary:hover {
    box-shadow: rgb(0 0 0 / 9%) 0rem 0.1875rem 0.3125rem -0.0625rem, rgb(0 0 0 / 7%) 0rem 0.125rem 0.3125rem -0.0625rem;    
}

.btn-danger {
    box-shadow: rgb(0 0 0 / 11%) 0rem 0.25rem 0.4375rem -0.0625rem, rgb(0 0 0 / 7%) 0rem 0.125rem 0.25rem -0.0625rem;    
    background-image: linear-gradient(310deg, rgb(234, 6, 6), rgb(255, 102, 124));    
}

.btn-danger:hover{
    box-shadow: rgb(0 0 0 / 9%) 0rem 0.1875rem 0.3125rem -0.0625rem, rgb(0 0 0 / 7%) 0rem 0.125rem 0.3125rem -0.0625rem;
}

.btn-warning{
    box-shadow: rgb(0 0 0 / 11%) 0rem 0.25rem 0.4375rem -0.0625rem, rgb(0 0 0 / 7%) 0rem 0.125rem 0.25rem -0.0625rem;    
    background-image: linear-gradient(310deg, rgb(245, 57, 57), rgb(251, 207, 51));
    color: #fff;
}

.btn-warning:hover {
box-shadow: rgb(0 0 0 / 9%) 0rem 0.1875rem 0.3125rem -0.0625rem, rgb(0 0 0 / 7%) 0rem 0.125rem 0.3125rem -0.0625rem;
color: #fff;
}

.btn-info {
    color: #fff;
    box-shadow: 0rem 0.25rem 0.4375rem -0.0625rem rgb(0 0 0 / 11%), 0rem 0.125rem 0.25rem -0.0625rem rgb(0 0 0 / 7%);        
    background: linear-gradient(310deg, #2152ff, #21d4fd);
}

.btn-info:hover {
    color: #fff;
    box-shadow: 0rem 0.1875rem 0.3125rem -0.0625rem rgb(0 0 0 / 9%), 0rem 0.125rem 0.3125rem -0.0625rem rgb(0 0 0 / 7%);
}

.btn-dark {
    box-shadow: rgb(0 0 0 / 11%) 0rem 0.25rem 0.4375rem -0.0625rem, rgb(0 0 0 / 7%) 0rem 0.125rem 0.25rem -0.0625rem;    
    background-image: linear-gradient(310deg, rgb(20, 23, 39), rgb(58, 65, 111));
}

.btn-dark:hover {
    box-shadow: rgb(0 0 0 / 9%) 0rem 0.1875rem 0.3125rem -0.0625rem, rgb(0 0 0 / 7%) 0rem 0.125rem 0.3125rem -0.0625rem;
}
