@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100..900&display=swap");

html {
    scroll-behavior: smooth;
}
body {
    font-family: "Poppins", sans-serif;
}

/* global.css */
:root {
    --primary-blue: #0057b7;
    --highlight-yellow: #ffd700;
    --sky-blue: #6eb5ff;
    --soft-yellow: #fff9b0;
    --accent-green: #a3ffae;
    --hot-pink: #ff5da2;
    --light-skyblue: #c7e6f4;
    --graycolor: #e7e5e4;
    --paratext: #7b7b7b;
    --headingcolor: #040e0d;
    --skyblue-active: #eef9ff;
    --skyblue-aborder: #c7e6f4;
    --bg-dashboard: #f6f8fc;
    --redbtn: #dc2626;
    --inputborder: #e7e5e4;
    --inputbg: #fafafa;
    --onbordingbottom: #737373;
    --searchbg: #f8f8f8;
    --searchtext: #5f5f5f;
}

/* Example of applying variables in classes */

/* Background colors */
.bg-primary-blue {
    background-color: var(--primary-blue);
}

.bg-highlight-yellow {
    background-color: var(--highlight-yellow);
}

.bg-sky-blue {
    background-color: var(--sky-blue);
}

.bg-soft-yellow {
    background-color: var(--soft-yellow);
}

.bg-accent-green {
    background-color: var(--accent-green);
}

.bg-hot-pink {
    background-color: var(--hot-pink);
}
.light-skyblue {
    background-color: var(--light-skyblue);
}

.bggray {
    background-color: var(--graycolor);
}
.bordergray {
    border: 1px solid var(--graycolor);
}
.light-skyblue-border {
    border: 1px solid var(--light-skyblue);
}

/* Text colors */
.text-primary-blue {
    color: var(--primary-blue);
}

.text-highlight-yellow {
    color: var(--highlight-yellow);
}

.placeholder13 {
    display: none;
}

.text-sky-blue {
    color: var(--sky-blue);
}

.text-soft-yellow {
    color: var(--soft-yellow);
}

.text-accent-green {
    color: var(--accent-green);
}
.headingcolor {
    color: var(--headingcolor);
}
.text-hot-pink {
    color: var(--hot-pink);
}
.paratext {
    color: var(--paratext);
}
.text_70 {
    color: rgba(4, 14, 13, 0.7);
}

/* Border colors */
.border-primary-blue {
    border-color: var(--primary-blue);
}

.border-highlight-yellow {
    border-color: var(--highlight-yellow);
}

.border-sky-blue {
    border-color: var(--sky-blue);
}

.border-soft-yellow {
    border-color: var(--soft-yellow);
}

.border-accent-green {
    border-color: var(--accent-green);
}

.border-hot-pink {
    border-color: var(--hot-pink);
}

/* Hover effects */
.hover\:bg-primary-blue:hover {
    background-color: var(--primary-blue);
}

.hover\:bg-highlight-yellow:hover {
    background-color: var(--highlight-yellow);
}

.hover\:bg-sky-blue:hover {
    background-color: var(--sky-blue);
}

.hover\:bg-soft-yellow:hover {
    background-color: var(--soft-yellow);
}

.hover\:bg-accent-green:hover {
    background-color: var(--accent-green);
}

.hover\:bg-hot-pink:hover {
    background-color: var(--hot-pink);
}
.skyblue_active {
    background-color: var(--skyblue-active);
}
.skyblue_aborder {
    border: 1px solid var(--skyblue-aborder);
}
.font12 {
    font-size: 12px;
}
.placeholder12::placeholder {
    font-size: 12px;
}

.inputborder {
    border: 1.59px solid var(--inputborder);
}
.inputbg {
    background-color: var(--inputbg);
}
.onbordingbottom {
    color: var(--onbordingbottom);
}
.redbg {
    background-color: var(--redbtn);
}
.redcolor {
    color: var(--redbtn);
}
.searchbg {
    background-color: var(--searchbg);
}
.searchtext {
    color: var(--searchtext);
}
.bg_dashboard {
    background-color: var(--bg-dashboard);
}
.customoutline {
    border: 1px solid #fff;
}
.customoutline2 {
    border: 1px solid #94a3b8;
}
.customcard:hover {
    background-color: var(--skyblue-active);
    border: 1px solid var(--skyblue-aborder);
}
.pagewidth {
    max-width: 1230px;
    padding-left: 15px;
    padding-right: 15px;
    width: 100%;
    margin: auto;
}
.onbodycontainer {
    max-width: 440px;
    width: 100%;
    margin: auto;
}
.contentbox {
    min-height: 720px;
}
.sec_title {
    font-family: "Poppins", sans-serif;
    font-size: 30px;
    font-weight: 600;
    color: #040e0d;
}
.subheading {
    font-size: 1rem;
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    color: rgba(4, 14, 13, 0.7);
}
.prograss_bar {
    width: 84%;
}
.sidebar-nav > a.active > svg path {
    fill: #fff !important;
}
/* .pri_group:hover .group-hover {
    color: #fff
  }
.pri_group:hover .group-hover2{
    color: rgba(255, 255, 255, 0.7)!important;
} */
.pri_group:hover .pri_groupbtn {
    background-color: #fff;
    color: var(--primary-blue);
}
.custom_shadow {
    box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.06);
}
.eye_toggle > svg {
    width: 20px;
}
.toggle-password-btn {
    top: 10%;
}
.cmpasword .toggle-password-btn {
    top: 35%;
}
.dashboard_header {
    z-index: 99999;
}
[x-cloak] {
    display: none;
}
.searchForm form {
    max-width: 275px;
    width: 275px;
}
.site_header.scrolled {
    position: fixed;
    top: 0;
    background-color: #fff;
    transition: box-shadow 0.5s ease;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    z-index: 99999;
}
.site_header.scrolled .lglink {
    border: 1px solid rgba(30, 58, 138, var(--tw-border-opacity));
}
.site_header.scrolled .lglink:hover {
    border: 1px solid transparent;
}
.site_header.scrolled .sulink:hover {
    border: 1px solid rgba(30, 58, 138, var(--tw-border-opacity));
}
.confirmpass .toggle-password-btn {
    top: 35%;
}
.faq_sec {
    min-height: 609px;
}
@media (max-width: 576px) {
    .contentbox {
        min-height: 600px;
    }
    .sec_title {
        font-size: 25px;
    }
}