body{
            font-family:'Inter',sans-serif;
            background:#f7f7f7;
            overflow-x:hidden;
        }

        a{
            text-decoration:none;
        }

        button{
            outline:none;
            border:none;
        }

        img{
            max-width:100%;
        }

        /* ===========================
            PAGE
        ============================ */

        .page-wrapper{
            min-height:100vh;
            background:#f7f7f7;
        }

        /* ===========================
            HEADER
        ============================ */

     

        .cart-open-btn{
            height:54px;
            background:#0c831f;
            color:#fff;
            padding:0 25px;
            border-radius:14px;
            font-weight:700;
            transition:.3s;
        }

        .cart-open-btn:hover{
            transform:translateY(-2px);
            background:#0a721a;
        }


     

        /* ===========================
            OVERLAY
        ============================ */

        .cart-overlay{
            position:fixed;
            inset:0;
            background:rgba(0,0,0,0.65);
            z-index:999;
            opacity:0;
            visibility:hidden;
            transition:.4s;
            backdrop-filter:blur(4px);
        }

        .cart-overlay.active{
            opacity:1;
            visibility:visible;
        }

        /* ===========================
            CART SIDEBAR
        ============================ */

        .cart-sidebar{
            position:fixed;
            right:-460px;
            top:0;
            width:430px;
            max-width:100%;
            height:100vh;
            background:#f6f7fb;
            z-index:1000;
            transition:.45s cubic-bezier(.77,0,.18,1);
            display:flex;
            flex-direction:column;
            box-shadow:-10px 0 50px rgba(0,0,0,0.12);
        }

        .cart-sidebar.active{
            right:0;
        }

        .cart-header{
            background:#fff;
            padding:25px;
            border-bottom:1px solid #ececec;
            display:flex;
            align-items:center;
            justify-content:space-between;
        }

        .cart-header h4{
            font-size:1.2rem;
            font-weight:800;
            margin-bottom:5px;
        }

        .close-cart{
            width:42px;
            height:42px;
            border-radius:50%;
            background:#f3f3f3;
            transition:.3s;
        }

        .close-cart:hover{
            transform:rotate(180deg);
        }

        .cart-body{
            flex:1;
            overflow-y:auto;
            padding:20px;
        }

        .delivery-card{
            background:#fff;
            border-radius:18px;
            padding:18px;
            margin-bottom:20px;
        }

        .delivery-card h5{
            font-size:26px;
            font-weight:800;
            margin-bottom:6px;
        }

        .delivery-card p{
            margin:0;
            color:#777;
        }

        /* ===========================
            CART ITEM
        ============================ */

        .cart-item{
            background:#fff;
            border-radius:18px;
            padding:15px;
            margin-bottom:18px;
            display:flex;
            gap:15px;
            animation:fadeInUp .4s ease;
        }

        @keyframes fadeInUp{

            from{
                opacity:0;
                transform:translateY(15px);
            }

            to{
                opacity:1;
                transform:translateY(0);
            }

        }

        .cart-item-image{
            width:90px;
            height:90px;
            border-radius:14px;
            overflow:hidden;
            background:#f4f4f4;
            flex-shrink:0;
        }

        .cart-item-image img{
            width:100%;
            height:100%;
            object-fit:cover;
        }

        .cart-item-content{
            flex:1;
        }

        .cart-item-name{
            font-size:14px;
            font-weight:700;
            margin-bottom:6px;
        }

        .cart-item-weight{
            font-size:13px;
            color:#777;
            margin-bottom:10px;
        }

        .cart-item-bottom{
            display:flex;
            align-items:center;
            justify-content:space-between;
        }

        .cart-item-price{
            font-size:18px;
            font-weight:800;
        }

        .qty-box{
            width:100px;
            height:35px;
            background:#0c831f;
            border-radius:12px;
            display:flex;
            align-items:center;
            justify-content:space-between;
            padding:0 10px;
            color:#fff;
            font-weight:700;
        }

        .qty-btn{
            background:none;
            color:#fff;
            font-size:18px;
        }

        /* ===========================
            BILL BOX
        ============================ */

        .bill-box{
            background:#fff;
            border-radius:18px;
            padding:20px;
            margin-top:20px;
        }

        .bill-box h5{
            font-size:18px;
            font-weight:800;
            margin-bottom:20px;
        }

        .bill-row{
            display:flex;
            justify-content:space-between;
            margin-bottom:14px;
            font-size:12px;
        }

        .bill-total{
            border-top:1px dashed #ddd;
            padding-top:18px;
            margin-top:18px;
            font-size:18px;
            font-weight:800;
        }

        /* ===========================
            FOOTER
        ============================ */

        .cart-footer{
            padding:20px;
            background:#fff;
            border-top:1px solid #ececec;
        }

        .checkout-btn{
            width:100%;
            height:auto;
            background:#0c831f;
            color:#fff;
            border-radius:18px;
            font-size:14px;
            font-weight:500;
            transition:.3s;
        }

        .checkout-btn:hover{
            transform:translateY(-2px);
            background:#0a721a;
        }

        /* ===========================
            LOGIN MODAL
        ============================ */

        .login-modal{
            position:fixed;
            inset:0;
            background:rgba(0,0,0,0.75);
            z-index:2000;
            display:none;
            justify-content:center;
            align-items:center;
            backdrop-filter:blur(5px);
        }

        .login-modal.active{
            display:flex;
            animation:fadeIn .3s ease;
        }

        @keyframes fadeIn{

            from{
                opacity:0;
            }

            to{
                opacity:1;
            }

        }

        .login-box{
            width:440px;
            background:#fff;
            border-radius:24px;
            padding:40px;
            position:relative;
            animation:popup .35s ease;
        }

        @keyframes popup{

            from{
                transform:scale(.9);
                opacity:0;
            }

            to{
                transform:scale(1);
                opacity:1;
            }

        }

        .close-login{
            position:absolute;
            right:20px;
            top:20px;
            background:none;
            font-size:22px;
        }

        .blinkit-badge{
            width:85px;
            height:85px;
            border-radius:22px;
            background:#f7d842;
            display:flex;
            align-items:center;
            justify-content:center;
            font-size:28px;
            font-weight:800;
            margin:auto;
            margin-bottom:25px;
        }

        .login-box h2{
            text-align:center;
            font-size:38px;
            font-weight:800;
            margin-bottom:10px;
        }

        .login-box p{
            text-align:center;
            color:#666;
            margin-bottom:30px;
        }

        .mobile-input{
            height:40px;
            border:1px solid #ddd;
            border-radius:16px;
            display:flex;
            overflow:hidden;
            margin-bottom:25px;
        }

        .mobile-code{
            width:90px;
            background:#fafafa;
            display:flex;
            align-items:center;
            justify-content:center;
            font-weight:700;
        }

        .mobile-input input{
            flex:1;
            border:none;
            padding:0 18px;
            font-size:14px;
        }

        .continue-btn{
            width:100%;
            height:35px;
            background:#0c831f;
            color:#fff;
            border-radius:16px;
            font-size:18px;
            font-weight:800;
        }

        /* ===========================
            ADDRESS SIDEBAR
        ============================ */

        .address-sidebar{
            position:fixed;
            right:-450px;
            top:0;
            width:430px;
            max-width:100%;
            height:100vh;
            background:#fff;
            z-index:2100;
            transition:.4s cubic-bezier(.77,0,.18,1);
            display:flex;
            flex-direction:column;
        }

        .address-sidebar.active{
            right:0;
        }

        .address-header{
            padding:22px;
            border-bottom:1px solid #eee;
            display:flex;
            align-items:center;
            gap:15px;
        }

        .address-header h4{
            font-size:28px;
            font-weight:800;
            margin:0;
        }

        .back-btn{
            background:none;
            font-size:20px;
        }

        .address-body{
            flex:1;
            overflow-y:auto;
            padding:20px;
            background:#f6f7fb;
        }

        .add-address-btn{
            background:#fff;
            padding:22px;
            border-radius:18px;
            color:#0c831f;
            font-weight:800;
            cursor:pointer;
            margin-bottom:25px;
            transition:.3s;
        }

        .add-address-btn:hover{
            transform:translateY(-2px);
        }

        .saved-title{
            color:#666;
            margin-bottom:15px;
        }

        .address-card{
            background:#fff;
            border-radius:18px;
            padding:20px;
            margin-bottom:16px;
            animation:fadeInUp .4s ease;
        }

        .address-card h5{
            font-weight:800;
            margin-bottom:8px;
        }

        .address-card p{
            margin:0;
            color:#666;
            line-height:24px;
        }

        /* ===========================
            ADD ADDRESS MODAL
        ============================ */

        .add-address-modal{
            position:fixed;
            inset:0;
            background:rgba(0,0,0,0.75);
            z-index:3000;
            display:none;
            justify-content:center;
            align-items:center;
            backdrop-filter:blur(5px);
        }

        .add-address-modal.active{
            display:flex;
        }

        .address-modal-box{
            width:1000px;
            background:#fff;
            border-radius:24px;
            overflow:hidden;
            position:relative;
            animation:popup .35s ease;
        }

        .close-address-modal{
            position:absolute;
            right:20px;
            top:20px;
            background:none;
            font-size:22px;
            z-index:2;
        }

        .map-side{
            background:#eef2f5;
            min-height:650px;
            position:relative;
        }

        .map-search{
            position:absolute;
            left:20px;
            right:20px;
            top:20px;
            background:#fff;
            padding:16px;
            border-radius:14px;
            font-weight:700;
        }

        .map-pin{
            position:absolute;
            left:50%;
            top:50%;
            transform:translate(-50%,-50%);
            font-size:45px;
            color:red;
        }

        .form-side{
            padding:40px;
        }

        .form-side h3{
            font-size:34px;
            font-weight:800;
            margin-bottom:30px;
        }

        .address-type-box{
            display:flex;
            gap:10px;
            margin-bottom:25px;
        }

        .address-type{
            padding:12px 20px;
            border-radius:12px;
            border:1px solid #ddd;
            background:#fff;
            font-weight:700;
        }

        .address-type.active{
            background:#eaf8ed;
            color:#0c831f;
            border-color:#0c831f;
        }

        .form-control{
            height:58px;
            border-radius:14px;
            margin-bottom:18px;
            border:1px solid #ddd;
            box-shadow:none !important;
        }

        .save-address{
            width:100%;
            height:62px;
            background:#0c831f;
            color:#fff;
            border-radius:16px;
            font-size:18px;
            font-weight:800;
            margin-top:10px;
        }

        /* ===========================
            RESPONSIVE
        ============================ */

        @media(max-width:992px){

            .top-header{
                padding:15px;
                flex-wrap:wrap;
                height:auto;
                gap:15px;
            }

            .search-bar{
                margin:0;
                width:100%;
                order:3;
            }

            .products-wrapper{
                padding:20px;
            }

            .address-modal-box{
                width:95%;
                max-height:95vh;
                overflow-y:auto;
            }

            .map-side{
                min-height:260px;
            }

        }

        @media(max-width:576px){

            .cart-sidebar{
                width:100%;
            }

            .address-sidebar{
                width:100%;
            }

            .login-box{
                width:95%;
                padding:25px;
            }

            .login-box h2{
                font-size:28px;
            }

            .form-side{
                padding:25px;
            }

            .form-side h3{
                font-size:26px;
            }

            .section-title{
                font-size:24px;
            }

        }