@charset "UTF-8";

/*!
 * Version - 1.1.1
 * Copyright (c) 2026 2A Digital <info@2adigital.site>
 * L’autorisation est accordée à toute personne qui en obtient une copie de ce style.
 * Il est strictement interdit de publier(vendre) sans l'autorisation préalable des auteurs.
 * Des spécialistes sont à l'origine des documents fournis.
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css');
@import url('../vendor/bootstrap/css/bootstrap.min.css');
@import url('color.css?');
@import url('typography.css');

/*  ==========================================
*   ================= GENERAL ================
*/

*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    color: var(--dark);
    font-size: 0.875rem;
    font-family: var(--ff-source);
}

a {
    text-decoration: none !important;
    color: inherit;
}

.eyebrow-pill {
    --color: #022d1c;
    --bgcolor: rgba(134, 202, 163, 0.08);
    display: inline-block;
    background: var(--bgcolor);
    color: var(--color);
    font-size: 0.65rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 8px 18px;
    border-radius: 50px;
    font-weight: 600;
    margin-bottom: 20px;
}

/*  ==============================================
*   =================== CUSTOM ===================
*/

/*  ===========================
*   ======== 1. Header ========
*/
#mainHeader {
    position: fixed;
    top: 15px;
    left: 0;
    width: 100%;
    z-index: 9999;
    transition:
        top .45s cubic-bezier(.4, 0, .2, 1),
        padding .45s cubic-bezier(.4, 0, .2, 1),
        transform .45s cubic-bezier(.4, 0, .2, 1);
}

.header-container {
    max-width: 1280px;
    margin: auto;
    padding: 5px 0;
    transition: all .45s cubic-bezier(.4, 0, .2, 1);
}

.header-container .navbar {
    border-radius: 10px;
    background: #fffdf5;
    backdrop-filter: blur(18px);
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.029);
    transition: all .45s cubic-bezier(.4, 0, .2, 1);
}

#mainHeader.scrolled {
    top: 0;
}

#mainHeader.scrolled .header-container {
    max-width: 100%;
    padding: 0;
}

#mainHeader.scrolled .navbar {
    border-radius: 0;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .029);
}

#mainHeader .menu {
    font-size: 0.756rem;
    color: var(--dark-gray);
}

#mainHeader .menu .nav-link {
    --menu-text-color: var(--dark);
    color: var(--menu-text-color);
    text-transform: uppercase;
}

#mainHeader .menu .nav-link.active {
    --menu-text-color: var(--primary-shiny) !important;
    font-weight: 600;
}

#mainHeader .menu .nav-link:hover {
    --menu-text-color: var(--primary-shiny);
}

#mainHeader .menu .dropdown-item {
    font-size: 0.756rem;
    text-transform: uppercase;
}

/*  ===========================
*   ======== End Header ========
*/

/*  ===========================
*   ======== 2. Content ========
*/
.content {
    position: relative;
    justify-self: end;
    width: 100vw;
}

.form-control {
    --bs-body-color: var(--dark);
    --bs-border-color: #2525259d;
    font-size: 0.875rem;
}

/*  ===========================
*   ======== End Content ========
*/


/*  ===========================
*   ======== 3. Nav ========
*/
.sidebar {
    height: 100vh;
    width: 280px;
    background-color: var(--light);
    border-right: 1px solid #73737439;
}

.sidebar-logo {
    min-height: 68px;
    border-bottom: 1px solid #ebebeb;
    display: flex;
    align-items: center;
    background-color: inherit;
}

.sidebar .sidebar-title {
    color: var(--dark-primary);
    font-size: 13px;
}

.sidebar .nav-pills .nav-link {
    margin: 2px 0;
    transition: .25s all ease-in;
}

.sidebar .nav-pills .nav-link:not(.active) {
    color: #22262a;
}

.sidebar .nav-pills .nav-link.active,
.sidebar .nav-pills .show>.nav-link {
    --bs-nav-pills-link-active-color: var(--dark-secondary);
    /* --bs-nav-pills-link-active-bg: var(--light-secondary); */
    --bs-nav-pills-link-active-bg: #d1d2d5;
}

.sidebar .nav-pills .nav-link:not(.active):hover {
    color: var(--dark);
    /* background-color: #1e3a8a38; */
    background-color: #d1d2d5;
}

.sidebar .nav-pills .nav-link i {
    height: 25px;
    width: 25px;
    background-color: var(--gray);
    color: var(--dark-secondary);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    padding: 7px;
}

/*  ===========================
*   ======== End Nav ========
*/

/*  ==========================================
*   ================= FOOTER ================
*/

footer {
    background-color: #fff !important;
    border-top: 1px solid #022d1c14;
}

.footer-title {
    font-weight: 700;
    color: #fff;
    margin-bottom: 20px;
    text-transform: uppercase;
    font-size: 0.95rem;
    letter-spacing: 1px;
}

.footer-text {
    color: #2a2a2a;
    font-size: 0.95rem;
    line-height: 1.6;
}

.footer-contact li {
    margin-bottom: 12px;
    color: #2a2a2a;
    font-size: 0.95rem;
}

.footer-contact i {
    color: var(--secondary-dark);
}

.social-icons a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: rgba(2, 45, 28, 0.08);
    color: var(--secondary-dark);
    margin-right: 8px;
    transition: all 0.3s ease;
    text-decoration: none;
}

.social-icons a:hover {
    background: var(--secondary-dark);
    color: var(--dark);
    border: 1px solid var(--primary-dark);
}

.btn-subscribe {
    background: var(--secondary-dark);
    color: var(--light);
    border-radius: 0 50px 50px 0;
    padding: 10px 20px;
    transition: 0.3s;
}

.btn-subscribe:hover {
    background: #01412a;
}

.footer-bottom {
    border-top: 1px solid rgba(2, 45, 28, 0.08);
    color: #ffffff;
    font-size: 0.85rem;
    background: #141414;
}


/*  ===========================
*   ======== End Widget ========
*/

.sidebar::-webkit-scrollbar {
    width: 5px;
    background-color: #929292;
}

::selection {
    background-color: var(--primary-shiny);
    color: var(--dark);
}

:root {
    --primary: #00913e;
    --primary-dark: #00421d;
    --primary-shiny: #ff9f1c;
    --dark-gray: #1E1E1D;
    --dark: #000000;
    --danger: #830505;
    --light: #ffffff;
    --beige: #fffdf5;
    --gray: #2a2a2a;

    --ff-source: "Inter", sans-serif;
}