@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');

body {font-family: "Rubik", sans-serif;background-color: #F4F7FA;}
:root {
  --primary-color: #832D49;
  --secondary-color: #34DAD7;
  --yellow: #F1C54C;
  --off-black: #120D26;
  --font-12: 12px;
  --font-14: 14px;
  --font-18: 18px;
  --font-24: 24px;
  --font-16: 16px;
}
h1,h2,h3,h4,h5,h6 {color: var(--off-black);}
a:hover {text-decoration: none;}
a {display: inline-block;color: inherit;text-decoration: none;}
p:nth-last-child(1) {margin: 0;}
button:focus{box-shadow: none!important;border:none;}
ul,
ol {margin: 0;padding: 0;}
button, button:focus, input:focus, .form-control:focus, .form-select:focus, .form-check-input:focus {outline: 0;box-shadow: none;}
.btn_meroon{box-shadow: 0px 10px 35px 0px #6F7EC940;font-size: 16px;font-weight: 500;border-radius: 15px;height:52px;background-color:var(--primary-color);color:#fff;line-height: 52px;padding: 0px}
.btn_meroon:hover{background-color:var(--off-black);}
.mt-20{margin-top:20px;}
.mt-30{margin-top:30px;}
.mt-40{margin-top:40px;}
.mt-50{margin-top:50px;}
.mt-60{margin-top:60px;}
.mb-20{margin-bottom:20px;}
.mb-30{margin-bottom:30px;}
.mb-40{margin-bottom:40px;}
.mb-50{margin-bottom:50px;}
.mb-60{margin-bottom:60px;}
/*Left Menu*/
.intersight_menu {background-color: #fff;border-right:1px solid #EDF0F4;padding: 20px;max-width: 280px;height: 100vh;position: fixed;width: 100%;left: 0;top: 0;}
.brand .brand-logo img { height: 39px;}
.menu_div {margin-top: 25px;}
.menu_div li.without_label {font-size: 12px;font-weight: 600;color: #454545B2;text-transform: uppercase;padding: 25px 10px 10px;}
.menu_div ul {list-style-type: none;}
.menu_div li a {color: #111827;width: 100%;height: 40px;border-radius: 10px;padding: 10px 10px;display: flex;align-items: center;gap: 12px;margin-bottom: 6px;font-size: 14px;font-weight: 400;position:relative;}
.menu_div li a.active, .menu_div li a:hover {background: rgb(131 45 73 / 10%);color: var(--primary-color);font-weight: 500;}
.menu_div li a.active svg path, .menu_div li a:hover svg path {fill: var(--primary-color);}
.menu_div li a span {position: relative;top: -1px;}
.bottom_menu {position: absolute;bottom: 20px;left: 0;right: 0;padding: 0px 20px;}
.bottom_menu .dropdown{border-top:1px solid #EDF0F4;padding-top:20px;}
.bottom_menu .dropdown button {padding: 0;background: transparent;color: #000000; font-size: 14px;font-weight: 500;text-align: left;gap: 12px;}
.bottom_menu .dropdown .dropdown-menu li .dropdown-item {color: #111827;font-size: var(--font-14);padding: 4px 10px;display: block;height: auto;}
.person_icon {background: var(--yellow);width: 40px;height: 40px;border-radius: 50%;flex: 0 0 40px;}
.person_name span {font-size: 13px;color: #454545;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;width: 150px;}
.contact-profile {padding: 0px 25px 25px;}
.intersight_content {position: relative;width: calc(100% - 280px);margin-left: auto;}
.top_header {margin-bottom: 25px;padding: 12px 25px;border-bottom: 1px solid #EDF0F4;background: #fff;}
.form_sec {max-width: 535px;margin: auto;flex-direction: column;gap: 20px;margin-top: 25px;}
.password_svg svg {position: absolute;bottom: 12px;right: 12px;}
.brand button {font-size: var(--font-14);text-align: left;gap: 10px;position: relative;background: transparent;}
.brand button span.d-flex {width: 42px;height: 42px;border-radius: 50%;background-color: var(--primary-color);}
.brand_dashboard span{font-size: 13px;display: block;text-transform: uppercase;font-weight: 500;color: #9CA3AF;}
.brand_dashboard h6{margin: 0px;font-size: 14px;}
.brand{border-bottom: 1px solid #EDF0F4;padding-bottom: 15px;}
/*Login*/
.login_image{background:url(../image/login_bg.png) no-repeat center center/cover;height: 96vh;border-radius: 20px;}
.brand_name{max-width: 470px;margin: 80px auto 0;text-align: center;}
.brand_name p{color:#fff;line-height: 24px;}
.brand_name span{background: linear-gradient(90deg, rgba(241, 197, 76, 0) 0%, #F1C54C 50%, rgba(241, 197, 76, 0) 100%);width:296px;height:2px;display: block;margin: 30px auto;}

.login-form{box-shadow: 0px 4px 24px 0px #0000000D;border-radius: 20px;padding:40px 30px;background:#fff;max-width:530px;width:100%;margin:0 auto;}
.logo_heading h1{font-size: 24px;font-weight: 500;color:var(--off-black);}
.logo_heading p{color:#555;}
.form_sec .form-check input{width:20px;height:20px;border-radius: 6px;}
.form_sec .form-check-label{font-size: 14px;}
.form-control{background-color:#FBFCFD;border:1px solid #E2E6EC;border-radius: 12px;height:52px;font-size: 14px;}
.form-group.with_icon img{position: absolute;top: 15px;left: 12px;}
.form-group.with_icon input, .form-group.with_icon textarea{padding-left: 40px;}
.form-group.with_icon textarea{padding-top:15px;}
.form-group.with_icon img.password_eye{left: auto;right: 12px;}
.back_arrow{width: 47px;height: 47px;border: 1px solid #ddd;border-radius: 50%;position: absolute;top: 20px;left: 20px;}
.back_arrow:hover{background-color:#E2E6EC;}
.pagination{font-size: 14px;color:#9CA3AF;}
.pagination span{font-weight: 500;color:var(--off-black);}
.user_header{gap: 8px;background: #F7F8FA;border: 1px solid #EDF0F4;border-radius: 30px;font-size: 14px;font-weight: 500;padding: 0px 15px 0px 6px;height: 44px;}
.user_header span{width: 30px;height: 30px;background: var(--yellow);display: flex;align-items: center;justify-content: center;border-radius: 50%;flex: 0 0 30px;}
.btn-close{background: none;opacity: 1;position: absolute;right: 18px; top: 13px;}
.small_popup h2{font-size: 24px;}
.small_popup input{border: none;border-bottom: 1px solid #D9D9D9;max-width: 48px;text-align: center;font-size: 20px;}
.small_popup input:focus{border-bottom: 1px solid #262626;}
.small_popup input::placeholder{color:#000;}
.small_popup .modal-content{border-radius: 20px;}
.small_popup .modal-content .modal-body {padding:40px 50px;}
.small_popup .form-group{    margin: 40px 0px 30px;}
.link{font-weight: 500;color:#16A4A3;}
.small_popup{max-width:480px;}
.scroll_div{border-top: 1px dashed #ddd;border-bottom: 1px dashed #ddd;padding: 20px 0px;margin: 20px 0px;max-height: calc(100vh - 500px);overflow: auto;}
.scroll_div h5{font-size: 15px;color: #4B5563;margin-bottom: 3px;}
.scroll_div p{font-size: 14px;color: #4B5563;line-height: 22px;}
.custom_checkbox label{color:#555;}
.custom_checkbox label a{color:#000;}
.custom_checkbox input{width:20px;height:20px;}
.text-gray{color:#555;}
@media (max-width: 1400px) {
	.login-form{padding: 30px;}
	.form_sec{gap:15px;}
	.login_image{height: 95vh;}
	.brand_name img{max-height: 110px;}
	.brand_name{margin: 50px auto 0;}
	.brand_name span{margin: 20px auto;}
}