
/* =====================================================================================
+++++++++++++++++++++++++++++ Single Color Buttons ++++++++++++++++++++++++++++++++++
===================================================================================== */

.btn, a.btn {
    font-weight: 500 !important;
    font-size: 1.6rem !important;
    line-height: 1.5 !important;
    padding: 0.7rem 3.2rem !important;
    transition: all 0.4s ease-in-out !important;
    border-radius: 20px;
  }

  .btn-check:focus+.btn, .btn:focus{
    box-shadow: none !important;
  }
  
  .btn-primary, a.btn-primary {
    background: var(--primary) !important;
    border: 1px solid var(--primary) !important;
    color: var(--white) !important;
  }
  
  .btn-secondary, a.btn-secondary {
    background: var(--secondary) !important;
    border: 1px solid var(--secondary) !important;
    color: var(--white) !important;
  }
  
  .btn-tertiary, a.btn-tertiary {
    background: var(--tertiary) !important;
    border: 1px solid var(--tertiary) !important;
    color: var(--white) !important;
  }
  
  .btn-animation {
    position: relative;
    box-shadow: inset 0 0 0px 0px rgba(0, 0, 0, 0.1215686275) !important;
  }

  .btn-animation:hover, .btn-animation:focus, .btn-animation:active, .btn-animation.hover {
    box-shadow: inset 0 50px 0px 0px rgba(0, 0, 0, 0.1215686275) !important;
  }

  /* =====================================================================================
+++++++++++++++++++++++++++++ Outlined Buttons ++++++++++++++++++++++++++++++++++
===================================================================================== */
  
  .btn-outline-primary {
    border: 1px solid var(--primary) !important;
    color: var(--primary) !important;
    background: transparent !important;
  }

  .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.hover {
    border-color: var(--primary) !important;
    background: var(--primary) !important;
    color: var(--white) !important;
  }
  
  .btn-outline-secondary {
    border: 1px solid var(--secondary) !important;
    color: var(--secondary) !important;
    background: transparent !important;
  }

  .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active, .btn-outline-secondary.active, .btn-outline-secondary.hover {
    border-color: var(--secondary) !important;
    background: var(--secondary) !important;
    color: var(--white) !important;
  }
  
  .btn-outline-tertiary {
    border: 1px solid var(--tertiary) !important;
    color: var(--tertiary) !important;
    background: transparent !important;
  }

  .btn-outline-tertiary:hover, .btn-outline-tertiary:focus, .btn-outline-tertiary:active, .btn-outline-tertiary.active, .btn-outline-tertiary.hover {
    border-color: var(--tertiary) !important;
    background: var(--tertiary) !important;
    color: var(--white) !important;
  }

/* =====================================================================================
+++++++++++++++++++++++++++++ Link Buttons ++++++++++++++++++++++++++++++++++
===================================================================================== */
  
  .btn-link {
    color: var(--primary) !important;
    text-decoration: none !important;
    padding: 0 5px !important;
    background: transparent !important;
    border: 0px !important;
  }
  .btn-link.underline {
    text-decoration: underline !important;
  }


  .btn-xs {padding: 0.2rem 0.3rem;}
  .btn-sm {padding: 0.28rem 0.32rem;}
  .btn-md {padding: 0.3rem 0.4rem;}
  .btn-lg {padding: 0.4rem 0.5rem;}
  .btn-xl {padding: 0.5rem 0.6rem;}
  .btn-xxl {padding: 0.8rem 1rem;}

  .refresh-icon {
    border-radius: 10px;
    border: 1px solid var(--primary);
    background: var(--white);
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 37px;
}
/* =====================================================================================
+++++++++++++++++++++++++++++ Font Size and Weight ++++++++++++++++++++++++++++++++++
===================================================================================== */

  .fs-inherit {font-size: inherit;}.fs-10 {font-size: 1rem;}.fs-11 {font-size: 1.1rem;}.fs-12 {font-size: 1.2rem;}.fs-13 {font-size: 1.3rem;}.fs-14 {font-size: 1.4rem;}.fs-15 {font-size: 1.5rem;}
  .fs-16 {font-size: 1.6rem;}.fs-17 {font-size: 1.7rem;}.fs-18 {font-size: 1.8rem;}.fs-19 {font-size: 1.9rem;}.fs-20 {font-size: 2rem;}.fs-21 {font-size: 2.1rem;}.fs-22 {font-size: 2.2rem;}
  .fs-23 {font-size: 2.3rem;}.fs-24 {font-size: 2.4rem;}.fs-25 {font-size: 2.5rem;}.fs-26 {font-size: 2.6rem;}.fs-27 {font-size: 2.7rem;}.fs-28 {font-size: 2.8rem;}.fs-29 {font-size: 2.9rem;}
  .fs-30 {font-size: 3rem;}.fs-31 {font-size: 3.1rem;}.fs-32 {font-size: 3.2rem;}.fs-33 {font-size: 3.3rem;}.fs-34 {font-size: 3.4rem;}.fs-35 {font-size: 3.5rem;}.fs-36 {font-size: 3.6rem;}
  .fs-37 {font-size: 3.7rem;}.fs-38 {font-size: 3.8rem;}.fs-39 {font-size: 3.9rem;}.fs-40 {font-size: 4rem;}.fs-41 {font-size: 4.1rem;}.fs-42 {font-size: 4.2rem;}.fs-43 {font-size: 4.3rem;}
  .fs-44 {font-size: 4.4rem;}.fs-45 {font-size: 4.5rem;}.fs-46 {font-size: 4.6rem;}.fs-47 {font-size: 4.7rem;}.fs-48 {font-size: 4.8rem;}.fs-49 {font-size: 4.9rem;}.fs-50 {font-size: 5rem;}
  .fs-51 {font-size: 5.1rem;}.fs-52 {font-size: 5.2rem;}.fs-53 {font-size: 5.3rem;}.fs-54 {font-size: 5.4rem;}.fs-55 {font-size: 5.5rem;}.fs-56 {font-size: 5.6rem;}.fs-57 {font-size: 5.7rem;}
  .fs-58 {font-size: 5.8rem;}.fs-59 {font-size: 5.9rem;}.fs-60 {font-size: 6rem;}.fs-61 {font-size: 6.1rem;}.fs-62 {font-size: 6.2rem;}.fs-63 {font-size: 6.3rem;}.fs-64 {font-size: 6.4rem;}
  .fs-65 {font-size: 6.5rem;}.fs-66 {font-size: 6.6rem;}.fs-67 {font-size: 6.7rem;}.fs-68 {font-size: 6.8rem;}.fs-69 {font-size: 6.9rem;}.fs-70 {font-size: 7rem;}.fs-71 {font-size: 7.1rem;}
  .fs-72 {font-size: 7.2rem;}.fs-73 {font-size: 7.3rem;}.fs-74 {font-size: 7.4rem;}.fs-75 {font-size: 7.5rem;}.fs-76 {font-size: 7.6rem;}.fs-77 {font-size: 7.7rem;}.fs-78 {font-size: 7.8rem;}
  .fs-79 {font-size: 7.9rem;}.fs-80 {font-size: 8rem;}.fs-81 {font-size: 8.1rem;}.fs-82 {font-size: 8.2rem;}.fs-83 {font-size: 8.3rem;}.fs-84 {font-size: 8.4rem;}.fs-85 {font-size: 8.5rem;}
  .fs-86 {font-size: 8.6rem;}.fs-87 {font-size: 8.7rem;}.fs-88 {font-size: 8.8rem;}.fs-89 {font-size: 8.9rem;}.fs-90 {font-size: 9rem;}.fs-91 {font-size: 9.1rem;}.fs-92 {font-size: 9.2rem;}
  .fs-93 {font-size: 9.3rem;}.fs-94 {font-size: 9.4rem;}.fs-95 {font-size: 9.5rem;}.fs-96 {font-size: 9.6rem;}.fs-97 {font-size: 9.7rem;}.fs-98 {font-size: 9.8rem;}.fs-99 {font-size: 9.9rem;}
  .fs-100 {font-size: 10rem;}

  .font-light{font-weight: 300;} .font-regular{font-weight: 400;} .font-semilight{font-weight: 500;} .font-semibold{font-weight: 600;}
  .font-bold{font-weight: 700;} .font-black{font-weight: 800;}

/* =====================================================================
+++++++++++++++++++++++++++++ Width ++++++++++++++++++++++++++++++++++
======================================================================== */

.w-0-pt {width: 0% !important;}.w-1-pt {width: 1%;}.w-2-pt {width: 2%;}.w-3-pt {width: 3%;}.w-4-pt {width: 4%;} .w-5-pt {width: 5%;}.w-6-pt {width: 6%;}.w-7-pt {width: 7%;}.w-8-pt {width: 8%;}.w-9-pt {width: 9%;}
.w-10-pt {width: 10%;}.w-11-pt {width: 11%;}.w-12-pt {width: 12%;}.w-13-pt {width: 13%;}.w-14-pt {width: 14%;}.w-15-pt {width: 15%;}.w-16-pt {width: 16%;}.w-17-pt {width: 17%;}.w-18-pt {width: 18%;}
.w-19-pt {width: 19%;}.w-20-pt {width: 20%;}.w-21-pt {width: 21%;}.w-22-pt {width: 22%;}.w-23-pt {width: 23%;}.w-24-pt {width: 24%;}.w-25-pt {width: 25%;}.w-26-pt {width: 26%;}.w-27-pt {width: 27%;}
.w-28-pt {width: 28%;}.w-29-pt {width: 29%;}.w-30-pt {width: 30%;}.w-31-pt {width: 31%;}.w-32-pt {width: 32%;}.w-33-pt {width: 33%;}.w-34-pt {width: 34%;}.w-35-pt {width: 35%;}.w-36-pt {width: 36%;}
.w-37-pt {width: 37%;}.w-38-pt {width: 38%;}.w-39-pt {width: 39%;}.w-40-pt {width: 40%;}.w-41-pt {width: 41%;}.w-42-pt {width: 42%;}.w-43-pt {width: 43%;}.w-44-pt {width: 44%;}.w-45-pt {width: 45%;}
.w-46-pt {width: 46%;}.w-47-pt {width: 47%;}.w-48-pt {width: 48%;}.w-49-pt {width: 49%;}.w-50-pt {width: 50%;}.w-51-pt {width: 51%;}.w-52-pt {width: 52%;}.w-53-pt {width: 53%;}.w-54-pt {width: 54%;}
.w-55-pt {width: 55%;}.w-56-pt {width: 56%;}.w-57-pt {width: 57%;}.w-58-pt {width: 58%;}.w-59-pt {width: 59%;}.w-60-pt {width: 60%;}.w-61-pt {width: 61%;}.w-62-pt {width: 62%;}.w-63-pt {width: 63%;}
.w-64-pt {width: 64%;}.w-65-pt {width: 65%;}.w-66-pt {width: 66%;}.w-67-pt {width: 67%;}.w-68-pt {width: 68%;}.w-69-pt {width: 69%;}.w-70-pt {width: 70%;}.w-71-pt {width: 71%;}.w-72-pt {width: 72%;}
.w-73-pt {width: 73%;}.w-74-pt {width: 74%;}.w-75-pt {width: 75%;}.w-76-pt {width: 76%;}.w-77-pt {width: 77%;}.w-78-pt {width: 78%;}.w-79-pt {width: 79%;}.w-80-pt {width: 80%;}.w-81-pt {width: 81%;}
.w-82-pt {width: 82%;}.w-83-pt {width: 83%;}.w-84-pt {width: 84%;}.w-85-pt {width: 85%;}.w-86-pt {width: 86%;}.w-87-pt {width: 87%;}.w-88-pt {width: 88%;}.w-89-pt {width: 89%;}.w-90-pt {width: 90%;}
.w-91-pt {width: 91%;}.w-92-pt {width: 92%;}.w-93-pt {width: 93%;}.w-94-pt {width: 94%;}.w-95-pt {width: 95%;}.w-96-pt {width: 96%;}.w-97-pt {width: 97%;}.w-99-pt {width: 99%;}.w-100-pt {width: 100%;}


/* ========================================================================
++++++++++++++++++++ Text, Border, Background color ++++++++++++++++++++++++
========================================================================== */ 

.text_primary {color: var(--primary) !important;}.text_secondary {color: var(--secondary);}.text-tertiary {color: var(--tertiary);}.text-grey {color: var(--grey);}.text-light-grey {color: var(--light-grey);}
.text-white {color: var(--white);}.text-dark {color: var(--dark);}.text-black {color: var(--dark);} .text-red {color: var(--red);} .text-mid-grey {color: var(--mid-grey);}

.bg_primary {background-color: var(--primary);}.bg-primary-light {background-color: var(--primary-light);}.bg_secondary {background-color: var(--secondary);}
.bg-secondary-light {background-color: var(--secondary-light);}.bg-tertiary {background-color: var(--tertiary);}.bg-tertiary-light {background-color: var(--tertiary-light);}
.bg-dark {background-color: var(--dark);}.bg-black {background-color: var(--dark);}.bg-mid-dark {background-color: var(--mid-dark);}.bg-grey {background-color: var(--grey);}
.bg-light-grey {background-color: var(--light-grey);}.bg-white {background-color: var(--white);} .bg-red {background-color: var(--red);} .bg-mid-grey {background-color: var(--mid-grey);}

.border_primary {border-color: var(--primary) !important;}.border-primary-light {border-color: var(--primary-light);}.border_secondary {border-color: var(--secondary);}
.border-secondary-light {border-color: var(--secondary-light);}.border-tertiary {border-color: var(--tertiary);}.border-tertiary-light {border-color: var(--tertiary-light);}
.border-dark {border-color: var(--dark);}.border-black {border-color: var(--dark);}.border-mid-dark {border-color: var(--mid-dark);}.border-grey {border-color: var(--grey);}
.border-light-grey {border-color: var(--light-grey);}.border-white {border-color: var(--white);} .border-red {border-color: var(--red);} .border-mid-grey {border-color: var(--mid-grey);}

.hover-primary:hover {color: var(--primary) !important;}.hover-secondary:hover {color: var(--secondary) !important;}.hover-tertiary:hover {color: var(--tertiary) !important;}.hover-grey:hover {color: var(--grey) !important;}
.hover-light-grey:hover {color: var(--light-grey) !important;} .hover-white:hover {color: var(--white) !important;}.hover-dark:hover {color: var(--dark) !important;}.hover-black:hover {color: var(--dark) !important;} 
.hover-red:hover {color: var(--red) !important;} .text-mid-grey:hover {color: var(--mid-grey) !important;}
/* ========================================================================
+++++++++++++++++++++++++++++++Custom Scrollbar ++++++++++++++++++++++++++++
========================================================================== */

  .custom_scrollbar {overflow-x: auto; max-height: 180px;}
  .custom_scrollbar::-webkit-scrollbar-track {
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: #F0F0F0;
    -webkit-background-color: #F0F0F0;
    -moz-background-color: #F0F0F0;
    cursor: pointer;
  }
  .custom_scrollbar::-webkit-scrollbar {
    width: 10px;
    -webkit-width: 10px;
    -moz-width: 10px;
    background-color: var(--primary);
    -webkit-background-color: var(--primary);
    -moz-background-color: var(--primary);
  }
  .custom_scrollbar::-webkit-scrollbar {
    width: 10px;
    background-color: #F0F0F0;
    border-radius: 10px;
    -webkit-width: 10px;
    -moz-width: 10px;
    -webkit-background-color: #F0F0F0;
    -moz-background-color: #F0F0F0;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
  }
  .custom_scrollbar::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: var(--primary);
    -webkit-background-color: var(--primary);
    -moz-background-color: var(--primary);
  }

  /* =========Select Scrollbar ============ */
  .select_scrollbar {overflow-x: auto; max-height: 180px;}
  .select_scrollbar::-webkit-scrollbar-track {
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: #F0F0F0;
    -webkit-background-color: #F0F0F0;
    -moz-background-color: #F0F0F0;
    cursor: pointer;
  }
  .select_scrollbar::-webkit-scrollbar {
    width: 10px;
    -webkit-width: 10px;
    -moz-width: 10px;
    background-color: var(--mid-grey);
    -webkit-background-color: var(--mid-grey);
    -moz-background-color: var(--mid-grey);
  }
  .select_scrollbar::-webkit-scrollbar {
    width: 10px;
    background-color: #F0F0F0;
    border-radius: 10px;
    -webkit-width: 10px;
    -moz-width: 10px;
    -webkit-background-color: #F0F0F0;
    -moz-background-color: #F0F0F0;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
  }
  .select_scrollbar::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: var(--mid-grey);
    -webkit-background-color: var(--mid-grey);
    -moz-background-color: var(--mid-grey);
  }

  /* Global Scrollbar */
  html::-webkit-scrollbar {
    width: 5px;
  }
  html::-webkit-scrollbar-thumb {
    background: var(--primary);
    border-radius: 10px;
  }
  html::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px #e1e1e1;
    border-radius: 10px;
  }

/* ========================================================================
+++++++++++++++++++++++++++++++ Custom Class +++++++++++++++++++++++++++++
========================================================================== */ 

.shadow-none, .shadow-none:focus {box-shadow: none !important;}
.outline-none {outline: none !important;}
.after-none::after {content: ''; display: none !important;}
.before-none::after {content: ''; display: none !important;}
.cursor-pointer{cursor: pointer;}
.d-inherit{display: inherit;}
.d-contents{display: contents;}
.bg-none{background: none !important;}
.hr-1{border: 1px solid #E1E1E1;}.hr-2{border: 2px solid #E1E1E1;}

.rounded-5{border-radius: 5px;} .rounded-6{border-radius: 6px;} .rounded-7{border-radius: 7px;} .rounded-8{border-radius: 8px;} .rounded-9{border-radius: 9px;}
.rounded-10{border-radius: 10px;} .rounded-11{border-radius: 11px;} .rounded-12{border-radius: 12px;} .rounded-13{border-radius: 13px;} .rounded-14{border-radius: 14px;}
.rounded-15{border-radius: 15px;}

.rotate-left-to-right{transform: rotate(180deg);}
.rotate-left-to-top{transform: rotate(90deg);}
.rotate-left-to-bottom{transform: rotate(-90deg);}