@font-face {
    font-family: 'Hellix';
    src: url('/website/assets/fonts/Hellix_Fonts/Hellix-Regular.woff2') format('woff2'),
    url('/website/assets/fonts/Hellix_Fonts/Hellix-Regular.woff') format('woff'),
    url('/website/assets/fonts/Hellix_Fonts/Hellix-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Hellix';
    src: url('/website/assets/fonts/Hellix_Fonts/Hellix-Bold.woff2') format('woff2'),
    url('/website/assets/fonts/Hellix_Fonts/Hellix-Bold.woff') format('woff'),
    url('/website/assets/fonts/Hellix_Fonts/Hellix-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Hellix';
    src: url('/website/assets/fonts/Hellix_Fonts/Hellix-Light.woff2') format('woff2'),
    url('/website/assets/fonts/Hellix_Fonts/Hellix-Light.woff') format('woff'),
    url('/website/assets/fonts/Hellix_Fonts/Hellix-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Hellix';
    src: url('/website/assets/fonts/Hellix_Fonts/Hellix-Medium.woff2') format('woff2'),
    url('/website/assets/fonts/Hellix_Fonts/Hellix-Medium.woff') format('woff'),
    url('/website/assets/fonts/Hellix_Fonts/Hellix-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Hellix';
    src: url('/website/assets/fonts/Hellix_Fonts/Hellix-SemiBold.woff2') format('woff2'),
    url('/website/assets/fonts/Hellix_Fonts/Hellix-SemiBold.woff') format('woff'),
    url('/website/assets/fonts/Hellix_Fonts/Hellix-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

*{ padding: 0;  margin: 0; box-sizing: border-box;}
body{ background-color: var(--white); overflow-x: hidden; font-family: 'Hellix', sans-serif;}

:root{
    --dark-green: #90D0AE;
    --light-green: #DAF1E2;
    --black: #4D4D4D;
    --green: #57B084;
    --white: #FFF;
    --badge-green: #B8E2C9;
    --table-light-bg: #F0F9F4;
    --icon-color: #359468;
    --search-icon:  #38373E;
    --black-txt: #696969;
    --card-border: #3DB87B;
    --gray-text: #949494;
}

.app-wrapper {background-color: var(--white);}

/* Scrollbar */

::-webkit-scrollbar{width:10px;background-color:transparent}
::-webkit-scrollbar-track{background-color:transparent}
::-webkit-scrollbar-thumb{background-color:#888;border-radius:20px}
::-webkit-scrollbar-thumb:hover{background-color: var(--light-green);}

/* Background */

.bg-lightgreen{background: var(--light-green);}
.bg-white{background-color: var(--white);}
.bg-tabs-light{background-color: var(--badge-green);}
.bg-tabs-dark{background-color: var(--green);}
.bg-light-div{background-color: var(--table-light-bg);}

/* Green-text */

.green-text{color: var(--green);}
.black-text{color: var(--black-txt) !important;}
.gray-text{color: var(--gray-text);}

/* Headings */

h1{font-size: 24px;}
h2{font-size: 20px;}
h3{font-size: 18px;}
h4{font-size: 16px;}
h5{font-size: 14px;}

.fs-40{font-size: 40px;}
.fs-30{font-size: 30px;}
.fs-25{font-size: 25px;}
.fs-24{font-size: 24px;}
.fs-20{font-size: 20px;}
.fs-18{font-size: 18px;}
.fs-14{font-size: 14px;}
.fs-16{font-size: 16px;}
.fs-10{font-size: 10px;}

.line-normal{line-height: 16px;}
.line-7{line-height: 8px}

/* Font Weights */

.bolder { font-weight: 900; }
.bold { font-weight: 700; }
.semibold { font-weight: 600; }
.medium { font-weight: 500; }
.regular { font-weight: 400; }
.light { font-weight: 300; }

/* Border */

.green-border{border: 1px solid var(--dark-green);}
.dark-green-border{border: 1px solid var(--card-border);}

/* Border Radius */

.br-radius-5{border-radius: 5px;}
.br-radius-10{border-radius: 10px;}
.br-radius-20{border-radius: 20px;}
.br-bottom{border-bottom: 1px solid var(--green) !important;}

/* Logo width */

.logo { height: 50px; width: 120px; object-fit: contain;}

/* Card */

.card{background: var(--white); box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.10);}
.card-border{border: 1px solid var(--card-border);}

.card2{background: var(--white); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.10);}
.boxx-shadow{box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.10);}

/* Tables Global*/

.table {border-collapse: separate !important; border-spacing: 0 10px !important; }
.table th {padding: 1.25rem;}
.table th, .table tbody td{padding-inline: 10px !important;}
.table th, .table tbody tr{border: 1px solid var(--light-green); font-size: 16px !important;}
.table thead {background-color: var(--green);  padding: 10px !important; color: var(--white);}
.table tbody tr:nth-child(odd) {background-color: var(--table-light-bg) !important;}
.table tbody tr:nth-child(even)  {background-color: var(--light-green) !important;}

/* Badges */

.badge{padding: 5px 20px; align-items: center;}
.badge-dark{background-color: var(--green);}
.badge-light{background-color: var(--badge-green); color: #38373E;}

/* Sidebar Icons */

img.app-sidebar-logo-default { height: 50px;}
.app-sidebar-logo { display: flex; justify-content: center; }
.cust-menu-icon i { color: var(--black);   font-size: 20px;}
[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link.active, [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link:hover {  background-color: var(--dark-green);}
[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-title, .menu-link.active i {color: var(--white);}
[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link:hover .menu-title, .menu-link:hover i {color: var(--white) !important;}

/* Buttons */

.green-btn,.green-btn1, .green-btn2 { padding: 5px 20px; background: var(--dark-green); border-radius: 8px; color: var(--white); width: fit-content; display: flex; justify-content: center;  align-items: center;   gap: 10px;}
.green-btn{padding: 5px 10px;}
.green-btn1 { padding: 10px 20px; }
.green-btn2 { padding: 10px; width: 180px;}
/*.btn .green-btn:hover{border: 1px solid var(--dark-green) !important; }*/
.dark-green-btn{background: var(--green); display: flex; padding: 8px 20px; align-items: center; border: 1px solid var(--white);  border-radius: 5px; color: var(--white);}
.light-green-btn{background-color: var(--badge-green); display: flex; padding: 10px 20px; align-items: center; gap: 15px;  color: var(--white); border-radius: 5px;}
.green-border-btn{border: 1px solid var(--green) !important; border-radius: 5px; padding:8px 20px; background-color: var(--white);}

.green-btn:hover,.green-btn1:hover, .green-btn2:hover{background-color: var(--white); color: var(--dark-green); border: 1px solid var(--dark-green); }
.dark-green-btn:hover{background-color: var(--white); color: var(--green); border: 1px solid var(--green) !important; }
.light-green-btn:hover{background-color: var(--white); color: var(--badge-green); border: 1px solid var(--badge-green) !important;}
.green-border-btn:hover{background-color: var(--green); color: var(--white); border: 1px solid var(--dark-green) !important; }
.dark-green-btn:hover i { color: var(--green) !important; }
.green-btn2:hover i { color: var(--green) !important; }

/* Index page */

.icon-box i { background: var(--white); padding: 12px; border-radius: 5px; color: var(--icon-color); font-size: 25px; }
.icon-box2 i {  color: var(--icon-color); padding: 10px 12px; font-size: 20px; border-radius: 10px; border: 1px solid #F4F4F4; background: var(--white); }

.line { border-left: 1px solid #E7E7E7;}

.business-img {width: 49px; height: 47px;}
.business-img1 {width: 62px; height: 70px;}

/* Search bar */

.search-icon i { position: absolute; top: 15px; left: 18px; font-size: 16px; right: 0; bottom: 0; color: var(--search-icon); width: fit-content;}
.search-form{border-radius: 8px; border: 1px solid var(--search-icon); background: var(--Black-White, #FFF);}
.search-form .form-control.form-control-solid::placeholder { font-size: 16px; color: var(--search-icon); font-weight: 400; }

.create-btn { display: flex; justify-content: flex-end; }
.create-btn i { color: var(--white); margin-inline: 5px; font-size: 15px; }

/*Tabs Styling*/

.business_tabs .nav-item .nav-link{border: 1px solid var(--badge-green); border-radius: 5px; padding: 8px 20px !important; background: var(--badge-green) !important; color: #4D4D4D;}
.business_tabs .nav-item .nav-link.active { border: 1px solid var(--green); border-radius: 5px; padding: 8px 20px !important; background: var(--green) !important; color: var(--white); }
.business_tabs .nav-tabs { border-bottom: unset;}

.users-tab i, .templates-filter i.funnel-filter { border: 1px solid var(--black); border-radius: 5px; padding: 12px 15px; font-size: 19px; color: var(--black);}

.campaign-tab .selection .select2-selection{border: 1px solid var(--green); padding: 15px; background-color: var(--white);}

.campaign-tab input[type="button"] { padding: 6px 12px; height: 22px; border: 1px solid #FFF; border-radius: 3px; background: #D9D9D9;}

input[type=checkbox] { accent-color: var(--badge-green);}

.modal-body .scanner-img{width: 352px; height: 352px;}

[type=button]:not(:disabled){outline: 0; border: 0;}

/*Business Input Image*/

.create_business .image-input [data-kt-image-input-action=change] { left: 68%; top: 16.5em; width: 172px;}
#edit_business_card  .image-input [data-kt-image-input-action=change] { left: 70%; top: 12em; width: 172px;}
.create_business i, .create_profile i, .templates-filter i {color: var(--white); font-size: 15px;}
.create_business .image-input [data-kt-image-input-action=remove], .create_business .image-input [data-kt-image-input-action=cancel], .image-input [data-kt-image-input-action=remove] {position: absolute; left: 16.5em; top: 16.5em; border: 1px solid green; background: #F0F9F4; color: black; width: 123px; padding: 7px; display: flex; justify-content: center;}
.create_business_form { padding-top:8em;}
.create_business .image-input-empty { background-image: url("../images/logo-placeholder.png"); background-size: contain; background-repeat: no-repeat; height: 125px;}

/*Profile Input Image*/

.create_profile .image-input-empty{ background-image:  url("../images/user_avatar.jpg"); border-radius: 50%; background-size: contain;}
.create_profile .image-input [data-kt-image-input-action=change] { left: 7em; top: 12em; width: 172px; z-index: 1;}
.create_profile .image-input [data-kt-image-input-action=remove], .create_profile .image-input [data-kt-image-input-action=cancel], .image-input [data-kt-image-input-action=remove] { position: absolute;  z-index: 1; left: 19em; top: 12em; border: 1px solid green; background: #F0F9F4; color: black; width: 123px; padding: 7px; display: flex; justify-content: center; }
.create_profile .image-input.image-input-outline .image-input-wrapper {  border-radius: 50%; margin: -3px;}

/*Forms*/

input[type="text"], input[type="email"], input[type="password"], input[type="number"], input, select {border: 1px solid green; padding: 10px; border-radius: 5px; outline:unset;}

textarea{border: 1px solid green; border-radius: 5px; outline: unset; resize: unset;}

.campaign-tab .dropdown-toggle { background: #FFF; border: 1px solid green !important; display: flex; justify-content: flex-start;}
.campaign-tab .dropdown-toggle::after {  margin-top: 8px; margin-left: 12px; color: var(--green);}

.border-block { border-block: 1px solid #F2F2F2; padding-top: 12px; }

.scroller { height: 450px; overflow-y: scroll; }

.unread { background: #DAF1E2; padding: 10px 2px; border-radius: 10px; }

/*Profile Setting Page*/

.eye_icon{position: relative;}
.eye_icon i { position: absolute; top: 50px; left: 73%; right: 0; bottom: 0; }
.app-sidebar-footer i {font-size: 25px;}
.app-sidebar-footer .bi-box-arrow-left{color: var(--white);}
.app-sidebar-footer { border-block: 1px solid rgba(77, 77, 77, 0.20);  padding-block: 2em !important; }

/*Modal SMS Template*/

.edit_schedule .modal-header, .edit_schedule .modal-footer {display: flex; justify-content: center; gap: 20px; border: unset;}
.modal-header, .modal-footer{border: unset;}
.edit_schedule  .modal-dialog {max-width: 50% !important;}
.close-bton i { border: 1px solid black; border-radius: 50%; color: black; margin: 2px; }

.success-img{width: 133px; height: 133px;}

/*.table {border-collapse: separate; border-spacing: 0;}*/
.table thead tr th:first-child {border-top-left-radius: 10px;}
.table thead tr th:last-child { border-top-right-radius: 10px;}
.table thead tr th:first-child { border-bottom-left-radius: 10px; }
.table thead tr th:last-child { border-bottom-right-radius: 10px; }
.table tbody tr td:first-child { border-top-left-radius: 10px; }
.table tbody tr td:last-child { border-top-right-radius: 10px; }
.table tbody tr td:first-child {border-bottom-left-radius: 10px;}
.table tbody tr td:last-child {border-bottom-right-radius: 10px;}

.select2-dropdown .select2-results__option.select2-results__option--selected { background-color: #FFF; color: green; outline: 0; }


/*Chart Styling*/

@keyframes chartjs-render-animation{from{opacity:.99}to{opacity:1}}
.chartjs-render-monitor{animation:chartjs-render-animation 1ms}
.chartjs-size-monitor,.chartjs-size-monitor-expand,.chartjs-size-monitor-shrink{position:absolute;direction:ltr;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1}
.chartjs-size-monitor-expand>div{position:absolute;width:1000000px;height:1000000px;left:0;top:0}
.chartjs-size-monitor-shrink>div{position:absolute;width:200%;height:200%;left:0;top:0}

.scrolltop, scrolltop:hover{background-color: var(--green) !important;}

/*Loader*/

.container-preloader {
    align-items:center;  display:flex; height:100%;
    justify-content:center; position:fixed;  width:100%; z-index:90000000;
}
.container-preloader .animation-preloader {z-index: 100;}
.container-preloader .loader-section {background-color: #ffffff;  height: 100%;position: fixed;  top: 0;  width: 100%}
.loaded .animation-preloader {opacity: 0;transition: 0.3s ease-out;}

.circles {width:200px; height:200px; position:relative; margin:auto;}
.circles > * { background-color:transparent; box-sizing:border-box; border:5px solid var(--green); border-top: 0 solid transparent; border-left: 0 solid transparent; border-radius: 50%; position:absolute; animation: spin 4s infinite linear alternate;}
.circle1 { width: 200px; height: 200px; animation-delay:-5s; border-color:var(--green); }
.circle2 { width: 180px; height: 180px; top:10px; left:10px; animation-delay:-4.9s; border-color:var(--green);}
.circle3 { width: 160px; height: 160px; top:20px; left:20px; animation-delay:-4.8s; border-color:var(--green);}
.circle4 { width: 140px; height: 140px; top:30px; left:30px; animation-delay:-4.7s; border-color:var(--green);}
.circle5 { width: 120px; height: 120px; top:40px; left:40px; animation-delay:-4.6s; border-color:var(--green);}
.circle6 { width: 100px; height: 100px; top:50px; left:50px; animation-delay:-4.5s; border-color:var(--green);}

.circle7 { width: 80px; height: 80px; top:60px; left:60px; animation-delay:-4.4s; border-color:var(--green);}
.circle8 { width: 60px; height: 60px; top:70px; left:70px; animation-delay:-4.3s; border-color:var(--green);}
.circle9 { width: 40px; height: 40px; top:80px; left:80px; animation-delay:-4.2s; border-color:var(--green);}
.circle10 { width: 20px; height: 20px; top:90px; left:90px; animation-delay:-4.1s; border-color:var(--green);}
.circle11 { width: 10px; height: 10px; top:100px; left:100px; animation-delay:-4s; border-color:var(--green);}

@keyframes spin { 0% {transform: rotate(0deg);} 100% {transform: rotate(360deg);} }

/*Select 2*/

.select2-container--bootstrap5 .select2-selection__clear {top: 34%;}

.sms-schedule .bi-pencil { border-bottom: 2px solid black; padding: 4px; cursor: pointer;  }
.sms-schedule i {color: var(--black);}

.create_profile { width: 135px; }
.create_profile_text {position: absolute; top: 2.4em; left: 0; right: 0; bottom: 0;}

/*Auth pages*/

.login-btn { display: flex; width: 262px; padding: 10px; justify-content: center; align-items: center; gap: 10px; border-radius: 10px; background: var(--dark-green); outline: unset; border: 1px solid var(--dark-green); }
.login-bg{background: rgba(87, 176, 132, 0.30); overflow-x: hidden;}
.login-column{height: 45em; margin: auto;}

a {color: black;}

/*Calendar Styling*/

.calendar-time{box-shadow: 0 3px 8px rgba(0, 0, 0, .25); border-radius: 12px; padding: 2em;}
.flatpickr-time {max-height: 50px; line-height: 44px;}
.calendar-time .form-label { font-size: 20px; font-weight: 600; }
.pignose-calendar { border-radius: 10px; padding-top: 6px;}
.calendar-time .form-control-solid.active, .calendar-time .form-control-solid {border: 1px solid var(--green); background: #FFF;     padding: 10px 13px;font-size: 20px;}
.calendar-time .flatpickr-time .flatpickr-am-pm { border: 1px solid green !important; border-radius: 5px; margin-inline: 4px; }
.pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-active a {background-color: var(--dark-green);}
.pignose-calendar .pignose-calendar-unit a {color: var(--green);}
.time-img {width: 200px; height: 210px;}


.campaign-tab input[type="radio"] { appearance: none; width: 8px; height: 8px; padding: 8px; border: 2px solid var(--badge-green); border-radius: 3px; background: transparent; cursor: pointer;transition: background 0.2s ease-in-out;}
.campaign-tab input[type="radio"]:checked {background: var(--badge-green);}

/*.campaign-tab input[type="radio"]{ appearance: none; height: 10px; padding: 8px; margin-top: 2px; }*/
/*.campaign-tab input[type="radio"]:checked, .scroller input[type="radio"] { background: var(--badge-green); }*/
/*.scroller input[type="radio"] { appearance: none; height: 10px; padding: 6px; margin-bottom: -2px; }*/

.chart select { border: 1px solid var(--dark-green); padding: 0px 12px; height: 30px; border-radius: 4px; font-size: 14px; font-weight: 700; }

.edit_business_card .bi-pencil { cursor: pointer;}

/*Cards Styling - inconsistent size*/

.linelimit-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; height: 75px; }

#toggle-password{cursor: pointer;}
.error { color: orangered; display: block; clear: both; }

.highlight {background: #FFF; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; border: 2px solid var(--card-border);}
.iti.iti--allow-dropdown.iti--separate-dial-code { width: 100%; border: 0.1px solid #0080000a; border-radius: 5px; outline: unset;}

.create_business .image-input.image-input-outline .image-input-wrapper {padding: 62px;}
.menu-sub-dropdown .table-menu-item {padding: 6px;}

.iti__flag-container {height: 42px;}

.form-control.is-invalid, .was-validated .form-control:invalid {background-image: unset;}

.login-bg #toggle-password{top: 22px;}