/* TND Sticky Footer Nav – by Tamilnadu Digital */
.tsfn-root{
	--tsfn-h:66px;--tsfn-gap:10px;--tsfn-r:22px;
	--tsfn-bg:rgba(24,21,19,.94);--tsfn-fg:rgba(255,255,255,.58);--tsfn-fg-on:#fff;
	--tsfn-bubble:rgba(255,255,255,.1);--tsfn-ring:#fff;
	position:fixed;z-index:99989;left:var(--tsfn-gap);right:var(--tsfn-gap);
	bottom:calc(var(--tsfn-gap) + env(safe-area-inset-bottom));
	height:var(--tsfn-h);border-radius:var(--tsfn-r);
	display:grid;grid-template-columns:repeat(var(--tsfn-n),1fr);align-items:center;
	background:var(--tsfn-bg);
	backdrop-filter:saturate(170%) blur(16px);-webkit-backdrop-filter:saturate(170%) blur(16px);
	box-shadow:0 18px 44px -14px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.06) inset;
	font-family:inherit;-webkit-tap-highlight-color:transparent;
	transform:translateY(0);transition:transform .45s cubic-bezier(.2,.9,.2,1),opacity .3s;
	animation:tsfnIn .7s cubic-bezier(.2,.9,.2,1) both .2s;
}
@keyframes tsfnIn{from{transform:translateY(130%);opacity:0}to{transform:none;opacity:1}}
.tsfn-root.is-hidden{transform:translateY(calc(100% + var(--tsfn-gap) + 30px))}

/* styles */
.tsfn-style-light{--tsfn-bg:rgba(255,255,255,.97);--tsfn-fg:#8a817a;--tsfn-fg-on:var(--tsfn-p);--tsfn-bubble:color-mix(in srgb,var(--tsfn-p) 10%,#fff);--tsfn-ring:#fff;
	box-shadow:0 14px 40px -12px rgba(30,20,10,.28),0 0 0 1px rgba(0,0,0,.05)}
.tsfn-style-gradient{--tsfn-bg:linear-gradient(120deg,var(--tsfn-p),var(--tsfn-s));--tsfn-fg:rgba(255,255,255,.7);--tsfn-bubble:rgba(255,255,255,.2);--tsfn-ring:rgba(255,255,255,.95)}
.tsfn-style-glass{--tsfn-bg:rgba(255,255,255,.62);--tsfn-fg:#4b443f;--tsfn-fg-on:var(--tsfn-p);--tsfn-bubble:rgba(255,255,255,.75);--tsfn-ring:rgba(255,255,255,.9);
	box-shadow:0 14px 40px -12px rgba(0,0,0,.25),0 0 0 1px rgba(255,255,255,.7) inset}
.tsfn-shape-docked{left:0;right:0;bottom:0;border-radius:20px 20px 0 0;height:calc(var(--tsfn-h) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom)}
.tsfn-shape-docked .tsfn-bubble{bottom:calc(8px + env(safe-area-inset-bottom))}

/* items */
.tsfn-item{all:unset;box-sizing:border-box;position:relative;z-index:1;height:100%;cursor:pointer;
	display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
	color:var(--tsfn-fg);text-decoration:none!important;transition:color .3s}
.tsfn-item:focus-visible{outline:2px solid var(--tsfn-s);outline-offset:-6px;border-radius:16px}
.tsfn-icon{position:relative;width:24px;height:24px;display:grid;place-items:center;transition:transform .4s cubic-bezier(.3,1.6,.5,1)}
.tsfn-icon svg{width:24px;height:24px;display:block;overflow:visible}
.tsfn-icon svg *{transform-box:fill-box;transform-origin:center}
.tsfn-label{font-size:10.5px;font-weight:600;line-height:1;letter-spacing:.02em;white-space:nowrap;transition:transform .3s,opacity .3s}
.tsfn-nolabels .tsfn-label{display:none}

.tsfn-item.is-active{color:var(--tsfn-fg-on)}
.tsfn-item.is-active .tsfn-icon{transform:translateY(-2px)}
.tsfn-item.is-active .tsfn-label{font-weight:700}
.tsfn-item:active .tsfn-icon{transform:scale(.86)}

/* sliding bubble */
.tsfn-bubble{position:absolute;z-index:0;top:8px;bottom:8px;left:0;width:calc(100% / var(--tsfn-n) - 12px);
	border-radius:16px;background:var(--tsfn-bubble);opacity:0;
	transform:translateX(var(--tsfn-x,0));transition:transform .55s cubic-bezier(.3,1.35,.5,1),opacity .3s}
.tsfn-root.has-active .tsfn-bubble{opacity:1}
.tsfn-bubble:after{content:"";position:absolute;left:50%;bottom:-5px;width:16px;height:3px;margin-left:-8px;border-radius:3px;
	background:linear-gradient(90deg,var(--tsfn-p),var(--tsfn-s))}
.tsfn-style-gradient .tsfn-bubble:after{background:#fff}

/* centre FAB */
.tsfn-fab{gap:7px}
.tsfn-fab .tsfn-icon{width:56px;height:56px;margin-top:-38px;border-radius:19px;color:#fff;
	background:linear-gradient(135deg,var(--tsfn-p),var(--tsfn-s));
	box-shadow:0 12px 26px -8px color-mix(in srgb,var(--tsfn-p) 70%,transparent),0 0 0 5px var(--tsfn-ring)}
.tsfn-style-dark .tsfn-fab .tsfn-icon{box-shadow:0 12px 26px -8px color-mix(in srgb,var(--tsfn-p) 70%,transparent),0 0 0 5px #fff}
.tsfn-style-gradient .tsfn-fab .tsfn-icon{background:#fff;color:var(--tsfn-p)}
.tsfn-fab .tsfn-icon:before{content:"";position:absolute;inset:0;border-radius:inherit;
	background:linear-gradient(135deg,rgba(255,255,255,.35),transparent 55%);pointer-events:none}
.tsfn-fab .tsfn-label{color:var(--tsfn-fg-on);margin-top:2px}
.tsfn-fab.is-active .tsfn-icon{transform:translateY(-3px)}
.tsfn-fab:active .tsfn-icon{transform:scale(.9)}

/* cart badge */
.tsfn-count{position:absolute;top:-7px;right:-10px;min-width:18px;height:18px;padding:0 5px;box-sizing:border-box;border-radius:99px;
	background:linear-gradient(135deg,var(--tsfn-p),var(--tsfn-s));color:#fff;font:700 10.5px/18px system-ui,-apple-system,sans-serif;text-align:center;
	box-shadow:0 0 0 2px var(--tsfn-ring);animation:tsfnPop .5s cubic-bezier(.3,1.8,.5,1)}
.tsfn-style-dark .tsfn-count{box-shadow:0 0 0 2px #181513}
.tsfn-fab .tsfn-count{top:-4px;right:-4px;background:#fff;color:var(--tsfn-p);box-shadow:0 2px 8px rgba(0,0,0,.25)}
.tsfn-count.is-empty{display:none}
@keyframes tsfnPop{0%{transform:scale(0)}100%{transform:scale(1)}}

/* WhatsApp ping */
.tsfn-ping{position:absolute;top:-2px;right:-2px;width:8px;height:8px;border-radius:50%;background:#25D366;box-shadow:0 0 0 2px var(--tsfn-ring)}
.tsfn-style-dark .tsfn-ping{box-shadow:0 0 0 2px #181513}
.tsfn-ping:after{content:"";position:absolute;inset:0;border-radius:50%;background:#25D366;animation:tsfnPing 1.8s cubic-bezier(0,0,.2,1) infinite}
@keyframes tsfnPing{75%,100%{transform:scale(2.6);opacity:0}}
.tsfn-fab .tsfn-ping{top:4px;right:4px}

/* ============ ANIMATED ICONS ============ */
/* idle micro-motion on active */
.tsfn-ic-whatsapp.is-active .tsfn-icon svg,.tsfn-ic-phone .tsfn-icon svg{animation:tsfnIdleRing 4s ease-in-out infinite 2s}
@keyframes tsfnIdleRing{0%,88%,100%{transform:rotate(0)}90%{transform:rotate(-14deg)}92%{transform:rotate(12deg)}94%{transform:rotate(-10deg)}96%{transform:rotate(6deg)}}
.tsfn-fab.tsfn-ic-whatsapp .tsfn-icon svg,.tsfn-fab.tsfn-ic-cart .tsfn-icon svg{animation:tsfnIdleRing 5s ease-in-out infinite 3s}

/* tap animations (.is-tap added by JS) */
.tsfn-ic-home.is-tap .i-roof{animation:tsfnRoof .6s cubic-bezier(.3,1.6,.5,1)}
.tsfn-ic-home.is-tap .i-body{animation:tsfnSquash .6s ease}
@keyframes tsfnRoof{0%{transform:translateY(0)}35%{transform:translateY(-5px)}100%{transform:translateY(0)}}
@keyframes tsfnSquash{0%,100%{transform:scale(1)}40%{transform:scale(1.08,.88)}70%{transform:scale(.96,1.05)}}

.tsfn-ic-bag.is-tap svg{transform-origin:50% 10%;animation:tsfnSwing .8s ease}
.tsfn-ic-bag.is-tap .i-handle{animation:tsfnLift .8s ease}
@keyframes tsfnSwing{0%,100%{transform:rotate(0)}20%{transform:rotate(14deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(6deg)}80%{transform:rotate(-3deg)}}
@keyframes tsfnLift{30%{transform:translateY(-2px)}}

.tsfn-ic-cart.is-tap svg{animation:tsfnRoll .7s cubic-bezier(.3,1.4,.5,1)}
.tsfn-ic-cart.is-tap .i-wheel{animation:tsfnWheel .7s ease}
.tsfn-ic-cart.is-bump svg{animation:tsfnBump .7s cubic-bezier(.3,1.8,.5,1)}
@keyframes tsfnRoll{0%{transform:translateX(0)}30%{transform:translateX(5px) rotate(-6deg)}60%{transform:translateX(-3px)}100%{transform:none}}
@keyframes tsfnWheel{50%{transform:scale(1.4)}}
@keyframes tsfnBump{0%{transform:scale(1)}30%{transform:scale(1.3) rotate(-10deg)}60%{transform:scale(.92) rotate(6deg)}100%{transform:scale(1)}}

.tsfn-ic-whatsapp.is-tap svg,.tsfn-ic-phone.is-tap svg{animation:tsfnRing .7s ease}
.tsfn-ic-phone.is-tap .i-wave,.tsfn-ic-whatsapp.is-tap .i-wave{animation:tsfnWave .7s ease}
@keyframes tsfnRing{0%,100%{transform:rotate(0)}15%{transform:rotate(-18deg)}30%{transform:rotate(16deg)}45%{transform:rotate(-12deg)}60%{transform:rotate(8deg)}75%{transform:rotate(-4deg)}}
@keyframes tsfnWave{0%{opacity:1}30%{opacity:.2}60%{opacity:1}}

.tsfn-ic-grid.is-tap svg{animation:tsfnSpin .6s cubic-bezier(.3,1.4,.5,1)}
.tsfn-ic-grid[aria-expanded="true"] .tsfn-icon svg{transform:rotate(45deg);transition:transform .45s cubic-bezier(.3,1.4,.5,1)}
.tsfn-ic-grid .tsfn-icon svg{transition:transform .45s cubic-bezier(.3,1.4,.5,1)}
@keyframes tsfnSpin{from{transform:rotate(0) scale(.8)}to{transform:rotate(90deg) scale(1)}}

.tsfn-ic-user.is-tap .i-head{animation:tsfnHead .6s cubic-bezier(.3,1.6,.5,1)}
@keyframes tsfnHead{40%{transform:translateY(-3px) scale(1.1)}}

.tsfn-ic-search.is-tap svg{animation:tsfnZoom .6s cubic-bezier(.3,1.6,.5,1)}
@keyframes tsfnZoom{40%{transform:scale(1.25) rotate(-15deg)}}

.tsfn-ic-heart.is-tap svg{animation:tsfnBeat .8s ease}
.tsfn-ic-heart.is-active .i-body{fill:currentColor}
@keyframes tsfnBeat{0%,100%{transform:scale(1)}15%{transform:scale(1.3)}30%{transform:scale(.95)}45%{transform:scale(1.18)}60%{transform:scale(1)}}

.tsfn-ic-layers.is-tap .i-top{animation:tsfnStack .6s ease}
.tsfn-ic-layers.is-tap .i-mid{animation:tsfnStack .6s ease .07s}
.tsfn-ic-layers.is-tap .i-bot{animation:tsfnStack .6s ease .14s}
@keyframes tsfnStack{40%{transform:translateY(-3px)}}

.tsfn-ic-pin.is-tap svg{animation:tsfnDrop .7s cubic-bezier(.3,1.6,.5,1)}
@keyframes tsfnDrop{0%{transform:translateY(-8px);opacity:.3}50%{transform:translateY(0) scale(1.1,.9)}100%{transform:none;opacity:1}}

.tsfn-ic-tag.is-tap svg{transform-origin:85% 15%;animation:tsfnSwing .8s ease}

/* ripple */
.tsfn-ripple{position:absolute;left:50%;top:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;pointer-events:none;
	background:radial-gradient(circle,color-mix(in srgb,var(--tsfn-s) 45%,transparent) 0,transparent 70%);animation:tsfnRipple .6s ease-out forwards}
@keyframes tsfnRipple{from{transform:scale(.2);opacity:1}to{transform:scale(1.6);opacity:0}}

/* ============ MENU SHEET ============ */
.tsfn-overlay{position:fixed;inset:0;z-index:99990;background:rgba(15,12,10,.45);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
	opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.tsfn-sheet{position:fixed;left:0;right:0;bottom:0;z-index:99991;max-height:82vh;background:#fff;color:#1e1b18;
	border-radius:28px 28px 0 0;box-shadow:0 -20px 60px -20px rgba(0,0,0,.35);
	transform:translateY(105%);transition:transform .5s cubic-bezier(.2,.9,.2,1);display:flex;flex-direction:column}
.tsfn-sheet-open .tsfn-overlay{opacity:1;visibility:visible}
.tsfn-sheet-open .tsfn-sheet{transform:translateY(var(--tsfn-drag,0))}
body.tsfn-lock{overflow:hidden}
.tsfn-grip{padding:12px 0 6px;cursor:grab}
.tsfn-grip:before{content:"";display:block;width:44px;height:5px;margin:auto;border-radius:5px;background:#ddd5cc}
.tsfn-sheet-in{overflow-y:auto;padding:4px 18px calc(18px + env(safe-area-inset-bottom));-webkit-overflow-scrolling:touch}
.tsfn-h{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#9a8f86;margin:12px 4px 8px}
.tsfn-menu,.tsfn-pages ul{list-style:none!important;margin:0!important;padding:0!important}
.tsfn-menu li,.tsfn-pages li{margin:0!important;opacity:0;transform:translateY(10px);transition:.4s ease}
.tsfn-sheet-open .tsfn-menu li,.tsfn-sheet-open .tsfn-pages li{opacity:1;transform:none}
.tsfn-sheet-open li:nth-child(2){transition-delay:.05s}.tsfn-sheet-open li:nth-child(3){transition-delay:.1s}
.tsfn-sheet-open li:nth-child(4){transition-delay:.15s}.tsfn-sheet-open li:nth-child(5){transition-delay:.2s}.tsfn-sheet-open li:nth-child(6){transition-delay:.25s}
.tsfn-menu a,.tsfn-pages a{display:flex;align-items:center;justify-content:space-between;padding:14px 12px;border-radius:14px;
	color:#1e1b18!important;text-decoration:none!important;font-size:16px;font-weight:600}
.tsfn-menu a:after,.tsfn-pages a:after{content:"›";font-size:22px;line-height:0;color:#cbbfb4}
.tsfn-menu .current-menu-item>a,.tsfn-pages .current_page_item>a{background:color-mix(in srgb,var(--tsfn-p) 8%,#fff);color:var(--tsfn-p)!important}
.tsfn-cats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.tsfn-cat{display:flex;align-items:center;gap:10px;padding:10px;border-radius:16px;background:#faf6f1;color:#1e1b18!important;
	text-decoration:none!important;font-size:13px;font-weight:600;line-height:1.2;border:1px solid transparent;transition:.2s}
.tsfn-cat:active{transform:scale(.97);border-color:var(--tsfn-p)}
.tsfn-cat-img{flex:none;width:40px;height:40px;border-radius:12px;overflow:hidden;display:grid;place-items:center;background:#fff;
	color:var(--tsfn-p);font-weight:800;font-size:16px}
.tsfn-cat-img img{width:100%;height:100%;object-fit:cover}
.tsfn-cat:last-child:nth-child(odd){grid-column:1/-1}
.tsfn-ctas{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.tsfn-cta{display:flex;align-items:center;justify-content:center;gap:8px;height:50px;border-radius:15px;font-weight:700;font-size:14px;text-decoration:none!important}
.tsfn-cta svg{width:19px;height:19px}
.tsfn-cta-call{background:#1e1b18;color:#fff!important}
.tsfn-cta-wa{background:#25D366;color:#fff!important}

@media (prefers-reduced-motion:reduce){
	.tsfn-root,.tsfn-root *,.tsfn-sheet,.tsfn-sheet *{animation:none!important;transition:none!important}
}

/* ============ LIQUID GLASS GRADIENT ============ */
.tsfn-defs{position:absolute;width:0;height:0;overflow:hidden}
.tsfn-sheen{display:none}
.tsfn-style-liquid{
	--tsfn-fg:#3a2a24;--tsfn-fg-on:#fff;--tsfn-ring:rgba(255,255,255,.85);
	--tsfn-bg:linear-gradient(135deg,
		rgba(255,255,255,.78) 0%,
		color-mix(in srgb,var(--tsfn-p) 12%,rgba(255,255,255,.62)) 45%,
		color-mix(in srgb,var(--tsfn-s) 18%,rgba(255,255,255,.7)) 100%);
	backdrop-filter:blur(24px) saturate(210%) contrast(1.05);-webkit-backdrop-filter:blur(24px) saturate(210%) contrast(1.05);
	box-shadow:
		inset 0 1.5px 0 rgba(255,255,255,.95),
		inset 0 -1px 0 rgba(255,255,255,.35),
		inset 0 0 0 1px rgba(255,255,255,.6),
		inset 0 -12px 24px -14px color-mix(in srgb,var(--tsfn-p) 35%,transparent),
		0 22px 44px -16px color-mix(in srgb,var(--tsfn-p) 50%,transparent),
		0 6px 14px -6px rgba(40,20,10,.18);
}
/* glossy top highlight + slow liquid shimmer */
.tsfn-style-liquid .tsfn-sheen{display:block;position:absolute;inset:0;border-radius:inherit;pointer-events:none;overflow:hidden;z-index:0}
.tsfn-style-liquid .tsfn-sheen:before{content:"";position:absolute;left:4%;right:4%;top:2px;height:46%;border-radius:20px 20px 40% 40%/20px 20px 100% 100%;
	background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,0))}
.tsfn-style-liquid .tsfn-sheen:after{content:"";position:absolute;top:-50%;bottom:-50%;width:35%;left:-40%;
	background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);
	animation:tsfnShimmer 6s ease-in-out infinite 1.5s}
@keyframes tsfnShimmer{0%{left:-40%}35%,100%{left:130%}}

/* gradient icons – always visible */
.tsfn-style-liquid .tsfn-item:not(.is-active):not(.tsfn-fab) .tsfn-icon svg{stroke:url(#tsfn-g);stroke-width:2.2;
	filter:drop-shadow(0 1px 0 rgba(255,255,255,.9)) drop-shadow(0 2px 4px color-mix(in srgb,var(--tsfn-p) 25%,transparent))}
.tsfn-style-liquid .tsfn-label{color:#3a2a24;text-shadow:0 1px 0 rgba(255,255,255,.8)}
.tsfn-style-liquid .tsfn-item.is-active .tsfn-label{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.18)}
.tsfn-style-liquid .tsfn-item.is-active .tsfn-icon svg{filter:drop-shadow(0 2px 3px rgba(0,0,0,.18))}

/* liquid blob bubble */
.tsfn-style-liquid .tsfn-bubble{top:7px;bottom:7px;border-radius:18px;
	background:linear-gradient(135deg,var(--tsfn-p),var(--tsfn-s));
	box-shadow:inset 0 1.5px 0 rgba(255,255,255,.55),inset 0 -6px 12px -6px rgba(0,0,0,.2),
		0 8px 18px -6px color-mix(in srgb,var(--tsfn-p) 65%,transparent)}
.tsfn-style-liquid .tsfn-bubble:before{content:"";position:absolute;left:10%;right:10%;top:3px;height:40%;border-radius:14px 14px 50% 50%;
	background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,0))}
.tsfn-style-liquid .tsfn-bubble:after{display:none}
.tsfn-bubble.is-moving{animation:tsfnBlob .6s cubic-bezier(.3,1.2,.5,1)}
@keyframes tsfnBlob{0%{scale:1 1}35%{scale:1.35 .78}65%{scale:.9 1.08}85%{scale:1.04 .97}100%{scale:1 1}}

/* FAB – glass ring */
.tsfn-style-liquid .tsfn-fab .tsfn-icon{
	box-shadow:0 14px 28px -8px color-mix(in srgb,var(--tsfn-p) 70%,transparent),
		0 0 0 5px rgba(255,255,255,.75),0 0 0 6px color-mix(in srgb,var(--tsfn-p) 18%,transparent),
		inset 0 1.5px 0 rgba(255,255,255,.5)}
.tsfn-style-liquid .tsfn-fab .tsfn-label{color:var(--tsfn-p);font-weight:700;text-shadow:0 1px 0 rgba(255,255,255,.8)}
.tsfn-style-liquid .tsfn-count{box-shadow:0 0 0 2px #fff,0 3px 8px color-mix(in srgb,var(--tsfn-p) 45%,transparent)}
.tsfn-style-liquid .tsfn-ping{box-shadow:0 0 0 2px #fff}
.tsfn-style-liquid .tsfn-ripple{background:radial-gradient(circle,rgba(255,255,255,.9) 0,transparent 70%)}
.tsfn-style-liquid .tsfn-item:focus-visible{outline-color:var(--tsfn-p)}
