
    /* ===== Uday Udyog – Chat Widget (scoped with .uu-) ===== */
    .uu-root,
    .uu-root *,
    .uu-bottom,
    .uu-bottom * {
        box-sizing: border-box;
        margin: 0;
        padding: 0
    }

    .uu-root,
    .uu-bottom {
        --uu-bg: #e6ebf2;
        --uu-light: #ffffff;
        --uu-dark: #c1c9d8;
        --uu-text: #27303f;
        --uu-muted: #6a7488;
        --uu-brand: #1b5fd1;
        --uu-brand2: #0f3f95;
        --uu-wa: #1ebe5a;
        --uu-call: #e8590c;
        --uu-nav-h: 66px;
        --uu-raise: 6px 6px 14px var(--uu-dark), -6px -6px 14px var(--uu-light);
        --uu-raise-s: 3px 3px 8px var(--uu-dark), -3px -3px 8px var(--uu-light);
        --uu-inset: inset 4px 4px 9px var(--uu-dark), inset -4px -4px 9px var(--uu-light);
        font-family: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
        color: var(--uu-text);
        -webkit-tap-highlight-color: transparent
    }

    .uu-root a,
    .uu-bottom a {
        text-decoration: none;
        color: inherit
    }

    .uu-root button,
    .uu-bottom button {
        font: inherit;
        color: inherit;
        border: 0;
        background: none;
        cursor: pointer;
        font-size: 12px;
    }

   /* ===== Right Sticky Social Widgets - FIXED ===== */

.uu-root .uu-side {
    position: fixed !important;
    top: 70% !important;
    right: 0 !important;
    left: auto !important;

    width: max-content !important;
    max-width: 190px !important;
    height: auto !important;

    float: none !important;
    clear: none !important;

    transform: translateY(-50%) !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: center !important;

    gap: 16px !important;

    z-index: 99990 !important;

    /* Prevent the container from blocking website clicks */
    pointer-events: none !important;
    overflow: visible !important;
}

/* Individual clickable social buttons */

.uu-root .uu-side .uu-tab {
    position: relative !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    width: 45px !important;
    min-width: 45px !important;
    max-width: 45px !important;

    height: 56px !important;
    min-height: 56px !important;

    padding: 0 !important;
    margin: 0 !important;

    overflow: hidden !important;

    border-radius: 18px 0 0 18px !important;

    cursor: pointer !important;

    pointer-events: auto !important;

    transition:
        max-width .45s cubic-bezier(.2, .8, .2, 1),
        box-shadow .25s,
        transform .25s !important;
}

/* Expand on hover */

.uu-root .uu-side .uu-tab:hover,
.uu-root .uu-side .uu-tab:focus-visible {
    max-width: 190px !important;
}

/* Icon alignment */

.uu-root .uu-side .uu-tab i {
    flex: 0 0 56px !important;
    width: 56px !important;
    height: 56px !important;

    line-height: 56px !important;
    text-align: center !important;

    pointer-events: none !important;
}

/* Label */

.uu-root .uu-side .uu-tab span {
    padding-right: 18px !important;
    white-space: nowrap !important;
    pointer-events: none !important;
}

/* Mobile */

@media (max-width: 767px) {
    .uu-root .uu-side {
        display: none !important;
    }
}

    /* ----- Chat window ----- */
    .uu-chat {
        position: fixed;
        right: 78px;
        bottom: 24px;
        width: 390px;
        height: min(640px, calc(100vh - 48px));
        height: min(640px, calc(100dvh - 48px));
        z-index: 99995;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        border-radius: 28px;
        background: var(--uu-bg);
        /* box-shadow: 14px 14px 34px rgba(120, 132, 155, .55), -10px -10px 28px rgba(255, 255, 255, .85); */
        opacity: 0;
        border: 1px solid #247cae;
        visibility: hidden;
        transform: translateY(24px) scale(.94);
        transform-origin: bottom right;
        pointer-events: none;
        transition: opacity .35s ease, transform .45s cubic-bezier(.2, .9, .25, 1.15), visibility 0s .45s
    }

    .uu-open .uu-chat {
        opacity: 1;
        visibility: visible;
        transform: none;
        pointer-events: auto;
        transition: opacity .35s ease, transform .45s cubic-bezier(.2, .9, .25, 1.15), visibility 0s
    }

    .uu-head {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 14px 16px;
        background: linear-gradient(145deg, #247cae, #247cae);
        box-shadow: 0 6px 14px rgba(150, 160, 182, .35);
        position: relative;
        z-index: 2
    }

    .uu-logo {
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 48px;
        max-width: 128px;
        padding: 6px 12px;
        border-radius: 16px;
        /* background: var(--uu-bg); */
        /* box-shadow: var(--uu-inset) */
    }

    .uu-logo img {
        display: block;
        height: 100%;
        width: auto;
        max-width: 100%;
        object-fit: contain
    }

    .uu-title {
        flex: 1;
        min-width: 0;
        line-height: 1.25
    }

    .uu-title strong {
        display: block;
        font-size: 14px;
        font-weight: 600;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis
    }

    .uu-title small {
        display: flex;
        align-items: center;
        gap: 6px;
        font-size: 11px;
        color: var(--uu-muted)
    }

    .uu-dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--uu-wa);
        box-shadow: 0 0 0 3px rgba(30, 190, 90, .2);
        animation: uuBlink 2.4s infinite
    }

    @keyframes uuBlink {
        50% {
            opacity: .45
        }
    }

    .uu-close {
        flex: 0 0 38px;
        width: 38px;
        height: 38px;
        border-radius: 12px;
        background: var(--uu-bg);
        box-shadow: var(--uu-raise-s);
        transition: box-shadow .2s, transform .2s;
        color: var(--uu-muted)
    }

    .uu-close:hover {
        color: var(--uu-brand)
    }

    .uu-close:active {
        box-shadow: var(--uu-inset);
        transform: scale(.96)
    }

    .uu-body {
        flex: 1;
        overflow-y: auto;
        padding: 18px 14px 8px;
        display: flex;
        flex-direction: column;
        gap: 12px;
        scroll-behavior: smooth;
        overscroll-behavior: contain
    }

    .uu-body::-webkit-scrollbar {
        width: 6px
    }

    .uu-body::-webkit-scrollbar-thumb {
        background: var(--uu-dark);
        border-radius: 6px
    }

    .uu-msg {
        max-width: 86%;
        font-size: 13.5px;
        line-height: 1.55;
        padding: 11px 14px;
        border-radius: 18px;
        animation: uuIn .38s cubic-bezier(.2, .9, .3, 1.2) both;
        word-wrap: break-word;
        overflow-wrap: anywhere
    }

    .uu-msg a {
        color: var(--uu-brand);
        font-weight: 500;
        text-decoration: underline;
        text-underline-offset: 2px
    }

    .uu-msg ul {
        margin: 6px 0 0 16px
    }

    .uu-msg li {
        margin: 2px 0
    }

    .uu-bot {
        align-self: flex-start;
        background: var(--uu-bg);
        box-shadow: var(--uu-raise-s);
        border-bottom-left-radius: 6px
    }

    .uu-user {
        align-self: flex-end;
        color: #fff;
        background: linear-gradient(145deg, var(--uu-brand), var(--uu-brand2));
        box-shadow: 4px 4px 10px rgba(15, 63, 149, .35), -3px -3px 8px rgba(255, 255, 255, .7);
        border-bottom-right-radius: 6px
    }

    @keyframes uuIn {
        from {
            opacity: 0;
            transform: translateY(12px) scale(.96)
        }

        to {
            opacity: 1;
            transform: none
        }
    }

    .uu-typing {
        display: inline-flex;
        gap: 5px;
        align-items: center;
        padding: 14px 16px
    }

    .uu-typing b {
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: var(--uu-muted);
        animation: uuDot 1.1s infinite ease-in-out
    }

    .uu-typing b:nth-child(2) {
        animation-delay: .15s
    }

    .uu-typing b:nth-child(3) {
        animation-delay: .3s
    }

    @keyframes uuDot {

        0%,
        60%,
        100% {
            transform: translateY(0);
            opacity: .4
        }

        30% {
            transform: translateY(-5px);
            opacity: 1
        }
    }

    .uu-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 2px;
        animation: uuIn .4s .1s both
    }

    .uu-chip {
        font-size: 12px;
        font-weight: 500;
        padding: 8px 13px;
        border-radius: 14px;
        background: var(--uu-bg);
        box-shadow: var(--uu-raise-s);
        color: var(--uu-brand);
        transition: box-shadow .2s, transform .2s
    }

    .uu-chip:hover {
        transform: translateY(-1px)
    }

    .uu-chip:active {
        box-shadow: var(--uu-inset);
        transform: none
    }

    .uu-chip.uu-chip-q {
        color: #fff;
        background: linear-gradient(145deg, var(--uu-brand), var(--uu-brand2))
    }

    .uu-gate {
        align-self: stretch;
        padding: 16px;
        border-radius: 20px;
        background: var(--uu-bg);
        box-shadow: var(--uu-inset);
        text-align: center;
        animation: uuIn .4s both;
        transition: opacity .4s, transform .4s
    }

    .uu-gate.uu-gone {
        opacity: 0;
        transform: scale(.95)
    }

    .uu-gate p {
        font-size: 12.5px;
        color: var(--uu-muted);
        margin-bottom: 12px
    }

    .uu-gate p i {
        color: var(--uu-brand);
        margin-right: 6px
    }

    .uu-ts {
        display: flex;
        justify-content: center;
        min-height: 65px
    }

    .uu-retry {
        margin-top: 10px;
        font-size: 12px;
        font-weight: 600;
        color: var(--uu-brand);
        padding: 8px 14px;
        border-radius: 12px;
        box-shadow: var(--uu-raise-s)
    }

    .uu-foot {
        padding: 10px 14px 14px;
        display: flex;
        flex-direction: column;
        gap: 10px;
        background: var(--uu-bg);
        box-shadow: 0 -6px 14px rgba(150, 160, 182, .22);
        position: relative;
        z-index: 2
    }

    .uu-quote-btn {
        position: relative;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 9px;
        height: 46px;
        border-radius: 16px;
        font-weight: 600;
        font-size: 14px;
        letter-spacing: .3px;
        color: #fff;
        background: linear-gradient(145deg, #2a70e6, #0f3f95);
        box-shadow: 5px 5px 12px rgba(15, 63, 149, .35), -4px -4px 10px rgba(255, 255, 255, .9);
        transition: transform .2s, box-shadow .2s, opacity .3s;
        animation: uuBreath 3s ease-in-out infinite
    }

    .uu-quote-btn::after {
        content: "";
        position: absolute;
        top: 0;
        left: -60%;
        width: 40%;
        height: 100%;
        background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .45), transparent);
        transform: skewX(-20deg);
        animation: uuShine 3.2s infinite
    }

    .uu-quote-btn i {
        transition: transform .3s
    }

    .uu-quote-btn:hover i {
        transform: translateX(3px) rotate(-8deg)
    }

    .uu-quote-btn:active {
        transform: scale(.98);
        box-shadow: inset 3px 3px 8px rgba(0, 0, 0, .3)
    }

    .uu-quote-btn:disabled {
        opacity: .55;
        cursor: not-allowed;
        animation: none
    }

    .uu-quote-btn:disabled::after {
        display: none
    }

    @keyframes uuShine {
        0% {
            left: -60%
        }

        55%,
        100% {
            left: 130%
        }
    }

    @keyframes uuBreath {
        50% {
            transform: translateY(-1.5px)
        }
    }

    .uu-input {
        display: flex;
        gap: 10px;
        align-items: center
    }

    .uu-input input {
        flex: 1;
        min-width: 0;
        height: 46px;
        border: 0;
        outline: 0;
        border-radius: 16px;
        padding: 0 16px;
        font: inherit;
        font-size: 16px;
        color: var(--uu-text);
        background: var(--uu-bg);
        box-shadow: var(--uu-inset);
        transition: box-shadow .2s
    }

    .uu-input input:focus {
        box-shadow: var(--uu-inset), 0 0 0 2px rgba(27, 95, 209, .3)
    }

    .uu-input input:disabled {
        opacity: .6
    }

    .uu-input button {
        flex: 0 0 46px;
        height: 46px;
        border-radius: 16px;
        color: var(--uu-brand);
        background: var(--uu-bg);
        box-shadow: var(--uu-raise-s);
        transition: box-shadow .2s, transform .2s
    }

    .uu-input button:active {
        box-shadow: var(--uu-inset)
    }

    .uu-input button:disabled {
        opacity: .5
    }

    /* ----- Quote sheet ----- */
    .uu-sheet {
        position: absolute;
        inset: 0;
        z-index: 5;
        display: flex;
        flex-direction: column;
        background: var(--uu-bg);
        transform: translateY(102%);
        visibility: hidden;
        transition: transform .5s cubic-bezier(.2, .85, .25, 1), visibility 0s .5s
    }

    .uu-sheet.uu-on {
        transform: none;
        visibility: visible;
        transition: transform .5s cubic-bezier(.2, .85, .25, 1), visibility 0s
    }

    .uu-sh-head {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 14px 16px;
        background: linear-gradient(145deg, #eff3f9, #dbe1ec);
        box-shadow: 0 6px 14px rgba(150, 160, 182, .35)
    }

    .uu-sh-head strong {
        flex: 1;
        font-size: 15px;
        font-weight: 600
    }

    .uu-sh-head strong small {
        display: block;
        font-size: 11px;
        font-weight: 400;
        color: var(--uu-muted)
    }

    .uu-sh-scroll {
        flex: 1;
        overflow-y: auto;
        padding: 18px 16px 20px;
        overscroll-behavior: contain
    }

    .uu-form {
        display: flex;
        flex-direction: column;
        gap: 13px
    }

    .uu-f label {
        display: block;
        font-size: 11.5px;
        font-weight: 500;
        color: var(--uu-muted);
        margin: 0 0 6px 6px
    }

    .uu-f input,
    .uu-f select,
    .uu-f textarea {
        width: 100%;
        border: 0;
        outline: 0;
        border-radius: 14px;
        padding: 12px 14px;
        font: inherit;
        font-size: 16px;
        color: var(--uu-text);
        background: var(--uu-bg);
        box-shadow: var(--uu-inset);
        transition: box-shadow .2s;
        appearance: none;
        -webkit-appearance: none
    }

    .uu-f select {
        background-image: linear-gradient(45deg, transparent 50%, var(--uu-muted) 50%), linear-gradient(135deg, var(--uu-muted) 50%, transparent 50%);
        background-position: calc(100% - 20px) 52%, calc(100% - 14px) 52%;
        background-size: 6px 6px;
        background-repeat: no-repeat;
        padding-right: 36px
    }

    .uu-f textarea {
        resize: none;
        min-height: 84px
    }

    .uu-f input:focus,
    .uu-f select:focus,
    .uu-f textarea:focus {
        box-shadow: var(--uu-inset), 0 0 0 2px rgba(27, 95, 209, .3)
    }

    .uu-f.uu-bad input,
    .uu-f.uu-bad select {
        box-shadow: var(--uu-inset), 0 0 0 2px rgba(220, 53, 69, .55)
    }

    .uu-hp {
        position: absolute !important;
        left: -9999px !important;
        top: auto;
        width: 1px;
        height: 1px;
        overflow: hidden
    }

    .uu-submit {
        position: relative;
        height: 48px;
        border-radius: 16px;
        font-weight: 600;
        font-size: 14px;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 9px;
        background: linear-gradient(145deg, #2a70e6, #0f3f95);
        box-shadow: 5px 5px 12px rgba(15, 63, 149, .35), -4px -4px 10px rgba(255, 255, 255, .9);
        transition: transform .2s, opacity .3s
    }

    .uu-submit:active {
        transform: scale(.98)
    }

    .uu-submit:disabled {
        opacity: .55;
        cursor: not-allowed
    }

    .uu-spin {
        width: 16px;
        height: 16px;
        border-radius: 50%;
        border: 2px solid rgba(255, 255, 255, .4);
        border-top-color: #fff;
        animation: uuSpin .7s linear infinite;
        display: none
    }

    .uu-submit.uu-load .uu-spin {
        display: block
    }

    .uu-submit.uu-load .uu-sub-ic {
        display: none
    }

    @keyframes uuSpin {
        to {
            transform: rotate(360deg)
        }
    }

    .uu-err {
        font-size: 12px;
        color: #c62839;
        text-align: center;
        min-height: 0;
        display: none
    }

    .uu-err.uu-show {
        display: block;
        animation: uuIn .3s both
    }

    .uu-ok {
        display: none;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 12px;
        padding: 30px 10px
    }

    .uu-ok.uu-show {
        display: flex
    }

    .uu-ok-ic {
        width: 78px;
        height: 78px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 32px;
        color: var(--uu-wa);
        background: var(--uu-bg);
        box-shadow: var(--uu-raise);
        animation: uuPop .6s cubic-bezier(.2, 1.4, .4, 1) both
    }

    @keyframes uuPop {
        from {
            transform: scale(.3);
            opacity: 0
        }

        to {
            transform: none;
            opacity: 1
        }
    }

    .uu-ok h4 {
        font-size: 17px;
        font-weight: 600
    }

    .uu-ok p {
        font-size: 13px;
        color: var(--uu-muted);
        line-height: 1.6
    }

    /* ----- Mobile bottom nav ----- */
    .uu-bottom {
        display: none
    }

    @media (max-width:767px) {
        .uu-side {
            display: none
        }

        body {
            padding-bottom: calc(var(--uu-nav-h, 66px) + env(safe-area-inset-bottom, 0px)) !important
        }

        .uu-bottom {
            position: fixed;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 99999;
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            gap: 8px;
            align-items: center;
            padding: 9px 10px calc(9px + env(safe-area-inset-bottom, 0px));
            background: var(--uu-bg);
            box-shadow: 0 -8px 22px rgba(130, 142, 165, .4)
        }

        .uu-bottom a,
        .uu-bottom button {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 3px;
            height: 48px;
            border-radius: 15px;
            font-size: 10px;
            font-weight: 500;
            color: var(--uu-muted);
            background: var(--uu-bg);
            box-shadow: var(--uu-raise-s);
            transition: box-shadow .2s, transform .2s, color .2s
        }

        .uu-bottom i {
            font-size: 17px
        }

        .uu-bottom a:active,
        .uu-bottom button:active,
        .uu-bottom .uu-on {
            box-shadow: var(--uu-inset);
            transform: scale(.97)
        }

        .uu-bottom .uu-n-home i,
        .uu-bottom .uu-n-chat i,
        .uu-bottom .uu-n-contact i {
            color: var(--uu-brand)
        }

        .uu-bottom .uu-n-wa i {
            color: var(--uu-wa)
        }

        .uu-bottom .uu-n-call i {
            color: var(--uu-call)
        }

        .uu-chat {
            right: 0;
            left: 0;
            top: 0;
            bottom: calc(var(--uu-nav-h, 66px) + env(safe-area-inset-bottom, 0px));
            width: 100%;
            height: auto;
            border-radius: 0 0 26px 26px;
            transform-origin: bottom center;
            transform: translateY(40px) scale(.98)
        }

        .uu-open .uu-chat {
            transform: none
        }

        html.uu-lock,
        html.uu-lock body {
            overflow: hidden
        }
    }

    @media (max-width:360px) {
        .uu-logo {
            max-width: 100px
        }

        .uu-title strong {
            font-size: 13px
        }

        .uu-bottom a,
        .uu-bottom button {
            font-size: 9px
        }
    }

    @media (prefers-reduced-motion:reduce) {

        .uu-root *,
        .uu-bottom * {
            animation: none !important;
            transition-duration: .01ms !important
        }
    }

    #uu-close {
        position: absolute;
  right: 8px;
  margin-left: 0;
  top: 50%;
  transform: translateY(-50%);
    }









    /* Priority Overrides for Side Tabs to counter global button[type="button"] rules */
.uu-root .uu-side .uu-tab,
.uu-root button.uu-tab {
height: 56px !important;
min-height: 56px !important;
padding: 0 !important;
background: linear-gradient(145deg, #f1f5fb, #dde3ee) !important;
border: 1px solid #00adee;
font-family: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, sans-serif !important;
font-size: 22px !important;
font-weight: normal !important;
line-height: normal !important;
box-sizing: border-box !important;
}

/* Ensure tab icons maintain exact dimensions and alignment */
.uu-root .uu-side .uu-tab i {
flex: 0 0 56px !important;
width: 56px !important;
height: 56px !important;
line-height: 56px !important;
text-align: center !important;
}

/* Ensure label text inside tab keeps correct padding */
.uu-root .uu-side .uu-tab span {
padding-right: 18px !important;
}

/* ===== Close Button Reset & Centering Fix ===== */
.uu-root #uu-close,
.uu-root button.uu-close {
position: absolute !important;
right: 12px !important;
top: 50% !important;
transform: translateY(-50%) !important;
width: 38px !important;
height: 38px !important;
min-width: 38px !important;
max-width: 38px !important;
min-height: 38px !important;
max-height: 38px !important;
padding: 0 !important;
margin: 0 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 12px !important;
background: var(--uu-bg) !important;
box-shadow: var(--uu-raise-s) !important;
border: 0 !important;
cursor: pointer !important;
}

.uu-root #uu-close i {
font-size: 18px !important;
line-height: 1 !important;
margin: 0 !important;
padding: 0 !important;
}