/* Custom Frontend Styles */

/* Change menu-top-area background to lighter green */
.menu-top-area {
    background: rgba(0, 36, 3, 0.85) !important;
}

/* Make text and icons white in top menu */
.menu-top-area .track-order-link,
.menu-top-area .track-order-link i,
.menu-top-area a,
.menu-top-area a i {
    color: #ffffff !important;
}

.menu-top-area .track-order-link:hover,
.menu-top-area a:hover {
    color: #ffffff !important;
    opacity: 0.8;
}

/* Marquee text animation */
.marquee-text-wrapper {
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
}

.marquee-text {
    display: inline-block;
    padding-left: 100%;
    animation: marquee 15s linear infinite;
    color: #ffffff;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%);
    }
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .marquee-text-wrapper {
        text-align: center;
    }
    
    .marquee-text {
        padding-left: 0;
        animation: none;
        display: block;
        text-align: center;
    }
}


/* Frontend Logo Sizing */
.site-branding .frontend-logo {
    max-height: 100px;
    width: auto;
    object-fit: contain;
}

/* Responsive logo sizing */
@media (max-width: 991px) {
    .site-branding .frontend-logo {
        max-height: 80px;
    }
}

@media (max-width: 576px) {
    .site-branding .frontend-logo {
        max-height: 60px;
    }
}


/* Topbar (Logo area) - Green background #002403 */
.site-header .topbar {
    background-color: #002403 !important;
}

.topbar {
    background-color: #002403 !important;
}


/* Make all icons and text white in topbar (logo area) */
.topbar,
.topbar .toolbar,
.topbar .toolbar-item,
.topbar .toolbar-item a,
.topbar .toolbar-item a div,
.topbar .toolbar-item a i,
.topbar .toolbar-item a span,
.topbar .text-label,
.topbar .search-box input,
.topbar .search-box button,
.topbar .search-box button i,
.topbar .search-box select,
.topbar .categoris {
    color: #ffffff !important;
}

/* Search box styling for white theme */
.topbar .search-box input::placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

.topbar .search-box input {
    background-color: rgba(255, 255, 255, 0.15) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
}

.topbar .search-box button {
    background-color: rgba(255, 255, 255, 0.15) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
}

.topbar .search-box select {
    background-color: rgba(255, 255, 255, 0.15) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
}

/* Count labels on cart/wishlist/compare */
.topbar .count-label {
    background-color: #ffffff !important;
    color: #002403 !important;
}

/* Mobile menu toggle */
.topbar .mobile-menu-toggle i {
    color: #ffffff !important;
}


/* Remove card/background from search button icon */
.topbar .search-box button,
.topbar .search-box .input-group-btn button {
    background-color: transparent !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 10px !important;
}

.topbar .search-box button:hover,
.topbar .search-box .input-group-btn button:hover {
    background-color: transparent !important;
    background: transparent !important;
}

/* Move search box down slightly */
.topbar .search-box-wrap,
.topbar .search-box-inner {
    margin-top: 8px !important;
}

/* Category dropdown - green background */
.topbar .search-box select option,
.topbar .categoris option {
    background-color: #002403 !important;
    color: #ffffff !important;
}

/* Select2 dropdown styling for category filter */
.select2-container--default .select2-results__option {
    background-color: #002403 !important;
    color: #ffffff !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: rgba(0, 36, 3, 0.8) !important;
    color: #ffffff !important;
}

.select2-container--default .select2-results {
    background-color: #002403 !important;
}

.select2-dropdown {
    background-color: #002403 !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
}

.select2-search--dropdown .select2-search__field {
    background-color: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
}

/* Categories menu dropdown - green background */
.site-header .menu .dropdown-menu,
.navbar .dropdown-menu,
.mega-dropdown-menu {
    background-color: #002403 !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
}

.site-header .menu .dropdown-menu .dropdown-item,
.navbar .dropdown-menu .dropdown-item,
.mega-dropdown-menu .dropdown-item,
.mega-dropdown-menu a {
    background-color: #002403 !important;
    color: #ffffff !important;
}

.site-header .menu .dropdown-menu .dropdown-item:hover,
.navbar .dropdown-menu .dropdown-item:hover,
.mega-dropdown-menu .dropdown-item:hover,
.mega-dropdown-menu a:hover {
    background-color: rgba(0, 36, 3, 0.8) !important;
    color: #ffffff !important;
}

/* Categories filter card - green background */
.left-category-area {
    background-color: #002403 !important;
}

.left-category-area .category-header {
    background-color: #002403 !important;
    color: #ffffff !important;
}

.left-category-area .category-header h4,
.left-category-area .category-header h4 i {
    color: #ffffff !important;
    background: #002403 !important;
}

.left-category-area .category-list {
    background-color: #002403 !important;
}

.left-category-area .c-item a,
.left-category-area .c-item .navi-link,
.left-category-area .c-item .navi-link span,
.left-category-area .c-item .text-gray-dark,
.left-category-area .view-all-category,
.left-category-area .view-all-category span {
    color: #ffffff !important;
}

.left-category-area .c-item a i,
.left-category-area .c-item .navi-link i {
    color: #ffffff !important;
}

.left-category-area .c-item a:hover,
.left-category-area .c-item .navi-link:hover,
.left-category-area .c-item a:hover span,
.left-category-area .c-item .navi-link:hover span,
.left-category-area .c-item a:hover .text-gray-dark,
.left-category-area .category-list .navi-link:hover span.text-gray-dark,
.left-category-area .view-all-category:hover,
.left-category-area .view-all-category:hover span {
    background-color: rgba(0, 36, 3, 0.8) !important;
    color: #FF6A00 !important;
}

.left-category-area .c-item a:hover i,
.left-category-area .c-item .navi-link:hover i {
    color: #FF6A00 !important;
}

.left-category-area .sub-c-box,
.left-category-area .child-c-box {
    background-color: #002403 !important;
}

.left-category-area .sub-c-box a,
.left-category-area .child-c-box a,
.left-category-area .child-c-box .title,
.left-category-area .category-list .sub-c-box .title,
.left-category-area .child-category a,
.left-category-area .category-list .sub-c-box .child-category a {
    color: #ffffff !important;
}

.left-category-area .sub-c-box a:hover,
.left-category-area .child-c-box a:hover,
.left-category-area .child-category a:hover,
.left-category-area .category-list .sub-c-box .child-category a:hover,
.left-category-area .category-list .sub-c-box .title:hover {
    background-color: rgba(0, 36, 3, 0.8) !important;
    color: #FF6A00 !important;
}


/* Notification icon before marquee text - moves with text */
.notification-icon-orange {
    color: #FF6A00 !important;
    font-size: 18px;
    margin-right: 10px;
    display: inline !important;
    vertical-align: middle;
}

/* Adjust marquee wrapper to accommodate icon */
/* Removed - already defined above */

/* Update marquee text to work with icon */
/* Removed - already defined above */


/* Remove border radius from topbar (logo header) */
.site-header .topbar,
.topbar {
    border-radius: 0 !important;
}

/* Remove border radius from any child elements in topbar */
.topbar * {
    border-radius: 0 !important;
}


/* Copyright section only - Green background with white text */
.site-footer .footer-copyright,
p.footer-copyright {
    background-color: #002403 !important;
    color: #ffffff !important;
    padding: 15px 0 !important;
    margin: 0 !important;
    border-top: none !important;
}

.site-footer .footer-copyright a,
p.footer-copyright a {
    color: #ffffff !important;
}

.site-footer .footer-copyright a:hover,
p.footer-copyright a:hover {
    color: #ffffff !important;
    opacity: 0.8;
}