*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Poppins',sans-serif;
}

body{
background:#fff5f8;
}

/* HEADER */

.header{

height:80px;

background:white;

display:flex;

align-items:center;

justify-content:space-between;

padding:0 25px;

box-shadow:0 2px 20px rgba(0,0,0,.08);

position:sticky;

top:0;

z-index:999;

}
/* NEWSLETTER */

.newsletter-section{

padding:70px 30px;

background:linear-gradient(
135deg,
#ff4f8b,
#ff7aa8
);

color:white;

text-align:center;

}

.newsletter-section h2{

font-size:42px;

font-weight:700;

margin-bottom:15px;

}

.newsletter-section p{

max-width:700px;

margin:auto;

margin-bottom:30px;

opacity:.95;

}

.newsletter-form{

display:flex;

justify-content:center;

max-width:700px;

margin:auto;

}

.newsletter-form input{

flex:1;

height:60px;

border:none;

padding:0 20px;

border-radius:40px 0 0 40px;

outline:none;

}

.newsletter-form button{

width:180px;

border:none;

background:#222;

color:white;

font-weight:600;

border-radius:0 40px 40px 0;

}

/* INSTAGRAM */

.instagram-section{

padding:60px 40px;

background:white;

}

.instagram-grid{

display:grid;

grid-template-columns:
repeat(auto-fit,minmax(220px,1fr));

gap:15px;

}

.instagram-grid img{

width:100%;

height:220px;

object-fit:cover;

border-radius:20px;

transition:.4s;

cursor:pointer;

}

.instagram-grid img:hover{

transform:scale(1.04);

}

/* FOOTER */

.footer{

background:#1d1d1d;

color:white;

padding:70px 40px 30px;

}

.footer-top{

display:grid;

grid-template-columns:
repeat(auto-fit,minmax(220px,1fr));

gap:40px;

margin-bottom:40px;

}

.footer-logo{

font-size:34px;

font-weight:700;

color:#ff4f8b;

margin-bottom:15px;

}

.footer h4{

margin-bottom:20px;

}

.footer ul{

list-style:none;

padding:0;

}

.footer ul li{

margin-bottom:10px;

}

.footer ul li a{

color:#ccc;

text-decoration:none;

}

.footer ul li a:hover{

color:#ff4f8b;

}

.social-icons{

display:flex;

gap:15px;

margin-top:20px;

}

.social-icons a{

width:45px;

height:45px;

border-radius:50%;

background:#333;

display:flex;

align-items:center;

justify-content:center;

color:white;

text-decoration:none;

transition:.3s;

}

.social-icons a:hover{

background:#ff4f8b;

}

.footer-bottom{

text-align:center;

border-top:1px solid #333;

padding-top:25px;

color:#aaa;

}

/* FLOAT BUTTONS */

.whatsapp-btn{

position:fixed;

bottom:25px;

right:25px;

width:65px;

height:65px;

border-radius:50%;

background:#25D366;

color:white;

font-size:28px;

display:flex;

justify-content:center;

align-items:center;

z-index:999;

text-decoration:none;

box-shadow:0 10px 25px rgba(0,0,0,.2);

}

.back-top{

position:fixed;

bottom:105px;

right:25px;

width:55px;

height:55px;

border-radius:50%;

background:#ff4f8b;

color:white;

display:flex;

justify-content:center;

align-items:center;

cursor:pointer;

z-index:999;

box-shadow:0 10px 25px rgba(0,0,0,.2);

display:none;

}
/* LEFT */

.header-left{

display:flex;

align-items:center;

gap:20px;

}

.menu-btn{

font-size:28px;

cursor:pointer;

color:#ff4f8b;

}

.logo{

font-size:32px;

font-weight:700;

color:#ff4f8b;

}

/* SEARCH */

.search-box{

width:50%;

height:50px;

display:flex;

}

.search-box input{

width:100%;

border:none;

outline:none;

background:#fff0f5;

padding-left:20px;

border-radius:30px 0 0 30px;

font-size:15px;

}

.search-box button{

width:60px;

border:none;

background:#ff4f8b;

color:white;

border-radius:0 30px 30px 0;

cursor:pointer;

}

/* RIGHT */

.header-right{

display:flex;

gap:25px;

align-items:center;

}

.header-right a{

font-size:22px;

color:#555;

text-decoration:none;

position:relative;

}


/* PRODUCTS */

.product-section{

padding:60px 40px;

background:#fff5f8;

}

.product-grid{

display:grid;

grid-template-columns:
repeat(auto-fit,minmax(260px,1fr));

gap:30px;

}

.product-card{

background:white;

border-radius:20px;

overflow:hidden;

box-shadow:0 5px 25px rgba(0,0,0,.08);

transition:.3s;

position:relative;

}

.product-card:hover{

transform:translateY(-10px);

box-shadow:0 15px 40px rgba(0,0,0,.15);

}

.product-img{

height:280px;

overflow:hidden;

}

.product-img img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.product-card:hover img{

transform:scale(1.08);

}

.discount-badge{

position:absolute;

top:15px;

left:15px;

background:#ff4f8b;

color:white;

padding:6px 12px;

border-radius:20px;

font-size:12px;

font-weight:600;

z-index:2;

}

.wishlist-btn{

position:absolute;

top:15px;

right:15px;

width:40px;

height:40px;

background:white;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

cursor:pointer;

box-shadow:0 2px 10px rgba(0,0,0,.15);

z-index:2;

}

.wishlist-btn i{

color:#ff4f8b;

}

.product-info{

padding:20px;

}

.product-title{

font-size:18px;

font-weight:600;

margin-bottom:10px;

color:#333;

}

.product-desc{

font-size:13px;

color:#777;

line-height:22px;

margin-bottom:15px;

}

.price-row{

display:flex;

align-items:center;

gap:10px;

margin-bottom:15px;

}

.new-price{

font-size:22px;

font-weight:700;

color:#ff4f8b;

}

.old-price{

font-size:14px;

color:#999;

text-decoration:line-through;

}

.cart-btn{

width:100%;

height:48px;

border:none;

border-radius:30px;

background:#ff4f8b;

color:white;

font-weight:600;

cursor:pointer;

transition:.3s;

}

.cart-btn:hover{

background:#e91e63;

}

.section-head{

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:30px;

}

.section-head h2{

font-size:32px;

font-weight:700;

}

.view-all{

color:#ff4f8b;

font-weight:600;

text-decoration:none;

}


.cart-count{

position:absolute;

top:-10px;

right:-12px;

width:20px;

height:20px;

border-radius:50%;

background:red;

color:white;

font-size:11px;

display:flex;

justify-content:center;

align-items:center;

}

/* SIDEBAR */

.overlay{

position:fixed;

left:0;

top:0;

width:100%;

height:100%;

background:rgba(0,0,0,.5);

display:none;

z-index:9998;

}

.sidebar{

position:fixed;

left:-320px;

top:0;

width:320px;

height:100vh;

background:white;

z-index:9999;

transition:.4s;

overflow:auto;

}

.sidebar.active{

left:0;

}

/* USER */

.user-box{

height:130px;

background:linear-gradient(
45deg,
#ff4f8b,
#ff79a7
);

display:flex;

align-items:center;

padding:20px;

color:white;

}

.user-box i{

font-size:60px;

margin-right:15px;

}

.user-box h3{

font-size:20px;

}

.user-box p{

font-size:13px;

}

/* MENU */

.menu-list{

list-style:none;

}

.menu-list li{

padding:18px 25px;

border-bottom:1px solid #eee;

cursor:pointer;

font-size:15px;

font-weight:500;

}

.menu-list li:hover{

background:#fff0f5;

}

.menu-list i{

margin-right:12px;

color:#ff4f8b;

}

/* MOBILE */

@media(max-width:768px){

.search-box{

display:none;

}

.logo{

font-size:24px;

}

.header{

padding:0 15px;

}

.header-right{

gap:18px;

}

}
/* TOP INFO BAR */

.top-strip{
background:#fff;
padding:12px 25px;
display:flex;
justify-content:space-between;
align-items:center;
border-bottom:1px solid #eee;
}

.location{
font-size:14px;
font-weight:500;
color:#555;
}

.location i{
color:#ff4f8b;
margin-right:6px;
}

.offer-strip{
background:linear-gradient(
90deg,
#ff4f8b,
#ff79a7
);
color:#fff;
padding:12px;
text-align:center;
font-size:14px;
font-weight:500;
}

/* HERO */

.hero-slider{
width:100%;
height:450px;
overflow:hidden;
position:relative;
}

.hero-slide{
position:absolute;
width:100%;
height:100%;
opacity:0;
transition:1s;
}

.hero-slide.active{
opacity:1;
}

.hero-slide img{
width:100%;
height:100%;
object-fit:cover;
}

.hero-content{
position:absolute;
left:8%;
top:50%;
transform:translateY(-50%);
color:white;
max-width:500px;
}

.hero-content h1{
font-size:55px;
font-weight:700;
}

.hero-content p{
font-size:18px;
margin:15px 0;
}

.hero-btn{
display:inline-block;
padding:14px 30px;
background:#ff4f8b;
color:white;
text-decoration:none;
border-radius:30px;
font-weight:600;
}

/* LOADER */

.loader{

position:fixed;

top:0;

left:0;

width:100%;

height:100%;

background:white;

z-index:99999;

display:flex;

justify-content:center;

align-items:center;

flex-direction:column;

}

.loader-logo{

font-size:55px;

font-weight:700;

color:#ff4f8b;

animation:pulse 1s infinite;
}

@keyframes pulse{

0%{transform:scale(1);}
50%{transform:scale(1.1);}
100%{transform:scale(1);}
}

/* DARK MODE */

.dark-toggle{

position:fixed;

left:20px;

bottom:20px;

width:55px;

height:55px;

background:#222;

color:white;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

cursor:pointer;

z-index:999;

}

.dark{

background:#111 !important;
color:white !important;
}

.dark .product-card,
.dark .feature-card,
.dark .trust-card,
.dark .brand-card{

background:#222;
color:white;

}

/* SEARCH POPUP */

.search-popup{

position:fixed;

top:-100%;

left:0;

width:100%;

background:white;

padding:30px;

z-index:99999;

transition:.4s;

box-shadow:0 10px 30px rgba(0,0,0,.15);

}

.search-popup.active{

top:0;

}

.search-popup input{

width:100%;

height:60px;

padding:0 20px;

border:2px solid #ff4f8b;

border-radius:30px;

outline:none;

}

/* LOGIN POPUP */

.login-popup{

position:fixed;

top:50%;

left:50%;

transform:translate(-50%,-50%);

background:white;

width:400px;

max-width:90%;

padding:30px;

border-radius:25px;

display:none;

z-index:99999;

}

.login-popup h3{

margin-bottom:20px;

}

.login-popup input{

width:100%;

height:50px;

margin-bottom:15px;

padding-left:15px;

border:1px solid #ddd;

border-radius:12px;

}

.login-popup button{

width:100%;

height:50px;

border:none;

background:#ff4f8b;

color:white;

border-radius:12px;

}

/* MINI CART */

.mini-cart{

position:fixed;

right:-380px;

top:0;

width:350px;

height:100vh;

background:white;

z-index:99999;

transition:.4s;

box-shadow:-5px 0 30px rgba(0,0,0,.15);

padding:20px;

overflow:auto;

}

.mini-cart.active{

right:0;

}

.mini-cart h3{

margin-bottom:20px;

}

.cart-item{

display:flex;

gap:15px;

margin-bottom:15px;

}

.cart-item img{

width:70px;

height:70px;

object-fit:cover;

border-radius:10px;

}

/* MOBILE BAR */

.mobile-bar{

position:fixed;

bottom:0;

left:0;

width:100%;

height:65px;

background:white;

display:none;

justify-content:space-around;

align-items:center;

box-shadow:0 -5px 20px rgba(0,0,0,.1);

z-index:999;

}

.mobile-bar a{

color:#555;

font-size:22px;

}

@media(max-width:768px){

.mobile-bar{

display:flex;

}

}

/* CATEGORY */

.category-section{
padding:50px 40px;
background:white;
}

.section-title{
font-size:32px;
font-weight:700;
text-align:center;
margin-bottom:35px;
color:#333;
}

.category-wrap{
display:flex;
justify-content:center;
flex-wrap:wrap;
gap:30px;
}

.category-item{
text-align:center;
cursor:pointer;
}

.category-circle{

width:120px;
height:120px;

border-radius:50%;

overflow:hidden;

box-shadow:0 5px 25px rgba(0,0,0,.1);

transition:.3s;
}

.category-circle:hover{
transform:translateY(-8px);
}

.category-circle img{

width:100%;
height:100%;
object-fit:cover;

}

.category-item h4{
margin-top:12px;
font-size:15px;
}

/* MOBILE */

@media(max-width:768px){

.hero-slider{
height:280px;
}

.hero-content h1{
font-size:30px;
}

.hero-content p{
font-size:14px;
}

.category-circle{
width:90px;
height:90px;
}

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

}

/* FEATURED COLLECTION */

.featured-section{
padding:60px 40px;
background:white;
}

.featured-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(350px,1fr));
gap:25px;
}

.feature-card{
height:250px;
border-radius:25px;
overflow:hidden;
position:relative;
cursor:pointer;
}

.feature-card img{
width:100%;
height:100%;
object-fit:cover;
transition:.5s;
}

.feature-card:hover img{
transform:scale(1.1);
}

.feature-overlay{
position:absolute;
inset:0;
background:linear-gradient(
to top,
rgba(0,0,0,.7),
rgba(0,0,0,.1)
);

display:flex;
flex-direction:column;
justify-content:flex-end;

padding:25px;
color:white;
}

.feature-overlay h3{
font-size:28px;
font-weight:700;
}

.feature-overlay p{
font-size:14px;
margin-top:10px;
}

/* DEAL OF DAY */

.deal-section{

padding:60px 40px;

background:#fff0f6;

}

.deal-box{

background:white;

border-radius:30px;

padding:40px;

display:flex;

align-items:center;

justify-content:space-between;

gap:40px;

box-shadow:0 10px 35px rgba(0,0,0,.08);

}

.deal-content{

flex:1;

}

.deal-tag{

display:inline-block;

padding:8px 15px;

background:#ff4f8b;

color:white;

border-radius:30px;

margin-bottom:15px;

font-size:13px;

}

.deal-content h2{

font-size:42px;

font-weight:700;

margin-bottom:15px;

}

.deal-content p{

color:#666;

line-height:28px;

margin-bottom:20px;

}

.deal-btn{

display:inline-block;

padding:14px 30px;

background:#ff4f8b;

color:white;

text-decoration:none;

border-radius:30px;

font-weight:600;

}

.deal-image{

flex:1;

}

.deal-image img{

width:100%;

border-radius:25px;

}

/* BRANDS */

.brand-section{

padding:60px 40px;

background:white;

}

.brand-slider{

display:flex;

gap:25px;

overflow-x:auto;

padding-bottom:15px;

}

.brand-slider::-webkit-scrollbar{

height:8px;

}

.brand-slider::-webkit-scrollbar-thumb{

background:#ff4f8b;

border-radius:20px;

}

.brand-card{

min-width:220px;

height:120px;

background:#fff5f8;

border-radius:20px;

display:flex;

align-items:center;

justify-content:center;

font-size:24px;

font-weight:700;

color:#ff4f8b;

box-shadow:0 5px 15px rgba(0,0,0,.08);

}

/* TRUST */

.trust-section{

padding:50px 30px;

background:#fff0f6;

}

.trust-grid{

display:grid;

grid-template-columns:
repeat(auto-fit,minmax(220px,1fr));

gap:25px;

}

.trust-card{

background:white;

padding:25px;

border-radius:20px;

text-align:center;

}

.trust-card i{

font-size:42px;

color:#ff4f8b;

margin-bottom:15px;

}

.trust-card h4{

margin-bottom:10px;

}
.login-page{
padding:80px 20px;
display:flex;
justify-content:center;
align-items:center;
min-height:70vh;
}

.login-container{
width:100%;
max-width:450px;
background:#fff;
padding:40px;
border-radius:25px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.login-container h2{
font-size:32px;
margin-bottom:10px;
}

.login-container p{
color:#777;
margin-bottom:25px;
}

.login-container input{
width:100%;
padding:15px;
border:1px solid #eee;
border-radius:15px;
margin-bottom:15px;
}

.login-container button{
width:100%;
padding:15px;
border:none;
border-radius:15px;
background:#ff4fa0;
color:#fff;
font-weight:600;
cursor:pointer;
}

.error-box{
background:#ffe7e7;
color:#c62828;
padding:12px;
border-radius:10px;
margin-bottom:15px;
}

.login-links,
.register-link{
text-align:center;
margin-top:15px;
}
.login-container{
    width:100%;
    max-width:450px;
    background:#fff;
    padding:40px;
    border-radius:25px;
    border:2px solid #ff4f8b;
    box-shadow:0 10px 30px rgba(255,79,139,.15);
}
.register-link a,
.login-links a{
color:#ff4f8b;
font-weight:600;
text-decoration:none;
}

.register-link a:hover,
.login-links a:hover{
text-decoration:underline;
}
/* CONTENT PAGES */

.content-page{

padding:60px 20px;

}


.profile-card{
max-width:900px;
margin:auto;
background:#fff;
padding:40px;
border-radius:25px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.profile-image{
width:120px;
height:120px;
border-radius:50%;
object-fit:cover;
border:4px solid #ff4f8b;
}

.profile-stat{
background:#fff8fb;
padding:15px;
border-radius:15px;
text-align:center;
border:1px solid #ffe0ec;
}

.profile-stat h4{
margin:0;
color:#ff4f8b;
font-weight:700;
}

.quick-btn{
display:block;
padding:12px;
background:#fff;
border:1px solid #eee;
border-radius:12px;
text-align:center;
text-decoration:none;
color:#333;
font-weight:600;
transition:.3s;
}

.quick-btn:hover{
background:#ff4f8b;
color:#fff;
}
.content-card{

max-width:1000px;

margin:auto;

background:#fff;

padding:40px;

border-radius:25px;

border:3px solid #ff4f8b;

box-shadow:0 10px 30px rgba(0,0,0,.08);

}

.page-title{

font-size:36px;

font-weight:700;

margin-bottom:25px;

color:#ff4f8b;

}

.content-body{

line-height:30px;

font-size:16px;

color:#555;

}
/* ABOUT PAGE */

.inner-hero{
height:420px;
position:relative;
overflow:hidden;
}

.inner-hero img{
width:100%;
height:100%;
object-fit:cover;
}

.inner-hero::before{
content:'';
position:absolute;
inset:0;
background:rgba(0,0,0,.45);
}

.inner-hero-content{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
text-align:center;
color:#fff;
z-index:2;
}

.inner-hero-content h1{
font-size:55px;
font-weight:700;
margin-bottom:15px;
}

.inner-hero-content p{
font-size:18px;
}

.about-section{
padding:70px 40px;
background:#fff;
}

.about-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:50px;
align-items:center;
max-width:1200px;
margin:auto;
}

.about-image img{
width:100%;
border-radius:25px;
box-shadow:0 10px 30px rgba(0,0,0,.12);
}

.about-text h2{
font-size:38px;
margin-bottom:20px;
color:#ff4f8b;
}

.stats-section{
padding:70px 40px;
background:#fff5f8;
}

.stats-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:25px;
max-width:1200px;
margin:auto;
}

.stat-box{
background:#fff;
padding:30px;
border-radius:20px;
text-align:center;
box-shadow:0 5px 20px rgba(0,0,0,.08);
}

.stat-box h2{
font-size:42px;
color:#ff4f8b;
margin-bottom:10px;
}

.about-cta{
padding:80px 20px;
text-align:center;
background:linear-gradient(
135deg,
#ff4f8b,
#ff7aa8
);
color:#fff;
}

.about-cta h2{
font-size:42px;
margin-bottom:15px;
}

.about-cta p{
max-width:700px;
margin:auto;
margin-bottom:25px;
}

@media(max-width:768px){

.about-grid{
grid-template-columns:1fr;
}

.stats-grid{
grid-template-columns:1fr 1fr;
}

.inner-hero-content h1{
font-size:34px;
}

}
/* CART PAGE */

.cart-page{
padding:60px 30px;
background:#fff5f8;
min-height:70vh;
}

.cart-wrapper{
background:#fff;
padding:30px;
border-radius:25px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.cart-title{
font-size:32px;
font-weight:700;
margin-bottom:25px;
color:#333;
}

.cart-table{
width:100%;
border-collapse:collapse;
}

.cart-table th{
background:#ff4f8b;
color:#fff;
padding:15px;
text-align:left;
}

.cart-table td{
padding:15px;
border-bottom:1px solid #eee;
vertical-align:middle;
}

.cart-product{
display:flex;
align-items:center;
gap:15px;
}

.cart-product img{
width:80px;
height:80px;
object-fit:cover;
border-radius:12px;
}

.qty-input{
width:80px;
padding:10px;
border:2px solid #ff4f8b;
border-radius:10px;
outline:none;
}

.remove-btn{
background:#ff4f8b;
color:#fff;
padding:8px 15px;
border-radius:8px;
text-decoration:none;
}

.cart-bottom{
display:flex;
justify-content:space-between;
align-items:flex-start;
margin-top:30px;
gap:30px;
flex-wrap:wrap;
}

.update-btn{
background:#555;
color:#fff;
border:none;
padding:12px 25px;
border-radius:30px;
cursor:pointer;
}

.summary-box{
background:#fff5f8;
padding:25px;
border-radius:20px;
min-width:300px;
}

.summary-box h3{
margin-bottom:15px;
}

.summary-row{
display:flex;
justify-content:space-between;
margin-bottom:12px;
}

.checkout-btn{
display:block;
width:100%;
background:#ff4f8b;
color:#fff;
text-align:center;
padding:14px;
border-radius:30px;
text-decoration:none;
margin-top:20px;
font-weight:600;
}

.empty-cart{
text-align:center;
padding:60px;
font-size:20px;
}

@media(max-width:768px){

.cart-table{
display:block;
overflow-x:auto;
}

.cart-wrapper{
padding:20px;
}

}
/* CATEGORY PAGE */

.category-page{
padding:60px 40px;
background:#fff5f8;
min-height:70vh;
}

.category-header{
text-align:center;
margin-bottom:40px;
}

.category-header h1{
font-size:42px;
font-weight:700;
color:#333;
}

.category-header p{
color:#777;
margin-top:10px;
}

.category-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:30px;
}

.no-product{
background:#fff;
padding:50px;
border-radius:20px;
text-align:center;
box-shadow:0 10px 25px rgba(0,0,0,.08);
}
/* CHECKOUT PAGE */

.checkout-layout{
display:grid;
grid-template-columns:2fr 1fr;
gap:30px;
align-items:start;
}

.checkout-left{
background:#fff;
padding:30px;
border-radius:25px;
border:3px solid #ff4f8b;
box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.checkout-right{
position:sticky;
top:100px;
}

.checkout-summary{
background:#fff;
padding:25px;
border-radius:25px;
border:3px solid #ff4f8b;
box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.address-box{
padding:15px;
border:2px solid #eee;
border-radius:15px;
margin-bottom:15px;
}

.address-box:hover{
border-color:#ff4f8b;
}

.checkout-summary h3{
margin-bottom:20px;
}

.summary-row{
display:flex;
justify-content:space-between;
margin-bottom:12px;
}

.summary-total{
display:flex;
justify-content:space-between;
font-size:24px;
font-weight:700;
color:#ff4f8b;
margin-top:15px;
padding-top:15px;
border-top:1px solid #eee;
}

@media(max-width:768px){

.checkout-layout{
grid-template-columns:1fr;
}

.checkout-right{
position:static;
}

}
.checkout-left input,
.checkout-left textarea{
width:100%;
padding:15px;
border:1px solid #eee;
border-radius:15px;
margin-bottom:15px;
outline:none;
}

.checkout-left input:focus,
.checkout-left textarea:focus{
border-color:#ff4f8b;
}
.checkout-left button{
background:#ff4f8b;
color:#fff;
border:none;
padding:14px 25px;
border-radius:30px;
cursor:pointer;
font-weight:600;
}

.checkout-left button:hover{
background:#e91e63;
}
/* CUSTOM ORDER PAGE */

.custom-page{
padding:60px 20px;
}

.custom-container{
max-width:1100px;
margin:auto;
background:#fff;
padding:40px;
border-radius:25px;
border:3px solid #ff4f8b;
box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.custom-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:15px;
}

.custom-full{
grid-column:1/-1;
}

.custom-container input,
.custom-container textarea,
.custom-container select{
width:100%;
padding:15px;
border:1px solid #eee;
border-radius:15px;
outline:none;
margin-bottom:15px;
}

.custom-container input:focus,
.custom-container textarea:focus{
border-color:#ff4f8b;
}

.custom-btn{
width:100%;
background:#ff4f8b;
color:#fff;
border:none;
padding:15px;
border-radius:30px;
font-weight:600;
cursor:pointer;
}

.custom-btn:hover{
background:#e91e63;
}

.success-box{
background:#e8fff0;
color:#0f8a43;
padding:15px;
border-radius:12px;
margin-bottom:20px;
}

@media(max-width:768px){

.custom-grid{
grid-template-columns:1fr;
}

}
/* CUSTOM ORDER DETAILS */

.details-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:25px;
}

.info-card{
background:#fff5f8;
padding:25px;
border-radius:20px;
border:2px solid #ffd6e5;
}

.info-card h5{
margin-bottom:15px;
color:#ff4f8b;
}

.preview-img{
width:100%;
border-radius:15px;
margin-top:10px;
}

.status-badge{
display:inline-block;
padding:8px 15px;
border-radius:30px;
font-size:13px;
font-weight:600;
}

@media(max-width:768px){

.details-grid{
grid-template-columns:1fr;
}

}
.custom-full{
grid-column:1/-1;
}

.info-card table{
width:100%;
border-collapse:collapse;
}

.info-card td,
.info-card th{
padding:10px 0;
border-bottom:1px solid #eee;
}

.invoice-btn{
display:block;
width:100%;
padding:14px;
text-align:center;
background:#ff4f8b;
color:#fff;
border-radius:15px;
text-decoration:none;
margin-top:15px;
font-weight:600;
}

.pay-btn{
display:block;
width:100%;
padding:14px;
text-align:center;
background:#28a745;
color:#fff;
border-radius:15px;
text-decoration:none;
margin-top:15px;
font-weight:600;
}
/* CUSTOM ORDERS LIST */

.orders-table{
width:100%;
border-collapse:collapse;
}

.orders-table th{
background:#ff4f8b;
color:#fff;
padding:15px;
text-align:left;
}

.orders-table td{
padding:15px;
border-bottom:1px solid #eee;
}

.orders-table tr:hover{
background:#fff5f8;
}

.view-btn{
display:inline-block;
padding:10px 18px;
background:#ff4f8b;
color:#fff;
border-radius:25px;
text-decoration:none;
font-size:14px;
}

.view-btn:hover{
background:#e91e63;
}

.green-badge{
background:#28a745;
color:#fff;
padding:6px 12px;
border-radius:20px;
font-size:12px;
}

.red-badge{
background:#dc3545;
color:#fff;
padding:6px 12px;
border-radius:20px;
font-size:12px;
}

.yellow-badge{
background:#ffc107;
color:#222;
padding:6px 12px;
border-radius:20px;
font-size:12px;
}

.blue-badge{
background:#0d6efd;
color:#fff;
padding:6px 12px;
border-radius:20px;
font-size:12px;
}

.gray-badge{
background:#6c757d;
color:#fff;
padding:6px 12px;
border-radius:20px;
font-size:12px;
}

.empty-orders{
text-align:center;
padding:60px 20px;
}

.empty-orders a{
display:inline-block;
margin-top:15px;
padding:14px 25px;
background:#ff4f8b;
color:#fff;
border-radius:30px;
text-decoration:none;
}

@media(max-width:768px){

.orders-table{
min-width:900px;
}

}
.success-payment{
max-width:600px;
margin:auto;
text-align:center;
}

.success-icon{
width:90px;
height:90px;
border-radius:50%;
background:#d4edda;
color:#198754;
display:flex;
align-items:center;
justify-content:center;
font-size:40px;
margin:0 auto 25px;
}

.success-payment h2{
margin-bottom:15px;
}

.success-summary{
background:#fff5f8;
padding:20px;
border-radius:20px;
margin:25px 0;
}

.success-row{
display:flex;
justify-content:space-between;
margin-bottom:10px;
}

.success-btn{
display:block;
width:100%;
background:#28a745;
color:#fff;
padding:15px;
border-radius:30px;
text-decoration:none;
font-weight:600;
}

.success-btn:hover{
background:#218838;
}
/* CUSTOM PAYMENT PAGE */

.payment-page{
padding:60px 20px;
}

.payment-box{
max-width:600px;
margin:auto;
background:#fff;
padding:40px;
border-radius:25px;
border:3px solid #ff4f8b;
box-shadow:0 10px 30px rgba(0,0,0,.08);
text-align:center;
}

.payment-icon{
font-size:60px;
color:#28a745;
margin-bottom:20px;
}

.amount-text{
font-size:42px;
font-weight:700;
color:#ff4f8b;
margin:25px 0;
}

.pay-btn{
display:block;
width:100%;
background:#ff4f8b;
color:#fff;
border:none;
padding:15px;
border-radius:30px;
font-weight:600;
cursor:pointer;
font-size:16px;
}

.pay-btn:hover{
background:#e91e63;
}

.back-link{
display:inline-block;
margin-top:20px;
color:#777;
text-decoration:none;
}