/* ============================================================
   CODSHIPX AI CRM R30-R3-R2
   Active icon fix + submenu alignment + light topbar
============================================================ */

/* ------------------------------------------------------------
   A. SUBMENU ALIGNMENT / WIDTH
------------------------------------------------------------ */

.rail-nav .cxr29-submenu{
    padding: 2px 10px 6px 18px !important;
}

.rail-nav .cxr29-child{
    width: calc(100% - 2px) !important;
    max-width: calc(100% - 2px) !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 4px 0 !important;
    padding: 4px 10px !important;
    gap: 9px !important;
    border-radius: 12px !important;
}

/* ------------------------------------------------------------
   B. ACTIVE CHILD ICON MUST STAY VISIBLE
------------------------------------------------------------ */

.rail-nav .cxr29-child::before{
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 16px 16px !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 1 !important;
}

.rail-nav .cxr29-child.active::before,
.rail-nav .cxr29-child.is-active::before,
.rail-nav .cxr29-child[aria-current="page"]::before{
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 16px 16px !important;
    opacity: 1 !important;
    visibility: visible !important;
    color: transparent !important;
    background-color: #14384a !important;
    border-color: rgba(183,237,78,.36) !important;
    box-shadow:
        0 0 0 2px rgba(163,230,53,.035),
        inset 0 1px 0 rgba(255,255,255,.06) !important;
}

/* Re-assert icons even in active state */
.rail-nav .cxr29-child.cxr30r3-opportunities.active::before,
.rail-nav .cxr29-child.cxr30r3-opportunities.is-active::before,
.rail-nav .cxr29-child.cxr30r3-opportunities[aria-current="page"]::before{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3e635' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 17l5-5 4 3 7-8'/%3E%3Cpath d='M15 7h5v5'/%3E%3C/svg%3E") !important;
}

.rail-nav .cxr29-child.cxr30r3-support.active::before,
.rail-nav .cxr29-child.cxr30r3-support.is-active::before,
.rail-nav .cxr29-child.cxr30r3-support[aria-current="page"]::before{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3e635' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 13v-2a8 8 0 0 1 16 0v2'/%3E%3Cpath d='M4 13h3v6H5a1 1 0 0 1-1-1z'/%3E%3Cpath d='M20 13h-3v6h2a1 1 0 0 0 1-1z'/%3E%3Cpath d='M17 19c0 1.3-1.5 2-4 2h-1'/%3E%3C/svg%3E") !important;
}

.rail-nav .cxr29-child.cxr30r3-automation.active::before,
.rail-nav .cxr29-child.cxr30r3-automation.is-active::before,
.rail-nav .cxr29-child.cxr30r3-automation[aria-current="page"]::before{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3e635' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Ccircle cx='5' cy='6' r='2'/%3E%3Ccircle cx='19' cy='6' r='2'/%3E%3Ccircle cx='5' cy='18' r='2'/%3E%3Ccircle cx='19' cy='18' r='2'/%3E%3Cpath d='M7 7.4 9.7 10M17 7.4 14.3 10M7 16.6 9.7 14M17 16.6 14.3 14'/%3E%3C/svg%3E") !important;
}

.rail-nav .cxr29-child.cxr30r3-analytics-child.active::before,
.rail-nav .cxr29-child.cxr30r3-analytics-child.is-active::before,
.rail-nav .cxr29-child.cxr30r3-analytics-child[aria-current="page"]::before{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3e635' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 19V10'/%3E%3Cpath d='M10 19V5'/%3E%3Cpath d='M15 19v-6'/%3E%3Cpath d='M20 19V8'/%3E%3Cpath d='M3 19h19'/%3E%3C/svg%3E") !important;
}

/* Keep child labels comfortably inside row */
.rail-nav .cxr29-child > span:last-child{
    font-size: 11.2px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* ------------------------------------------------------------
   C. REMOVE DARK TOPBAR DOCK / MAKE IT LIGHT PREMIUM
------------------------------------------------------------ */

.topbar{
    height: 82px !important;
    flex-basis: 82px !important;
    padding: 0 24px 0 28px !important;
    background:
        linear-gradient(180deg, rgba(255,255,255,.99), rgba(248,251,254,.98)) !important;
    border-bottom: 1px solid rgba(210,220,231,.78) !important;
    box-shadow: 0 6px 22px rgba(20,41,70,.045) !important;
}

.topbar-right{
    padding: 0 !important;
    gap: 12px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Search */
.topbar-right .global-search{
    width: 520px !important;
    min-width: 520px !important;
    height: 52px !important;
    margin: 0 !important;
    padding: 0 12px 0 14px !important;
    gap: 10px !important;
    border-radius: 17px !important;
    border: 1px solid #d8e2ec !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(164,230,53,.08), transparent 28%),
        linear-gradient(180deg, rgba(255,255,255,.99), rgba(247,250,253,.98)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.96),
        0 6px 18px rgba(16,40,73,.05) !important;
}

.topbar-right .global-search:hover{
    border-color: #cfdae6 !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.98),
        0 8px 20px rgba(16,40,73,.07) !important;
}

.topbar-right .global-search:focus-within{
    border-color: rgba(147,199,42,.50) !important;
    box-shadow:
        0 0 0 4px rgba(163,230,53,.08),
        0 8px 22px rgba(16,40,73,.08) !important;
    background: #ffffff !important;
}

.topbar-right .global-search > svg{
    width: 17px !important;
    height: 17px !important;
    color: #6f8aa5 !important;
    stroke: #6f8aa5 !important;
}

.topbar-right .global-search input{
    color: #23334a !important;
    font-size: 12.8px !important;
    font-weight: 760 !important;
    letter-spacing: -.05px !important;
}

.topbar-right .global-search input::placeholder{
    color: #90a0b4 !important;
    opacity: 1 !important;
}

.topbar-right .global-search kbd{
    min-width: 42px !important;
    height: 31px !important;
    padding: 0 9px !important;
    border-radius: 11px !important;
    border: 1px solid #d9e2eb !important;
    color: #65758d !important;
    background:
        linear-gradient(180deg, #ffffff, #f2f6f9) !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.98),
        0 3px 8px rgba(13,34,67,.055) !important;
    font-size: 10.5px !important;
    font-weight: 850 !important;
}

/* Bell */
.topbar-right .round-button{
    width: 52px !important;
    height: 52px !important;
    margin: 0 !important;
    border-radius: 17px !important;
    border: 1px solid #d8e2ec !important;
    color: #667a93 !important;
    background:
        linear-gradient(180deg, #ffffff, #f7fafc) !important;
    box-shadow: 0 6px 16px rgba(15,38,70,.05) !important;
}

.topbar-right .round-button:hover{
    color: #243b57 !important;
    background:
        linear-gradient(180deg, #ffffff, #f2f6fa) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 9px 20px rgba(15,38,70,.07) !important;
}

/* Login / Ask Codi */
.topbar-right .cxr30-top-login,
.topbar-right .cxr30-top-ask-codi,
.topbar-right .codi-mini{
    min-width: 118px !important;
    height: 52px !important;
    padding: 0 20px !important;
    margin: 0 !important;
    gap: 8px !important;
    border-radius: 17px !important;
    border: 1px solid rgba(153,201,56,.34) !important;
    color: #27410f !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(177,233,78,.20), transparent 42%),
        linear-gradient(135deg, #f8fce9, #edf7d8) !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.96),
        0 8px 18px rgba(112,160,28,.085) !important;
    font-size: 12.5px !important;
    font-weight: 850 !important;
    letter-spacing: -.08px !important;
    text-decoration: none !important;
}

.topbar-right .cxr30-top-login:hover,
.topbar-right .cxr30-top-ask-codi:hover,
.topbar-right .codi-mini:hover{
    border-color: rgba(137,193,31,.52) !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.98),
        0 10px 22px rgba(112,160,28,.12) !important;
    transform: translateY(-1px) !important;
    filter: none !important;
}

/* ------------------------------------------------------------
   D. RESPONSIVE
------------------------------------------------------------ */

@media (max-width: 1280px){
    .topbar-right .global-search{
        width: 430px !important;
        min-width: 430px !important;
    }
}

@media (max-width: 1080px){
    .topbar-right .global-search{
        width: 320px !important;
        min-width: 320px !important;
    }
}

@media (max-width: 960px){
    .rail-nav .cxr29-submenu{
        padding-left: 14px !important;
    }

    .topbar-right{
        gap: 10px !important;
    }

    .topbar-right .global-search{
        width: 260px !important;
        min-width: 260px !important;
    }
}

@media (max-width: 760px){
    .topbar-right .global-search{
        display: none !important;
    }

    .rail-nav .cxr29-child{
        width: calc(100% - 2px) !important;
    }
}

/* CODSHIPX_AI_CRM_R30_R3_R2_VISUAL_CORRECTIVE_END */