/* 1. Font Import */
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');

/* 2. Responsive Container */
@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1680px;
    }
}

/* 3. Global Variables */
:root {
    --hr-primary: #2D3A8D;
    --hr-secondary: #B59351;
    --hr-danger: #D30000;    
    --hr-success-bg-subtle: #FAFFFF;
    --hr-success-border-subtle: #BFEBD3;
    --hr-success-text-emphasis: #007249;
    --hr-danger-bg-subtle: #FFFAFA;
    --hr-danger-text-emphasis: #FF0000;
    --hr-danger-border-subtle: #EBBFBF;
    --hr-secondary-rgb: 181, 147, 81;
    --hr-primary-rgb: 45, 58, 141;
    --hr-danger-rgb: 211, 0, 0;
    --hr-success-rgb: 0, 114, 73;
    --hr-border-radius: 10px;
    --hr-border-color: #C1CBDA;
}

.fs-xxs {
    font-size: .5rem !important;
}

hr {
    opacity: 25% !important;
}

/* 4. Background Colors */
.bg-hr-light { background-color: #F5F4F9 !important; }
.bg-hr-light-secondary { background-color: #F0EFF4 !important; }
.bg-hr-f2 { background-color: #F2F2F2 !important; }
.bg-hr-f9 { background-color: #F9F9F9 !important; }
.bg-hr-gray { background-color: #C1CBDA !important; }
.bg-hr-pastel-purple { background-color: #FAF9FC !important; }

/* 5. Text Colors */
.text-hr-black { color: #131313 !important; }
.text-hr-gray { color: #C1CBDA !important; }
.text-primary { color: #2D3A8D !important; }
.text-hr-f5 { color: #F5F5F5 !important; }

/* 6. Button Styles */
.btn { height: 52px; }
.btn.h-secondary { height: 39px; }
.btn.huge { height: 84px; }
.btn.u-height { height: unset !important; }

.btn-primary,
.product-card .count-input:not(.collapsed) .product-card-button,
.product-card:hover .product-card-button,
[data-bs-theme=dark] .product-card:hover .product-card-button {
    --hr-btn-color: #fff;
    --hr-btn-bg: #2D3A8D;
    --hr-btn-border-color: #2D3A8D;
    --hr-btn-hover-bg: #4052c4;
    --hr-btn-hover-border-color: #4052c4;
    --hr-btn-active-bg: #4052c4;
    --hr-btn-disabled-bg: #C1CBDA;
}

.btn-secondary {
    --hr-btn-color: #fff;
    --hr-btn-bg: #B59351;
    --hr-btn-border-color: #B59351;
    --hr-btn-hover-color: #fff;
    --hr-btn-hover-bg: #947942;
    --hr-btn-disabled-bg: #947942;
}

.btn-outline-primary {
    --hr-btn-color: #2D3A8D;
    --hr-btn-border-color: #2D3A8D;
    --hr-btn-hover-color: #fff;
    --hr-btn-hover-bg: #2D3A8D;
    --hr-btn-hover-border-color: #2D3A8D;
    --hr-btn-focus-shadow-rgb: 245, 82, 102;
    --hr-btn-active-color: #fff;
    --hr-btn-active-bg: #2D3A8D;
    --hr-btn-active-border-color: #2D3A8D;
    --hr-btn-active-shadow: none;
    --hr-btn-disabled-color: #2D3A8D;
    --hr-btn-disabled-bg: transparent;
    --hr-btn-disabled-border-color: #2D3A8D;
    --hr-gradient: none;
}

.check-primary .btn-check:checked+.btn, .check-primary .btn.active, .check-primary .btn.show, .check-primary .btn:first-child:active, :not(.btn-check)+.btn:active { background-color: #2D3A8D;}

/* 7. Input Placeholder */
input::placeholder { color: #C1CBDA; font-size: 14px; }
.was-validated .form-control::placeholder { color: #D30000 !important; }

/* 8. Breadcrumbs */
.breadcrumb-item + .breadcrumb-item:before {
    color: #C1CBDA !important;
    content: var(--hr-breadcrumb-divider, url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' fill='%23C1CBDA' viewBox='0 0 24 24'><path d='M8.381 5.381a.874.874 0 0 1 1.237 0l6 6a.874.874 0 0 1 0 1.237l-6 6a.874.874 0 1 1-1.237-1.237L13.763 12 8.381 6.619a.874.874 0 0 1 0-1.237z'/></svg>"));
}

/* 9. Header Styling */
.header-ilan { padding: 15px 30px; height: 52px; border-radius: 10px; }

.header-search {
    max-width: 854px;
    width: 100%;
}
.header-search input { height: 52px; font-size: 14px; color: #131313; }
.header-search input::placeholder { font-size: 14px; color: #131313; }
.header-search i { font-size: 21px; color: #131313; right: 2% !important; }

.header-alert { height: 49px; }
.header-alert .alert-text { font-weight: 500; font-size: 14px; }

/* 10. Footer */
footer .grid {
    display: grid;
    grid-template-columns: minmax(200px, 1fr) minmax(500px, 3fr) minmax(150px, 1fr);
    gap: 5%;
}

/* 11. Mobile Bar */
.mobile-bar {
    height: 80px;
    display: flex;
    align-items: center;
    z-index: 9999;
}
.mobile-bar .contents {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
}
.mobile-bar .contents a {
    height: 40px;
    width: 62px;
}

/* 12. Sidebar & Logo */
.col-sidebar, .col-logo { flex: 0 0 254px !important; }

/* 13. Custom Heights */
.h-150px { height: 150px !important; }
.h-64px { height: 64px !important; }
.h-54px { height: 54px !important; }
.h-10px { height: 10px !important; }
.hw-40px { height: 40px !important; width: 40px !important;}
.hw-55px { height: 55px !important; width: 55px !important;}

/* 14. Border & Swiper */
.border-product { border: .5px solid #C1CBDA; }
.swiper-thumb.active, .swiper-thumb.swiper-slide-thumb-active { border-color: #2D3A8D; }

/* 15. Social Share */
ul.social-share { gap: 10px; }
ul.social-share li a {
    height: 24px;
    width: 24px;
    border: .25px solid #2D3A8D;
    border-radius: 50px;
    padding: 0;
    display: flex;
    justify-content: center;
}

/* 16. Cart Checkbox */
.cart-check .form-check-input { height: 36px; width: 36px; }
.cart-nav .nav-link.active { color: #131313 }
.cart-nav .nav-link { color: #C1CBDA }

/* 16. Cart Page */
.cart-grid {
    display: grid;
    grid-template-columns: 3fr 1fr;
    gap: 40px;
}

@media (max-width: 1200px) {
    .cart-grid {
        grid-template-columns: 2fr 1fr;
    }
}

@media (max-width: 768px) {
    .cart-grid {
        grid-template-columns: 1fr;
    }
}


/* 17. User Menu */
.list-group.user-menu button {
    height: 64px;
    background-color: #EDEBF64A;
    border: 0;
    border-bottom: .75px solid #EDEBF64A;
}

.list-group.user-menu .accordion-body {
    background-color: #EDEBF64A;
}

.list-group.user-menu .accordion-body li {
    border-bottom: .75px solid #EDEBF64A;
}

.list-group.user-menu button.active, 
.list-group.user-menu button:hover {
    background-color: #F0EAFB !important;
}

/* 18. Inputs */
.form-control:not(textarea.form-control), .form-select {height: 52px; --hr-form-control-border-color: #C1CBDA;}
.choices__item.choices__item--selectable {
    padding-top: 7px;
}

input[type="file"] {
    position: relative;
    overflow: hidden;
    background: url('data:image/svg+xml;utf8,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11 19H13V14.825L14.6 16.425L16 15L12 11L8 15L9.425 16.4L11 14.825V19ZM6 22C5.45 22 4.97917 21.8042 4.5875 21.4125C4.19583 21.0208 4 20.55 4 20V4C4 3.45 4.19583 2.97917 4.5875 2.5875C4.97917 2.19583 5.45 2 6 2H14L20 8V20C20 20.55 19.8042 21.0208 19.4125 21.4125C19.0208 21.8042 18.55 22 18 22H6ZM13 9V4H6V20H18V9H13Z" fill="%232D3A8D"/></svg>') no-repeat 10px center;
    background-size: 20px;
    padding-left: 40px;
    padding-top: 15px;
}

input[type="file"]::-webkit-file-upload-button {
    display: none;
}



/* 19. Inputs */

.active>.page-link, .page-link.active {
    background-color: #131313;
    border-color: #131313;
    color: #C1CBDA;
}

/* 20. Revenue Menu */

.revenue-menu {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.4s ease, opacity 0.4s ease;
    background-color: white;
}

.revenue-menu .list-group-item:first-child,
.revenue-menu {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
[data-collapse].active-collapse .revenue-menu {
    max-height: 500px;
    opacity: 1;
}

[data-collapse] {
    cursor: pointer;
}

[data-collapse] img {
    transition: transform 0.4s ease;
}

[data-collapse].active-collapse img {
    transform: translate(-50%, -50%) rotate(180deg) !important;
    transition: transform 0.4s ease;
}

[data-collapse].active-collapse {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

/* 21. Pagination */

ul.pagination {margin-top: 61px;}

/* 22. Hover Effect */

.hover-effect-show:hover .hover-effect-target {
    max-height: 500px;
    opacity: 1;
}



@media(min-width: 768px) {
    .hover-effect-show .hover-effect-target {
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        transition: max-height 0.4s ease, opacity 0.4s ease;
    }
}

/* 23. Rating */

.hover-effect-color-primary span,
.hover-effect-color-primary .card {
    transition: all 0.4s ease;
} 

.hover-effect-color-primary:hover .card{
    background-color:#2D3A8D !important
} 

.hover-effect-color-primary:hover span {
    color: white !important
} 

.hover-effect-color-primary:hover button {
    background: white !important;
    color: #2D3A8D;
} 

.rating input[type="radio"] {
    display: none;
}

.rating label {
    cursor: pointer;
    transition: transform 0.2s;
}

.rating label svg path {
    fill: #C1CBDA;
}

.rating input[type="radio"]:checked ~ label svg path,
.rating input[type="radio"]:checked + label svg path,
.rating input[type="radio"]:checked + label ~ label svg path {
    fill: #B59351;
}

.rating label:hover,
.rating label:hover ~ label {
    transform: scale(1.1);
}

/* 24. Profile */

img.profile-background {
    height: 250px;
    width: 100%;
    object-fit: cover;
}

.mt-n6 {
    margin-top: -5rem !important;
}


/* 24. Admin General */

@media (min-width: 1200px) {
    .navbar-vertical-aside-show-xl .navbar-vertical-aside {
        margin-left: 0;
    }

    .navbar-vertical.navbar-expand-xl {
        -ms-flex-flow: column;
        flex-flow: column;
    }

    body.has-navbar-vertical-aside main{
        padding: 60px;
        grid-area: content;
    }

    body.has-navbar-vertical-aside #footer {
        grid-area: footer;
    }

    body.has-navbar-vertical-aside #footer .container:not(body.has-navbar-vertical-aside #footer .copyright .container) {
        max-width: unset !important;
        padding: 60px;
    }

    body.has-navbar-vertical-aside #footer .copyright .container {
        max-width: unset !important;
        padding: 0 60px;
    }

    .navbar-vertical.navbar-bordered {
        border-width: 0 .0625rem 0 0;
    }

    .navbar-vertical.navbar {
        display: block;
        padding: 0;
    }

    .navbar-vertical-fixed {
        height: 100vh;
    }
    .navbar-bordered {
        border-width: 0 0 .0625rem 0;
        border-style: solid;
        border-color: rgba(231, 234, 243, .7);
    }
    
    .navbar-vertical-fixed .navbar-vertical-container {
        max-height: 100%;
    }
    
    
    .navbar-vertical-container {
        position: relative;
        height: 100%;
        min-height: 100%;
    }
    
    .navbar-content {
        padding: 60px;
    }

    body.has-navbar-vertical-aside.navbar-vertical-aside-show-xl {
        display: grid;
        grid-template-columns: 320px 1fr;
        grid-template-rows: auto auto;
        grid-template-areas:
            "aside content"
            "footer footer";
        min-height: 100vh;
    }
    
}

.navbar-content ul li{
    border-color:#c1cbda25 !important;
}

.navbar-content ul a {
    font-weight: 400;
    color: #131313;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 0;
}

.navbar-content ul a.active,
.navbar-content ul a:hover {
    font-weight: 600;
}

.navbar-content ul a svg path{
    fill: #B59351;
}

.navbar-content ul a.active svg path,
.navbar-content ul a:hover svg path{
    fill: #2D3A8D !important;
    
}