@import url("./custom-design.css");
@import url("../icons_custom/style.css");

/*==== Fonts ====*/

:root {
    --font-family-default: 'Nunito', Verdana, sans-serif;
    --font-family-default-display: 'Nunito', Verdana, sans-serif;
    --font-family-headings: 'Nunito', Verdana, sans-serif;
    --color-active-available: #35B768;
    --color-p-button-hover: #2D78F6;
    --color-p-button: #3E6DB5;
    --color-option-selected: #65A3D9;
    --color-text-dark: #131313;
    --color-text-highlight: #E63633;
    --color-text-light: #757575;
    --color-text-placeholder: #C8C8C8;
    --color-pupup-timer: #333333;
    --color-header-background: #F2F2F2;
    --color-main: rgba(234, 159, 150, 1);
    --color-main-hover: rgba(234, 159, 150, 100);
    --color-disabled: darkgray;
}

#loading {
    width: 4rem;
    height: 4rem;
    border: 5px solid #f3f3f3;
    border-top: 6px solid var(--color-main);
    border-radius: 100%;
    margin: auto;
    visibility: hidden;
    animation: spin 1s infinite linear;
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 999999999;
    transform: translate(-50%, -50%);
}
#loading.display {
    visibility: visible;
    display: block;
    
}

.disable-pointer{
    pointer-events: none;
}


.no-border{
    background-color: #35B768;
 
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.bg-main-color{
    --tw-bg-opacity: 1;
    background-color: rgb(0 0 0 / var(--tw-bg-opacity));
}
.bg-main-color:hover{
    --tw-bg-opacity: 1;
    background-color: var(--color-main-hover);
}

.text-color-main{
    color: var(--color-main);
}


.p-left-10{
    padding-left:10px !important;
  }
  
  .p-right-10{
    padding-right: 10px !important;
  }