:root {
            --primary: #e9a71f;
            --dark: #121212;
            --light-gold: #fff9e6;
            --glass: rgba(255, 255, 255, 0.95);
        }
		
		
		
		:root {
    /* #e9a71f ka RGB value 233, 167, 31 hota hai */
    --bs-primary-rgb: 233, 167, 31;
    --primary: #e9a71f;
}

.text-primary {
    --bs-text-opacity: 1;
    color: rgba(var(--bs-primary-rgb), var(--bs-text-opacity)) !important;
}

/* Background ke liye bhi agar chahiye ho */
.bg-primary {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)) !important;
}

/* Border ke liye */
.border-primary {
    --bs-border-opacity: 1;
    border-color: rgba(var(--bs-primary-rgb), var(--bs-border-opacity)) !important;
}



        body { font-family: 'Plus Jakarta Sans', sans-serif; background-color: #fafafa; color: var(--dark); overflow-x: hidden; }

        /* Navigation */
        .navbar { background: var(--glass); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(0,0,0,0.05); padding: 18px 0; }
        .btn-theme { background-color: var(--primary); color: white; border: none; padding: 10px 25px; border-radius: 50px; font-weight: 600; transition: 0.4s; font-size: 13px; letter-spacing: 1px; }
        .btn-theme:hover { background-color: var(--dark); transform: translateY(-2px); box-shadow: 0 10px 20px rgba(233, 167, 31, 0.3); }

        /* Hero */
        .hero { background: linear-gradient(135deg, rgba(18,18,18,0.8) 0%, rgba(18,18,18,0.6) 100%), url('https://images.unsplash.com/photo-1581093588401-fbb62a02f120?auto=format&fit=crop&q=80&w=1500'); background-size: cover; background-position: center; height: 80vh; display: flex; align-items: center; color: white; clip-path: ellipse(150% 100% at 50% 0%); }
        .hero h1 { font-size: 4rem; font-weight: 800; }
        .hero span { color: var(--primary); }

        /* Quality Section */
        .quality-card { border: none; border-radius: 20px; padding: 30px; background: white; transition: 0.3s; height: 100%; border-bottom: 4px solid #eee; }
        .quality-card:hover { border-bottom-color: var(--primary); transform: translateY(-5px); }
        .quality-icon { font-size: 40px; color: var(--primary); margin-bottom: 20px; }

        /* Products */
        .product-card { background: white; border-radius: 24px; padding: 30px; text-align: center; transition: 0.4s; border: 1px solid #f0f0f0; }
        .product-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0,0,0,0.08); }
        .badge-purity { background: var(--light-gold); color: var(--primary); font-weight: 700; font-size: 11px; padding: 5px 12px; border-radius: 50px; }

        /* FAQ Section */
        .accordion-item { border: none; margin-bottom: 15px; border-radius: 15px !important; overflow: hidden; box-shadow: 0 5px 15px rgba(0,0,0,0.03); }
        .accordion-button:not(.collapsed) { background-color: var(--light-gold); color: var(--primary); }
        .accordion-button:focus { box-shadow: none; border: 1px solid var(--primary); }

        /* Newsletter Section */
        .newsletter-box { background: var(--dark); border-radius: 30px; padding: 60px; color: white; position: relative; overflow: hidden; }
        .newsletter-box input { background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.2); color: white; padding: 15px 25px; border-radius: 50px; }

        /* Final CTA */
        .final-cta { padding: 100px 0; background: linear-gradient(rgba(233, 167, 31, 0.1), rgba(255,255,255,1)); text-align: center; }

        /* Auth Notification Bar */
        #authBanner { display: none; background: var(--dark); color: var(--primary); text-align: center; padding: 8px; font-size: 13px; font-weight: 600; }
		
		
		img{ max-width:100%; height:auto;}
		
		
		
		
		
		
		
		
		
		
		 :root {
            --primary: #e9a71f;
            --dark: #121212;
            --light-bg: #f4f7f6;
            --white: #ffffff;
        }

        body { font-family: 'Plus Jakarta Sans', sans-serif; background-color: var(--light-bg); color: var(--dark); }

        /* Navigation */
        .navbar { background: var(--white); box-shadow: 0 2px 15px rgba(0,0,0,0.05); padding: 15px 0; }
        .btn-theme { background-color: var(--primary); color: white !important; border-radius: 12px; font-weight: 600; padding: 10px 24px; border: none; transition: 0.3s; }
        .btn-theme:hover { background-color: var(--dark); transform: translateY(-2px); }

        /* Stats Cards */
        .stat-card { background: var(--white); border-radius: 20px; padding: 25px; border: none; box-shadow: 0 10px 30px rgba(0,0,0,0.03); transition: 0.3s; }
        .stat-card:hover { transform: translateY(-5px); }
        .stat-icon { width: 50px; height: 50px; border-radius: 12px; background: var(--light-gold); color: var(--primary); display: flex; align-items: center; justify-content: center; font-size: 20px; margin-bottom: 15px; }

        /* Order List Table */
        .dashboard-container { margin-top: -50px; position: relative; z-index: 10; }
        .order-table-card { background: var(--white); border-radius: 24px; border: none; box-shadow: 0 20px 40px rgba(0,0,0,0.05); overflow: hidden; }
        .table thead { background: #fafafa; }
        .table th { padding: 20px; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: #888; border: none; }
        .table td { vertical-align: middle; padding: 20px; border-bottom: 1px solid #f8f8f8; font-size: 14px; color:#000!important }
        
        /* Status Badges */
        .badge-status { padding: 8px 16px; border-radius: 10px; font-size: 11px; font-weight: 700; }
        .status-processing { background: #fff9e6; color: #e9a71f; }
        .status-shipped { background: #eef2ff; color: #4f46e5; }
        .status-delivered { background: #f0fdf4; color: #16a34a; }
.form-control-sm{padding: 14px 13px;}
        /* Order Detail Section */
        .detail-header { background: var(--dark); color: white; padding: 80px 0 120px; }
        .card-custom { background: white; border-radius: 24px; padding: 30px; border: none; box-shadow: 0 15px 35px rgba(0,0,0,0.05); }
        
        .product-img { width: 70px; height: 70px; object-fit: cover; border-radius: 15px; border: 1px solid #eee; }
        
        /* Progress Tracker */
        .step-container { display: flex; justify-content: space-between; position: relative; margin-top: 30px; }
        .step-container::before { content: ''; position: absolute; top: 15px; left: 0; width: 100%; height: 2px; background: #eee; z-index: 1; }
        .step { position: relative; z-index: 2; text-align: center; width: 100px; }
        .step-icon { width: 32px; height: 32px; background: #eee; border-radius: 50%; margin: 0 auto 10px; display: flex; align-items: center; justify-content: center; font-size: 12px; color: #999; border: 4px solid white; }
        .step.active .step-icon { background: var(--primary); color: white; }
        .step.active .step-text { color: var(--primary); font-weight: 700; }
        .step-text { font-size: 12px; font-weight: 500; color: #999; }

        .btn-outline-gold { border: 2px solid var(--primary); color: var(--primary); border-radius: 12px; font-weight: 600; padding: 8px 20px; transition: 0.3s; }
        .btn-outline-gold:hover { background: var(--primary); color: white; }

        .text-gold { color: var(--primary) !important; }
		
		
		
		
		 /* Custom Owl Nav Styling */
    .owl-nav button {
        background: #e9a71f !important;
        color: white !important;
        width: 40px;
        height: 40px;
        border-radius: 50% !important;
        font-size: 24px !important;
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    }
    .owl-dots .owl-dot.active span {
        background: #e9a71f !important;
    }
    .product-card {
        margin: 10px; /* Space for shadows */
    }
	
	
	
	
	
	
	
	
	
	/* Premium Footer Styling */
footer {
    background-color: #0f0f0f !important; /* Deeper dark for premium feel */
}

footer h5, footer h6 {
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 25px;
}

.footer-link {
    color: #888;
    text-decoration: none;
    transition: 0.3s;
    display: block;
    margin-bottom: 12px;
}

.footer-link:hover {
    color: #e9a71f;
    padding-left: 5px;
}

.newsletter-input {
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.1);
    color: white;
    border-radius: 50px 0 0 50px;
    padding-left: 20px;
}

.newsletter-input:focus {
    background: rgba(255,255,255,0.1);
    border-color: #e9a71f;
    box-shadow: none;
    color: white;
}

.btn-newsletter {
    background-color: #e9a71f;
    color: white;
    border-radius: 0 50px 50px 0;
    font-weight: 600;
}

.payment-icons i {
    font-size: 24px;
    margin-left: 15px;
    opacity: 0.5;
    transition: 0.3s;
}

.payment-icons i:hover {
    opacity: 1;
    color: #e9a71f;
}




.ps-4{margin-left: 7px;}





 :root { --primary: #e9a71f; --dark: #121212; }
        
        /* New Tracking Search Bar Styling */
        .hero-tracking-input {
            max-width: 600px;
            background: white;
            border-radius: 50px;
            padding: 8px;
            display: flex;
            box-shadow: 0 15px 35px rgba(0,0,0,0.2);
            margin-top: 30px;
        }
        .hero-tracking-input input {
            border: none;
            flex-grow: 1;
            padding: 10px 25px;
            border-radius: 50px 0 0 50px;
            outline: none;
            font-size: 16px;
        }
        .btn-track-main {
            background: var(--primary);
            color: white;
            border: none;
            padding: 12px 35px;
            border-radius: 50px;
            font-weight: 700;
            transition: 0.3s;
        }
        .btn-track-main:hover { background: #d19519; transform: scale(1.05); }

        /* Logistics Dashboard Section */
        .logistics-banner {
            background: #fff9e6;
            border: 1px dashed var(--primary);
            border-radius: 20px;
            padding: 20px;
            margin-top: -40px;
            position: relative;
            z-index: 10;
        }

        .owl-nav button {
            background: var(--primary) !important;
            color: white !important;
            width: 40px; height: 40px; border-radius: 50% !important;
        }
		
		
		
		
		
		.peptide-carousel-five .product-card {
    transition: 0.3s;
    background: #fff;
}
.peptide-carousel-five .product-card h6 {
    font-size: 13px; /* Slightly smaller text for 5 column layout */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.peptide-carousel-five .item {
    padding: 10px 5px;
}
.peptide-carousel-five .owl-nav button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: #e9a71f !important;
    color: white !important;
    width: 35px;
    height: 35px;
    border-radius: 50% !important;
}
.peptide-carousel-five .owl-prev { left: -10px; }
.peptide-carousel-five .owl-next { right: -10px; }










/* Reorder View Specific */
.reorder-item-card {
    background: #fff;
    border-radius: 15px;
    padding: 20px;
    border: 1px solid #eee;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.qty-input {
    width: 60px;
    text-align: center;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 5px;
}

.btn-group-sm > .btn {
    padding: 6px 15px;
    font-size: 12px;
    font-weight: 700;
}

/* Table formatting fix */
.table-responsive {
    border-radius: 0 0 24px 24px;
}

.table thead th {
    background: #fcfcfc;
    border-top: none;
    color: #999;
}





  /* Premium Table Styling */
    .dashboard-table-card {
        background: #ffffff;
        border-radius: 30px;
        box-shadow: 0 10px 40px rgba(0,0,0,0.03);
        border: 1px solid #f0f0f0;
        overflow: hidden;
    }

    .table-elite { width: 100%; border-collapse: separate; border-spacing: 0; }
    .table-elite thead th {
        background: #fafafa;
        padding: 20px;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: 1.5px;
        font-weight: 800;
        color: #999;
        border-bottom: 1px solid #eee;
    }
    .table-elite tbody td {
        padding: 22px 20px;
        vertical-align: middle;
        border-bottom: 1px solid #f8f8f8;
        font-size: 14px;
        font-weight: 500;
    }

    /* Status Badges */
    .badge-purity {
        padding: 6px 14px;
        border-radius: 10px;
        font-size: 11px;
        font-weight: 800;
        background: var(--primary-soft);
        color: var(--primary);
    }

    /* Action Buttons Group */
    .btn-capsule-group {
        background: #f4f4f4;
        padding: 4px;
        border-radius: 50px;
        display: inline-flex;
    }
    .btn-capsule {
        border: none;
        padding: 6px 18px;
        border-radius: 50px;
        font-size: 12px;
        font-weight: 700;
        transition: 0.3s;
        background: transparent;
        color: #666;
    }
    .btn-capsule:hover { background: #fff; color: var(--dark); box-shadow: 0 4px 10px rgba(0,0,0,0.05); }
    .btn-capsule-primary { background: var(--primary); color: white; }
    .btn-capsule-primary:hover { background: var(--dark); color: white; }

    /* --- REORDER PAGE STYLING --- */
    .reorder-container { max-width: 1100px; margin: 0 auto; }
    
    .reorder-item-strip {
        background: white;
        border-radius: 24px;
        padding: 20px;
        margin-bottom: 15px;
        border: 1px solid #eee;
        display: flex;
        align-items: center;
        transition: 0.3s;
    }
    .reorder-item-strip:hover { border-color: var(--primary); transform: translateX(10px); }

    .item-thumb {
        width: 80px; height: 80px;
        background: #f9f9f9;
        border-radius: 18px;
        padding: 10px;
        margin-right: 25px;
    }

    .qty-stepper {
        display: flex;
        align-items: center;
        background: #f1f1f1;
        border-radius: 12px;
        padding: 4px;
    }
    .qty-btn {
        width: 30px; height: 30px;
        border-radius: 10px;
        border: none;
        background: white;
        font-weight: bold;
        transition: 0.2s;
    }
    .qty-btn:hover { background: var(--primary); color: white; }
    .qty-val { width: 40px; text-align: center; font-weight: 800; font-size: 14px; }

    .summary-card {
        background: var(--dark);
        color: white;
        border-radius: 30px;
        padding: 35px;
        position: sticky;
        top: 100px;
        box-shadow: 0 20px 40px rgba(0,0,0,0.2);
    }
	
	
	
	
	
	
	
	/* Premium Reorder Summary Card */
.bento-card-summary {
    background: #ffffff;
    border-radius: 24px;
    padding: 35px;
    border: 1px solid #f0f0f0;
    box-shadow: 0 15px 35px rgba(0,0,0,0.05); /* Soft premium shadow */
    position: sticky;
    top: 100px;
}

.bento-card-summary h5 {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #8e8e93; /* Muted corporate grey */
    margin-bottom: 30px;
    font-weight: 800;
}

/* Summary Rows */
.summary-item {
    font-size: 15px;
    margin-bottom: 18px;
    color: #444;
}

.summary-value {
    font-weight: 700;
    color: #121212;
}

.delivery-free {
    color: #16a34a; /* Professional Success Green */
    font-weight: 800;
    font-size: 12px;
    background: #f0fdf4;
    padding: 4px 10px;
    border-radius: 8px;
}

/* Custom Divider */
.summary-divider {
    border: none;
    height: 1px;
    background: linear-gradient(to right, transparent, #eee, transparent);
    margin: 25px 0;
}

/* Action Button */
.btn-premium-action {
    background-color: var(--primary); /* #e9a71f */
    color: white;
    border: none;
    border-radius: 16px;
    padding: 16px !important;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: 0.5px;
    transition: 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    box-shadow: 0 10px 20px rgba(233, 167, 31, 0.3);
}

.btn-premium-action:hover {
    background-color: #121212;
    color: white;
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.2);
}

/* Footnote info */
.summary-footnote {
    font-size: 11px;
    line-height: 1.6;
    color: #999;
    margin-top: 20px;
    font-weight: 500;
}


.btn-theme a{ color:#fff; text-decoration:none}

.logo img{width: 39%;}










/* --- Tracking V2 Premium Styling --- */
.tracking-v2-wrapper {
    background: #ffffff;
    padding: 40px 20px;
    border-radius: 30px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.03);
    margin: 20px 0;
}

.tracking-v2-container {
    display: flex;
    justify-content: space-between;
    position: relative;
    max-width: 900px;
    margin: 0 auto;
}

.tracking-v2-item {
    flex: 1;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    z-index: 2;
}

/* Connecting Line */
.v2-connector {
    position: absolute;
    top: 25px; /* Centers with icon-box */
    left: 50%;
    width: 100%;
    height: 4px;
    background: #f1f3f5;
    z-index: -1;
}

/* Icon Box Styling */
.v2-icon-box {
    width: 50px;
    height: 50px;
    border-radius: 15px;
    background: #f8fafc;
    color: #cbd5e0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    margin-bottom: 15px;
    border: 4px solid #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    transition: 0.4s;
}

/* --- Status Logic --- */

/* Completed State */
.tracking-v2-item.completed .v2-icon-box {
    background: #10b981; /* Success Green */
    color: white;
}
.tracking-v2-item.completed .v2-connector {
    background: #10b981;
}

/* Current State (Active Gold) */
.tracking-v2-item.current .v2-icon-box {
    background: var(--primary); /* Gold #e9a71f */
    color: white;
    box-shadow: 0 0 20px rgba(233, 167, 31, 0.4);
    animation: v2-pulse-gold 2s infinite;
}

/* Content Styling */
.v2-title {
    font-weight: 800;
    font-size: 13px;
    margin-bottom: 2px;
    color: #1a202c;
}

.v2-time {
    font-size: 10px;
    color: #94a3b8;
    margin-bottom: 8px;
}

.v2-tag {
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 3px 8px;
    background: #f1f5f9;
    border-radius: 6px;
    color: #64748b;
}

.v2-tag.active {
    background: var(--primary-soft);
    color: var(--primary);
}

/* Animations */
@keyframes v2-pulse-gold {
    0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(233, 167, 31, 0.4); }
    70% { transform: scale(1.05); box-shadow: 0 0 0 10px rgba(233, 167, 31, 0); }
    100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(233, 167, 31, 0); }
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .tracking-v2-container { flex-direction: column; align-items: flex-start; padding-left: 50px; }
    .tracking-v2-item { align-items: flex-start; text-align: left; padding-bottom: 30px; }
    .v2-connector { left: 23px; top: 50px; width: 4px; height: 100%; }
    .v2-icon-box { position: absolute; left: -50px; }
}