/* SarvCloud Icons v4.1 — proportional, responsive inline SVG icons */

/*
 * Important: every SVG wrapper gets an explicit size.
 * This prevents the browser's default SVG intrinsic size (300x150px)
 * from stretching menu items and header controls.
 */
.sc-svg-icon,
.sc-menu-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    line-height: 1 !important;
    color: currentColor;
    vertical-align: middle;
    box-sizing: border-box !important;
}

.sc-menu-icon {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
    flex-basis: 18px !important;
    padding: 0 !important;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.sc-svg-icon:not(.sc-menu-icon) {
    width: 1em !important;
    height: 1em !important;
    min-width: 1em !important;
    min-height: 1em !important;
    max-width: 1em !important;
    max-height: 1em !important;
    flex-basis: 1em !important;
}

.sc-svg-icon > svg,
.sc-menu-icon > svg,
svg.sc-svg-icon,
svg.sc-menu-icon {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 100% !important;
    max-height: 100% !important;
    flex: none !important;
    overflow: visible;
    stroke: currentColor;
    box-sizing: border-box !important;
}

/* Main navigation */
#Primary_Navbar > li > a,
.navbar-main .navbar-nav > li > a,
header .navbar-nav > li > a,
.main-navbar-wrapper .navbar-nav > li > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 7px !important;
}

#Primary_Navbar > li > a > .sc-menu-icon,
.navbar-main .navbar-nav > li > a > .sc-menu-icon,
header .navbar-nav > li > a > .sc-menu-icon,
.main-navbar-wrapper .navbar-nav > li > a > .sc-menu-icon {
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
    min-height: 26px !important;
    max-width: 26px !important;
    max-height: 26px !important;
    flex-basis: 26px !important;
    padding: 5px !important;
    border: 1px solid rgba(13, 148, 136, .10) !important;
    border-radius: 8px !important;
    color: #087f75;
    background: rgba(13, 148, 136, .075);
    transition: transform .18s ease, background-color .18s ease, color .18s ease;
}

#Primary_Navbar > li:hover > a > .sc-menu-icon,
#Primary_Navbar > li.active > a > .sc-menu-icon,
#Primary_Navbar > li > a.sc-current-link > .sc-menu-icon,
.navbar-main .navbar-nav > li:hover > a > .sc-menu-icon,
.main-navbar-wrapper .navbar-nav > li:hover > a > .sc-menu-icon {
    color: #fff;
    background: linear-gradient(135deg, #0f766e, #0891b2);
    border-color: transparent !important;
    transform: translateY(-1px);
}

/* Header utility links: cart, login, language, search controls */
#header .sc-menu-icon,
header.header .sc-menu-icon,
.header .sc-menu-icon,
.top-nav .sc-menu-icon,
.master-breadcrumb .sc-menu-icon {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
    flex-basis: 18px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}

/* Re-apply compact boxed icons only to the actual primary navbar. */
#header #Primary_Navbar > li > a > .sc-menu-icon,
header.header #Primary_Navbar > li > a > .sc-menu-icon,
#header .main-navbar-wrapper .navbar-nav > li > a > .sc-menu-icon,
header.header .main-navbar-wrapper .navbar-nav > li > a > .sc-menu-icon {
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
    min-height: 26px !important;
    max-width: 26px !important;
    max-height: 26px !important;
    flex-basis: 26px !important;
    padding: 5px !important;
    border: 1px solid rgba(13, 148, 136, .10) !important;
    border-radius: 8px !important;
    background: rgba(13, 148, 136, .075) !important;
}

/* Dropdowns, tabs and sidebars */
.dropdown-menu a,
.dropdown-menu .dropdown-item,
.panel-sidebar .list-group-item,
.sidebar .list-group-item,
.list-group a.list-group-item,
.nav-tabs .nav-link,
.client-home-panels .panel-title a {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
}

.dropdown-menu a > .sc-menu-icon,
.dropdown-menu .dropdown-item > .sc-menu-icon,
.panel-sidebar .list-group-item > .sc-menu-icon,
.sidebar .list-group-item > .sc-menu-icon,
.list-group a.list-group-item > .sc-menu-icon,
.nav-tabs .nav-link > .sc-menu-icon,
.client-home-panels .panel-title a > .sc-menu-icon {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    max-width: 20px !important;
    max-height: 20px !important;
    flex-basis: 20px !important;
    padding: 3px !important;
    border: 1px solid rgba(15, 118, 110, .08) !important;
    border-radius: 6px !important;
    color: #0f766e;
    background: rgba(15, 118, 110, .055) !important;
}

.dropdown-menu a:hover > .sc-menu-icon,
.dropdown-menu .dropdown-item:hover > .sc-menu-icon,
.panel-sidebar .list-group-item:hover > .sc-menu-icon,
.sidebar .list-group-item:hover > .sc-menu-icon,
.list-group a.list-group-item:hover > .sc-menu-icon {
    color: #0369a1;
    background: rgba(14, 165, 233, .09) !important;
}

/* Homepage icon proportions */
.sc3-home .sc-svg-icon:not(.sc-menu-icon) {
    width: 1.08em !important;
    height: 1.08em !important;
    min-width: 1.08em !important;
    min-height: 1.08em !important;
    max-width: 1.08em !important;
    max-height: 1.08em !important;
    flex-basis: 1.08em !important;
}

.sc3-card-icon .sc-svg-icon,
.sc3-card-icon > svg {
    width: 27px !important;
    height: 27px !important;
    min-width: 27px !important;
    min-height: 27px !important;
    max-width: 27px !important;
    max-height: 27px !important;
    flex-basis: 27px !important;
}

.sc3-step-icon .sc-svg-icon,
.sc3-step-icon > svg {
    width: 23px !important;
    height: 23px !important;
    min-width: 23px !important;
    min-height: 23px !important;
    max-width: 23px !important;
    max-height: 23px !important;
    flex-basis: 23px !important;
}

.sc3-ai-symbol .sc-svg-icon,
.sc3-ai-symbol > svg {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    max-width: 38px !important;
    max-height: 38px !important;
    flex-basis: 38px !important;
}

.sc3-brand-tags .sc-svg-icon,
.sc3-hero-points .sc-svg-icon,
.sc3-btn .sc-svg-icon,
.sc3-card-link .sc-svg-icon,
.sc3-text-link .sc-svg-icon {
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    min-height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
    flex-basis: 16px !important;
}

.sc3-card-icon,
.sc3-step-icon,
.sc3-ai-symbol {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden;
}

/* Direction-aware arrows */
html[dir="rtl"] .sc-arrow-directional,
html.sc3-dir-rtl .sc-arrow-directional {
    transform: scaleX(-1);
}

/* Hide replaced Font Awesome placeholders */
.sc-svg-replaced > i[class*="fa-"],
i.sc-icon-hidden {
    display: none !important;
}

/* Safety net: no injected SVG icon may ever become a large card. */
a .sc-menu-icon,
button .sc-menu-icon,
.nav-link .sc-menu-icon,
.dropdown-item .sc-menu-icon {
    aspect-ratio: 1 / 1 !important;
    overflow: visible !important;
}

@media (max-width: 991.98px) {
    #Primary_Navbar > li > a,
    .navbar-main .navbar-nav > li > a,
    header .navbar-nav > li > a,
    .main-navbar-wrapper .navbar-nav > li > a {
        width: 100%;
        justify-content: flex-start;
    }

    #Primary_Navbar > li > a > .sc-menu-icon,
    .navbar-main .navbar-nav > li > a > .sc-menu-icon,
    header .navbar-nav > li > a > .sc-menu-icon,
    .main-navbar-wrapper .navbar-nav > li > a > .sc-menu-icon {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        max-width: 24px !important;
        max-height: 24px !important;
        flex-basis: 24px !important;
        padding: 4px !important;
    }
}

@media (max-width: 575.98px) {
    .sc-menu-icon {
        width: 17px !important;
        height: 17px !important;
        min-width: 17px !important;
        min-height: 17px !important;
        max-width: 17px !important;
        max-height: 17px !important;
        flex-basis: 17px !important;
    }

    #Primary_Navbar > li > a > .sc-menu-icon,
    .navbar-main .navbar-nav > li > a > .sc-menu-icon,
    header .navbar-nav > li > a > .sc-menu-icon,
    .main-navbar-wrapper .navbar-nav > li > a > .sc-menu-icon {
        width: 23px !important;
        height: 23px !important;
        min-width: 23px !important;
        min-height: 23px !important;
        max-width: 23px !important;
        max-height: 23px !important;
        flex-basis: 23px !important;
        padding: 4px !important;
    }
}