*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#050505;color:#fff;font-family:Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{cursor:pointer}img{max-width:100%;display:block}.topbar{position:sticky;top:0;z-index:50;height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:rgba(5,5,5,.82);backdrop-filter:blur(18px);border-bottom:1px solid #1c1c1c}.brand{font-weight:900;letter-spacing:.24em}.desktop-nav{display:flex;gap:28px;color:#cfcfcf}.desktop-nav a:hover{color:white}.icon-btn,.btn{border:1px solid #333;border-radius:999px;padding:13px 18px;background:#111;color:#fff}.icon-btn span{background:#fff;color:#000;border-radius:999px;padding:2px 7px;margin-left:5px}.btn{display:inline-flex;align-items:center;justify-content:center;font-weight:800;transition:.25s}.btn:hover{transform:translateY(-2px)}.primary{background:#fff;color:#000;border-color:#fff}.secondary{background:#111;color:#fff}.danger{border-color:#552222!important;color:#ff8d8d!important}.hero{min-height:calc(100vh - 72px);display:grid;grid-template-columns:1.08fr .92fr;gap:40px;align-items:center;padding:60px 5vw;background:radial-gradient(circle at top right,#323232,transparent 38%),linear-gradient(135deg,#050505,#101010 48%,#000)}.hero h1{font-size:clamp(42px,7vw,96px);line-height:.92;margin:10px 0;letter-spacing:-.06em}.hero p{color:#cfcfcf;max-width:620px;font-size:18px}.eyebrow{letter-spacing:.28em;text-transform:uppercase;color:#8c8c8c;font-size:12px;font-weight:900}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}.hero-product{min-height:520px;border:1px solid #242424;border-radius:36px;background:linear-gradient(145deg,#111,#030303);display:grid;place-items:center;box-shadow:0 30px 90px #000}.mock-shirt{width:min(360px,75vw);aspect-ratio:.76;background:#efefef;color:#050505;border-radius:80px 80px 28px 28px;display:flex;align-items:center;justify-content:center;flex-direction:column;font-weight:950;letter-spacing:.16em;box-shadow:inset 0 -30px 70px #bbb}.mock-shirt small{font-size:12px;letter-spacing:.3em;margin-top:12px}.marquee{display:flex;overflow:hidden;gap:40px;padding:18px 5vw;border-block:1px solid #191919;color:#aaa;white-space:nowrap}.marquee span{font-weight:900;letter-spacing:.18em}.section{padding:80px 5vw}.section-head{margin-bottom:28px}.section-head h2{font-size:clamp(30px,4vw,54px);margin:6px 0;letter-spacing:-.04em}.row{display:flex;align-items:end;justify-content:space-between;gap:15px}.select,input,textarea,select{width:100%;background:#0d0d0d;color:#fff;border:1px solid #262626;border-radius:16px;padding:14px 15px;outline:none}textarea{min-height:96px;resize:vertical}.category-grid,.product-grid,.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.category-card,.product-card,.review-grid article,.feature-list article,.login-card,.admin-dashboard{border:1px solid #242424;background:#0d0d0d;border-radius:28px;overflow:hidden}.category-card{min-height:220px;display:flex;align-items:end;padding:22px;background-size:cover;background-position:center;position:relative}.category-card:before{content:"";position:absolute;inset:0;background:linear-gradient(transparent,rgba(0,0,0,.9))}.category-card h3{position:relative;margin:0;font-size:24px}.product-card img{height:360px;width:100%;object-fit:cover;background:#111}.product-body{padding:20px}.product-body h3{font-size:21px;margin:4px 0}.muted{color:#a8a8a8}.small{font-size:13px}.split-panel{display:grid;grid-template-columns:.8fr 1.2fr;gap:30px;align-items:start;background:#090909}.feature-list{display:grid;gap:15px}.feature-list article,.review-grid article{padding:22px}.review-grid article{display:flex;flex-direction:column;gap:18px;color:#ddd}.admin-section{background:#060606}.login-card{max-width:560px;padding:22px;display:grid;gap:12px}.hidden{display:none!important}.admin-dashboard{padding:18px}.admin-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}.tab{border:1px solid #333;background:#111;color:#aaa;border-radius:999px;padding:11px 15px}.tab.active{background:#fff;color:#000;border-color:#fff}.admin-panel{border-top:1px solid #202020;padding-top:18px}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:14px 0}.form-grid textarea{grid-column:1/-1}.two{grid-template-columns:repeat(2,1fr)}.admin-list{display:grid;gap:12px;margin-top:18px}.admin-row,.cart-row{display:grid;grid-template-columns:74px 1fr auto;gap:14px;align-items:center;padding:12px;border:1px solid #242424;border-radius:18px;background:#090909}.admin-row img,.cart-row img{width:74px;height:74px;object-fit:cover;border-radius:14px}.mini-actions{display:flex;gap:8px;flex-wrap:wrap}.mini-actions button,.cart-row button{border:1px solid #333;background:#151515;color:#fff;border-radius:12px;padding:9px 12px}.modal,.drawer{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.75);backdrop-filter:blur(10px)}.modal{display:grid;place-items:center;padding:20px}.modal-card{position:relative;width:min(1120px,100%);max-height:92vh;overflow:auto;display:grid;grid-template-columns:1fr 1fr;gap:24px;border:1px solid #292929;border-radius:32px;background:#090909;padding:22px}.close-btn{position:absolute;right:18px;top:15px;z-index:2;border:1px solid #333;background:#111;color:#fff;border-radius:50%;width:42px;height:42px;font-size:24px}.gallery img{width:100%;height:560px;object-fit:cover;border-radius:24px;background:#111}.thumb-row{display:flex;gap:10px;margin-top:10px;overflow:auto}.thumb-row img{width:86px;height:86px;object-fit:cover;border:1px solid #333;border-radius:14px;opacity:.75}.thumb-row img.active{opacity:1;border-color:#fff}.product-info{padding:20px}.product-info h2{font-size:38px;margin:5px 0}.chips{display:flex;gap:9px;flex-wrap:wrap;margin:8px 0 18px}.chip{border:1px solid #333;background:#111;color:#fff;border-radius:999px;padding:10px 15px}.chip.active{background:#fff;color:#000}.qty{display:inline-flex;align-items:center;gap:18px;border:1px solid #333;border-radius:999px;padding:8px 12px;margin:8px 0 18px}.qty button{background:#fff;color:#000;border:none;border-radius:50%;width:30px;height:30px;font-weight:900}.sticky-buy{width:100%;margin-top:15px}.drawer{display:flex;justify-content:flex-end}.drawer-card{position:relative;width:min(460px,100%);height:100%;overflow:auto;background:#080808;border-left:1px solid #292929;padding:28px}.bill-box{border:1px solid #292929;border-radius:22px;background:#0e0e0e;padding:16px;margin:15px 0}.bill-box p,.bill-box h3{display:flex;justify-content:space-between;margin:10px 0}.bill-box h3{font-size:24px;border-top:1px solid #262626;padding-top:14px}footer{text-align:center;color:#777;padding:35px;border-top:1px solid #191919}@media(max-width:850px){.desktop-nav{display:none}.topbar{height:64px;padding:0 16px}.hero{grid-template-columns:1fr;padding:42px 16px}.hero-product{min-height:370px}.section{padding:55px 16px}.category-grid,.product-grid,.review-grid,.split-panel,.modal-card,.form-grid,.two{grid-template-columns:1fr}.row{align-items:stretch;flex-direction:column}.product-card img{height:330px}.gallery img{height:430px}.modal-card{padding:14px}.product-info{padding:6px}.admin-row,.cart-row{grid-template-columns:60px 1fr}.mini-actions,.cart-row button{grid-column:2}.drawer-card{padding:22px 16px}.hero h1{font-size:46px}}
.nav-login{background:transparent;border:0;color:#cfcfcf;padding:0;font:inherit;cursor:pointer}.nav-login:hover{color:#fff}.admin-teaser{background:#060606}.admin-teaser-card{border:1px solid #242424;border-radius:32px;background:linear-gradient(135deg,#0d0d0d,#050505);padding:34px;max-width:760px}.admin-login-overlay{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:20px;background:linear-gradient(135deg,rgba(255,129,83,.88),rgba(255,39,143,.88),rgba(82,31,150,.88));backdrop-filter:blur(10px)}.login-window{position:relative;width:min(820px,96vw);min-height:430px;display:grid;grid-template-columns:1.08fr .92fr;border-radius:20px;background:#fff;color:#202020;box-shadow:0 30px 80px rgba(0,0,0,.35);overflow:hidden}.login-close{position:absolute;right:14px;top:12px;z-index:5;width:38px;height:38px;border:0;border-radius:50%;background:#f2f2f2;color:#222;font-size:26px}.login-art{position:relative;overflow:hidden;background:#fff}.login-art:before{content:"";position:absolute;inset:-70px 20px -70px -110px;border:38px solid rgba(255,255,255,.9);border-radius:45% 25% 45% 25%;background:linear-gradient(145deg,#ff477f,#8b2fb2);box-shadow:0 0 0 26px rgba(255,72,141,.22)}.blob{position:absolute;border-radius:50%;background:linear-gradient(135deg,#ff9d5c,#ff3e91,#7b2bb0)}.blob.one{width:95px;height:95px;right:44px;top:-20px}.blob.two{width:72px;height:72px;left:24px;bottom:20px}.blob.three{width:120px;height:120px;right:40px;bottom:-38px;opacity:.75}.login-form-side{display:flex;align-items:center;justify-content:center;padding:34px}.login-form-side h2{margin:0 0 16px;color:#222}.login-form-side input{background:#e9e9e9;color:#222;border:0;border-radius:12px;margin:10px 0}.login-gradient{width:100%;border:0;border-radius:999px;padding:13px 18px;margin:10px 0;color:#fff;font-weight:900;background:linear-gradient(90deg,#ff965d,#ff3e88,#7d2bb0);box-shadow:0 12px 26px rgba(255,62,136,.25)}.admin-panel-screen{position:fixed;inset:0;z-index:180;overflow:auto;background:#050505;padding:72px 5vw 40px}.close-admin-screen{position:fixed;right:22px;top:20px;z-index:181;border:1px solid #333;background:#111;color:#fff;border-radius:50%;width:46px;height:46px;font-size:26px}.admin-panel-screen .admin-panel{border:1px solid #242424;border-radius:28px;background:#0b0b0b;padding:22px;margin-top:16px}.admin-panel-screen .admin-tabs{position:sticky;top:0;background:#050505;padding:12px 0;z-index:2}
@media(max-width:700px){.login-window{grid-template-columns:1fr;min-height:auto}.login-art{min-height:180px}.login-form-side{padding:24px}.admin-panel-screen{padding:70px 16px 30px}.nav-login{display:none}}
/* Premium pink/white admin dashboard update */
.admin-pro{padding:0;background:#f4f6fb;color:#222;display:grid;grid-template-columns:260px 1fr;font-family:Inter,Arial,sans-serif}.admin-pro.hidden{display:none!important}.admin-sidebar{background:#df2f78;color:#fff;min-height:100vh;padding:22px 0;position:sticky;top:0}.admin-logo{display:flex;align-items:center;gap:12px;padding:0 24px 28px}.admin-logo span{width:36px;height:36px;border-radius:12px;background:#fff;color:#df2f78;display:grid;place-items:center;font-weight:950}.admin-logo b{display:block;letter-spacing:.08em}.admin-logo small{opacity:.8}.admin-nav{width:calc(100% - 24px);margin:5px 12px;border:0;border-radius:4px;background:transparent;color:#fff;text-align:left;padding:14px 18px;font-weight:700;transition:.2s}.admin-nav:hover,.admin-nav.active{background:#fff;color:#df2f78}.admin-nav.danger{margin-top:22px;color:#fff!important;border:0!important}.admin-workspace{padding:0 28px 40px;min-width:0}.admin-topline{height:76px;display:flex;align-items:center;justify-content:space-between;background:#fff;margin:0 -28px 28px;padding:0 32px;box-shadow:0 6px 18px rgba(20,20,20,.06)}.admin-topline h2{margin:0;color:#222}.admin-topline .muted{margin:4px 0 0;color:#777}.admin-topline .close-admin-screen{position:static;background:#f8f8f8;color:#222;border:1px solid #eee;box-shadow:none}.admin-pro .admin-panel{border:0!important;background:transparent!important;padding:0!important;margin:0!important}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.stat-card{min-height:122px;background:#fff;border-radius:4px;padding:24px;box-shadow:0 10px 30px rgba(20,20,20,.05);display:flex;flex-direction:column;justify-content:center}.stat-card span{color:#777;font-weight:700}.stat-card b{font-size:32px;color:#202020;margin:8px 0}.stat-card small{color:#999}.stat-card.pink{background:#df2f78;color:#fff}.stat-card.pink b,.stat-card.pink span,.stat-card.pink small{color:#fff}.admin-hero-card{margin-top:24px;background:#fff;border-radius:4px;padding:28px;display:flex;align-items:center;justify-content:space-between;gap:20px;box-shadow:0 10px 30px rgba(20,20,20,.05)}.admin-hero-card h3{font-size:28px;margin:6px 0;color:#222}.admin-pro .primary{background:#df2f78;color:#fff;border-color:#df2f78}.admin-pro .secondary{background:#fff;color:#df2f78;border-color:#f0bfd2}.panel-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.panel-title h3{font-size:24px;margin:4px 0;color:#222}.premium-form{background:#fff;border-radius:4px;padding:20px;box-shadow:0 10px 30px rgba(20,20,20,.05)}.admin-pro input,.admin-pro textarea,.admin-pro select{background:#f6f7fb;color:#222;border:1px solid #e8e8ef;border-radius:8px}.premium-list{background:#fff;border-radius:4px;padding:12px;box-shadow:0 10px 30px rgba(20,20,20,.05)}.admin-pro .admin-row{background:#fff;border:1px solid #f0f0f0;border-radius:4px;color:#222}.admin-pro .admin-row .muted{color:#777}.admin-pro .mini-actions button{background:#fff;color:#df2f78;border:1px solid #f0bfd2}.settings-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.settings-grid article{background:#fff;border-radius:4px;padding:24px;box-shadow:0 10px 30px rgba(20,20,20,.05)}.settings-grid span{display:block;color:#777;margin-bottom:8px}.settings-grid b{color:#222}.admin-pro .eyebrow{color:#df2f78}.admin-pro .muted{color:#777}@media(max-width:900px){.admin-pro{grid-template-columns:1fr}.admin-sidebar{min-height:auto;position:relative;display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:14px}.admin-logo{grid-column:1/-1;padding:0 8px 8px}.admin-nav{width:100%;margin:0}.admin-workspace{padding:0 14px 24px}.admin-topline{margin:0 -14px 18px;padding:12px 16px;height:auto}.stat-grid,.settings-grid{grid-template-columns:1fr}.admin-hero-card{align-items:stretch;flex-direction:column}}
.status-board{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}.status-board article{border:1px solid #242424;background:#101010;border-radius:24px;padding:20px}.status-board span,.stat-card span{display:block;color:#9a9a9a;font-size:13px}.status-board b{display:block;font-size:24px;margin:8px 0}.product-review-box{margin-top:18px;border-top:1px solid #242424;padding-top:16px}.product-photo-reviews{display:grid;gap:12px;max-height:320px;overflow:auto}.photo-review-card{display:grid;grid-template-columns:92px 1fr;gap:12px;border:1px solid #272727;background:#0e0e0e;border-radius:18px;padding:10px}.photo-review-card img{width:92px;height:92px;object-fit:cover;border-radius:14px}.photo-review-card span{display:block;color:#ffd66b;margin:4px 0}.photo-review-card p{margin:0;color:#cfcfcf;font-size:13px}.stat-grid{grid-template-columns:repeat(3,1fr)!important}.admin-row p{margin:4px 0}@media(max-width:900px){.status-board,.stat-grid{grid-template-columns:1fr!important}.photo-review-card{grid-template-columns:74px 1fr}.photo-review-card img{width:74px;height:74px}}
.user-review-form{margin-top:16px;border:1px solid #272727;background:#080808;border-radius:20px;padding:14px;display:grid;gap:10px}.user-review-form h4{margin:0 0 4px}.user-review-form input,.user-review-form select,.user-review-form textarea{width:100%;background:#121212;color:#fff;border:1px solid #2b2b2b;border-radius:14px;padding:12px}.user-review-form textarea{min-height:82px;resize:vertical}.user-review-form input[type=file]{padding:10px;color:#cfcfcf}.admin-pro #reviewsPanel .muted{margin-bottom:14px}
/* Update: product review system fixed to right side */
.modal-card{
width:min(1380px,100%)!important;
grid-template-columns:.9fr .82fr 380px!important;
align-items:start!important;
}
.right-review-panel{
position:sticky;
top:0;
margin-top:0!important;
border:1px solid #272727!important;
border-radius:26px;
background:linear-gradient(180deg,#101010,#070707);
padding:18px!important;
max-height:calc(92vh - 44px);
overflow:auto;
}
.review-panel-head h3{margin:4px 0 14px;font-size:24px}.right-review-panel .product-photo-reviews{max-height:300px}.right-review-panel .user-review-form{margin-top:16px}.product-info .product-review-box{display:none!important}
@media(max-width:1100px){.modal-card{grid-template-columns:1fr 1fr!important}.right-review-panel{grid-column:1/-1;position:relative;max-height:none}.right-review-panel .product-photo-reviews{grid-template-columns:repeat(2,1fr);max-height:none}}
@media(max-width:850px){.modal-card{grid-template-columns:1fr!important}.right-review-panel{grid-column:auto}.right-review-panel .product-photo-reviews{grid-template-columns:1fr}}
/* User photo reviews moved to left side below product image */
.modal-card{grid-template-columns:minmax(320px,1fr) minmax(320px,1fr)!important;align-items:start}
.product-left-column{display:flex;flex-direction:column;gap:14px}
.left-review-panel{margin-top:8px;border:1px solid #272727;background:linear-gradient(180deg,#111,#070707);border-radius:26px;padding:18px;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.left-review-panel .product-photo-reviews{max-height:340px;overflow:auto}
.left-review-panel .user-review-form{margin-top:16px;display:grid;gap:10px}
.left-review-panel .user-review-form input,.left-review-panel .user-review-form textarea,.left-review-panel .user-review-form select{width:100%;background:#080808;border:1px solid #2b2b2b;border-radius:14px;color:#fff;padding:12px}
.right-review-panel{display:none!important}
@media(max-width:850px){.modal-card{grid-template-columns:1fr!important}.left-review-panel{border-radius:22px;padding:14px}.left-review-panel .product-photo-reviews{max-height:none}}
/* Product description Read More feature */
.description-box {
margin: 10px 0 16px;
}
.product-desc {
line-height: 1.75;
transition: max-height .35s ease;
overflow: hidden;
}
.product-desc.collapsed {
max-height: 74px;
position: relative;
}
.read-more-btn {
border: 0;
background: transparent;
color: #111;
font-weight: 900;
letter-spacing: .04em;
padding: 6px 0;
margin-top: 2px;
cursor: pointer;
text-transform: uppercase;
font-size: 12px;
border-bottom: 1px solid #111;
}
.read-more-btn:hover { opacity: .65; }
.read-more-btn.hidden { display: none !important; }
/* Read More for product cards on homepage/collection */
.card-desc-box { margin: 10px 0 14px; }
.card-product-desc { line-height: 1.45; margin-bottom: 6px; }
.card-product-desc.expanded { max-height: none; }
.card-read-more {
display: inline-flex;
align-items: center;
border: 0;
background: transparent;
color: #ffffff;
padding: 0;
font-weight: 900;
font-size: 12px;
letter-spacing: .06em;
text-transform: uppercase;
cursor: pointer;
border-bottom: 1px solid #ffffff;
}
.card-read-more:hover { opacity: .7; }
.product-card .actions { margin-top: 12px; }
/* Update: clear Read More / Show Less on product popup description */
.product-info .description-box{position:relative;margin:12px 0 18px;}
.product-info .product-desc{font-size:16px;line-height:1.75;color:#d6d6d6!important;max-width:720px;}
.product-info .product-desc.collapsed{max-height:92px;overflow:hidden;}
.product-info .product-desc.collapsed::after{content:"";position:absolute;left:0;right:0;bottom:38px;height:46px;background:linear-gradient(180deg,rgba(9,9,9,0),#090909);pointer-events:none;}
.product-info .read-more-btn{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:8px 0;border:0;border-bottom:1px solid #fff;background:transparent;color:#fff!important;font-weight:900;letter-spacing:.08em;text-transform:uppercase;font-size:13px;}
.product-info .read-more-btn::after{content:"↓";font-size:14px;}
.product-info .read-more-btn:not(.hidden):hover{opacity:.72;}
.product-info .read-more-btn.hidden{display:none!important;}
.product-info .product-desc:not(.collapsed)+.read-more-btn::after{content:"↑";}
@media(max-width:850px){.product-info .product-desc.collapsed{max-height:118px}}
.old-price{opacity:.55;text-decoration:line-through;font-size:.75em;margin-right:8px;font-weight:700}.product-meta-line{font-size:13px;color:#aaa;margin:6px 0 12px}.premium-form input#productColors{grid-column:span 2}@media(max-width:760px){.premium-form input#productColors{grid-column:span 1}}
/* User login/register protection */
.user-login-btn{border:1px solid #333!important;border-radius:999px!important;padding:9px 14px!important;background:#111!important;color:#fff!important}
.user-auth-overlay{position:fixed;inset:0;z-index:220;display:grid;place-items:center;padding:18px;background:rgba(0,0,0,.78);backdrop-filter:blur(14px)}
.user-auth-card{position:relative;width:min(460px,96vw);border:1px solid #2a2a2a;border-radius:30px;background:linear-gradient(145deg,#111,#050505);padding:28px;box-shadow:0 30px 90px rgba(0,0,0,.55)}
.user-auth-brand h2{font-size:34px;margin:6px 0 8px;letter-spacing:-.04em}.user-auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.user-auth-tabs button{border:1px solid #303030;border-radius:999px;padding:12px;background:#101010;color:#aaa;font-weight:900}.user-auth-tabs button.active{background:#fff;color:#000;border-color:#fff}.user-auth-form{display:grid;gap:12px}.user-auth-form .btn{width:100%;margin-top:4px}
@media(max-width:700px){.user-login-btn{display:inline-flex!important}.topbar{gap:8px}.brand{letter-spacing:.14em}.icon-btn,.user-login-btn{padding:9px 11px!important;font-size:13px}}
/* Premium animated top navigation */
.desktop-nav a,
.nav-login{
position:relative;
display:inline-flex;
align-items:center;
justify-content:center;
min-height:42px;
padding:0 4px;
transition:color .28s ease, transform .28s ease, text-shadow .28s ease;
}
.desktop-nav a::after,
.nav-login::after{
content:"";
position:absolute;
left:50%;
bottom:2px;
width:0;
height:2px;
border-radius:999px;
background:linear-gradient(90deg,#fff,#df2f78,#fff);
transform:translateX(-50%);
transition:width .32s ease;
box-shadow:0 0 16px rgba(223,47,120,.75);
}
.desktop-nav a:hover,
.nav-login:hover{
color:#fff;
transform:translateY(-3px);
text-shadow:0 0 18px rgba(255,255,255,.42);
}
.desktop-nav a:hover::after,
.nav-login:hover::after{width:100%;}
.user-login-btn{
border:1px solid rgba(255,255,255,.18)!important;
border-radius:999px!important;
padding:10px 18px!important;
background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.02))!important;
box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),0 0 0 rgba(223,47,120,0);
overflow:hidden;
animation:loginPulse 2.4s ease-in-out infinite;
}
.user-login-btn::before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(120deg,transparent,rgba(255,255,255,.28),transparent);
transform:translateX(-130%);
transition:transform .6s ease;
}
.user-login-btn:hover::before{transform:translateX(130%);}
.user-login-btn:hover{
background:linear-gradient(135deg,#fff,#f7f7f7)!important;
color:#000!important;
box-shadow:0 12px 34px rgba(223,47,120,.28);
}
.user-login-btn:hover::after{width:0;}
#openAdminLoginBtn{
border:1px solid transparent!important;
border-radius:999px!important;
padding:10px 18px!important;
}
#openAdminLoginBtn:hover{
border-color:rgba(223,47,120,.45)!important;
background:rgba(223,47,120,.10)!important;
color:#fff!important;
}
@keyframes loginPulse{
0%,100%{box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),0 0 0 rgba(223,47,120,0);}
50%{box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 0 22px rgba(223,47,120,.22);}
}
@media(max-width:700px){
.nav-login{display:inline-flex!important;}
.desktop-nav{gap:12px;overflow:auto;padding:8px 0;}
}
/* Updated: User Login as clean text link, no box */
.user-login-btn,
button.user-login-btn,
#openUserLoginBtn{
border:0!important;
border-radius:0!important;
padding:0 4px!important;
background:transparent!important;
box-shadow:none!important;
animation:none!important;
color:#cfcfcf!important;
overflow:visible!important;
}
.user-login-btn::before,
#openUserLoginBtn::before{display:none!important;}
.user-login-btn:hover,
#openUserLoginBtn:hover{
background:transparent!important;
color:#fff!important;
box-shadow:none!important;
}
.user-login-btn:hover::after,
#openUserLoginBtn:hover::after{width:100%!important;}
@media(max-width:700px){
.user-login-btn,
#openUserLoginBtn{padding:0 4px!important;font-size:13px;}
}
.user-avatar{width:48px;height:48px;border-radius:18px;background:linear-gradient(135deg,#ff2b7a,#fff);color:#050505;display:grid;place-items:center;font-weight:900;letter-spacing:.08em;box-shadow:0 12px 30px rgba(255,43,122,.22)}
.user-detail-row{grid-template-columns:auto 1fr auto}
/* Notification automation */
.notify-nav-btn{background:transparent;color:#fff;border:0;font-size:16px;cursor:pointer;position:relative;padding:10px 12px;border-radius:999px;transition:.25s ease}
.notify-nav-btn:hover{background:#171717;transform:translateY(-2px)}
#userNotificationBadge{position:absolute;top:0;right:0;min-width:18px;height:18px;background:#ff2d75;color:#fff;border-radius:999px;font-size:11px;display:grid;place-items:center;font-weight:800;border:1px solid #fff}
#userNotificationBadge.hidden-badge{display:none}
.notification-admin-grid{display:grid;grid-template-columns:minmax(280px,420px) 1fr;gap:18px;align-items:start}
.check-line{display:flex;gap:10px;align-items:center;color:#ccc;font-size:13px;margin:6px 0 10px}
.check-line input{width:auto!important}
.notification-drawer-card{max-width:460px}
.notification-list{display:grid;gap:12px;margin:18px 0}
.notification-card{border:1px solid #262626;background:#101010;border-radius:18px;padding:16px;box-shadow:0 14px 40px rgba(0,0,0,.22)}
.notification-card.unread{border-color:#ff2d75;box-shadow:0 0 0 1px rgba(255,45,117,.3),0 14px 40px rgba(255,45,117,.08)}
.notification-card span{display:inline-block;font-size:11px;letter-spacing:2px;color:#ff7aa8;font-weight:900;text-transform:uppercase;margin-bottom:8px}
.notification-card h4{margin:0 0 8px;color:#fff}
.notification-card p{margin:0 0 10px;color:#ccc;line-height:1.45}
.notification-card small{color:#777;display:block;margin-bottom:8px}
.small-link{color:#fff;text-decoration:none;border-bottom:1px solid #ff2d75;font-weight:800}
.notice-icon{width:44px;height:44px;border-radius:16px;background:#151515;display:grid;place-items:center;font-size:22px}
.notification-admin-row{grid-template-columns:52px 1fr auto!important}
@media(max-width:800px){.notification-admin-grid{grid-template-columns:1fr}.notify-nav-btn{padding:8px}.notification-drawer-card{max-width:100%}}
/* Black & white full UI update */
:root{--bw-bg:#050505;--bw-panel:#0d0d0d;--bw-card:#ffffff;--bw-text:#ffffff;--bw-muted:#9f9f9f;--bw-border:#262626;--bw-dark:#111111;--bw-light:#ffffff;}
body,.admin-panel-screen{background:#050505!important;color:#fff!important;}
.admin-pro{background:#050505!important;color:#fff!important;grid-template-columns:260px 1fr;}
.admin-sidebar{background:#000!important;color:#fff!important;border-right:1px solid #252525;}
.admin-logo span{background:#fff!important;color:#000!important;}
.admin-nav{color:#d6d6d6!important;background:transparent!important;border:1px solid transparent!important;}
.admin-nav:hover,.admin-nav.active{background:#fff!important;color:#000!important;border-color:#fff!important;}
.admin-topline{background:#0b0b0b!important;color:#fff!important;border-bottom:1px solid #252525;box-shadow:none!important;}
.admin-topline h2,.panel-title h3,.admin-hero-card h3{color:#fff!important;}
.admin-pro .muted,.admin-topline .muted{color:#aaa!important;}
.stat-card,.admin-hero-card,.premium-form,.premium-list,.settings-grid article{background:#0e0e0e!important;color:#fff!important;border:1px solid #252525!important;box-shadow:0 20px 60px rgba(0,0,0,.35)!important;border-radius:18px!important;}
.stat-card.pink{background:#fff!important;color:#000!important;}
.stat-card b,.stat-card span,.stat-card small,.settings-grid b{color:inherit!important;}
.admin-pro .primary{background:#fff!important;color:#000!important;border-color:#fff!important;}
.admin-pro .secondary{background:#111!important;color:#fff!important;border-color:#444!important;}
.admin-pro input,.admin-pro textarea,.admin-pro select{background:#050505!important;color:#fff!important;border:1px solid #333!important;}
.admin-pro .admin-row{background:#0b0b0b!important;color:#fff!important;border:1px solid #272727!important;border-radius:16px!important;}
.admin-pro .mini-actions button{background:#fff!important;color:#000!important;border:1px solid #fff!important;border-radius:999px!important;font-weight:800;}
.admin-pro .eyebrow{color:#fff!important;}
.notify-nav-btn:hover,.desktop-nav a:hover{background:#fff!important;color:#000!important;}
#userNotificationBadge{background:#fff!important;color:#000!important;border-color:#000!important;}
.notification-card.unread{border-color:#fff!important;box-shadow:0 0 0 1px rgba(255,255,255,.35)!important;}
.notification-card span,.small-link{color:#fff!important;border-color:#fff!important;}
.user-avatar{background:linear-gradient(135deg,#fff,#999)!important;color:#000!important;box-shadow:none!important;}
.share-actions{display:grid;gap:10px;margin-top:10px;}
.share-actions.hidden{display:none!important;}
@media(max-width:900px){.admin-pro{grid-template-columns:1fr}.admin-sidebar{border-right:0;border-bottom:1px solid #252525}}
.send-option-box{border:1px solid rgba(255,255,255,.16);border-radius:18px;padding:14px;background:rgba(255,255,255,.04);display:grid;gap:8px}
.send-option-box .check-line{margin:0}
.notification-admin-row .mini-actions button{border-color:#fff;background:#050505;color:#fff}
.notification-admin-row .mini-actions button:hover{background:#fff;color:#000}
/* BLACK & WHITE LUXURY ADMIN LOGIN UI UPDATE */
.admin-login-overlay{
background:
radial-gradient(circle at 20% 15%, rgba(255,255,255,.16), transparent 28%),
radial-gradient(circle at 80% 85%, rgba(255,255,255,.09), transparent 30%),
linear-gradient(135deg,#000,#070707 45%,#111)!important;
backdrop-filter:blur(18px)!important;
}
.login-window{
background:#050505!important;
color:#fff!important;
border:1px solid rgba(255,255,255,.18)!important;
border-radius:30px!important;
box-shadow:0 35px 110px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.login-close{
background:#fff!important;
color:#000!important;
border:1px solid #fff!important;
box-shadow:0 10px 28px rgba(0,0,0,.35)!important;
}
.login-art{
background:linear-gradient(145deg,#000,#101010)!important;
border-right:1px solid rgba(255,255,255,.12)!important;
}
.login-art:before{
inset:44px 36px!important;
border:1px solid rgba(255,255,255,.22)!important;
border-radius:32px!important;
background:
linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.03)),
linear-gradient(135deg,#111,#000)!important;
box-shadow:0 25px 70px rgba(0,0,0,.75), inset 0 0 0 1px rgba(255,255,255,.08)!important;
transform:rotate(-6deg)!important;
}
.login-art:after{
content:'CHAITHANYA';
position:absolute;
inset:0;
display:grid;
place-items:center;
color:#fff;
font-size:clamp(32px,5vw,56px);
letter-spacing:.24em;
font-weight:950;
z-index:2;
text-shadow:0 20px 50px rgba(0,0,0,.75);
}
.blob{background:#fff!important;opacity:.08!important;filter:blur(1px)!important;}
.blob.one{right:35px!important;top:35px!important;}
.blob.two{left:30px!important;bottom:36px!important;}
.blob.three{right:60px!important;bottom:20px!important;}
.login-form-side{
background:#050505!important;
padding:46px!important;
}
.login-form-side h2{
color:#fff!important;
font-size:34px!important;
letter-spacing:-.04em!important;
margin-bottom:8px!important;
}
.login-form-side .muted{
color:#aaa!important;
}
.login-form-side input{
background:#0f0f0f!important;
color:#fff!important;
border:1px solid #292929!important;
border-radius:16px!important;
padding:15px 16px!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.login-form-side input:focus{
border-color:#fff!important;
box-shadow:0 0 0 4px rgba(255,255,255,.08)!important;
}
.login-gradient{
background:#fff!important;
color:#000!important;
border:1px solid #fff!important;
border-radius:999px!important;
box-shadow:0 16px 40px rgba(255,255,255,.12)!important;
transition:.25s ease!important;
}
.login-gradient:hover{
transform:translateY(-2px)!important;
background:#e9e9e9!important;
}
@media(max-width:700px){
.login-window{border-radius:24px!important;}
.login-art{min-height:150px!important;border-right:0!important;border-bottom:1px solid rgba(255,255,255,.12)!important;}
.login-art:before{inset:26px 32px!important;}
.login-form-side{padding:26px!important;}
.login-form-side h2{font-size:28px!important;}
}
/* Admin editable homepage hero */
.hero-uploaded-image{
width:100%;height:100%;object-fit:cover;border-radius:inherit;position:absolute;inset:0;z-index:1;
}
.mock-shirt{position:relative;overflow:hidden;}
.mock-shirt.has-image span,.mock-shirt.has-image small{position:relative;z-index:2;background:rgba(255,255,255,.82);color:#000;padding:8px 14px;border-radius:999px;backdrop-filter:blur(10px);}
.mock-shirt.has-image small{margin-top:10px;}
.home-preview-admin{margin-top:18px;padding:18px;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:rgba(255,255,255,.04)}
#homeEditPanel textarea{min-height:110px;grid-column:1/-1;}
#homeImageFileInput{padding:14px;background:#0e0e0e;border:1px dashed rgba(255,255,255,.25);border-radius:16px;color:#fff;}
/* User profile page */
.profile-drawer-card{width:min(560px,100%)}
.profile-card{display:grid;grid-template-columns:72px 1fr;gap:16px;align-items:center;border:1px solid #292929;background:#0e0e0e;border-radius:24px;padding:16px;margin:18px 0}
.profile-avatar,.user-avatar{width:58px;height:58px;border-radius:50%;background:#fff;color:#000;display:grid;place-items:center;font-weight:950;font-size:22px}
.profile-card h3{margin:0 0 6px;font-size:24px}.profile-card p{margin:3px 0}
.profile-form{display:grid;gap:12px;border:1px solid #292929;background:#0c0c0c;border-radius:24px;padding:16px;margin-bottom:22px}
.profile-section{margin-top:22px}.profile-section h3{margin:0 0 12px;font-size:22px}
.profile-list{display:grid;gap:12px}
.profile-product-row{display:grid;grid-template-columns:70px 1fr;gap:12px;align-items:center;border:1px solid #252525;background:#0f0f0f;border-radius:18px;padding:10px}
.profile-product-row img{width:70px;height:70px;object-fit:cover;border-radius:14px;background:#111}.profile-product-row b{display:block}.profile-product-row span{display:block;margin-top:5px;font-weight:900;color:#fff}.profile-product-row.mini{grid-template-columns:54px 1fr;margin-top:8px}.profile-product-row.mini img{width:54px;height:54px;border-radius:12px}
.profile-order-card{border:1px solid #292929;background:#0d0d0d;border-radius:20px;padding:14px}.profile-order-card>p{margin:7px 0 12px}
.nav-login#openUserProfileBtn{border:0;background:transparent;color:#cfcfcf;padding:0}.nav-login#openUserProfileBtn:hover{color:#fff;transform:translateY(-2px)}
@media(max-width:700px){.profile-card{grid-template-columns:58px 1fr}.profile-drawer-card{width:100%}.desktop-nav{display:flex;gap:12px;overflow-x:auto;font-size:13px}.nav-login#openUserProfileBtn{display:inline-flex!important}}
/* Black & white profile dashboard UI */
.profile-dashboard-card{width:min(1180px,96vw)!important;height:min(720px,92vh);padding:0!important;border-radius:30px!important;background:#f7f7f7!important;color:#050505!important;border:1px solid #d9d9d9!important;box-shadow:0 35px 120px rgba(0,0,0,.55);overflow:hidden!important;align-self:center;margin:auto}
#profileDrawer{justify-content:center;align-items:center;padding:24px;background:rgba(0,0,0,.78)}
.profile-shell{display:grid;grid-template-columns:180px 1fr;height:100%;background:#f7f7f7;color:#090909}
.profile-sidebar{background:#050505;color:#fff;padding:24px 18px;display:flex;flex-direction:column;gap:12px}
.profile-logo{width:44px;height:44px;border-radius:15px;background:#fff;color:#000;display:grid;place-items:center;font-weight:950;letter-spacing:.12em;margin-bottom:18px}
.profile-side-item{border:0;background:transparent;color:#9f9f9f;text-align:left;padding:13px 14px;border-radius:14px;font-weight:800;transition:.2s}
.profile-side-item:hover,.profile-side-item.active{background:#fff;color:#000;transform:translateX(4px)}
.profile-main-panel{overflow:auto;background:#fff}
.profile-topline{height:82px;border-bottom:1px solid #e5e5e5;display:flex;align-items:center;justify-content:space-between;padding:0 28px;background:#fff}
.profile-topline h2{margin:4px 0 0;font-size:20px;color:#050505}.profile-topline .eyebrow{color:#555}
.profile-mini-card{border:0!important;background:transparent!important;margin:0!important;padding:0!important;grid-template-columns:48px 1fr!important;gap:10px!important;color:#050505!important}.profile-mini-card h3{font-size:14px!important}.profile-mini-card p{color:#777!important}
.profile-content-grid{display:grid;grid-template-columns:260px 1fr;min-height:440px}
.profile-inner-menu{border-right:1px solid #e9e9e9;background:#fbfbfb;padding:18px;display:grid;align-content:start;gap:4px}
.profile-inner-menu button{border:0;background:transparent;color:#555;text-align:left;padding:16px 14px;border-radius:12px;font-weight:750}.profile-inner-menu button:hover,.profile-inner-menu .profile-inner-active{background:#f0f0f0;color:#000}
.profile-edit-panel{padding:28px 34px;background:#fff}.profile-edit-panel h3{margin:0 0 18px;color:#050505}
.profile-big-avatar{display:grid;place-items:center;margin:0 0 18px;position:relative}.profile-avatar.large{width:86px;height:86px;font-size:32px;border:1px solid #ddd;box-shadow:0 10px 35px rgba(0,0,0,.08)}.profile-big-avatar span{margin-top:-20px;margin-left:58px;background:#000;color:#fff;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:12px}
.profile-form-modern{display:grid!important;grid-template-columns:1fr 1fr;gap:14px!important;border:0!important;background:#fff!important;padding:0!important;margin:0!important;border-radius:0!important}.profile-form-modern .field{display:grid;gap:6px}.profile-form-modern label{font-size:12px;color:#777;font-weight:800}.profile-form-modern input,.profile-form-modern textarea{background:#fff!important;color:#000!important;border:1px solid #dedede!important;border-radius:8px!important;padding:12px!important}.profile-form-modern textarea{min-height:74px}.field-wide{grid-column:1/-1}.profile-save-btn{width:max-content;border-radius:8px!important;padding:12px 28px!important;background:#050505!important;color:#fff!important;border-color:#050505!important}
.profile-lists-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:0 28px 28px;background:#fff}.profile-section{border:1px solid #e7e7e7;border-radius:20px;padding:16px;background:#fafafa;margin-top:0!important}.profile-section h3{color:#050505;font-size:18px!important}.profile-product-row,.profile-order-card{background:#fff!important;border-color:#e2e2e2!important;color:#050505!important}.profile-product-row span{color:#000!important}.profile-product-row img{background:#eee!important}.profile-close{background:#fff!important;color:#000!important;border-color:#ddd!important;right:18px!important;top:18px!important}
@media(max-width:850px){.profile-dashboard-card{height:92vh;width:96vw!important}.profile-shell{grid-template-columns:1fr}.profile-sidebar{display:none}.profile-topline{height:auto;align-items:flex-start;gap:12px;padding:20px;flex-direction:column}.profile-content-grid,.profile-lists-grid,.profile-form-modern{grid-template-columns:1fr!important}.profile-inner-menu{border-right:0;border-bottom:1px solid #eee;grid-template-columns:1fr 1fr}.profile-edit-panel{padding:22px}.profile-lists-grid{padding:0 20px 24px}.profile-close{top:10px!important;right:10px!important}}
.seo-preview-box{margin:18px 0;padding:18px;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:#0f0f0f;color:#fff;box-shadow:0 18px 50px rgba(0,0,0,.25)}
.seo-preview-box b{display:block;letter-spacing:.18em;text-transform:uppercase;color:#aaa;font-size:11px;margin-bottom:10px}.seo-preview-box h4{margin:0 0 6px;font-size:20px;color:#fff}.seo-preview-box small{color:#aaa}.seo-preview-box p{color:#d7d7d7;line-height:1.55}.seo-checklist article{border:1px solid rgba(255,255,255,.12);background:#111;color:#fff}
.premium-form input[type="file"]{padding:13px;background:#0c0c0c;color:#ddd;border:1px dashed rgba(255,255,255,.2);border-radius:16px}
/* Homepage customer feedback add-review system */
.customer-feedback-form{margin-top:28px;max-width:760px;border:1px solid #242424;background:#0b0b0b;border-radius:28px;padding:24px;display:grid;gap:12px;box-shadow:0 24px 80px rgba(0,0,0,.35)}
.customer-feedback-form h3{margin:4px 0;font-size:26px}.customer-feedback-form input[type=file]{color:#cfcfcf}.customer-feedback-card img{width:100%;height:180px;object-fit:cover;border-radius:20px;margin-bottom:8px;background:#111}.customer-feedback-card span{color:#fff;letter-spacing:2px;font-weight:900}.customer-feedback-card small{display:block;margin-top:-8px}@media(max-width:850px){.customer-feedback-form{padding:18px}.customer-feedback-card img{height:220px}}
/* ============================================================
CHAITHANYA — JAPAM-INSPIRED STOREFRONT REDESIGN
Functional JS hooks are preserved. Admin UI remains protected.
============================================================ */
:root{
--ivory:#fbf8f2;
--paper:#fffdf9;
--cream:#f4eee4;
--ink:#241d17;
--brown:#5d4634;
--muted-brown:#8b7867;
--line:#e7ddd0;
--gold:#a8834f;
--sale:#8c2e20;
--shadow:0 16px 45px rgba(59,40,22,.09);
}
html{background:var(--ivory)}
body{
background:var(--ivory);
color:var(--ink);
font-family:Inter,Arial,sans-serif;
}
body:has(.admin-panel-screen:not(.hidden)){
background:#050505;
}
body a{color:inherit}
.announcement-bar{
min-height:34px;
display:flex;
justify-content:center;
align-items:center;
gap:38px;
padding:7px 16px;
background:#2b211a;
color:#fffaf2;
font-size:10px;
font-weight:800;
letter-spacing:.12em;
text-transform:uppercase;
text-align:center;
overflow:hidden;
}
.topbar{
position:sticky;
top:0;
z-index:80;
height:76px;
padding:0 clamp(18px,4vw,64px);
background:rgba(255,253,249,.94);
border-bottom:1px solid var(--line);
backdrop-filter:blur(16px);
color:var(--ink);
}
.brand{
display:flex;
align-items:center;
gap:9px;
color:var(--ink);
letter-spacing:.22em;
font-size:18px;
}
.brand-mark{
display:grid;
place-items:center;
width:30px;height:30px;
border:1px solid var(--ink);
border-radius:50%;
font-size:12px;
letter-spacing:0;
}
.desktop-nav{gap:25px;color:#594a3d;font-size:13px;font-weight:700}
.desktop-nav a:hover{color:#000}
.nav-login,.notify-nav-btn,.header-search{
border:0!important;background:transparent!important;color:inherit!important;
padding:8px!important;font-weight:700;
}
.notify-nav-btn span{
background:#2b211a!important;color:#fff!important;
border-radius:99px;padding:2px 6px;font-size:10px;
}
.header-actions{display:flex;align-items:center;gap:7px}
.header-search{font-size:25px;line-height:1}
.icon-btn{
border:1px solid #cfc2b3!important;
background:var(--paper)!important;
color:var(--ink)!important;
border-radius:999px;
padding:10px 15px;
}
.icon-btn span{background:var(--ink)!important;color:#fff!important}
.mobile-menu-btn{display:none}
.hero{
min-height:620px;
grid-template-columns:1.05fr .95fr;
gap:55px;
padding:70px clamp(20px,7vw,110px);
background:
radial-gradient(circle at 78% 18%,#eadbc7 0,transparent 30%),
linear-gradient(110deg,#fbf8f2,#f1e8dc);
color:var(--ink);
}
.hero-copy{max-width:700px}
.eyebrow{color:#90765e;font-size:10px;letter-spacing:.22em}
.hero h1{
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(48px,7vw,88px);
line-height:.98;
letter-spacing:-.055em;
font-weight:500;
margin:13px 0 20px;
}
.hero h1 em{color:#866544;font-weight:400}
.hero p:not(.eyebrow){color:#766658;max-width:570px;font-size:16px;line-height:1.75}
.actions{margin-top:30px}
.btn{
border-radius:3px;
padding:14px 21px;
font-size:12px;
letter-spacing:.04em;
}
.primary{background:#2b211a!important;color:#fff!important;border-color:#2b211a!important}
.secondary{background:transparent!important;color:var(--ink)!important;border-color:#bcae9f!important}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(59,40,22,.12)}
.hero-trust{
display:flex;flex-wrap:wrap;gap:18px;
margin-top:30px;color:#786757;font-size:11px;font-weight:700;
}
.hero-product{
min-height:500px;
border:0;
border-radius:0;
background:transparent;
box-shadow:none;
display:grid;
place-items:center;
}
.hero-image-frame{
position:relative;
width:min(470px,100%);
min-height:470px;
display:grid;
place-items:center;
border-radius:48% 48% 10px 10px;
background:linear-gradient(145deg,#e8dac8,#c8b29a);
box-shadow:var(--shadow);
overflow:hidden;
}
.hero-badge{
position:absolute;right:24px;top:24px;z-index:2;
width:64px;height:64px;border-radius:50%;
display:grid;place-items:center;text-align:center;
background:#2b211a;color:#fff;font-size:9px;line-height:1.2;font-weight:900;
letter-spacing:.08em;
}
.mock-shirt{
width:min(330px,70%);
aspect-ratio:.76;
border-radius:90px 90px 25px 25px;
background:#24211e;
color:#f5eee4;
box-shadow:0 28px 50px rgba(45,31,20,.25);
}
.mock-shirt span{font-size:20px}
.mock-shirt small{font-size:9px}
.marquee{
background:#2b211a;
color:#f6ede0;
border:0;
padding:13px 5vw;
gap:48px;
}
.marquee span{font-size:9px;letter-spacing:.16em}
.section{padding:76px clamp(18px,6vw,90px);background:var(--ivory)}
.section-head{margin-bottom:28px}
.section-head h2{
color:var(--ink);
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(34px,4.3vw,55px);
font-weight:500;
letter-spacing:-.045em;
}
.row{align-items:end}
.select{
width:220px!important;
background:#fffdf9!important;
color:var(--ink)!important;
border:1px solid var(--line)!important;
border-radius:2px!important;
}
.category-grid{grid-template-columns:repeat(3,1fr);gap:16px}
.category-card{
min-height:310px;
border:0;
border-radius:3px;
box-shadow:var(--shadow);
}
.category-card:before{background:linear-gradient(transparent 25%,rgba(35,25,18,.78))}
.category-card h3{font-family:Georgia,serif;font-weight:500;font-size:27px}
.product-grid{grid-template-columns:repeat(4,1fr);gap:18px}
.product-card{
border:0;
border-radius:2px;
background:transparent;
overflow:visible;
}
.product-card img{
height:390px;
border-radius:2px;
background:#eee5d9;
object-fit:cover;
}
.product-body{padding:15px 2px 5px}
.product-body h3{
color:var(--ink);
font-family:Georgia,serif;
font-size:17px;
font-weight:500;
margin:5px 0 7px;
}
.product-body p{color:#8a796a!important}
.product-body .btn{border-radius:2px!important}
.product-card:hover img{transform:translateY(-3px);box-shadow:var(--shadow);transition:.3s}
.product-card img{transition:.3s}
.split-panel{
background:#eee4d6;
grid-template-columns:.8fr 1.2fr;
}
.split-panel h2{font-family:Georgia,serif;color:var(--ink)}
.feature-list article,.review-grid article{
border:1px solid #dfd2c2;
background:rgba(255,253,249,.65);
border-radius:3px;
color:var(--ink);
}
.feature-list article p{color:#7f6d5c}
.review-grid{grid-template-columns:repeat(3,1fr)}
.review-grid article{box-shadow:none}
.customer-feedback-form{
margin-top:35px;
padding:24px;
background:#fffdf9;
border:1px solid var(--line);
border-radius:3px;
display:grid;
gap:12px;
}
.customer-feedback-form input,
.customer-feedback-form textarea,
.customer-feedback-form select,
.user-auth-form input,
.user-auth-form textarea{
background:#fff!important;color:var(--ink)!important;border:1px solid #ddd0c1!important;border-radius:2px!important;
}
.admin-teaser{background:#f1e9de}
.admin-teaser-card{
padding:45px;
border:1px solid #ddcfbf;
background:#fffdf9;
border-radius:3px;
}
.admin-teaser-card h2{font-family:Georgia,serif;font-weight:500;color:var(--ink)}
footer{
background:#2b211a!important;
color:#d9ccbd!important;
border:0!important;
}
.modal,.drawer,.user-auth-overlay,.admin-login-overlay{
background:rgba(39,28,19,.62);
backdrop-filter:blur(12px);
}
.modal-card,.drawer-card,.user-auth-card,.login-window{
background:#fffdf9!important;
color:var(--ink)!important;
border:1px solid var(--line)!important;
border-radius:4px!important;
box-shadow:0 25px 70px rgba(40,25,15,.2);
}
.close-btn,.login-close{
background:#2b211a!important;color:#fff!important;border:0!important;
}
.product-info h2{font-family:Georgia,serif;color:var(--ink);font-weight:500}
.product-info p,.product-info .muted{color:#756454}
.chip{background:#f5eee5;color:var(--ink);border-color:#ded1c1}
.chip.active{background:#2b211a;color:#fff;border-color:#2b211a}
.qty{border-color:#d6c8b8;background:#fff}
.qty button{background:#2b211a;color:#fff}
@media(max-width:1050px){
.product-grid{grid-template-columns:repeat(3,1fr)}
.desktop-nav{gap:12px}
}
@media(max-width:850px){
.announcement-bar{gap:20px;justify-content:flex-start;white-space:nowrap;overflow:auto}
.topbar{height:64px;padding:0 15px}
.mobile-menu-btn{
display:block;border:0;background:transparent;color:var(--ink);font-size:22px;padding:5px;
}
.brand{font-size:15px}
.desktop-nav{display:none}
.header-actions{margin-left:auto}
.hero{
grid-template-columns:1fr;
padding:42px 18px 52px;
min-height:auto;
}
.hero h1{font-size:52px}
.hero-product{min-height:390px}
.hero-image-frame{min-height:380px}
.section{padding:55px 16px}
.row{align-items:flex-start;flex-direction:column}
.select{width:100%!important}
.category-grid,.review-grid{grid-template-columns:1fr}
.product-grid{grid-template-columns:repeat(2,1fr);gap:18px 12px}
.product-card img{height:270px}
.split-panel{grid-template-columns:1fr}
.admin-teaser-card{padding:28px 22px}
}
@media(max-width:480px){
.header-search{display:none}
.cart-button{padding:9px 11px}
.hero h1{font-size:45px}
.hero-trust{gap:9px;flex-direction:column}
.product-grid{grid-template-columns:repeat(2,1fr)}
.product-card img{height:235px}
.product-body h3{font-size:15px}
}
@media(max-width:850px){
.desktop-nav.mobile-open{
display:flex;
position:absolute;
left:0;right:0;top:64px;
padding:18px;
flex-direction:column;
gap:4px;
background:#fffdf9;
border-bottom:1px solid #e7ddd0;
box-shadow:0 18px 35px rgba(50,35,20,.12);
}
.desktop-nav.mobile-open a,
.desktop-nav.mobile-open button{
text-align:left;
padding:12px!important;
}
}
/* CHAITHANYA Panchaloha Jewellery redesign */
:root{--gold:#c9a35b;--gold2:#f0d28a;--ink:#080806;--soft:#15130f}
body{background:#070705;color:#f7f3e8}
a:hover{color:var(--gold2)}
.topbar{background:rgba(7,7,5,.9);border-bottom-color:#2b2418}
.brand{letter-spacing:.18em}.brand-mark{color:var(--gold)}
.desktop-nav{color:#d8d0bd}
.hero{background:radial-gradient(circle at 80% 20%,rgba(201,163,91,.20),transparent 35%),linear-gradient(135deg,#080806,#17130c 52%,#050504)}
.hero h1 em{color:var(--gold2);font-style:normal}
.eyebrow{color:#b99b64}
.btn.primary{background:linear-gradient(135deg,#f1d38b,#b88b3f);border-color:#d6b66f;color:#17120a}
.btn.secondary{border-color:#5a4728}
.hero-product{border-color:#3a2f1d;background:radial-gradient(circle at center,rgba(201,163,91,.18),transparent 58%),linear-gradient(145deg,#17130c,#050504);box-shadow:0 30px 90px rgba(0,0,0,.8)}
.mock-shirt{width:min(360px,75vw);aspect-ratio:1;background:radial-gradient(circle at 35% 30%,#f4db9b,#a87531 70%,#513515);border-radius:50%;box-shadow:0 0 0 12px rgba(201,163,91,.12),inset 0 0 50px rgba(255,244,196,.25),0 25px 70px rgba(0,0,0,.55);color:#201708}
.mock-shirt small{color:#2b1c08}
.hero-badge{background:#0b0905!important;border-color:#7d6131!important;color:#e5c47e!important}
.marquee{border-color:#2a2318;color:#cbb98f}
.section{background:#070705}
.category-card,.product-card,.review-grid article,.feature-list article,.login-card,.admin-dashboard{border-color:#302718;background:#100e0a}
.category-card:before{background:linear-gradient(transparent,rgba(0,0,0,.94))}
.product-card img{background:#14110b}
.product-body h3{color:#f3e5c2}
.split-panel,.about-chaithanya{background:#0b0906}
.about-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px;align-items:center}
.about-copy{font-size:18px;line-height:1.8;color:#d9d0bf}
.about-chaithanya h2{font-size:clamp(34px,5vw,64px);line-height:1}
footer{padding:50px 5vw;border-top:1px solid #2b2418;background:#050504;display:grid;gap:10px;color:#bfb39c}
.footer-brand{font-size:28px;font-weight:900;letter-spacing:.2em;color:#e5c47e}
.footer-social-note{color:#766b58;font-size:13px}
.chip.active{background:var(--gold);color:#161006;border-color:var(--gold)}
@media(max-width:800px){.about-grid{grid-template-columns:1fr}.hero{grid-template-columns:1fr}.hero-product{min-height:400px}.category-grid,.product-grid,.review-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.category-grid,.product-grid,.review-grid{grid-template-columns:1fr}.section{padding:60px 5vw}.hero{padding-top:40px}.mock-shirt{width:250px}}
/* CHAITHANYA WHITE LUXURY THEME */
:root{--ink:#171717;--muted:#6d6d6d;--line:#e8e5df;--surface:#fff;--soft:#faf9f7;--accent:#a8843d}
body{background:#fff;color:var(--ink)}
.topbar{background:rgba(255,255,255,.94);border-bottom:1px solid var(--line)}
.desktop-nav{color:#555}.desktop-nav a:hover,.nav-login:hover{color:#111}
.nav-login{color:#444}
.icon-btn,.btn{background:#fff;color:#171717;border-color:#d9d5ce}
.icon-btn span{background:#171717;color:#fff}
.primary{background:#171717;color:#fff;border-color:#171717}
.secondary{background:#fff;color:#171717}
.hero{background:linear-gradient(135deg,#fff,#faf9f7 55%,#f2eee7);color:#171717}
.hero p{color:#666}.eyebrow{color:#8a6c35}
.hero-product{background:linear-gradient(145deg,#fff,#f5f2ec);border-color:#e6e0d6;box-shadow:0 30px 90px rgba(40,30,10,.10)}
.mock-jewellery{background:#fff!important;color:#171717!important;box-shadow:inset 0 -30px 70px #e8e1d4!important}
.marquee{border-color:var(--line);color:#777}
.section{background:#fff}
.category-card,.product-card,.review-grid article,.feature-list article,.login-card,.admin-dashboard{border-color:var(--line);background:#fff}
.category-card:before{background:linear-gradient(transparent,rgba(0,0,0,.72))}
.select,input,textarea,select{background:#fff;color:#171717;border-color:#ddd8cf}
.product-card img{background:#f5f3ef}
.split-panel{background:#faf9f7}
.admin-section{background:#fff}
.tab{border-color:#ddd8cf;background:#fff;color:#666}
.tab.active{background:#171717;color:#fff;border-color:#171717}
.admin-panel{border-color:var(--line)}
.admin-row,.cart-row{border-color:var(--line);background:#fff}
.mini-actions button,.cart-row button{border-color:#ddd8cf;background:#fff;color:#171717}
.modal,.drawer{background:rgba(20,20,20,.45)}
.modal-card{border-color:#e2ddd4;background:#fff}
.close-btn{border-color:#ddd8cf;background:#fff;color:#171717}
.gallery img{background:#f5f3ef}.thumb-row img{border-color:#ddd8cf}
.chip{border-color:#ddd8cf;background:#fff;color:#171717}
.qty{border-color:#ddd8cf}.drawer-card{background:#fff;border-left-color:#e2ddd4}
.bill-box{border-color:#e2ddd4;background:#faf9f7}
footer{color:#777;border-top-color:var(--line)}
.admin-login-overlay{background:rgba(255,255,255,.88)}
.login-window{background:#fff;color:#202020;box-shadow:0 30px 80px rgba(0,0,0,.15)}
.login-art{background:#faf9f7}
.login-art:before{border-color:rgba(255,255,255,.9);background:linear-gradient(145deg,#eee9df,#fff);box-shadow:0 0 0 26px rgba(180,150,90,.12)}
.blob{background:linear-gradient(135deg,#d7c49a,#f4f0e8,#b89b5d)}
.login-form-side input{background:#f7f6f3;color:#222}
.login-gradient{color:#fff;background:#171717;box-shadow:0 12px 26px rgba(0,0,0,.12)}
.admin-panel-screen{background:#fff}
.close-admin-screen{background:#fff;color:#171717;border-color:#ddd8cf}
.admin-panel-screen .admin-panel{border-color:var(--line);background:#fff}
.admin-panel-screen .admin-tabs{background:#fff}
.admin-pro{background:#f8f7f4;color:#222}
.admin-sidebar{background:#fff;color:#171717;border-right:1px solid #e5e1d8}
.admin-logo span{background:#171717;color:#fff}
.admin-nav{color:#555}.admin-nav:hover,.admin-nav.active{background:#171717;color:#fff}
.admin-nav.danger{color:#555!important}
.admin-topline{background:#fff;box-shadow:0 6px 18px rgba(20,20,20,.05)}
.stat-card{background:#fff}.stat-card.pink{background:#171717}
/* CHAITHANYA JAPAM-INSPIRED WHITE STOREFRONT */
:root{--ch-bg:#fff;--ch-cream:#faf8f3;--ch-ink:#1b1a18;--ch-muted:#716c63;--ch-line:#e8e3da;--ch-gold:#a77b38;--ch-gold-soft:#efe4d0}
html{background:#fff!important}body{background:var(--ch-bg)!important;color:var(--ch-ink)!important;font-family:Inter,Arial,sans-serif!important}.announcement-bar{background:#1d1b18!important;color:#fff!important;font-size:11px!important;letter-spacing:.12em!important;justify-content:center!important;gap:36px!important;padding:9px 15px!important}.topbar{position:sticky!important;top:0!important;background:rgba(255,255,255,.96)!important;color:var(--ch-ink)!important;border-bottom:1px solid var(--ch-line)!important;height:78px!important;box-shadow:0 4px 22px rgba(40,30,15,.05)!important}.brand{color:var(--ch-ink)!important;letter-spacing:.25em!important}.brand-mark{background:var(--ch-ink)!important;color:#fff!important;width:35px;height:35px;border-radius:50%;display:inline-grid;place-items:center;margin-right:9px}.desktop-nav{color:#4b463f!important;gap:25px!important}.desktop-nav a,.nav-login{color:#4b463f!important}.desktop-nav a:hover,.nav-login:hover{color:var(--ch-gold)!important}.header-search{color:var(--ch-ink)!important;background:transparent!important;border:0!important;font-size:25px}.icon-btn{background:var(--ch-ink)!important;color:#fff!important;border-color:var(--ch-ink)!important}.icon-btn span{background:#fff!important;color:var(--ch-ink)!important}.hero{min-height:650px!important;background:linear-gradient(90deg,#fff 0%,#fbf8f1 54%,#eee6d8 100%)!important;padding:70px 6vw!important;grid-template-columns:1.05fr .95fr!important}.hero h1{color:var(--ch-ink)!important;font-family:Georgia,serif!important;font-weight:500!important;letter-spacing:-.055em!important}.hero h1 em{color:var(--ch-gold)!important}.hero p:not(.eyebrow){color:var(--ch-muted)!important}.eyebrow{color:var(--ch-gold)!important;letter-spacing:.2em!important}.hero-product{background:linear-gradient(145deg,#f5eee3,#fff)!important;border:1px solid #dfd4c1!important;box-shadow:0 30px 80px rgba(80,55,25,.13)!important}.hero-image-frame{background:linear-gradient(145deg,#fff,#eee5d5)!important;border:1px solid #e1d7c7!important}.hero-badge{background:var(--ch-ink)!important;color:#fff!important}.mock-jewellery{color:var(--ch-gold)!important}.mock-jewellery small{color:var(--ch-muted)!important}.btn{border-radius:3px!important}.primary{background:var(--ch-ink)!important;color:#fff!important;border-color:var(--ch-ink)!important}.secondary{background:#fff!important;color:var(--ch-ink)!important;border-color:#d8d0c3!important}.marquee{background:#fff!important;color:#80796e!important;border-color:var(--ch-line)!important}.section{background:#fff!important}.section-head h2{font-family:Georgia,serif!important;font-weight:500!important;color:var(--ch-ink)!important}.section-sub{color:var(--ch-muted);max-width:650px;margin:8px auto 0;line-height:1.7}.centered{text-align:center}.trust-strip{display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid var(--ch-line);background:#fff;padding:22px 6vw}.trust-strip div{display:grid;grid-template-columns:38px 1fr;column-gap:10px;align-items:center;border-right:1px solid var(--ch-line);padding:6px 24px}.trust-strip div:last-child{border:0}.trust-strip span{grid-row:1/3;color:var(--ch-gold);font-size:24px}.trust-strip b{font-size:13px;text-transform:uppercase;letter-spacing:.08em}.trust-strip small{color:#8a847b}.collection-showcase{background:var(--ch-cream)!important}.showcase-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;grid-template-rows:250px 250px;gap:18px}.showcase-card{background:#fff;border:1px solid var(--ch-line);overflow:hidden;display:grid;grid-template-rows:1fr auto;transition:.25s;box-shadow:0 8px 30px rgba(60,40,20,.04)}.showcase-card:hover{transform:translateY(-4px);box-shadow:0 16px 45px rgba(60,40,20,.10)}.showcase-card.tall{grid-row:span 2}.showcase-art{min-height:0;display:grid;place-items:center;background:radial-gradient(circle,#fff 0,#eee4d4 65%,#d7c7ae 100%);color:#9b7135;font-family:Georgia,serif;letter-spacing:.16em;font-size:18px}.art-rudraksha{background:radial-gradient(circle at 50% 40%,#fff,#eadbc6 60%,#cbb28f)}.art-karungali{background:radial-gradient(circle,#fff,#eee8df 55%,#d8cec0)}.art-stones{background:radial-gradient(circle,#fff,#eee7dc 58%,#d4c1a4)}.art-panchaloha{background:radial-gradient(circle,#fff,#f1e5d2 58%,#d9bf94)}.showcase-card>div:last-child{padding:17px 18px}.showcase-card h3{margin:0 0 4px;font-family:Georgia,serif;font-size:21px;font-weight:500}.showcase-card p{margin:0;color:var(--ch-muted);font-size:13px}.purpose-band{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding:75px 8vw;background:#1d1b18!important;color:#fff!important}.purpose-band h2{font-family:Georgia,serif;font-size:clamp(35px,5vw,65px);font-weight:400;line-height:1.02;margin:8px 0}.purpose-band h2 em{color:#d4b27c;font-style:normal}.purpose-band .eyebrow{color:#d4b27c!important}.purpose-pills{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.purpose-pills span{border:1px solid rgba(255,255,255,.25);padding:13px 18px;border-radius:999px;color:#eee}.about-chaithanya{background:#fff!important}.about-copy{color:var(--ch-muted)!important;line-height:1.9}.muted{color:var(--ch-muted)!important}.review-grid article{background:#faf8f3!important;border:1px solid var(--ch-line)!important;color:#4d4942!important}.admin-teaser{background:var(--ch-cream)!important}.admin-teaser-card{background:#fff!important;border:1px solid var(--ch-line)!important}.admin-login-overlay{background:rgba(255,255,255,.9)!important}.login-window{border:1px solid var(--ch-line)!important;box-shadow:0 30px 90px rgba(40,30,15,.18)!important}.login-art{background:linear-gradient(145deg,#f5eee3,#fff)!important}.login-art:before{background:linear-gradient(145deg,#b18a54,#e9d5b2,#fff)!important;box-shadow:0 0 0 26px rgba(167,123,56,.12)!important}.login-form-side input{background:#f7f5f0!important;color:#222!important;border:1px solid #e5dfd5!important}.login-gradient{background:var(--ch-ink)!important}.admin-panel-screen{background:#f8f7f4!important;color:#1d1b18!important}.admin-sidebar{background:#fff!important;color:#222!important;border-right:1px solid var(--ch-line)!important}.admin-logo span{background:var(--ch-ink)!important;color:#fff!important}.admin-nav{color:#5e584f!important}.admin-nav:hover,.admin-nav.active{background:#f1eadf!important;color:#8a622d!important}.admin-topline{background:#fff!important;border-bottom:1px solid var(--ch-line)!important}.admin-topline h2,.panel-title h3,.admin-hero-card h3{color:#1d1b18!important}.stat-card,.admin-hero-card,.premium-form,.premium-list,.settings-grid article{background:#fff!important;color:#1d1b18!important;border:1px solid var(--ch-line)!important;box-shadow:0 12px 35px rgba(40,30,15,.06)!important}.stat-card.pink{background:#1d1b18!important;color:#fff!important}.admin-pro input,.admin-pro textarea,.admin-pro select{background:#fff!important;color:#222!important;border:1px solid #ded8ce!important}.admin-pro .primary{background:#1d1b18!important;border-color:#1d1b18!important}.admin-pro .admin-row{background:#fff!important;border-color:#e6e0d7!important;color:#222!important}.admin-pro .mini-actions button{color:#6e4d22!important;border-color:#ddd2c1!important}.admin-pro .eyebrow{color:#9b6f32!important}
@media(max-width:850px){.announcement-bar span:nth-child(n+2){display:none}.trust-strip{grid-template-columns:1fr 1fr;padding:15px}.trust-strip div{padding:12px;border-bottom:1px solid var(--ch-line)}.showcase-grid{grid-template-columns:1fr 1fr;grid-template-rows:220px 220px}.showcase-card.tall{grid-row:span 1}.purpose-band{grid-template-columns:1fr;padding:55px 6vw}.purpose-pills{justify-content:flex-start}.hero{min-height:auto!important;padding:55px 18px!important}}
@media(max-width:560px){.showcase-grid{grid-template-columns:1fr;grid-template-rows:220px}.trust-strip{grid-template-columns:1fr}.trust-strip div{border-right:0}.brand{font-size:14px}.hero-product{min-height:340px!important}}
/* =========================================================
CHAITHANYA — JAPAM-INSPIRED STOREFRONT V2
Visual direction: warm ivory, editorial jewellery layout,
circular category rail, full-width hero, horizontal products.
========================================================= */
:root{
--jp-bg:#fbf7ee;
--jp-cream:#f5ead8;
--jp-paper:#fffaf1;
--jp-ink:#27242a;
--jp-muted:#716b63;
--jp-line:#ded5c8;
--jp-gold:#9b672d;
--jp-red:#c92f38;
}
body{
background:var(--jp-bg)!important;
color:var(--jp-ink)!important;
}
html{background:var(--jp-bg)!important;}
.announcement-bar{
min-height:28px!important;
height:28px!important;
padding:5px 12px!important;
background:#050505!important;
color:#fff!important;
font-size:10px!important;
font-weight:800!important;
letter-spacing:.04em!important;
text-transform:none!important;
}
.announcement-bar span{white-space:nowrap}
.topbar{
height:76px!important;
position:sticky!important;
top:0!important;
z-index:80!important;
padding:0 clamp(18px,3.2vw,52px)!important;
background:rgba(255,250,241,.97)!important;
border-bottom:1px solid var(--jp-line)!important;
box-shadow:0 2px 12px rgba(56,39,18,.04)!important;
}
.brand{
color:var(--jp-ink)!important;
font-family:Georgia,'Times New Roman',serif!important;
font-size:20px!important;
letter-spacing:.13em!important;
font-weight:700!important;
}
.brand-mark{
width:38px!important;height:38px!important;
border:0!important;border-radius:0!important;
background:transparent!important;color:var(--jp-ink)!important;
font-family:Georgia,serif!important;font-size:23px!important;
position:relative;
}
.brand-mark:after{content:'';position:absolute;left:4px;right:4px;bottom:1px;height:2px;background:var(--jp-ink)}
.desktop-nav{gap:22px!important;color:#514b45!important;font-size:12px!important}
.desktop-nav a,.nav-login{color:#514b45!important}
.desktop-nav a:hover,.nav-login:hover{color:var(--jp-gold)!important}
.header-actions{gap:12px!important}
.header-search{font-size:27px!important;color:var(--jp-ink)!important}
.icon-btn{
border:0!important;border-radius:0!important;
background:transparent!important;color:var(--jp-ink)!important;
padding:8px!important;font-size:13px!important;
}
.icon-btn span{background:var(--jp-ink)!important;color:#fff!important;border-radius:99px;padding:2px 6px}
.mobile-menu-btn{color:var(--jp-ink)!important;font-size:25px!important}
/* category rail */
.quick-category-section{
padding:12px clamp(18px,4vw,60px) 14px!important;
background:#f7e7d0!important;
border-bottom:1px solid #ead6bd!important;
}
.quick-category-row{
display:flex!important;
gap:26px!important;
align-items:flex-start!important;
overflow-x:auto!important;
scrollbar-width:none!important;
max-width:1320px;
margin:auto;
padding:0 4px 2px;
}
.quick-category-row::-webkit-scrollbar{display:none}
.quick-category-row .category-card{
flex:0 0 74px!important;
width:74px!important;
min-height:74px!important;
height:auto!important;
aspect-ratio:1!important;
border:0!important;
border-radius:50%!important;
padding:0!important;
position:relative!important;
background-size:cover!important;
background-position:center!important;
box-shadow:none!important;
overflow:visible!important;
color:var(--jp-ink)!important;
}
.quick-category-row .category-card:before{display:none!important}
.quick-category-row .category-card h3{
position:absolute!important;
top:calc(100% + 7px)!important;
left:50%!important;
transform:translateX(-50%)!important;
width:110px!important;
margin:0!important;
color:#443d36!important;
font-family:Inter,Arial,sans-serif!important;
font-size:10px!important;
font-weight:700!important;
line-height:1.15!important;
text-align:center!important;
white-space:normal!important;
}
.quick-category-section{padding-bottom:42px!important}
/* full width hero */
.hero{
min-height:480px!important;
display:grid!important;
grid-template-columns:1fr 1.25fr!important;
align-items:center!important;
gap:10px!important;
padding:0 clamp(24px,8vw,105px)!important;
position:relative!important;
overflow:hidden!important;
background:
linear-gradient(90deg,rgba(249,235,215,.98) 0%,rgba(249,235,215,.88) 34%,rgba(214,181,148,.38) 62%,rgba(188,153,122,.18) 100%),
url('https://images.unsplash.com/photo-1611652022419-a9419f74343d?q=80&w=1800&auto=format&fit=crop') center/cover!important;
color:var(--jp-ink)!important;
}
.hero:after{
content:'';position:absolute;inset:0;
background:linear-gradient(90deg,rgba(249,235,215,.78),rgba(249,235,215,.12) 64%,rgba(0,0,0,0));
pointer-events:none;
}
.hero-copy{position:relative;z-index:2;max-width:530px!important}
.hero .eyebrow{color:#775b42!important;font-size:10px!important;letter-spacing:.22em!important}
.hero h1{
color:#19161a!important;
font-family:Georgia,'Times New Roman',serif!important;
font-size:clamp(45px,6vw,76px)!important;
line-height:.96!important;
font-weight:500!important;
letter-spacing:-.055em!important;
margin:12px 0 16px!important;
}
.hero h1 em{color:#9c6b31!important;font-style:normal!important}
.hero p:not(.eyebrow){color:#4e4943!important;font-size:14px!important;line-height:1.65!important;max-width:460px!important}
.hero .actions{margin-top:24px!important}
.hero .primary{background:#9a652c!important;border-color:#9a652c!important;color:#fff!important;padding:11px 18px!important}
.hero .secondary{display:none!important}
.hero-trust{gap:12px!important;color:#62584e!important;font-size:10px!important}
.hero-product{
min-height:480px!important;
position:relative!important;z-index:1!important;
background:transparent!important;border:0!important;box-shadow:none!important;
}
.hero-image-frame{
width:min(690px,100%)!important;height:100%!important;min-height:480px!important;
background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important;
}
.hero-image-frame:after{content:'12 SIGNATURE PIECES';position:absolute;right:9%;bottom:32px;background:#9a652c;color:#fff;padding:7px 11px;font-size:9px;letter-spacing:.08em;font-weight:800}
.mock-jewellery{
width:390px!important;height:390px!important;
border-radius:50%!important;
background:radial-gradient(circle at 45% 40%,#fff,#efe0cb 52%,#d2b89b 100%)!important;
box-shadow:0 30px 60px rgba(70,45,25,.16)!important;
border:1px solid rgba(155,103,45,.15)!important;
}
.hero-badge{display:none!important}
#heroImageBrandText{font-family:Georgia,serif!important;color:#8f5d2d!important;font-size:28px!important}
#heroImageSmallText{color:#706457!important}
/* remove old marquee visual weight */
.marquee{
background:var(--jp-ink)!important;color:#fff!important;border:0!important;
padding:10px 5vw!important;gap:46px!important;
}
.marquee span{font-size:9px!important;letter-spacing:.12em!important}
/* sections */
.section{padding:52px clamp(18px,3.3vw,48px)!important;background:var(--jp-bg)!important}
.bestseller-section{padding-top:44px!important}
.section-head{margin-bottom:22px!important}
.section-head h2{
font-family:Inter,Arial,sans-serif!important;
font-size:clamp(27px,3vw,38px)!important;
font-weight:800!important;
letter-spacing:-.035em!important;
color:var(--jp-ink)!important;
}
.bestseller-head{align-items:center!important}
.bestseller-head .eyebrow{display:none!important}
.shop-head-actions{display:flex;align-items:center;gap:18px}
.view-all-link{color:#4e4943!important;font-size:13px;text-decoration:underline;text-underline-offset:5px}
.view-all-link span{margin-left:5px}
.select{width:150px!important;background:transparent!important;border:1px solid var(--jp-line)!important;color:#4c463f!important;border-radius:3px!important}
/* product rail like screenshot */
.product-grid{
display:flex!important;
gap:18px!important;
overflow-x:auto!important;
padding:2px 1px 18px!important;
scroll-snap-type:x mandatory;
scrollbar-width:thin;
scrollbar-color:#8b8175 transparent;
}
.product-grid::-webkit-scrollbar{height:4px}
.product-grid::-webkit-scrollbar-track{background:transparent}
.product-grid::-webkit-scrollbar-thumb{background:#8b8175;border-radius:99px}
.product-card{
flex:0 0 calc(33.333% - 12px)!important;
min-width:250px!important;
border:0!important;background:transparent!important;
scroll-snap-align:start;
}
.product-card img{
width:100%!important;height:320px!important;
object-fit:cover!important;border-radius:7px!important;
background:#eee5d8!important;
}
.product-body{padding:10px 1px 4px!important}
.product-body .eyebrow{display:none!important}
.product-body h3{
color:#2d2930!important;font-family:Inter,Arial,sans-serif!important;
font-size:16px!important;font-weight:700!important;line-height:1.35!important;
margin:2px 0 6px!important;
}
.product-body .muted,.product-body p{color:#736c64!important;font-size:12px!important}
.product-body h2{font-size:17px!important;color:#2b272d!important;margin:7px 0!important}
.old-price{color:#817970!important}
.product-meta-line{display:none!important}
.product-card .actions{display:none!important}
.card-desc-box{margin:0!important}
.card-product-desc{display:none!important}
.card-read-more{display:none!important}
/* collection strip below products */
.collection-showcase{background:var(--jp-bg)!important;padding-top:20px!important}
.collection-showcase .section-head{display:none!important}
.showcase-grid{display:flex!important;gap:28px!important;overflow-x:auto!important;scrollbar-width:none!important;padding:4px 0 15px!important}
.showcase-grid::-webkit-scrollbar{display:none}
.showcase-card,.showcase-card.tall{
flex:0 0 150px!important;height:auto!important;display:block!important;
border:0!important;background:transparent!important;box-shadow:none!important;
}
.showcase-art{
width:142px!important;height:142px!important;min-height:142px!important;
border-radius:50%!important;
background-size:cover!important;
color:transparent!important;
border:3px solid #f1e6d7!important;
box-shadow:0 6px 20px rgba(70,45,25,.08)!important;
}
.art-rudraksha{background:radial-gradient(circle at 45% 42%,#7e4c27,#2f1b0e)!important}
.art-karungali{background:radial-gradient(circle at 50% 50%,#3b2d25,#0d0c0b)!important}
.art-stones{background:radial-gradient(circle at 40% 40%,#d8c8a8,#8f6b48)!important}
.art-panchaloha{background:radial-gradient(circle at 45% 40%,#e4c48c,#6c4928)!important}
.showcase-card>div:last-child{padding:9px 0!important;text-align:center!important}
.showcase-card h3{font-family:Inter,Arial,sans-serif!important;font-size:12px!important;font-weight:700!important;color:#3f3933!important}
.showcase-card p{display:none!important}
/* mobile storefront */
@media(max-width:850px){
.announcement-bar{justify-content:center!important;overflow:hidden!important}
.announcement-bar span:not(:first-child){display:none!important}
.topbar{height:62px!important;padding:0 14px!important}
.mobile-menu-btn{order:4!important;margin-left:2px!important}
.brand{font-size:15px!important;letter-spacing:.12em!important}
.brand-mark{width:30px!important;height:30px!important;font-size:19px!important}
.header-actions{margin-left:auto!important}
.header-search{display:block!important;font-size:23px!important}
.icon-btn{font-size:0!important;padding:6px!important}
.icon-btn:before{content:'♧';font-size:22px}
.icon-btn span{font-size:9px!important;position:absolute;margin:-4px 0 0 -5px}
.quick-category-section{padding:10px 14px 40px!important}
.quick-category-row{gap:23px!important}
.quick-category-row .category-card{flex-basis:62px!important;width:62px!important}
.quick-category-row .category-card h3{font-size:9px!important;width:80px!important}
.hero{
min-height:410px!important;
display:block!important;
padding:0!important;
background:
linear-gradient(90deg,rgba(249,235,215,.93),rgba(249,235,215,.15)),
url('https://images.unsplash.com/photo-1611652022419-a9419f74343d?q=80&w=1400&auto=format&fit=crop') center/cover!important;
}
.hero:after{background:linear-gradient(90deg,rgba(249,235,215,.76),rgba(249,235,215,.05))!important}
.hero-copy{padding:58px 22px 24px!important;max-width:65%!important}
.hero h1{font-size:42px!important}
.hero p:not(.eyebrow){font-size:12px!important;line-height:1.5!important}
.hero .actions{margin-top:16px!important}
.hero-trust{display:none!important}
.hero-product{display:none!important}
.marquee{display:none!important}
.section{padding:34px 14px!important}
.bestseller-section{padding-top:34px!important}
.bestseller-head{gap:8px!important}
.bestseller-head h2{font-size:27px!important}
.shop-head-actions{width:100%;justify-content:space-between}
.select{display:none!important}
.view-all-link{font-size:12px}
.product-grid{gap:14px!important;padding-bottom:13px!important}
.product-card{flex-basis:78%!important;min-width:0!important}
.product-card img{height:320px!important;border-radius:7px!important}
.product-body h3{font-size:15px!important}
.product-body h2{font-size:16px!important}
.collection-showcase{padding-top:12px!important}
}
@media(max-width:430px){
.quick-category-row{gap:21px!important}
.quick-category-row .category-card{flex-basis:57px!important;width:57px!important}
.hero{min-height:385px!important}
.hero-copy{max-width:76%!important;padding-top:48px!important}
.hero h1{font-size:39px!important}
.product-card{flex-basis:82%!important}
.product-card img{height:290px!important}
}
/* =========================================================
JAPAM-INSPIRED HEADER — desktop + mobile
========================================================= */
.jp-header{
position:sticky!important;
top:0!important;
z-index:120!important;
height:auto!important;
min-height:0!important;
padding:0!important;
display:block!important;
background:#fffaf1!important;
color:#302a25!important;
border-bottom:1px solid #e9dfd0!important;
box-shadow:0 2px 12px rgba(45,32,20,.045)!important;
backdrop-filter:none!important;
}
.jp-header-main{
min-height:76px;
display:grid;
grid-template-columns:1fr auto 1fr;
align-items:center;
gap:28px;
padding:0 clamp(22px,3.2vw,52px);
}
.jp-header .brand{
justify-self:start;
display:flex!important;
align-items:center;
gap:10px;
font-family:Georgia,'Times New Roman',serif!important;
font-size:19px!important;
font-weight:700!important;
letter-spacing:.11em!important;
color:#302a25!important;
}
.jp-header .brand-mark{
width:42px!important;
height:42px!important;
margin:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
color:#302a25!important;
font-family:Georgia,'Times New Roman',serif!important;
font-size:27px!important;
font-weight:700!important;
position:relative!important;
}
.jp-header .brand-mark:after{
content:'';
position:absolute;
left:3px;
right:3px;
bottom:2px;
height:2px;
background:#302a25;
}
.jp-primary-nav{
justify-self:center;
display:flex!important;
align-items:center;
gap:22px!important;
color:#504942!important;
font-size:12px!important;
font-weight:600!important;
white-space:nowrap;
}
.jp-primary-nav .notify-nav-btn,
.jp-primary-nav .nav-login{display:none!important}
.jp-header-actions{
justify-self:end;
display:flex!important;
align-items:center;
gap:14px!important;
}
.jp-header .header-search,
.jp-header .jp-help-icon,
.jp-header .jp-cart-icon{
width:34px!important;
height:38px!important;
display:grid!important;
place-items:center!important;
padding:0!important;
border:0!important;
background:transparent!important;
color:#302a25!important;
position:relative!important;
}
.jp-header .header-search{font-size:29px!important;line-height:1!important;transform:translateY(-1px)}
.jp-help-icon{font-size:25px!important;font-weight:700!important}
.jp-cart-icon{font-size:25px!important}
.jp-cart-icon span{
position:absolute!important;
top:1px!important;
right:-2px!important;
min-width:15px;
height:15px;
display:grid!important;
place-items:center;
padding:0 3px!important;
border-radius:99px!important;
background:#302a25!important;
color:#fff!important;
font-size:8px!important;
line-height:1!important;
}
.jp-category-nav{
min-height:48px;
display:flex;
align-items:center;
justify-content:center;
gap:28px;
padding:0 28px;
border-top:1px solid #eee4d6;
background:#fffaf1;
overflow:hidden;
white-space:nowrap;
}
.jp-category-nav a{
color:#443d36!important;
font-size:12px!important;
font-weight:600!important;
}
.jp-category-nav a:hover{color:#9b7135!important}
.jp-category-nav span{font-size:11px;margin-left:4px}
.jp-header .mobile-menu-btn{display:none!important}
@media(max-width:850px){
.jp-header-main{
min-height:64px!important;
height:64px!important;
display:flex!important;
padding:0 15px!important;
gap:0!important;
}
.jp-header .brand{
flex:1 1 auto!important;
justify-self:auto!important;
font-size:15px!important;
letter-spacing:.08em!important;
gap:7px!important;
}
.jp-header .brand-mark{
width:31px!important;
height:31px!important;
font-size:21px!important;
}
.jp-header .brand-mark:after{left:2px;right:2px;bottom:0;height:1.5px}
.jp-primary-nav{display:none!important}
.jp-category-nav{display:none!important}
.jp-header-actions{
flex:0 0 auto!important;
margin-left:auto!important;
gap:9px!important;
}
.jp-header .header-search,
.jp-header .jp-help-icon,
.jp-header .jp-cart-icon{
width:31px!important;
height:42px!important;
}
.jp-header .header-search{font-size:25px!important}
.jp-help-icon{font-size:22px!important}
.jp-cart-icon{font-size:23px!important}
.jp-cart-icon span{top:4px!important;right:-2px!important}
.jp-header .mobile-menu-btn{
display:grid!important;
place-items:center!important;
width:34px!important;
height:42px!important;
margin:0!important;
padding:0!important;
border:0!important;
background:transparent!important;
color:#302a25!important;
font-size:26px!important;
line-height:1!important;
}
}
/* =========================================================
CHAITHANYA V4 — JAPAM-INSPIRED STOREFRONT + FLOATING HERO
========================================================= */
:root{
--ch-cream:#fbf3e6;
--ch-cream-2:#f4e4cf;
--ch-ink:#302b31;
--ch-brown:#95602b;
--ch-line:#e8dac7;
}
body{background:var(--ch-cream)!important;color:var(--ch-ink)!important}
/* Header: clean Japam-like two-level desktop header */
.jp-header{position:sticky!important;top:0!important;z-index:1200!important;background:#fffaf2!important;border-bottom:1px solid #e8ddcd!important;box-shadow:0 4px 22px rgba(50,35,20,.05)!important}
.jp-header-main{min-height:74px!important;padding:0 clamp(20px,3.2vw,48px)!important;grid-template-columns:auto 1fr auto!important;gap:34px!important}
.jp-header .brand{font-family:Georgia,'Times New Roman',serif!important;font-size:20px!important;letter-spacing:.15em!important;color:#2e2a2d!important}
.jp-header .brand-mark{font-size:25px!important;width:35px!important;height:35px!important}
.jp-primary-nav{justify-content:center!important;gap:25px!important}
.jp-primary-nav a,.jp-primary-nav button{font-size:12px!important;color:#3f3940!important;text-decoration:none!important}
.jp-header-actions{justify-self:end!important;gap:12px!important}
.jp-header-actions button{color:#302b31!important}
.jp-category-nav{display:flex!important;align-items:center!important;justify-content:center!important;gap:30px!important;min-height:46px!important;padding:0 24px!important;border-top:1px solid #eee3d5!important;background:#fffaf2!important;overflow:auto!important;scrollbar-width:none!important}
.jp-category-nav::-webkit-scrollbar{display:none}
.jp-category-nav a{white-space:nowrap!important;font-size:12px!important;color:#3f3940!important;text-decoration:none!important}
.jp-category-nav a:hover{color:var(--ch-brown)!important}
/* The old round category rail is intentionally removed. */
.quick-category-section{display:none!important}
/* Floating editorial hero */
.hero{
min-height:560px!important;
display:grid!important;
grid-template-columns:minmax(320px,.85fr) minmax(480px,1.15fr)!important;
gap:18px!important;
padding:58px clamp(22px,5vw,78px)!important;
background:
radial-gradient(circle at 75% 30%,rgba(255,255,255,.75),transparent 28%),
linear-gradient(110deg,#faecd9 0%,#f8e9d3 42%,#e7c7a7 100%)!important;
overflow:hidden!important;
}
.hero:before{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.15),transparent 50%,rgba(114,72,36,.07))}
.hero:after{content:'';position:absolute;inset:auto -10% -180px 20%;height:360px;border-radius:50%;background:rgba(143,91,45,.09);filter:blur(30px);pointer-events:none}
.hero-copy{align-self:center!important;max-width:550px!important;padding:12px 0!important}
.hero .eyebrow{color:#76583f!important;font-size:10px!important;letter-spacing:.25em!important}
.hero h1{font-family:Georgia,'Times New Roman',serif!important;font-size:clamp(48px,5.7vw,78px)!important;line-height:.94!important;color:#1d191c!important;font-weight:500!important;letter-spacing:-.055em!important;margin:12px 0 20px!important}
.hero h1 em{color:#9a642d!important;font-style:normal!important}
.hero p:not(.eyebrow){max-width:490px!important;font-size:14px!important;line-height:1.8!important;color:#554d46!important}
.hero .primary{background:#9a642d!important;border-color:#9a642d!important;color:#fff!important;border-radius:3px!important;padding:12px 20px!important}
.hero .secondary{display:none!important}
.hero-trust{margin-top:22px!important;display:flex!important;flex-wrap:wrap!important;gap:12px 20px!important;color:#6a5d52!important;font-size:10px!important}
.hero-floating-stage{position:relative!important;min-height:470px!important;width:100%!important;background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important;display:block!important}
.hero-orbit{position:absolute;border:1px solid rgba(130,87,49,.16);border-radius:50%;pointer-events:none;animation:orbitDrift 9s ease-in-out infinite}
.hero-orbit-one{width:430px;height:430px;right:6%;top:2%}
.hero-orbit-two{width:300px;height:300px;right:20%;top:15%;animation-delay:-3s}
.floating-image-card{position:absolute;overflow:hidden;background:#efe1cf;border:8px solid rgba(255,250,242,.85);box-shadow:0 28px 70px rgba(66,43,23,.22);border-radius:24px;transition:transform 1s cubic-bezier(.2,.75,.2,1),opacity .8s ease,filter .8s ease;will-change:transform}
.floating-image-card img{display:block;width:100%;height:100%;object-fit:cover}
.floating-image-card span{position:absolute;left:16px;bottom:14px;padding:6px 9px;background:rgba(35,27,23,.75);color:#fff;font-size:8px;letter-spacing:.18em;border-radius:2px}
.floating-card-main{width:min(390px,52vw);height:460px;right:13%;top:3%;z-index:5;transform:rotate(1.8deg);animation:mainFloat 5.5s ease-in-out infinite}
.floating-card-left{width:205px;height:270px;left:5%;bottom:8%;z-index:4;transform:rotate(-8deg);animation:leftFloat 6.4s ease-in-out infinite}
.floating-card-back{width:180px;height:240px;right:1%;top:8%;z-index:2;transform:rotate(8deg);opacity:.86;filter:saturate(.86);animation:backFloat 7s ease-in-out infinite}
.floating-image-caption{position:absolute;left:16px;right:16px;bottom:15px;padding:12px 14px;background:linear-gradient(180deg,transparent,rgba(22,17,14,.8));color:#fff;display:grid;gap:3px}
.floating-image-caption small{font-size:9px;letter-spacing:.22em}
.floating-image-caption b{font-family:Georgia,serif;font-size:16px;font-weight:500}
.hero-floating-dots{position:absolute;right:17%;bottom:0;display:flex;gap:7px;z-index:10}
.hero-floating-dots i{width:28px;height:3px;border-radius:5px;background:rgba(55,42,32,.25);transition:.3s}
.hero-floating-dots i.active{background:#9a642d;width:42px}
@keyframes mainFloat{0%,100%{transform:translate3d(0,0,0) rotate(1.8deg)}50%{transform:translate3d(0,-13px,0) rotate(-1deg)}}
@keyframes leftFloat{0%,100%{transform:translate3d(0,0,0) rotate(-8deg)}50%{transform:translate3d(-8px,-18px,0) rotate(-4deg)}}
@keyframes backFloat{0%,100%{transform:translate3d(0,0,0) rotate(8deg)}50%{transform:translate3d(10px,-15px,0) rotate(12deg)}}
@keyframes orbitDrift{0%,100%{transform:rotate(0deg) scale(1)}50%{transform:rotate(12deg) scale(1.035)}}
/* Admin controls for three editable hero images */
.hero-image-admin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}
.hero-image-admin-card{padding:16px;border:1px solid #e4dacb;background:#fbf8f2;border-radius:14px;display:grid;gap:10px}
.hero-image-admin-card b{font-size:12px;color:#2d292d}
.hero-image-admin-card input{width:100%;box-sizing:border-box}
/* Product sections closer to the reference */
.bestseller-section{background:#fffaf2!important}
.section-head h2{font-family:Inter,Arial,sans-serif!important;font-weight:800!important;color:#302b31!important}
.product-card{background:transparent!important}
.product-card img{border-radius:8px!important;box-shadow:none!important}
.product-body h3{font-size:15px!important;color:#322d33!important}
.product-body h2{color:#322d33!important}
.collection-showcase{background:#f7e8d2!important}
@media(max-width:850px){
.jp-header-main{min-height:64px!important;grid-template-columns:auto 1fr auto!important;gap:8px!important;padding:0 14px!important}
.jp-header .brand{font-size:15px!important;letter-spacing:.11em!important}
.jp-header .brand-mark{width:29px!important;height:29px!important;font-size:19px!important}
.jp-primary-nav{display:none!important}
.jp-header-actions{gap:8px!important}
.jp-header-actions .header-search{font-size:23px!important}
.jp-category-nav{justify-content:flex-start!important;gap:24px!important;min-height:44px!important;padding:0 16px!important}
.jp-category-nav a{font-size:11px!important}
.hero{min-height:690px!important;display:flex!important;flex-direction:column!important;padding:42px 18px 22px!important;gap:0!important}
.hero-copy{max-width:100%!important;padding:0 4px!important;z-index:5!important}
.hero h1{font-size:43px!important;line-height:.96!important;margin:10px 0 14px!important}
.hero p:not(.eyebrow){font-size:12px!important;line-height:1.65!important;max-width:360px!important}
.hero-trust{display:none!important}
.hero-floating-stage{height:380px!important;min-height:380px!important;margin-top:8px!important}
.hero-orbit-one{width:320px;height:320px;right:4%;top:15%}
.hero-orbit-two{width:220px;height:220px;right:18%;top:28%}
.floating-card-main{width:245px;height:300px;right:12%;top:13%;border-width:6px}
.floating-card-left{width:135px;height:185px;left:1%;bottom:9%;border-width:5px}
.floating-card-back{width:120px;height:160px;right:0;top:11%;border-width:5px}
.floating-image-caption{left:9px;right:9px;bottom:8px;padding:8px}
.floating-image-caption small{font-size:7px}
.floating-image-caption b{font-size:12px}
.floating-image-card span{left:9px;bottom:8px;font-size:6px;padding:5px}
.hero-floating-dots{right:23%;bottom:0}
.hero-image-admin-grid{grid-template-columns:1fr}
}
@media(max-width:430px){
.hero{min-height:655px!important}
.hero h1{font-size:40px!important}
.hero-floating-stage{height:350px!important;min-height:350px!important}
.floating-card-main{width:220px;height:275px;right:12%;}
.floating-card-left{width:120px;height:165px}
.floating-card-back{width:108px;height:145px}
.hero-floating-dots{right:20%}
}
@media(prefers-reduced-motion:reduce){
.floating-image-card,.hero-orbit{animation:none!important}
}
/* V5 Japam-inspired homepage collection rail. The header category circles remain removed. */
.japam-collections{background:#fffaf2!important;padding-top:34px!important;padding-bottom:28px!important;border-top:1px solid #e9dfd1;border-bottom:1px solid #e9dfd1}
.japam-collections .section-head{margin-bottom:20px}
.collection-rail{display:flex;gap:34px;overflow-x:auto;padding:4px 2px 16px;scrollbar-width:none}
.collection-rail::-webkit-scrollbar{display:none}
.collection-round{min-width:150px;text-decoration:none;color:#2e2a2d;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;font-weight:700;font-size:13px}
.collection-round img{width:150px;height:150px;border-radius:50%;object-fit:cover;border:1px solid #e1d5c5;box-shadow:0 10px 28px rgba(55,40,20,.10);transition:transform .35s ease,box-shadow .35s ease}
.collection-round:hover img{transform:translateY(-7px) scale(1.03);box-shadow:0 18px 38px rgba(55,40,20,.18)}
@media(max-width:700px){.japam-collections{padding:26px 16px 22px!important}.collection-rail{gap:18px}.collection-round{min-width:112px;font-size:11px}.collection-round img{width:112px;height:112px}}
/* Admin reliability: never let the admin login controls be hidden by the mobile nav. */
#openAdminLoginBtn{cursor:pointer!important;pointer-events:auto!important}
.admin-login-overlay.hidden{display:none!important}
.admin-login-overlay:not(.hidden){display:grid!important}
/* =========================================================
V7 FIXES — LOGO + PRODUCT VIEW + CART/ADMIN CLOSING
========================================================= */
.jp-header .brand{display:flex!important;align-items:center!important;min-width:0!important;text-decoration:none!important}
.brand-logo-image{width:178px!important;height:58px!important;object-fit:cover!important;object-position:center!important;display:block!important;border-radius:0!important;background:#fffaf2!important}
@media(min-width:851px){.jp-header .brand-logo-image{width:190px!important;height:64px!important}}
/* Product view: keep product details visible beside the gallery on desktop and immediately
after the gallery on mobile, before photo reviews. */
.product-left-column{min-width:0!important}
.modal-card{overflow:auto!important;align-items:start!important}
.modal-card .product-info{min-width:0!important;align-self:start!important}
@media(max-width:850px){
.modal{padding:0!important;display:block!important;overflow-y:auto!important;background:rgba(20,20,20,.45)!important}
.modal-card{display:grid!important;grid-template-columns:1fr!important;grid-template-rows:auto auto auto auto!important;width:100%!important;min-height:100vh!important;max-height:none!important;margin:0!important;border-radius:0!important;border:0!important;padding:72px 14px 30px!important;gap:16px!important;background:#fffaf2!important;overflow:visible!important}
.product-left-column{display:contents!important}
.product-left-column > #modalMainImage{grid-column:1!important;grid-row:1!important;width:100%!important;height:min(68vh,520px)!important;max-height:520px!important;object-fit:cover!important;border-radius:22px!important;background:#f3eee5!important}
.product-left-column > #thumbRow{grid-column:1!important;grid-row:2!important;margin:0!important}
.modal-card > .product-info{grid-column:1!important;grid-row:3!important;padding:6px 2px 18px!important;background:#fffaf2!important}
.modal-card > .left-review-panel{grid-column:1!important;grid-row:4!important}
.product-info h2{font-size:28px!important;line-height:1.12!important;margin:5px 0 8px!important}
.product-info h3{font-size:24px!important;margin:8px 0!important}
.product-info .product-desc{font-size:14px!important;line-height:1.65!important}
.close-btn#closeProductBtn{position:fixed!important;top:76px!important;right:18px!important;z-index:10020!important;width:44px!important;height:44px!important;background:#1d1b18!important;color:#fff!important;border:0!important;box-shadow:0 5px 18px rgba(0,0,0,.2)!important}
}
/* Cart drawer: reliable close control and mobile-safe layout. */
.drawer{z-index:10050!important}
.drawer-card{z-index:10051!important}
#closeCartBtn,#closeProfileBtn,#closeNotificationsBtn{z-index:10060!important;pointer-events:auto!important}
@media(max-width:850px){
.drawer-card{width:100%!important;max-width:100%!important;border-left:0!important;border-radius:18px 18px 0 0!important;margin-top:auto!important;height:92vh!important;padding:24px 16px 28px!important}
.drawer{align-items:flex-end!important}
}
/* Admin panel: make the close button always clickable and keep it above the full-screen panel. */
.admin-panel-screen{z-index:11000!important}
.close-admin-screen{z-index:11010!important;pointer-events:auto!important;right:18px!important;top:16px!important}
.admin-login-overlay{z-index:11100!important}
/* Generic escape/close buttons should never be blocked by decorative layers. */
.modal .close-btn,.drawer .close-btn,.admin-panel-screen .close-admin-screen{pointer-events:auto!important}
\n\n/* FINAL REPAIR — logo, product view, cart and admin reliability */\n.jp-header .brand-logo-image{width:56px!important;height:56px!important;max-width:56px!important;max-height:56px!important;object-fit:contain!important;object-position:center!important;border-radius:50%!important;background:#fffaf2!important;padding:2px!important;box-sizing:border-box!important;flex:0 0 56px!important}\n.jp-header .brand{gap:12px!important;white-space:nowrap!important}\n@media(min-width:851px){.jp-header .brand-logo-image{width:62px!important;height:62px!important;max-width:62px!important;max-height:62px!important;flex-basis:62px!important}}\n.jp-primary-nav .admin-nav-link{display:block!important;cursor:pointer!important;font-weight:700!important}\n.mobile-admin-menu{display:none!important}\n@media(max-width:850px){\n .jp-header .brand-logo-image{width:50px!important;height:50px!important;max-width:50px!important;max-height:50px!important;flex-basis:50px!important}\n .jp-header .brand{gap:8px!important}\n .jp-primary-nav.mobile-open{display:flex!important;position:absolute!important;left:10px!important;right:10px!important;top:64px!important;z-index:1300!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;padding:10px!important;background:#fffaf2!important;border:1px solid #e8ddcd!important;border-radius:0 0 18px 18px!important;box-shadow:0 18px 45px rgba(50,35,20,.15)!important}\n .jp-primary-nav.mobile-open a,.jp-primary-nav.mobile-open button{display:block!important;text-align:left!important;padding:13px 14px!important;border-bottom:1px solid #eee4d6!important}\n .jp-primary-nav.mobile-open .admin-nav-link,.jp-primary-nav.mobile-open .notify-nav-btn,.jp-primary-nav.mobile-open #openUserProfileBtn,.jp-primary-nav.mobile-open #openUserLoginBtn{display:block!important}\n}\n.product-main-image-wrap{position:relative!important;width:100%!important;min-height:320px!important}\n.product-main-image-wrap #modalMainImage{display:block!important;width:100%!important;min-height:320px!important}\n.product-image-fallback{position:absolute!important;inset:0!important;display:grid!important;place-items:center!important;padding:30px!important;text-align:center!important;background:#f2eadf!important;color:#6e5842!important;border-radius:24px!important;font-weight:700!important}\n.product-image-fallback.hidden{display:none!important}\n#productModal{background:rgba(38,30,24,.62)!important}\n#productModal .modal-card{background:#fffaf2!important;color:#302b31!important;border:1px solid #e4d8c8!important;border-radius:20px!important;box-shadow:0 30px 100px rgba(30,20,10,.28)!important}\n#productModal .product-info{background:#fffaf2!important}\n#productModal .product-info h2,#productModal .product-info h3,#productModal .product-info label,#productModal .product-info summary{color:#302b31!important}\n#productModal .muted{color:#6f655d!important}\n#productModal .chip{background:#fff!important;color:#302b31!important;border-color:#d8ccbd!important;border-radius:8px!important}\n#productModal .chip.active{background:#302b31!important;color:#fff!important;border-color:#302b31!important}\n#productModal .qty{border-color:#d8ccbd!important;background:#fff!important}\n#productModal .qty button{background:#302b31!important;color:#fff!important}\n#productModal .sticky-buy{background:#302b31!important;color:#fff!important;border-color:#302b31!important}\n#productModal .close-btn{background:#302b31!important;color:#fff!important;border-color:#302b31!important}\n@media(max-width:850px){\n #productModal .modal-card{padding-top:76px!important}\n #productModal .product-main-image-wrap{min-height:0!important}\n #productModal .product-main-image-wrap #modalMainImage{height:min(66vh,500px)!important;min-height:280px!important;object-fit:cover!important;border-radius:20px!important}\n #productModal .product-info{min-height:0!important}\n}\n#cartDrawer{z-index:12000!important;align-items:stretch!important}\n#cartDrawer .drawer-card{position:relative!important;z-index:12001!important;background:#fffaf2!important;color:#302b31!important;border-left:1px solid #e4d8c8!important}\n#cartDrawer .close-btn{position:absolute!important;top:14px!important;right:14px!important;z-index:12020!important;pointer-events:auto!important;cursor:pointer!important;background:#302b31!important;color:#fff!important}\n#cartDrawer input,#cartDrawer textarea{background:#fff!important;color:#302b31!important;border-color:#d8ccbd!important}\n#adminDashboard{position:fixed!important;inset:0!important;z-index:13000!important}\n#adminLoginOverlay{z-index:13100!important}\n
/* =========================================================
V9 MOBILE PRODUCT VIEW + HEADER FINAL REPAIR
========================================================= */
.jp-header .jp-header-main{display:grid!important;grid-template-columns:auto 1fr auto!important;align-items:center!important;min-width:0!important}
.jp-header .brand{display:flex!important;align-items:center!important;justify-content:flex-start!important;width:auto!important;min-width:0!important;max-width:72px!important;overflow:hidden!important}
.jp-header .brand-logo-image{display:block!important;width:58px!important;height:58px!important;min-width:58px!important;max-width:58px!important;min-height:58px!important;max-height:58px!important;object-fit:contain!important;object-position:center!important;padding:0!important;margin:0!important;border:0!important;border-radius:0!important;background:transparent!important}
@media(min-width:851px){
.jp-header .brand{max-width:72px!important}
.jp-header .brand-logo-image{width:64px!important;height:64px!important;min-width:64px!important;max-width:64px!important;min-height:64px!important;max-height:64px!important}
}
/* Product modal must own the mobile viewport instead of sitting behind the sticky header. */
#productModal{z-index:5000!important;padding:0!important;overflow-y:auto!important;align-items:flex-start!important}
#productModal.hidden{display:none!important}
#productModal .modal-card{width:min(1180px,calc(100% - 32px))!important;max-height:calc(100vh - 32px)!important;margin:16px auto!important;overflow:auto!important}
#productModal .product-main-image-wrap{background:#f1e9de!important;overflow:hidden!important}
#productModal #modalMainImage{background:#f1e9de!important}
#productModal #modalMainImage.is-fallback{object-fit:contain!important;padding:28px!important}
@media(max-width:850px){
#productModal{background:#fffaf2!important;backdrop-filter:none!important}
#productModal .modal-card{display:block!important;width:100%!important;min-height:100dvh!important;max-height:none!important;margin:0!important;padding:76px 16px 36px!important;border:0!important;border-radius:0!important;overflow:visible!important;box-shadow:none!important}
#productModal .product-left-column{display:block!important;width:100%!important}
#productModal .product-main-image-wrap{width:100%!important;height:min(58dvh,520px)!important;min-height:300px!important;border-radius:22px!important;margin:0!important}
#productModal .product-main-image-wrap #modalMainImage{display:block!important;width:100%!important;height:100%!important;min-height:0!important;max-height:none!important;object-fit:cover!important;border-radius:22px!important}
#productModal .product-main-image-wrap #modalMainImage.is-fallback{object-fit:contain!important;padding:32px!important}
#productModal .product-image-fallback{border-radius:22px!important;font-size:14px!important}
#productModal #thumbRow{display:flex!important;width:100%!important;max-width:100%!important;overflow-x:auto!important;margin:12px 0 20px!important;padding:0 2px 4px!important}
#productModal #thumbRow img{flex:0 0 72px!important;width:72px!important;height:72px!important;border-radius:12px!important}
#productModal .product-info{display:block!important;width:100%!important;padding:4px 2px 24px!important}
#productModal .product-info h2{font-size:30px!important;line-height:1.12!important;margin:6px 0 10px!important}
#productModal .product-info h3{font-size:25px!important;margin:8px 0 16px!important}
#productModal .product-info label{display:block!important;margin-top:18px!important;font-size:14px!important;font-weight:800!important}
#productModal .chips{margin:8px 0 12px!important}
#productModal .chip{min-height:42px!important}
#productModal .qty{margin-bottom:18px!important}
#productModal .sticky-buy,#productModal #buyNowBtn{min-height:52px!important;width:100%!important}
#productModal .left-review-panel{display:block!important;width:100%!important;margin-top:8px!important}
#productModal .close-btn#closeProductBtn{position:fixed!important;top:14px!important;right:14px!important;width:46px!important;height:46px!important;z-index:5100!important}
}
/* Home/shop should never inherit product-modal sizing. */
body{overflow-x:hidden!important}
#shop{scroll-margin-top:118px!important}
/* =========================================================
V10 — CUSTOMER FEEDBACK AT THE BOTTOM
========================================================= */
#reviews.customer-feedback-bottom,
#reviews{
background:linear-gradient(180deg,#f5ead8 0%,#efe0c8 100%)!important;
color:#2f2922!important;
border-top:1px solid #dfc9a7!important;
border-bottom:1px solid #dfc9a7!important;
position:relative!important;
}
#reviews .section-head h2{color:#2f2922!important}
#reviews .section-head .eyebrow{color:#9a7135!important}
#reviews .section-head{max-width:760px!important}
#reviews .review-grid{gap:18px!important}
#reviews .review-grid article,
#reviews .customer-feedback-card{
background:#fffdf9!important;
color:#3b332a!important;
border:1px solid #ddc9aa!important;
box-shadow:0 12px 30px rgba(82,55,24,.08)!important;
border-radius:18px!important;
}
#reviews .review-grid article b,
#reviews .customer-feedback-card b{color:#8b632d!important}
#reviews .customer-feedback-form{
margin-top:34px!important;
background:#fffaf2!important;
color:#302a24!important;
border:1px solid #ddc9aa!important;
border-radius:22px!important;
padding:24px!important;
box-shadow:0 16px 40px rgba(82,55,24,.08)!important;
}
#reviews .customer-feedback-form h3{color:#302a24!important;margin:4px 0 8px!important}
#reviews .customer-feedback-form input,
#reviews .customer-feedback-form select,
#reviews .customer-feedback-form textarea{
background:#fff!important;
color:#302a24!important;
border-color:#d9c6a9!important;
}
#reviews .customer-feedback-form .primary{
background:#2f2922!important;
border-color:#2f2922!important;
color:#fff!important;
}
@media(max-width:700px){
#reviews{padding:52px 5vw 58px!important}
#reviews .review-grid{grid-template-columns:1fr!important}
#reviews .customer-feedback-form{padding:18px!important}
}
/* =========================================================
V10 FINAL — CUSTOMER PROOF BELOW PRODUCT DETAILS
========================================================= */
#productModal .modal-card{
grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
grid-template-rows:auto auto!important;
align-items:start!important;
}
#productModal .modal-card > .product-left-column{
grid-column:1!important;
grid-row:1!important;
}
#productModal .modal-card > .product-info{
grid-column:2!important;
grid-row:1!important;
}
#productModal .modal-card > .left-review-panel{
grid-column:1 / -1!important;
grid-row:2!important;
width:100%!important;
margin-top:8px!important;
}
/* Dark Customer Proof palette: black, white and Chaithanya gold. */
#productModal .left-review-panel{
background:linear-gradient(180deg,#111111 0%,#080808 100%)!important;
color:#ffffff!important;
border:1px solid #2c2c2c!important;
border-radius:26px!important;
padding:20px!important;
box-shadow:0 18px 50px rgba(0,0,0,.22)!important;
}
#productModal .left-review-panel .eyebrow{
color:#b8893f!important;
}
#productModal .left-review-panel h3,
#productModal .left-review-panel h4{
color:#ffffff!important;
}
#productModal .left-review-panel .muted{
color:#a9a9a9!important;
}
#productModal .left-review-panel .product-photo-reviews{
max-height:340px!important;
overflow:auto!important;
}
#productModal .left-review-panel .photo-review-card{
background:#101010!important;
color:#ffffff!important;
border-color:#292929!important;
}
#productModal .left-review-panel .photo-review-card span{
color:#d2a45f!important;
}
#productModal .left-review-panel .photo-review-card p{
color:#c9c9c9!important;
}
#productModal .left-review-panel .user-review-form{
background:#0b0b0b!important;
color:#ffffff!important;
border:1px solid #292929!important;
border-radius:22px!important;
padding:18px!important;
}
#productModal .left-review-panel .user-review-form input,
#productModal .left-review-panel .user-review-form select,
#productModal .left-review-panel .user-review-form textarea{
background:#101010!important;
color:#ffffff!important;
border-color:#303030!important;
}
#productModal .left-review-panel .user-review-form input::placeholder,
#productModal .left-review-panel .user-review-form textarea::placeholder{
color:#8e8e8e!important;
}
#productModal .left-review-panel #submitUserReviewBtn{
background:#ffffff!important;
color:#222222!important;
border-color:#ffffff!important;
}
@media(max-width:850px){
#productModal .modal-card{
display:block!important;
grid-template-columns:1fr!important;
grid-template-rows:none!important;
}
#productModal .modal-card > .product-left-column,
#productModal .modal-card > .product-info,
#productModal .modal-card > .left-review-panel{
grid-column:auto!important;
grid-row:auto!important;
width:100%!important;
}
#productModal .modal-card > .left-review-panel{
margin-top:8px!important;
}
}
/* Homepage model showcase */
.model-gallery-section {
background: #f6ead8;
padding-top: 72px;
padding-bottom: 82px;
}
.model-gallery-head {
align-items: end;
margin-bottom: 30px;
}
.model-gallery-head h2 {
max-width: 760px;
margin-bottom: 8px;
}
.model-gallery-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 18px;
}
.model-gallery-card {
position: relative;
min-height: 430px;
overflow: hidden;
border-radius: 24px;
background: #1c1a17;
border: 1px solid rgba(44, 35, 28, .14);
box-shadow: 0 18px 42px rgba(55, 38, 20, .12);
}
.model-gallery-card img {
width: 100%;
height: 100%;
min-height: 430px;
display: block;
object-fit: cover;
transition: transform .5s ease;
}
.model-gallery-card:hover img { transform: scale(1.035); }
.model-gallery-caption {
position: absolute;
left: 0;
right: 0;
bottom: 0;
display: flex;
justify-content: space-between;
align-items: end;
gap: 12px;
padding: 58px 20px 18px;
color: #fff;
background: linear-gradient(transparent, rgba(0,0,0,.76));
font-weight: 700;
}
.model-gallery-caption i {
font-style: normal;
font-size: .75rem;
letter-spacing: .18em;
opacity: .78;
}
.model-gallery-admin-toolbar {
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
margin-top:18px;
flex-wrap:wrap;
}
.model-gallery-count {
font-weight:700;
color:#6f4b1f;
padding:9px 14px;
border:1px solid rgba(111,75,31,.18);
border-radius:999px;
background:#fffaf0;
}
.model-photo-remove {
border:1px solid rgba(150,40,40,.2);
background:#fff;
color:#9a3434;
border-radius:999px;
padding:7px 12px;
font-weight:700;
cursor:pointer;
}
.model-photo-remove:hover { background:#fff2f2; }
.model-gallery-admin-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px;
margin-top: 22px;
}
.model-gallery-admin-item {
padding: 18px;
border: 1px solid rgba(50,40,30,.12);
border-radius: 18px;
background: rgba(255,255,255,.72);
}
.model-gallery-admin-item input { width: 100%; margin-top: 10px; }
.model-gallery-admin-title {
display: flex;
justify-content: space-between;
gap: 10px;
align-items: center;
}
.model-gallery-admin-title span {
font-size: .72rem;
opacity: .6;
letter-spacing: .12em;
text-transform: uppercase;
}
@media (max-width: 900px) {
.model-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.model-gallery-card, .model-gallery-card img { min-height: 360px; }
.model-gallery-admin-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
.model-gallery-section { padding-top: 54px; padding-bottom: 60px; }
.model-gallery-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
.model-gallery-card { min-height: 300px; border-radius: 16px; }
.model-gallery-card img { min-height: 300px; }
.model-gallery-caption { padding: 48px 12px 12px; font-size: .78rem; }
}
/* ADMIN LOGIN ICON — compact header control */
.jp-primary-nav .admin-nav-link{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:0!important;
width:40px!important;
height:40px!important;
padding:0!important;
border:1px solid #d8cdbd!important;
border-radius:50%!important;
background:#fffaf2!important;
color:#302b31!important;
cursor:pointer!important;
box-sizing:border-box!important;
transition:transform .2s ease,background .2s ease,color .2s ease,box-shadow .2s ease!important;
}
.jp-primary-nav .admin-nav-link:hover{
background:#302b31!important;
color:#fff!important;
transform:translateY(-1px)!important;
box-shadow:0 6px 16px rgba(40,30,15,.12)!important;
}
.admin-login-icon{width:20px!important;height:20px!important;display:block!important;flex:0 0 20px!important}
.admin-login-label{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:850px){
.jp-primary-nav.mobile-open .admin-nav-link{display:flex!important;width:100%!important;height:auto!important;border-radius:10px!important;justify-content:flex-start!important;gap:10px!important}
.jp-primary-nav.mobile-open .admin-nav-link .admin-login-label{position:static!important;width:auto!important;height:auto!important;margin:0!important;overflow:visible!important;clip:auto!important;white-space:normal!important;font-weight:700!important}
}
/* ADMIN LOGIN — icon only in the desktop header */
.jp-primary-nav .admin-nav-link{
display:inline-grid!important;
place-items:center!important;
width:34px!important;
height:34px!important;
min-width:34px!important;
padding:0!important;
margin:0 0 0 2px!important;
border:0!important;
outline:0!important;
background:transparent!important;
color:#4b463f!important;
box-shadow:none!important;
border-radius:50%!important;
cursor:pointer!important;
}
.jp-primary-nav .admin-nav-link:hover,.jp-primary-nav .admin-nav-link:focus-visible{
background:#f1eadf!important;
color:#8a622d!important;
box-shadow:none!important;
}
.jp-primary-nav .admin-login-icon{
width:22px!important;
height:22px!important;
display:block!important;
}
@media(max-width:850px){
.jp-primary-nav.mobile-open .admin-nav-link{
width:42px!important;
height:42px!important;
min-width:42px!important;
padding:0!important;
margin:4px 0!important;
align-self:flex-start!important;
text-align:center!important;
border:0!important;
border-radius:50%!important;
}
}
/* =========================================================
V10.1 — ADMIN DASHBOARD CONTRAST / MOBILE REPAIR
========================================================= */
#adminDashboard.admin-pro{
background:#f8f7f4!important;
color:#1d1b18!important;
}
#adminDashboard.admin-pro .admin-workspace,
#adminDashboard.admin-pro .admin-panel{
color:#1d1b18!important;
}
#adminDashboard.admin-pro .admin-hero-card .muted,
#adminDashboard.admin-pro .panel-title + .muted,
#adminDashboard.admin-pro .admin-panel > .muted{
color:#6f675e!important;
}
/* Quick-control buttons must have readable text. */
#adminDashboard.admin-pro .btn.primary,
#adminDashboard.admin-pro #saveProductBtn,
#adminDashboard.admin-pro #saveCategoryBtn,
#adminDashboard.admin-pro #saveHomeContentBtn,
#adminDashboard.admin-pro #saveModelGalleryBtn,
#adminDashboard.admin-pro #saveSeoBtn,
#adminDashboard.admin-pro #saveSettingsBtn,
#adminDashboard.admin-pro #sendNotificationBtn,
#adminDashboard.admin-pro #sendNewProductTemplateBtn{
background:#1d1b18!important;
color:#fff!important;
border-color:#1d1b18!important;
text-shadow:none!important;
}
#adminDashboard.admin-pro .btn.primary:hover,
#adminDashboard.admin-pro #saveProductBtn:hover,
#adminDashboard.admin-pro #saveCategoryBtn:hover{
background:#332e28!important;
color:#fff!important;
}
/* The dark metric cards were inheriting dark text. Keep their content readable. */
#adminDashboard.admin-pro .status-board article{
background:#1d1b18!important;
color:#fff!important;
border:1px solid #302b25!important;
box-shadow:0 12px 30px rgba(40,30,15,.10)!important;
}
#adminDashboard.admin-pro .status-board article span,
#adminDashboard.admin-pro .status-board article b,
#adminDashboard.admin-pro .status-board article small{
color:#fff!important;
}
#adminDashboard.admin-pro .status-board article span{opacity:.72}
#adminDashboard.admin-pro .status-board article small{opacity:.58}
#adminDashboard.admin-pro #statLatestActivity{
font-size:18px!important;
line-height:1.35!important;
overflow-wrap:anywhere!important;
}
/* All overview statistic text stays readable in both normal and highlighted cards. */
#adminDashboard.admin-pro .stat-card{
color:#1d1b18!important;
}
#adminDashboard.admin-pro .stat-card span,
#adminDashboard.admin-pro .stat-card b,
#adminDashboard.admin-pro .stat-card small{
color:inherit!important;
}
#adminDashboard.admin-pro .stat-card.pink,
#adminDashboard.admin-pro .stat-card.pink span,
#adminDashboard.admin-pro .stat-card.pink b,
#adminDashboard.admin-pro .stat-card.pink small{
color:#fff!important;
}
/* Product editor controls: visible placeholders, typed text and file names. */
#adminDashboard.admin-pro .premium-form input,
#adminDashboard.admin-pro .premium-form textarea,
#adminDashboard.admin-pro .premium-form select{
color:#222!important;
background:#fff!important;
border-color:#ded8ce!important;
}
#adminDashboard.admin-pro .premium-form input::placeholder,
#adminDashboard.admin-pro .premium-form textarea::placeholder{
color:#777!important;
opacity:1!important;
}
#adminDashboard.admin-pro .premium-form input[type="file"]{
color:#222!important;
background:#fff!important;
}
#adminDashboard.admin-pro .premium-form input[type="file"]::file-selector-button{
color:#fff!important;
background:#1d1b18!important;
border:0!important;
border-radius:7px!important;
padding:9px 13px!important;
margin-right:10px!important;
cursor:pointer!important;
}
/* Product list cards remain readable on the cream admin background. */
#adminDashboard.admin-pro .admin-row,
#adminDashboard.admin-pro .premium-list > *{
color:#222!important;
}
#adminDashboard.admin-pro .admin-row h4,
#adminDashboard.admin-pro .admin-row h3,
#adminDashboard.admin-pro .admin-row b,
#adminDashboard.admin-pro .admin-row strong{
color:#2d2924!important;
}
#adminDashboard.admin-pro .admin-row p,
#adminDashboard.admin-pro .admin-row .muted,
#adminDashboard.admin-pro .admin-row small{
color:#756e65!important;
}
@media(max-width:850px){
#adminDashboard.admin-pro .admin-workspace{
padding:76px 14px 30px!important;
}
#adminDashboard.admin-pro .admin-topline{
margin:0 -14px 18px!important;
padding:14px 16px!important;
}
#adminDashboard.admin-pro .admin-topline h2{
font-size:24px!important;
line-height:1.15!important;
}
#adminDashboard.admin-pro .status-board article{
min-height:132px!important;
}
#adminDashboard.admin-pro .stat-card{
min-height:120px!important;
}
#adminDashboard.admin-pro .admin-hero-card .btn.primary{
width:100%!important;
min-height:52px!important;
}
#adminDashboard.admin-pro .premium-form input[type="file"]{
min-height:52px!important;
}
}
/* Dynamic model showcase replacing the old Experience feature panel */
.model-gallery-feature {
display: grid;
grid-template-columns: minmax(260px, .8fr) minmax(0, 2.2fr);
gap: 42px;
align-items: center;
background: #fbf4e8;
padding-top: 76px;
padding-bottom: 82px;
}
.model-gallery-intro h2 {
font-family: Georgia, 'Times New Roman', serif;
font-size: clamp(2.6rem, 5vw, 5rem);
line-height: .98;
margin: 8px 0 18px;
max-width: 430px;
}
.model-gallery-intro .section-sub { max-width: 390px; margin-bottom: 24px; }
.model-gallery-ornament { color: #a77b3e; letter-spacing: .22em; margin-top: 26px; }
.model-gallery-feature .model-gallery-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.model-gallery-feature .model-gallery-card { min-height: 410px; border-radius: 20px; }
.model-gallery-feature .model-gallery-card img { min-height: 410px; }
.model-gallery-enter .model-gallery-card {
animation: modelCardIn .65s cubic-bezier(.2,.75,.25,1) both;
animation-delay: var(--delay);
}
@keyframes modelCardIn {
from { opacity: 0; transform: translateY(22px) scale(.985); }
to { opacity: 1; transform: translateY(0) scale(1); }
}
.model-gallery-admin-item select { width: 100%; margin-top: 10px; }
@media (max-width: 980px) {
.model-gallery-feature { grid-template-columns: 1fr; }
.model-gallery-feature .model-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
.model-gallery-feature { padding-top: 54px; padding-bottom: 60px; gap: 26px; }
.model-gallery-intro h2 { font-size: 2.7rem; }
.model-gallery-feature .model-gallery-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
.model-gallery-feature .model-gallery-card,
.model-gallery-feature .model-gallery-card img { min-height: 280px; }
}
@media (prefers-reduced-motion: reduce) {
.model-gallery-enter .model-gallery-card { animation: none; }
}
/* ===== Reference-inspired storefront refresh ===== */
:root{
--ref-cream:#f5efe2;
--ref-paper:#fffaf0;
--ref-brown:#6f4b1f;
--ref-gold:#b18a45;
--ref-ink:#211d18;
--ref-muted:#756d61;
}
body{background:var(--ref-cream)!important;color:var(--ref-ink)!important}
.announcement-bar{background:#0e0d0b!important;color:#fff!important;letter-spacing:.08em}
.jp-header{background:#fffaf0!important;border-bottom:1px solid #dfd4c1!important;position:relative!important}
.jp-header-main{min-height:78px!important}
.brand-logo-image{width:76px!important;height:76px!important;object-fit:contain}
.jp-primary-nav a,.jp-primary-nav button{font-size:12px!important}
.jp-category-nav{background:#fffaf0!important;border-top:1px solid #eee4d4!important}
.ref-hero{position:relative!important;min-height:560px!important;margin:0!important;display:flex!important;align-items:center!important;overflow:hidden!important;background:#2b2119!important;border-radius:0!important}
.ref-hero .hero-bg{position:absolute!important;inset:0!important;z-index:0!important}
.ref-hero .hero-bg img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}
.ref-hero .hero-shade{position:absolute!important;inset:0!important;background:linear-gradient(90deg,rgba(27,18,12,.78),rgba(27,18,12,.38) 55%,rgba(27,18,12,.48))!important}
.ref-hero-copy{position:relative!important;z-index:2!important;width:min(720px,92%)!important;margin-left:auto!important;margin-right:8%!important;text-align:center!important;color:#fff!important;padding:70px 20px!important}
.ref-hero-copy .eyebrow{color:#f4dfb0!important}
.ref-hero-copy h1{font-family:Georgia,serif!important;font-size:clamp(42px,5vw,72px)!important;line-height:1.03!important;text-transform:uppercase!important;letter-spacing:.01em!important;color:#fff!important;text-shadow:0 2px 18px rgba(0,0,0,.35)!important}
.ref-hero-copy h1 em{color:#f0d39b!important;font-style:normal}
.ref-hero-copy p:not(.eyebrow){color:#fff!important;max-width:640px!important;margin:18px auto!important;font-size:17px!important}
.hero-shop-btn{background:#a67b17!important;border-color:#c99c39!important;color:#fff!important;border-radius:6px!important;box-shadow:0 8px 20px rgba(0,0,0,.2)!important}
.reference-category-rail{display:grid!important;grid-template-columns:repeat(8,1fr)!important;gap:18px!important;align-items:start!important;padding:18px 5%!important;background:#fffaf0!important;border-bottom:1px solid #e5dac7!important}
.reference-category-rail a{text-decoration:none!important;color:var(--ref-ink)!important;text-align:center!important;font-size:11px!important;font-weight:700!important;letter-spacing:.04em!important;display:flex!important;flex-direction:column!important;align-items:center!important;gap:8px!important;transition:transform .25s ease!important}
.reference-category-rail a:hover{transform:translateY(-4px)!important}
.reference-category-rail img{width:72px!important;height:72px!important;border-radius:50%!important;object-fit:cover!important;border:2px solid #d4c19e!important;box-shadow:0 4px 12px rgba(91,64,26,.12)!important}
.reference-purpose{padding-top:44px!important;padding-bottom:52px!important;background:#fffaf0!important}
.center-head{text-align:center!important;display:block!important}
.center-head h2{font-family:Georgia,serif!important;font-size:34px!important}
.purpose-card-grid{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:14px!important;max-width:1180px!important;margin:24px auto 0!important}
.purpose-card{min-height:130px!important;border-radius:8px!important;background:linear-gradient(135deg,#c7b38e,#9d8965)!important;color:#fff!important;text-decoration:none!important;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;text-align:center!important;padding:20px!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 8px 20px rgba(73,53,27,.12)!important;transition:transform .25s ease,filter .25s ease!important}
.purpose-card:hover{transform:translateY(-4px)!important;filter:brightness(1.04)!important}
.purpose-card span{font-size:26px!important;margin-bottom:6px!important}.purpose-card b{font-size:15px!important;letter-spacing:.06em!important}.purpose-card small{opacity:.9!important;margin-top:5px!important;max-width:230px!important}
.model-gallery-feature{background:#f8f1e4!important;padding-top:70px!important;padding-bottom:70px!important;display:grid!important;grid-template-columns:1fr 2.5fr!important;gap:40px!important;align-items:center!important}
.model-gallery-intro h2{font-family:Georgia,serif!important;font-size:clamp(38px,4vw,58px)!important;line-height:1.02!important;color:#211d18!important}
.model-gallery-grid{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:18px!important}
.model-gallery-card,.model-gallery-item{border-radius:12px!important;overflow:hidden!important;background:#fff!important;box-shadow:0 10px 30px rgba(57,41,21,.12)!important}
.model-gallery-grid img{width:100%!important;aspect-ratio:3/4!important;object-fit:cover!important;display:block!important}
.hidden-reference-section,.hidden-public-section{display:none!important}
.bestseller-section{background:#fffaf0!important}
.bestseller-head{align-items:end!important}.bestseller-head h2{font-family:Georgia,serif!important}
.product-card{background:#fff!important;border-color:#e1d4bf!important}
@media (max-width:900px){
.reference-category-rail{grid-template-columns:repeat(4,1fr)!important;gap:14px 8px!important;padding:16px 3%!important}
.reference-category-rail img{width:62px!important;height:62px!important}
.ref-hero{min-height:470px!important}
.ref-hero-copy{margin:0 auto!important;padding:50px 18px!important}
.ref-hero-copy h1{font-size:42px!important}
.purpose-card-grid{grid-template-columns:repeat(2,1fr)!important}
.model-gallery-feature{grid-template-columns:1fr!important}
.model-gallery-grid{grid-template-columns:repeat(2,1fr)!important}
}
@media (max-width:520px){
.reference-category-rail{grid-template-columns:repeat(4,1fr)!important}
.reference-category-rail img{width:52px!important;height:52px!important}
.reference-category-rail a{font-size:9px!important}
.ref-hero{min-height:430px!important}
.ref-hero-copy h1{font-size:34px!important}
.ref-hero-copy p:not(.eyebrow){font-size:14px!important}
.purpose-card-grid{grid-template-columns:1fr!important}
.model-gallery-grid{grid-template-columns:repeat(2,1fr)!important;gap:10px!important}
}
/* Private admin access: kept out of the top navigation */
.footer-admin-link{
margin-top:14px;
border:0;
background:transparent;
color:#8d6b32;
font:inherit;
font-size:.78rem;
letter-spacing:.08em;
cursor:pointer;
padding:8px 4px;
opacity:.78;
}
.footer-admin-link:hover,.footer-admin-link:focus-visible{opacity:1;text-decoration:underline;outline:none;}
/* Header admin icon + alignment refinements */
.jp-header-main{
width:100%;
max-width:1440px;
margin:0 auto;
grid-template-columns:minmax(220px,1fr) auto minmax(220px,1fr);
}
.jp-header-actions{
min-width:220px;
justify-content:flex-end;
}
.admin-header-icon{
width:36px!important;
height:38px!important;
display:grid!important;
place-items:center!important;
padding:0!important;
border:0!important;
background:transparent!important;
color:#302a25!important;
position:relative!important;
font-size:23px!important;
line-height:1!important;
transition:transform .2s ease,color .2s ease,background .2s ease!important;
}
.admin-header-icon:hover{
color:#9b7135!important;
transform:translateY(-1px);
}
.admin-lock-dot{
position:absolute!important;
right:2px!important;
bottom:5px!important;
width:9px!important;
height:9px!important;
border-radius:50%!important;
display:grid!important;
place-items:center!important;
background:#9b7135!important;
color:#fff!important;
font-size:8px!important;
line-height:1!important;
}
.jp-category-nav{
width:100%;
max-width:1440px;
margin:0 auto;
gap:clamp(16px,2.2vw,30px);
padding-inline:clamp(16px,3vw,42px);
overflow-x:auto;
scrollbar-width:none;
}
.jp-category-nav::-webkit-scrollbar{display:none}
/* Keep the main storefront content aligned to one readable grid. */
main>section:not(.hero):not(.marquee){
width:100%;
max-width:1440px;
margin-inline:auto;
}
.reference-category-rail{
padding-inline:clamp(20px,4vw,60px)!important;
}
.reference-purpose,.model-gallery-section,.bestseller-section{
padding-inline:clamp(20px,5vw,72px)!important;
}
.product-grid{
align-items:stretch;
}
@media(max-width:850px){
.jp-header-main{
width:100%;
max-width:none;
min-height:64px!important;
grid-template-columns:none!important;
}
.jp-header-actions{
min-width:0;
gap:8px!important;
}
.admin-header-icon{
width:34px!important;
}
.jp-category-nav{
justify-content:flex-start;
gap:18px;
padding-inline:16px;
}
main>section:not(.hero):not(.marquee){
max-width:none;
}
}
/* Final hero alignment fix: center the heading, supporting text and CTA over the hero image. */
.hero.ref-hero{
grid-template-columns:1fr!important;
min-height:560px!important;
padding:72px 24px!important;
place-items:center!important;
text-align:center!important;
}
.hero.ref-hero .hero-copy{
width:min(760px,100%)!important;
max-width:760px!important;
margin:0 auto!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:center!important;
}
.hero.ref-hero .hero-copy .eyebrow{
width:100%!important;
text-align:center!important;
}
.hero.ref-hero h1{
width:100%!important;
max-width:760px!important;
margin:12px auto 18px!important;
text-align:center!important;
}
.hero.ref-hero p:not(.eyebrow){
margin:0 auto!important;
max-width:650px!important;
text-align:center!important;
}
.hero.ref-hero .actions{
width:100%!important;
justify-content:center!important;
align-items:center!important;
margin:28px auto 0!important;
}
.hero.ref-hero .hero-shop-btn{
margin:0 auto!important;
}
.hero.ref-hero .hero-bg,
.hero.ref-hero .hero-shade{
position:absolute!important;
inset:0!important;
}
.hero.ref-hero .hero-bg img{
width:100%!important;
height:100%!important;
object-fit:cover!important;
object-position:center!important;
}
.hero.ref-hero .hero-shade{
background:linear-gradient(90deg,rgba(20,12,7,.38),rgba(20,12,7,.16) 50%,rgba(20,12,7,.38))!important;
}
@media(max-width:560px){
.hero.ref-hero{min-height:500px!important;padding:55px 18px!important}
.hero.ref-hero h1{font-size:clamp(38px,11vw,54px)!important;line-height:1!important}
.hero.ref-hero p:not(.eyebrow){font-size:14px!important;max-width:340px!important}
}
/* Header category connection animation */
.jp-category-nav a{position:relative;transition:color .25s ease,transform .25s ease}
.jp-category-nav a:after{content:'';position:absolute;left:0;right:0;bottom:-7px;height:2px;background:#9b7135;transform:scaleX(0);transform-origin:center;transition:transform .28s ease}
.jp-category-nav a:hover,.jp-category-nav a.active-category{color:#9b7135!important;transform:translateY(-1px)}
.jp-category-nav a.active-category:after{transform:scaleX(1)}
.reference-category-rail a{transition:transform .3s ease,filter .3s ease,opacity .3s ease}
.reference-category-rail a.active-category{transform:translateY(-7px);filter:drop-shadow(0 8px 12px rgba(120,80,25,.2))}
.reference-category-rail a.active-category img{box-shadow:0 0 0 3px #9b7135,0 8px 18px rgba(120,80,25,.16)}
.hero.category-switching{animation:categoryHeroIn .65s ease both}
.hero .hero-copy.category-copy-switching{animation:categoryCopyIn .55s ease both}
.hero #heroImagePreview{transition:opacity .35s ease,transform .6s ease,filter .35s ease}
.hero #heroImagePreview.hero-category-image-out{opacity:0;transform:scale(1.045);filter:blur(2px)}
@keyframes categoryHeroIn{0%{filter:saturate(.75)}45%{filter:saturate(1.08)}100%{filter:saturate(1)}}
@keyframes categoryCopyIn{0%{opacity:.15;transform:translateY(16px)}100%{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.jp-category-nav a,.reference-category-rail a,.hero.category-switching,.hero .hero-copy.category-copy-switching,.hero #heroImagePreview{animation:none!important;transition:none!important}}
/* Admin-controlled hero click target */
.ref-hero { cursor: pointer; }
.ref-hero:focus-visible { outline: 3px solid #b8863b; outline-offset: -6px; }
#homeClickCategoryInput { min-height: 48px; }
.form-help { grid-column: 1 / -1; margin: -8px 0 0; }
@media (max-width: 700px) {
.ref-hero { cursor: pointer; }
.form-help { grid-column: 1; }
}
/* Five-page storefront routing */
[data-page].route-hidden { display: none !important; }
body[data-page="home"] .jp-primary-nav [data-page-link="home"],
body[data-page="product"] .jp-primary-nav [data-page-link="product"],
body[data-page="about"] .jp-primary-nav [data-page-link="about"],
body[data-page="support"] .jp-primary-nav [data-page-link="support"],
body[data-page="feedback"] .jp-primary-nav [data-page-link="feedback"],
.active-page-link { color: #9b6b27 !important; }
.jp-primary-nav a[data-page-link] { position: relative; }
.jp-primary-nav a[data-page-link]::after { content:""; position:absolute; left:50%; bottom:-8px; width:0; height:2px; background:#b3833e; transform:translateX(-50%); transition:width .25s ease; }
.jp-primary-nav a[data-page-link].active-page-link::after { width:70%; }
.route-page { min-height: 65vh; }
.support-page { padding-top: clamp(54px, 8vw, 100px); padding-bottom: clamp(70px, 10vw, 120px); }
.support-hero { max-width: 820px; margin: 0 auto 44px; text-align:center; }
.support-hero h2 { font-size: clamp(2.6rem, 6vw, 5rem); margin: 10px 0 18px; }
.support-hero > p:last-child { max-width: 680px; margin: 0 auto; font-size: 1.05rem; line-height: 1.8; }
.support-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; max-width:1100px; margin:0 auto; }
.support-card { border:1px solid rgba(113,82,39,.18); background:#fffdf8; border-radius:24px; padding:30px; box-shadow:0 18px 50px rgba(47,36,24,.06); }
.support-card span { color:#a67b39; font-size:.75rem; letter-spacing:.18em; }
.support-card h3 { margin:12px 0 10px; font-size:1.5rem; }
.support-card p { color:#6d655c; line-height:1.7; min-height:86px; }
.support-card .btn { margin-top:10px; }
.support-note { max-width:1100px; margin:28px auto 0; padding:24px 28px; border-radius:18px; background:#f3eadb; text-align:center; }
.support-note p { margin:8px 0 0; color:#6d655c; }
@media (max-width: 760px) {
.support-grid { grid-template-columns:1fr; }
.support-card p { min-height:0; }
.jp-primary-nav a[data-page-link]::after { bottom:-3px; }
}
/* Homepage New & Trending highlights */
.highlights-section{background:linear-gradient(180deg,#fffaf0 0%,#f6ead7 100%);padding-top:clamp(48px,7vw,88px);padding-bottom:clamp(48px,7vw,88px)}
.highlights-columns{max-width:1180px;margin:32px auto 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.highlight-group{background:rgba(255,255,255,.7);border:1px solid rgba(117,82,35,.16);border-radius:26px;padding:22px;box-shadow:0 18px 45px rgba(50,35,18,.06)}
.highlight-group-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:18px}.highlight-group-head h3{margin:0;font-size:1.45rem}.highlight-group-head span{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#a07739}
.highlight-product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.highlight-product-card{overflow:hidden;border:1px solid rgba(80,55,30,.12);border-radius:18px;background:#fff;transition:transform .25s ease,box-shadow .25s ease}.highlight-product-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(50,35,18,.1)}
.highlight-product-image{display:block;width:100%;aspect-ratio:1/1;background:#eee4d2;border:0;padding:0;cursor:pointer;overflow:hidden}.highlight-product-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}.highlight-product-card:hover .highlight-product-image img{transform:scale(1.045)}
.highlight-product-body{padding:15px}.highlight-product-body .eyebrow{margin:0 0 5px;font-size:.6rem}.highlight-product-body h4{margin:0 0 8px;font-size:1rem;line-height:1.25}.highlight-product-price{font-weight:700;margin-bottom:12px}.highlight-product-price .old-price{font-weight:400;text-decoration:line-through;color:#999;margin-right:7px}.highlight-product-body .btn.small{padding:8px 12px;font-size:.75rem}.highlight-empty{padding:28px 8px;text-align:center}
.highlight-admin-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:24px}.highlight-admin-box{border:1px solid rgba(80,55,30,.13);border-radius:20px;padding:20px;background:#fffaf3}.highlight-admin-box .panel-title{margin-bottom:10px}.highlight-admin-list{display:grid;gap:10px;max-height:480px;overflow:auto;padding-right:4px}.highlight-admin-product{display:grid;grid-template-columns:auto 48px 1fr;align-items:center;gap:11px;padding:10px;border:1px solid rgba(80,55,30,.12);border-radius:14px;background:#fff;cursor:pointer}.highlight-admin-product:hover{background:#fbf2e4}.highlight-admin-product input{width:18px;height:18px;accent-color:#9b7135}.highlight-admin-product img{width:48px;height:48px;border-radius:10px;object-fit:cover}.highlight-admin-product span{min-width:0}.highlight-admin-product b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.highlight-admin-product small{display:block;color:#777;margin-top:3px}
@media(max-width:800px){.highlights-columns,.highlight-admin-columns{grid-template-columns:1fr}.highlight-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.highlight-group{padding:15px}.highlight-product-grid{gap:10px}.highlight-product-body{padding:11px}.highlight-product-body h4{font-size:.9rem}.highlight-group-head{align-items:start;flex-direction:column;gap:4px}}
/* Automatic trending controls */
.auto-trending-box{margin-top:18px}
.auto-trending-controls{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:10px 0 12px}
.toggle-line{display:flex;align-items:center;gap:10px;font-weight:600;cursor:pointer}
.toggle-line input{width:18px;height:18px;accent-color:#b98b45}
.auto-limit-field{display:flex;align-items:center;gap:8px;font-weight:600}
.auto-limit-field input{width:76px;padding:10px 12px;border:1px solid #d8cbb8;border-radius:12px;background:#fffaf0}
.auto-trending-sales-list{display:grid;gap:8px;margin-top:12px}
.auto-trending-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid #e3d7c5;border-radius:14px;background:rgba(255,255,255,.7)}
.auto-trending-row img{width:46px;height:46px;border-radius:10px;object-fit:cover;flex:none}
.auto-rank{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#2f2528;color:#fff;font-weight:700;font-size:13px;flex:none}
.auto-trending-row b{display:block}
.auto-trending-row small{display:block;color:#7b7068;margin-top:3px}
@media(max-width:700px){.auto-trending-controls{align-items:flex-start;flex-direction:column}.auto-limit-field{width:100%;justify-content:space-between}}
/* =========================================================
V11 — JAPAM-INSPIRED PRODUCT VIEW
========================================================= */
#productModal .modal-card{background:#fffaf2!important;border:1px solid #e3d4c0!important;border-radius:22px!important;box-shadow:0 24px 70px rgba(43,31,22,.18)!important;gap:0!important}
#productModal .product-left-column{padding:22px 0 22px 22px!important}
#productModal .product-main-image-wrap{background:#f0e4d5!important;border:1px solid #e1cfb6!important;border-radius:16px!important;min-height:520px!important}
#productModal #modalMainImage{object-fit:cover!important}
#productModal .thumb-row{padding:12px 4px 4px!important;gap:10px!important}
#productModal .thumb-row img{width:78px!important;height:78px!important;border-radius:12px!important;border:1px solid #d8c5ab!important}
#productModal .thumb-row img.active{border:2px solid #2d2723!important}
#productModal .product-info{padding:28px 28px 22px!important;background:#fffaf2!important}
#productModal .product-brandline{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px;color:#6d6258;font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:800}
#productModal .product-brand-badge{background:#2f2922;color:#fff;border-radius:5px;padding:5px 8px;font-size:10px;letter-spacing:.12em}
#productModal .product-info h2{font-size:34px!important;line-height:1.12!important;margin:5px 0 10px!important;color:#29231f!important}
#productModal .product-rating-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px;color:#5c534c;font-size:13px}
#productModal .product-rating-row .stars{color:#c62828;font-size:17px;letter-spacing:1px}
#productModal .description-box{margin:0 0 8px!important}
#productModal .product-desc{color:#5e554d!important;line-height:1.55!important}
#productModal .product-price-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:4px 0 0}
#productModal .product-price-line h3{font-size:31px!important;color:#29231f!important;margin:0!important}
#productModal .product-offer-pill{background:#e9f5e9;color:#18733a;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:800}
#productModal .product-meta-line{margin:6px 0 16px!important;color:#6b625b!important}
#productModal .offer-card-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0 18px}
#productModal .offer-card{background:#2e251d;color:#fff7eb;border-radius:12px;padding:11px 10px;min-height:64px;display:flex;flex-direction:column;gap:4px}
#productModal .offer-card b{font-size:12px}.offer-card span{font-size:10px;color:#dfd0bf}
#productModal .delivery-check-card{margin:14px 0;padding:13px;border:1px solid #eadbc8;border-radius:14px;background:#fff3df}
#productModal .delivery-check-card>div:first-child{display:flex;flex-direction:column;gap:3px}.delivery-check-card span{font-size:12px;color:#776d64}
#productModal .delivery-input{display:flex;gap:8px;margin-top:9px}
#productModal .delivery-input input{min-width:0;flex:1;border:1px solid #d9c7ae;border-radius:9px;padding:10px;background:#fff}
#productModal .delivery-input button{border:0;background:#d4313a;color:#fff;border-radius:9px;padding:0 16px;font-weight:800}
#productModal #productPinStatus{display:block;margin-top:6px;color:#18733a;font-weight:700}
#productModal .product-action-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 10px}
#productModal .product-action-row .btn{min-height:50px!important}
#productModal .product-accordion-stack{border-top:1px solid #e3d5c3;margin-top:12px}
#productModal .product-accordion-stack details{border-bottom:1px solid #e3d5c3;padding:15px 0}
#productModal .product-accordion-stack summary{cursor:pointer;font-weight:800;color:#332c27;list-style:none;display:flex;justify-content:space-between}
#productModal .product-accordion-stack summary::-webkit-details-marker{display:none}
#productModal .product-accordion-stack summary:after{content:'⌄';font-size:16px;color:#74675d}
#productModal .product-accordion-stack p{color:#625951;line-height:1.55;margin:10px 0 0;font-size:13px}
#productModal .left-review-panel{border-radius:0 0 20px 20px!important}
@media(min-width:851px){
#productModal .modal-card{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important;grid-template-rows:auto auto!important;overflow:hidden!important}
#productModal .product-left-column{grid-column:1!important;grid-row:1!important}
#productModal .product-info{grid-column:2!important;grid-row:1!important;max-height:calc(100vh - 80px);overflow:auto}
#productModal .left-review-panel{grid-column:1 / -1!important;grid-row:2!important}
}
@media(max-width:850px){
#productModal .product-left-column{padding:10px 0 0!important}
#productModal .product-main-image-wrap{min-height:0!important;height:56dvh!important}
#productModal .product-info{padding:16px 2px 24px!important}
#productModal .product-info h2{font-size:28px!important}
#productModal .offer-card-row{grid-template-columns:1fr 1fr 1fr;gap:6px}
#productModal .offer-card{padding:9px 7px;min-height:58px}
#productModal .offer-card b{font-size:10px}.offer-card span{font-size:9px}
#productModal .product-action-row{position:sticky;bottom:0;background:#fffaf2;padding:8px 0;z-index:4}
}
/* Available-category rail controls */
.reference-category-rail{position:relative!important;display:block!important;padding:0!important;overflow:hidden!important}
.category-rail-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px clamp(16px,4vw,60px);background:#fffaf0;border-bottom:1px solid #e5dac7}
.category-home-btn,.category-close-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:34px;border:1px solid #d9c8ae;border-radius:999px;background:#fffaf0;color:#302b31;text-decoration:none;font-size:11px;font-weight:800;letter-spacing:.08em;padding:0 13px;cursor:pointer}
.category-home-btn:hover,.category-close-btn:hover{background:#f3e4cf;color:#95602b}
.category-close-btn{width:34px;padding:0;font-size:22px;line-height:1}
.category-rail-title{font-size:11px;letter-spacing:.18em;color:#95602b;font-weight:800;text-align:center;flex:1}
.category-rail-items{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:18px;align-items:start;padding:18px clamp(20px,4vw,60px);background:#fffaf0}
.category-rail-items a{text-decoration:none;color:var(--ref-ink);text-align:center;font-size:11px;font-weight:700;letter-spacing:.04em;display:flex;flex-direction:column;align-items:center;gap:8px;transition:transform .25s ease}
.category-rail-items a:hover{transform:translateY(-4px)}
.category-rail-items img{width:72px;height:72px;border-radius:50%;object-fit:cover;border:2px solid #d4c19e;box-shadow:0 4px 12px rgba(91,64,26,.12)}
.category-empty-state{grid-column:1/-1;text-align:center;color:#8a7c6a;margin:18px 0}
.reference-category-rail.category-rail-closed{display:none!important}
.category-rail-reopen{display:block;margin:10px auto 0;border:1px solid #d9c8ae;border-radius:999px;background:#fffaf0;color:#302b31;padding:9px 16px;font-size:11px;font-weight:800;letter-spacing:.08em;cursor:pointer}
.category-rail-reopen:hover{background:#f3e4cf;color:#95602b}
.category-rail-reopen.hidden{display:none!important}
@media(max-width:650px){.category-rail-toolbar{padding:9px 12px}.category-rail-title{font-size:9px}.category-rail-items{grid-template-columns:repeat(3,1fr);gap:12px 8px;padding:14px 12px}.category-rail-items img{width:60px;height:60px}.category-rail-items a{font-size:9px}.category-home-btn,.category-close-btn{height:32px}.category-home-btn span{display:none}}
.top-home-btn{display:inline-flex!important;align-items:center;justify-content:center;gap:5px;height:38px;padding:0 10px;border:1px solid #d9c8ae;border-radius:999px;background:#fffaf2;color:#302b31!important;text-decoration:none!important;font-size:12px;font-weight:800;letter-spacing:.03em}
.top-home-btn:hover,.top-home-btn.active-page-link{background:#f3e4cf;color:#95602b!important}
@media(max-width:850px){.top-home-btn{width:34px;height:38px;padding:0;font-size:20px}.top-home-btn span{display:none}}
\n\n/* V12: reliable three-image hero rotation */\n.hero-with-floating-animation .hero-floating-stage{z-index:4!important}\n.hero-with-floating-animation .floating-image-card{opacity:.72;transform-origin:center;transition:opacity .7s ease,transform .9s ease,filter .7s ease}\n.hero-with-floating-animation .floating-image-card.is-active{opacity:1;filter:none;z-index:8;box-shadow:0 32px 80px rgba(66,43,23,.28)}\n.hero-with-floating-animation .floating-card-main.is-active{transform:translate3d(0,-10px,0) rotate(-1deg) scale(1.035)}\n.hero-with-floating-animation .floating-card-left.is-active{transform:translate3d(-5px,-14px,0) rotate(-4deg) scale(1.04)}\n.hero-with-floating-animation .floating-card-back.is-active{transform:translate3d(8px,-12px,0) rotate(11deg) scale(1.04)}\n@media(max-width:850px){.hero-with-floating-animation .hero-floating-stage{display:block!important}.hero-with-floating-animation .hero-copy{position:relative!important;z-index:20!important}}\n\n/* V12: product page grouped by category */\n.product-category-section{margin:0 0 42px;padding:0}\n.product-category-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid #dfd2bf}\n.product-category-heading h3{margin:4px 0 0;font-size:clamp(24px,3vw,34px);color:#302b31}\n.product-category-heading span{font-size:12px;color:#766d65;font-weight:700}\n.product-category-grid{margin:0!important}\n.product-card-animated{transition:transform .35s ease,box-shadow .35s ease}\n.product-card-animated:hover{transform:translateY(-5px);box-shadow:0 14px 32px rgba(54,40,25,.1)}\n.product-anim-zoom img{transition:transform .8s cubic-bezier(.2,.75,.2,1)}\n.product-anim-zoom:hover img{transform:scale(1.045)}\n.product-anim-float img{animation:productFloat 4.5s ease-in-out infinite}\n.product-anim-slide img{transition:transform .7s ease}.product-anim-slide:hover img{transform:translateX(7px)}\n.product-anim-pulse img{animation:productPulse 3s ease-in-out infinite}\n.product-animation-zoom img{animation:productDetailZoom 5s ease-in-out infinite}\n.product-animation-float img{animation:productDetailFloat 4.8s ease-in-out infinite}\n.product-animation-slide img{animation:productDetailSlide 4s ease-in-out infinite}\n.product-animation-pulse img{animation:productDetailPulse 3s ease-in-out infinite}\n@keyframes productFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}\n@keyframes productPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}\n@keyframes productDetailZoom{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}\n@keyframes productDetailFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}\n@keyframes productDetailSlide{0%,100%{transform:translateX(0)}50%{transform:translateX(7px)}}\n@keyframes productDetailPulse{0%,100%{filter:saturate(1)}50%{filter:saturate(1.08)}}\n.product-animation-none img{animation:none!important}\n@media(prefers-reduced-motion:reduce){.hero-with-floating-animation .floating-image-card,.product-anim-float img,.product-anim-pulse img,.product-animation-zoom img,.product-animation-float img,.product-animation-slide img,.product-animation-pulse img{animation:none!important;transition:none!important}}\n
/* V13: Full-screen 3-image hero/header animation inspired by the supplied preview */
.hero{
position:relative!important;
min-height:calc(100svh - 78px)!important;
height:calc(100svh - 78px)!important;
max-height:none!important;
overflow:hidden!important;
display:block!important;
padding:0!important;
isolation:isolate!important;
background:#16120e!important;
}
.hero::after{
content:"";
position:absolute;
inset:0;
z-index:1;
pointer-events:none;
background:
linear-gradient(90deg,rgba(15,11,8,.88) 0%,rgba(15,11,8,.60) 34%,rgba(15,11,8,.18) 65%,rgba(15,11,8,.12) 100%),
linear-gradient(180deg,rgba(0,0,0,.10),rgba(0,0,0,.30));
}
.hero-floating-stage{
position:absolute!important;
inset:0!important;
width:100%!important;
height:100%!important;
min-height:0!important;
z-index:0!important;
pointer-events:none!important;
overflow:hidden!important;
}
.hero-floating-stage .hero-orbit,
.hero-floating-dots{display:none!important}
.floating-image-card{
position:absolute!important;
inset:0!important;
width:100%!important;
height:100%!important;
margin:0!important;
padding:0!important;
border:0!important;
border-radius:0!important;
background:#111!important;
box-shadow:none!important;
opacity:0!important;
visibility:hidden!important;
transform:none!important;
transition:opacity 1.15s ease,visibility 1.15s ease!important;
overflow:hidden!important;
}
.floating-image-card.is-active{
opacity:1!important;
visibility:visible!important;
z-index:2!important;
}
.floating-image-card img{
position:absolute!important;
inset:0!important;
width:100%!important;
height:100%!important;
max-width:none!important;
object-fit:cover!important;
object-position:center!important;
filter:saturate(.96) contrast(1.02)!important;
transform:scale(1.04)!important;
transition:transform 6s ease!important;
}
.floating-image-card.is-active img{transform:scale(1.10)!important}
.floating-image-caption{display:none!important}
.hero-copy{
position:relative!important;
z-index:3!important;
min-height:100%!important;
max-width:720px!important;
display:flex!important;
flex-direction:column!important;
justify-content:center!important;
padding:8vh 7vw!important;
color:#fff!important;
pointer-events:none!important;
}
.hero-copy .actions,
.hero-copy .actions *{pointer-events:auto!important}
.hero-copy .eyebrow{color:#e5c47e!important;text-shadow:0 2px 18px rgba(0,0,0,.35)!important}
.hero-copy h1{color:#fff!important;text-shadow:0 4px 28px rgba(0,0,0,.45)!important;max-width:700px!important}
.hero-copy h1 em{color:#f0ca7e!important}
.hero-copy p:not(.eyebrow){color:#fff!important;max-width:620px!important;text-shadow:0 2px 16px rgba(0,0,0,.55)!important}
.hero-copy .primary{background:#b97820!important;color:#fff!important;border-color:#b97820!important;box-shadow:0 10px 30px rgba(0,0,0,.25)!important}
.hero-category-indicator{
position:absolute!important;
right:4vw!important;
bottom:28px!important;
z-index:4!important;
display:flex!important;
gap:8px!important;
pointer-events:none!important;
}
.hero-category-indicator span{
width:34px!important;height:3px!important;border-radius:99px!important;background:rgba(255,255,255,.45)!important;
transition:.35s ease!important;
}
.hero-category-indicator span.active{background:#f0ca7e!important;width:54px!important}
@media(max-width:800px){
.hero{min-height:calc(100svh - 70px)!important;height:calc(100svh - 70px)!important}
.hero::after{background:linear-gradient(180deg,rgba(12,9,6,.28) 0%,rgba(12,9,6,.55) 52%,rgba(12,9,6,.88) 100%)!important}
.hero-copy{justify-content:flex-end!important;padding:32px 24px 70px!important;max-width:100%!important}
.hero-copy h1{font-size:clamp(40px,12vw,68px)!important;line-height:.94!important}
.hero-copy p:not(.eyebrow){font-size:14px!important;line-height:1.6!important}
.hero-category-indicator{right:24px!important;bottom:22px!important}
}
/* V14: stack product categories vertically. Each category gets its own row,
while products inside that category can still scroll horizontally. */
#productGrid.product-grid,
.bestseller-section #productGrid.product-grid{
display:block!important;
overflow:visible!important;
padding:0!important;
scroll-snap-type:none!important;
}
#productGrid > .product-category-section{
display:block!important;
width:100%!important;
margin:0 0 54px!important;
}
#productGrid > .product-category-section + .product-category-section{
margin-top:12px!important;
}
#productGrid .product-category-grid{
display:flex!important;
gap:18px!important;
overflow-x:auto!important;
overflow-y:hidden!important;
padding:2px 1px 18px!important;
scroll-snap-type:x mandatory!important;
}
#productGrid .product-category-grid .product-card{
flex:0 0 calc(33.333% - 12px)!important;
min-width:250px!important;
}
@media(max-width:850px){
#productGrid .product-category-grid .product-card{flex-basis:calc(50% - 9px)!important;min-width:210px!important}
}
@media(max-width:520px){
#productGrid > .product-category-section{margin-bottom:42px!important}
#productGrid .product-category-grid .product-card{flex-basis:78%!important;min-width:230px!important}
}
/* Footer social links and like/follower counts */
.footer-social-title{font-family:Georgia,serif;font-size:22px;font-weight:600;color:#f2dfb8;margin-top:10px}
.footer-social-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;max-width:980px;width:100%;margin:4px auto 2px}
.footer-social-card{display:flex;align-items:center;gap:12px;text-align:left;padding:14px 16px;border:1px solid rgba(229,196,126,.22);border-radius:14px;background:rgba(255,255,255,.035);color:#f1e7d5;transition:transform .2s ease,border-color .2s ease,background .2s ease}
a.footer-social-card:hover{transform:translateY(-2px);border-color:#e5c47e;background:rgba(229,196,126,.08)}
.footer-social-card.disabled{opacity:.72;cursor:default}
.footer-social-icon{width:34px;height:34px;display:grid;place-items:center;flex:0 0 34px;border-radius:10px;background:#e5c47e;color:#2b211a}
.footer-social-icon svg{width:20px;height:20px}
.footer-social-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.footer-social-copy b{font-size:14px;color:#f4ead8}
.footer-social-copy small{font-size:11px;color:#bfb39c;white-space:nowrap}
@media(max-width:800px){.footer-social-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 4px}}
@media(max-width:480px){.footer-social-grid{grid-template-columns:1fr}.footer-social-card{justify-content:flex-start}}
/* V15.1 — Remove unwanted black description fade/boarder from product view */
#productModal .product-info .product-desc.collapsed::after {
display: none !important;
content: none !important;
background: none !important;
}
#productModal .product-info .product-desc.collapsed {
background: transparent !important;
color: #5e554d !important;
border: 0 !important;
box-shadow: none !important;
overflow: hidden !important;
}
#productModal .description-box {
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
}
#productModal .read-more-btn {
background: transparent !important;
color: #8a622d !important;
border: 0 !important;
box-shadow: none !important;
}
/* CHAITHANYA LOGO MATCH THEME - GREEN & GOLD */
:root{
--ch-green:#063b26;
--ch-green-dark:#03291b;
--ch-green-soft:#0b5135;
--ch-gold:#e4b85f;
--ch-gold-light:#f3d58b;
--ch-cream:#fbf5e8;
--ch-paper:#fffaf0;
--ch-ink:#211a14;
--ch-muted:#756a5b;
--ch-line:#e5d7bd;
}
html,body{background:var(--ch-cream)!important;color:var(--ch-ink)!important}
body{font-family:Inter,Arial,sans-serif!important}
.announcement-bar{background:var(--ch-green-dark)!important;color:var(--ch-gold-light)!important;border-color:var(--ch-green)!important}
.jp-header,.topbar{background:var(--ch-paper)!important;color:var(--ch-ink)!important;border-bottom-color:var(--ch-line)!important}
.jp-header .brand-logo-image,.brand-logo-image{object-fit:contain!important;background:transparent!important;border:0!important;border-radius:0!important}
.jp-header .brand{color:var(--ch-green)!important}
.desktop-nav,.desktop-nav a,.nav-login{color:#463d32!important}
.desktop-nav a:hover,.nav-login:hover{color:var(--ch-green-soft)!important}
.jp-primary-nav{background:var(--ch-paper)!important;border-color:var(--ch-line)!important}
.jp-primary-nav a,.jp-primary-nav button{color:#4b4236!important}
.jp-primary-nav a:hover,.jp-primary-nav button:hover{color:var(--ch-green)!important}
.icon-btn,.header-icon-btn{background:var(--ch-green)!important;color:#fff!important;border-color:var(--ch-green)!important}
.hero{background:linear-gradient(120deg,var(--ch-green-dark) 0%,var(--ch-green) 55%,#0a5738 100%)!important;color:#fff!important}
.hero h1,.hero h2,.hero .eyebrow,.hero p:not(.eyebrow){color:#fff!important}
.hero h1 em,.hero .eyebrow{color:var(--ch-gold-light)!important}
.hero-product,.hero-image-frame{background:rgba(255,250,240,.08)!important;border-color:rgba(228,184,95,.5)!important}
.hero-badge{background:var(--ch-gold)!important;color:var(--ch-green-dark)!important}
.primary,.btn.primary{background:var(--ch-green)!important;color:#fff!important;border-color:var(--ch-green)!important}
.secondary,.btn.secondary{background:var(--ch-paper)!important;color:var(--ch-green)!important;border-color:var(--ch-gold)!important}
.marquee{background:var(--ch-green-dark)!important;color:var(--ch-gold-light)!important;border-color:var(--ch-green)!important}
.section,.about-chaithanya{background:var(--ch-cream)!important}
.section-head h2,.section h2,.showcase-card h3{color:var(--ch-green-dark)!important}
.eyebrow{color:#9b7130!important}
.collection-showcase{background:#f4ead8!important}
.showcase-card{background:var(--ch-paper)!important;border-color:var(--ch-line)!important}
.purpose-band{background:var(--ch-green-dark)!important;color:#fff!important}
.purpose-band h2{color:#fff!important}
.purpose-band h2 em,.purpose-band .eyebrow{color:var(--ch-gold-light)!important}
.trust-strip{background:var(--ch-paper)!important;border-color:var(--ch-line)!important}
.trust-strip span{color:var(--ch-gold)!important}
.product-card,.product-grid .card,.collection-card{background:var(--ch-paper)!important;border-color:var(--ch-line)!important}
.product-card h3,.product-grid h3{color:var(--ch-green-dark)!important}
.product-price{color:var(--ch-green)!important}
.product-brandline{color:var(--ch-green)!important}
.product-brand-badge{background:var(--ch-green)!important;color:var(--ch-gold-light)!important}
#productModal .modal-card,#productModal .product-info{background:var(--ch-paper)!important;color:var(--ch-ink)!important}
#productModal .sticky-buy{background:var(--ch-green)!important;border-color:var(--ch-green)!important}
#productModal .close-btn{background:var(--ch-green-dark)!important;border-color:var(--ch-green-dark)!important}
#cartDrawer .drawer-card{background:var(--ch-paper)!important;color:var(--ch-ink)!important;border-color:var(--ch-line)!important}
#cartDrawer .close-btn{background:var(--ch-green)!important;color:#fff!important}
footer,.site-footer{background:var(--ch-green-dark)!important;color:#fff!important;border-color:var(--ch-green)!important}
footer h2,footer h3,footer b,footer strong,.footer-brand,.footer-social-title{color:var(--ch-gold-light)!important}
footer p,footer li,footer a,.site-footer p,.site-footer a{color:#f4ead8!important}
.footer-social-grid a,.footer-social-grid button{background:transparent!important;color:var(--ch-gold-light)!important;border-color:rgba(228,184,95,.55)!important}
.footer-social-grid svg{color:var(--ch-gold-light)!important;fill:currentColor}
.admin-pro .admin-sidebar{background:var(--ch-green-dark)!important}
.admin-pro .admin-logo span{background:var(--ch-gold)!important;color:var(--ch-green-dark)!important}
.admin-pro .primary{background:var(--ch-green)!important;border-color:var(--ch-green)!important}
.admin-pro .eyebrow{color:var(--ch-gold)!important}
@media(max-width:850px){
.jp-primary-nav.mobile-open{background:var(--ch-paper)!important;border-color:var(--ch-line)!important}
}
/* Chaithanya green + gold social media theme */
.footer-social-title{color:var(--ch-gold-light)!important;text-shadow:0 1px 0 rgba(0,0,0,.15)}
.footer-social-grid{gap:16px}
.footer-social-card,
.footer-social-grid a.footer-social-card,
.footer-social-grid button{
background:rgba(4,48,34,.72)!important;
border:1px solid rgba(228,184,95,.48)!important;
box-shadow:inset 0 0 0 1px rgba(255,255,255,.025),0 5px 18px rgba(0,0,0,.12);
color:var(--ch-gold-light)!important;
}
.footer-social-card:hover,
.footer-social-grid a.footer-social-card:hover{
background:rgba(228,184,95,.10)!important;
border-color:var(--ch-gold)!important;
box-shadow:0 7px 22px rgba(0,0,0,.18),0 0 0 1px rgba(228,184,95,.16);
}
.footer-social-icon{
width:46px!important;height:46px!important;flex:0 0 46px!important;
border-radius:13px!important;
display:grid!important;place-items:center!important;
background:var(--ch-gold)!important;
color:var(--ch-green-dark)!important;
border:1px solid rgba(255,244,208,.72)!important;
box-shadow:0 3px 10px rgba(0,0,0,.16);
}
.footer-social-icon svg{width:25px!important;height:25px!important;color:var(--ch-green-dark)!important;fill:currentColor!important}
.footer-social-copy b{color:var(--ch-gold-light)!important}
.footer-social-copy small{color:#f4ead8!important}
.footer-social-note{color:#d8c79f!important}
@media(max-width:480px){.footer-social-card{padding:14px 15px!important}}
/* PRODUCT IMAGE SLIDESHOW */
.product-gallery-thumb{border:0;background:transparent;padding:0;cursor:pointer;display:block;flex:0 0 auto;border-radius:12px}
.product-gallery-thumb img{display:block;width:72px;height:72px;object-fit:cover;border-radius:12px;border:2px solid transparent;transition:transform .2s ease,border-color .2s ease,opacity .2s ease}
.product-gallery-thumb.active img{border-color:#b68a2c;transform:translateY(-2px)}
.product-gallery-thumb:hover img{transform:translateY(-2px)}
#modalMainImage.product-slide-in{animation:productGallerySlide .48s ease both}
@keyframes productGallerySlide{from{opacity:.25;transform:translateX(18px) scale(.99)}to{opacity:1;transform:translateX(0) scale(1)}}
#productModal .product-main-image-wrap:has(+ .thumb-row){overflow:hidden;border-radius:24px}
@media(max-width:850px){.product-gallery-thumb img{width:64px;height:64px}}
/* V15.5 — working header product search */
.jp-header{position:relative!important;z-index:1000!important}
.header-search-panel{position:absolute!important;right:clamp(58px,4vw,90px)!important;top:70px!important;width:min(360px,calc(100vw - 28px))!important;display:flex!important;align-items:center!important;gap:6px!important;padding:8px!important;background:#fffaf2!important;border:1px solid #d9c9ad!important;border-radius:14px!important;box-shadow:0 18px 45px rgba(50,35,20,.18)!important;z-index:1500!important}
.header-search-panel.hidden{display:none!important}
.header-search-panel input{flex:1!important;min-width:0!important;border:0!important;outline:0!important;background:#fff!important;color:#302b31!important;border-radius:9px!important;padding:12px 13px!important;font:600 14px/1.2 inherit!important;box-sizing:border-box!important}
.header-search-panel button{width:34px!important;height:34px!important;border:0!important;border-radius:9px!important;background:#302b31!important;color:#fff!important;cursor:pointer!important;font-size:20px!important;line-height:1!important}
.header-search:focus-visible{outline:2px solid #b48a42!important;outline-offset:2px!important}
.search-empty{padding:30px 10px!important;text-align:center!important}
/* V15.5 — smaller homepage header animation */
.ref-hero{min-height:420px!important;height:420px!important}
.hero-with-floating-animation{min-height:420px!important;height:420px!important}
@media(max-width:900px){
.ref-hero,.hero-with-floating-animation{min-height:360px!important;height:360px!important}
.header-search-panel{top:62px!important;right:10px!important}
}
@media(max-width:520px){
.ref-hero,.hero-with-floating-animation{min-height:330px!important;height:330px!important}
.ref-hero-copy{padding:30px 16px!important}
.ref-hero-copy h1{font-size:30px!important}
.ref-hero-copy p:not(.eyebrow){font-size:13px!important;margin:10px auto!important}
.hero-copy{padding:6vh 5vw!important}
}
/* FINAL MOBILE MENU REPAIR */
@media (max-width:850px){
.jp-header .mobile-menu-btn{
display:grid !important;
visibility:visible !important;
opacity:1 !important;
pointer-events:auto !important;
position:relative !important;
z-index:1400 !important;
flex:0 0 34px !important;
}
.jp-header .jp-primary-nav.mobile-open{
display:flex !important;
visibility:visible !important;
opacity:1 !important;
pointer-events:auto !important;
position:absolute !important;
top:64px !important;
left:10px !important;
right:10px !important;
z-index:1350 !important;
}
.jp-header .jp-primary-nav.mobile-open a,
.jp-header .jp-primary-nav.mobile-open button{
pointer-events:auto !important;
visibility:visible !important;
}
}
/* V15.7 — mobile menu as a right-side drawer, matching the cart drawer */
@media(max-width:850px){
.jp-header .jp-primary-nav.mobile-open{
position:fixed!important;
top:0!important;
right:0!important;
left:auto!important;
width:min(340px,86vw)!important;
height:100dvh!important;
max-height:100dvh!important;
box-sizing:border-box!important;
overflow-y:auto!important;
display:flex!important;
flex-direction:column!important;
align-items:stretch!important;
justify-content:flex-start!important;
gap:0!important;
padding:78px 16px 24px!important;
margin:0!important;
border:0!important;
border-left:1px solid var(--ch-line)!important;
border-radius:20px 0 0 20px!important;
background:var(--ch-paper)!important;
box-shadow:-18px 0 45px rgba(36,26,15,.22)!important;
z-index:14050!important;
transform:translateX(0)!important;
}
.jp-header .jp-primary-nav.mobile-open a,
.jp-header .jp-primary-nav.mobile-open button{
display:flex!important;
align-items:center!important;
justify-content:flex-start!important;
width:100%!important;
min-height:48px!important;
box-sizing:border-box!important;
padding:13px 14px!important;
margin:0 0 7px!important;
border:1px solid rgba(182,138,44,.16)!important;
border-radius:12px!important;
background:rgba(255,255,255,.55)!important;
text-align:left!important;
}
.jp-header .jp-primary-nav.mobile-open a:hover,
.jp-header .jp-primary-nav.mobile-open button:hover{
background:#fff!important;
}
.jp-header .jp-primary-nav.mobile-open .notify-nav-btn,
.jp-header .jp-primary-nav.mobile-open .nav-login{
color:#4b4236!important;
}
.jp-header .mobile-menu-btn{
position:relative!important;
z-index:14100!important;
}
}
/* V15.8 — live product suggestions in search */
.header-search-panel{width:min(390px,calc(100vw - 24px))!important;overflow:visible!important;padding:8px!important}
.header-search-input-row{display:flex!important;align-items:center!important;gap:6px!important}
.header-search-results{display:none!important;margin-top:7px!important;border-top:1px solid #eadfce!important;max-height:360px!important;overflow:auto!important;background:#fff!important;border-radius:10px!important}
.header-search-results.has-results{display:block!important}
.header-search-result{width:100%!important;display:flex!important;align-items:center!important;gap:11px!important;padding:9px 10px!important;border:0!important;border-bottom:1px solid #f0e9de!important;border-radius:0!important;background:#fff!important;color:#302b31!important;text-align:left!important;cursor:pointer!important}
.header-search-result:last-child{border-bottom:0!important}
.header-search-result:hover,.header-search-result:focus-visible{background:#fbf5ea!important}
.header-search-result img{width:48px!important;height:48px!important;flex:0 0 48px!important;object-fit:cover!important;border-radius:8px!important;background:#f5eee3!important}
.header-search-result-copy{display:flex!important;min-width:0!important;flex:1!important;flex-direction:column!important;gap:3px!important}
.header-search-result-copy strong{font-size:13px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.header-search-result-copy small{font-size:11px!important;color:#8a7a67!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.header-search-no-results{padding:15px 12px!important;color:#8a7a67!important;font-size:12px!important;text-align:center!important}
@media(max-width:520px){.header-search-panel{right:8px!important;left:auto!important;width:min(360px,calc(100vw - 16px))!important}.header-search-results{max-height:55vh!important}.header-search-result img{width:42px!important;height:42px!important;flex-basis:42px!important}}
/* V15.9 — search suggestions dropdown directly below the search field */
.header-search-panel{
flex-direction:column!important;
align-items:stretch!important;
gap:0!important;
}
.header-search-input-row{
width:100%!important;
flex:0 0 auto!important;
}
.header-search-input-row input{width:100%!important}
.header-search-results{
width:100%!important;
flex:0 0 auto!important;
box-sizing:border-box!important;
}
.header-search-result-copy strong{
display:block!important;
color:#000000!important;
font-size:14px!important;
font-weight:700!important;
}
.header-search-result-copy small{
display:block!important;
}
/* V15.9.1: force product names visible in black */
.header-search-results .header-search-result-copy{display:flex!important;visibility:visible!important;opacity:1!important;}
.header-search-results .header-search-result-copy strong{display:block!important;visibility:visible!important;opacity:1!important;color:#000!important;-webkit-text-fill-color:#000!important;font-size:14px!important;font-weight:700!important;line-height:1.35!important;}
.header-search-results .header-search-result-copy small{display:block!important;visibility:visible!important;opacity:1!important;color:#333!important;-webkit-text-fill-color:#333!important;}
/* V15.10: compact product preview inside search dropdown */
.header-search-panel{position:absolute!important;z-index:99999!important;overflow:visible!important;background:#fff!important;border:1px solid #d8c9ad!important;box-shadow:0 8px 24px rgba(0,0,0,.14)!important;border-radius:10px!important}
.header-search-results{margin-top:5px!important;border:1px solid #eadfce!important;box-shadow:0 5px 16px rgba(0,0,0,.10)!important}
.header-search-result{min-height:62px!important;padding:7px 9px!important;gap:9px!important}
.header-search-result img{width:50px!important;height:50px!important;flex:0 0 50px!important;border-radius:7px!important;object-fit:cover!important;display:block!important}
.header-search-result-copy{display:flex!important;visibility:visible!important;opacity:1!important;min-width:0!important;overflow:hidden!important}
.header-search-result-copy strong{display:block!important;visibility:visible!important;opacity:1!important;color:#000!important;-webkit-text-fill-color:#000!important;font-size:13px!important;font-weight:700!important;line-height:18px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.header-search-result-copy small{display:block!important;visibility:visible!important;opacity:1!important;color:#555!important;-webkit-text-fill-color:#555!important;font-size:10px!important;line-height:15px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
@media(max-width:520px){.header-search-result{min-height:56px!important;padding:6px 8px!important}.header-search-result img{width:44px!important;height:44px!important;flex-basis:44px!important}.header-search-result-copy strong{font-size:12px!important}}
/* V15.11 — fix search result cards overriding the generic search-panel button styles */
.header-search-panel .header-search-result{
width:100%!important;
height:auto!important;
min-height:62px!important;
display:grid!important;
grid-template-columns:50px minmax(0,1fr)!important;
align-items:center!important;
gap:10px!important;
padding:8px 10px!important;
margin:0!important;
box-sizing:border-box!important;
border:0!important;
border-bottom:1px solid #eadfce!important;
border-radius:0!important;
background:#fff!important;
color:#000!important;
text-align:left!important;
cursor:pointer!important;
font:inherit!important;
line-height:normal!important;
}
.header-search-panel .header-search-result:last-child{border-bottom:0!important}
.header-search-panel .header-search-result:hover,
.header-search-panel .header-search-result:focus-visible{background:#fbf5ea!important;color:#000!important}
.header-search-panel .header-search-result img{
display:block!important;
width:50px!important;
height:50px!important;
min-width:50px!important;
max-width:50px!important;
min-height:50px!important;
max-height:50px!important;
object-fit:cover!important;
border-radius:7px!important;
margin:0!important;
}
.header-search-panel .header-search-result-copy{
display:flex!important;
flex-direction:column!important;
justify-content:center!important;
align-items:flex-start!important;
width:100%!important;
min-width:0!important;
max-width:none!important;
height:auto!important;
overflow:hidden!important;
visibility:visible!important;
opacity:1!important;
}
.header-search-panel .header-search-result-copy strong{
display:block!important;
width:100%!important;
margin:0!important;
padding:0!important;
color:#000!important;
-webkit-text-fill-color:#000!important;
font-size:13px!important;
font-weight:700!important;
line-height:18px!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
}
.header-search-panel .header-search-result-copy small{
display:block!important;
width:100%!important;
margin:2px 0 0!important;
padding:0!important;
color:#555!important;
-webkit-text-fill-color:#555!important;
font-size:11px!important;
font-weight:500!important;
line-height:15px!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
}
@media(max-width:520px){
.header-search-panel .header-search-result{grid-template-columns:44px minmax(0,1fr)!important;min-height:58px!important;padding:7px 8px!important;gap:9px!important}
.header-search-panel .header-search-result img{width:44px!important;height:44px!important;min-width:44px!important;max-width:44px!important;min-height:44px!important;max-height:44px!important}
.header-search-panel .header-search-result-copy strong{font-size:12px!important;line-height:17px!important}
.header-search-panel .header-search-result-copy small{font-size:10px!important;line-height:14px!important}
}
/* V15.13 ADMIN PANEL RELIABILITY FIX */
.admin-pro .admin-nav.tab{display:flex!important;width:100%!important;visibility:visible!important;opacity:1!important;position:relative!important;z-index:2!important;align-items:center!important;justify-content:flex-start!important;}
.admin-pro .admin-nav.tab.active{background:#fff!important;color:#000!important;}
.admin-pro .admin-panel.hidden{display:none!important;}
.admin-pro .admin-panel:not(.hidden){display:block!important;visibility:visible!important;opacity:1!important;}
.admin-pro .admin-row{min-width:0!important;}
.admin-pro .admin-row .mini-actions{display:flex!important;visibility:visible!important;opacity:1!important;flex-wrap:wrap!important;gap:8px!important;}
.admin-pro .admin-row .mini-actions button{display:inline-flex!important;visibility:visible!important;opacity:1!important;white-space:nowrap!important;}
.admin-pro #adminProductList,.admin-pro #adminCategoryList,.admin-pro #adminReviewList,.admin-pro #adminUserList,.admin-pro #adminOrderList{min-height:30px!important;visibility:visible!important;}
@media(max-width:700px){.admin-pro .admin-row .mini-actions{grid-column:2!important;}.admin-pro .admin-nav.tab{min-height:44px!important;}}
/* V15.15 — Existing product highlight pickers */
.highlight-picker{display:flex;align-items:center;gap:8px;margin:8px 0 12px;padding:10px;border:1px dashed #d8c5ab;border-radius:14px;background:#fffdf8}
.highlight-picker select{min-width:0;flex:1;padding:11px 12px;border:1px solid #d8c5ab;border-radius:10px;background:#fff;color:#29231f;font:inherit}
.highlight-picker .btn.small{padding:10px 14px;white-space:nowrap}
@media(max-width:520px){.highlight-picker{align-items:stretch;flex-direction:column}.highlight-picker .btn.small{width:100%}}