/* <!-- <----------- root start -----------> */
:root{
    --main: 220,0,25;
    --primary: 26,24,24;
    --white: 255,255,255;
    --black: 0,0,0;
    --box-border: 207,207,207;
    --grey-dark: 121,121,121;
    --wapper-bg: 250,250,250;
    --table-border: 235,235,235;
    --table-thead-bg: 244,253,255;
    --search-bar-border: 239,239,239;
    --upload-container-border: 202,202,202
}
/* <!-- <----------- root end -----------> */

h1,h2,h3,h4,h5,h6,p{
    margin-bottom: 0;
}


/* <!-- <----------- color start -----------> */
.main-color{
    color: rgba(var(--main));
}
.primary-color{
    color: rgba(var(--primary));
}
.grey-dark-color{
    color: rgba(var(--grey-dark));
}
.wapper-bg-color{
    color: rgba(var(--wapper-bg));
}
.box-border-color{
    border-color: rgba(var(--box-border)) !important;
}
.main-border-color{
    border-color: rgba(var(--main)) !important;
}
.table-border-color{
    border-color: rgba(var(--table-border)) !important;
}
/* <!-- <----------- color end -----------> */

/* <!-- <----------- background color start -----------> */
.main-bg{
    background-color: rgba(var(--main));
}
.primary-bg{
    background-color: rgba(var(--primary));
}
.box-border-bg{
    background-color: rgba(var(--box-border));
}
.grey-dark-bg{
    background-color: rgba(var(--grey-dark));
}
.wapper-bg{
    background-color: rgba(var(--wapper-bg));
}
.table-border-bg{
    background-color: rgba(var(--table-border));
}
/* <!-- <----------- background color end -----------> */

/* <!-- <----------- font start -----------> */
.poppins-reg-11{
    font-size: 11px;
    font-weight: 400;
}
.poppins-semi-11{
    font-size: 11px;
    font-weight: 600;
}


.poppins-reg-12{
    font-size: 12px;
    font-weight: 400;
}
.poppins-reg-13{
    font-size: 13px;
    font-weight: 400;
}
.poppins-med-13{
    font-size: 13px;
    font-weight: 500;
}
.poppins-semi-13{
    font-size: 13px;
    font-weight: 600;
}


.poppins-reg-14{
    font-size: 14px;
    font-weight: 400;
}
.poppins-med-14{
    font-size: 14px;
    font-weight: 500;
}
.poppins-semi-14{
    font-size: 14px;
    font-weight: 600;
}



.poppins-reg-16{
    font-size: 16px;
    font-weight: 400;
}
.poppins-med-16{
    font-size: 16px;
    font-weight: 500;
}
.poppins-semi-16{
    font-size: 16px;
    font-weight: 600;
}
.poppins-bold-16{
    font-size: 16px;
    font-weight: 700;
}



.poppins-semi-18{
    font-size: 18px;
    font-weight: 600;
}



.poppins-bold-20{
    font-size: 20px;
    font-weight: 700;
}



.poppins-bold-32{
    font-size: 32px;
    font-weight: 700;
}
/* <!-- <----------- font end -----------> */


/* <!-- <----------- button start -----------> */
.btn-bar{
    text-wrap: nowrap;
    gap: 5px;
    border: 1px solid transparent;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    transition: 0.3s ease-in-out;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -ms-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
}
.default-btn{
    padding: 5px 10px;
    font-size: 13px;
    font-weight: 600;
}
.btn-1x{
    padding: 5px 10px;
    font-size: 16px;
    font-weight: 600;
}
.fill-btn:hover{
    background-color: transparent !important;
}
.fill-btn.main-bg:hover{
    border-color: rgba(var(--main)) !important;
}
.fill-btn.main-bg:hover span{
    color: rgba(var(--main)) !important;
}
.fill-btn.main-bg:hover .icon-bar svg path{
    fill: rgba(var(--main)) !important;
}
.fill-opacity-btn{
    background-color: rgba(var(--main), 10%) !important;
}
.fill-btn.fill-opacity-btn:hover{
    border-color: rgba(var(--main)) !important;
}
.fill-btn.fill-opacity-btn:hover .icon-bar svg path{
    fill: rgba(var(--main)) !important;
}
.main-border-btn{
    border-color: rgba(var(--main)) !important;
}
/* <!-- <-----------  button end -----------> */


/* <!-- <----------- scrollbar start -----------> */
/* width */
::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

/* Track */
::-webkit-scrollbar-track {
    background: rgba(var(--table-border));
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
    background: rgba(var(--box-border));
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: rgba(var(--main)); 
}
/* <!-- <----------- scrollbar end -----------> */

/* <!-- <----------- input type=number arrow hide start -----------> */
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}
/* <!-- <----------- input type=number arrow hide end -----------> */