/* AD ON nav makeover, option A "Visual mega menu" — round 3 (2026-11-01: bigger logo and text, live). Desktop only (850px+); the phone menu is unchanged. */
:root{--an-red:#ed1b24;--an-grey:#2e3236;--an-ink:#2b2f33;--an-mute:#6b7177;--an-line:#e8e9eb;--an-soft:#f5f6f7;--an-tint:#fdeced}

@media (min-width:850px){
/* ---------- Header: one clean row ---------- */
.adon-nav-on #masthead{height:92px}
.adon-nav-on #masthead .header-inner{position:relative;flex-wrap:nowrap}
.adon-nav-on #masthead #logo img{max-height:72px;width:auto}
.adon-nav-on .stuck #masthead{height:74px;box-shadow:0 4px 18px rgba(0,0,0,.18)}
.adon-nav-on .stuck #masthead #logo img{max-height:58px}
.adon-nav-on #masthead .flex-left{position:static}
.adon-nav-on .header-nav-main{flex-wrap:nowrap;position:static!important;align-items:center}
.adon-nav-on .header-nav-main>li{margin:0!important;flex:0 0 auto}
.adon-nav-on .header-nav-main.nav-divided>li+li>a:after,.adon-nav-on .header-nav-main>li.header-divider{display:none}
.adon-nav-on .header-nav-main>li>a.nav-top-link,.adon-nav-on .header-nav-main>li>a{display:inline-flex!important;flex-wrap:nowrap!important;flex-direction:row!important;align-items:center;gap:4px;white-space:nowrap;position:relative;font-weight:600;font-size:17px;letter-spacing:0;padding:10px 14px;color:#fff;opacity:.92;text-transform:none;line-height:1.2}
.adon-nav-on .header-nav-main>li>a.nav-top-link:before{content:"";position:absolute;left:14px;right:14px;bottom:2px;height:2px;border-radius:2px;background:var(--an-red);transform:scaleX(0);transform-origin:left;transition:transform .2s}
.adon-nav-on .header-nav-main>li:hover>a,.adon-nav-on .header-nav-main>li:focus-within>a{opacity:1}
.adon-nav-on .header-nav-main>li:hover>a.nav-top-link:before,.adon-nav-on .header-nav-main>li:focus-within>a.nav-top-link:before,.adon-nav-on .header-nav-main>li.an-here>a.nav-top-link:before{transform:scaleX(1)}
.adon-nav-on .header-nav-main .icon-angle-down{display:inline-block;font-size:12px;margin:1px 0 0 2px;opacity:.65;transition:transform .2s}
.adon-nav-on .header-nav-main>li:hover .icon-angle-down{transform:rotate(180deg)}
.adon-nav-on .header-nav-main li.has-dropdown:before,.adon-nav-on .header-nav-main li.has-dropdown:after{display:none!important}
/* search: compact pill, icon and text side by side */
.adon-nav-on .header-search{margin-right:8px!important}
.adon-nav-on .header-search>a.nav-top-link{gap:8px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:8px 17px 8px 14px!important;font-size:15.5px!important;font-weight:400!important;opacity:1}
.adon-nav-on .header-search>a.nav-top-link i{font-size:15px;margin:0}
.adon-nav-on .header-search>a.nav-top-link:after{content:"ค้นหาสินค้า";opacity:.8}
.adon-nav-on .header-search>a.nav-top-link:before{display:none}
.adon-nav-on .header-search:hover>a.nav-top-link{background:rgba(255,255,255,.16)}
/* right side: social icons unchanged (Bennie 2026-11-01); compact language pill */
.adon-nav-on #masthead .flex-right .trp-language-switcher>div{background:transparent!important;border:1px solid rgba(255,255,255,.28)!important;border-radius:999px!important;padding:4px 10px!important}
.adon-nav-on #masthead .flex-right .trp-language-switcher a{color:#fff!important;background:transparent!important;font-size:14px!important;padding:2px 6px!important}
.adon-nav-on #masthead .flex-right .trp-ls-shortcode-language{background:#fff!important;border-radius:12px!important}
.adon-nav-on #masthead .flex-right .trp-ls-shortcode-language a{color:var(--an-ink)!important}

/* ---------- Drop-down panels (all tabs) ---------- */
.adon-nav-on .header-nav-main .nav-dropdown{border:1px solid var(--an-line);border-radius:16px;box-shadow:0 22px 60px rgba(20,24,28,.18);background:#fff;padding:0;overflow:hidden}
.adon-nav-on .header-nav-main .nav-dropdown:before,.adon-nav-on .header-nav-main .nav-dropdown:after{display:none}
.adon-nav-on li.an-mega{position:static!important}
.adon-nav-on li.an-mega>.nav-dropdown{left:50%!important;top:100%!important;transform:translateX(-50%);margin-top:0;max-height:calc(100vh - 110px)}
.adon-nav-on li.an-mega>.nav-dropdown>li{margin:0;list-style:none}
.an-panel-title{font-size:13.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--an-mute);font-weight:600;margin:0 0 12px}

/* สินค้า: list left, photo cards right */
.adon-nav-on li.an-prod>.nav-dropdown{display:grid;grid-template-columns:280px 1fr;grid-template-rows:1fr auto;width:min(1120px,calc(100vw - 48px))}
.adon-nav-on li.an-prod>.nav-dropdown>li.an-lw{grid-column:1;grid-row:1/span 2;padding:14px 10px;border-right:1px solid var(--an-line);background:#fafafb;overflow:auto}
.adon-nav-on li.an-prod .an-list{list-style:none;margin:0;padding:0}
.adon-nav-on li.an-prod .an-list>li{margin:0}
.adon-nav-on li.an-prod .an-list>li>a{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px;border-radius:8px;font-size:16px;color:var(--an-ink);position:relative;text-transform:none;font-weight:400}
.adon-nav-on li.an-prod .an-list>li>a:after{content:"›";color:#b5b9bd;font-size:18px;line-height:1}
.adon-nav-on li.an-prod .an-list>li.an-on>a{background:#fff;color:var(--an-red);box-shadow:0 1px 4px rgba(0,0,0,.07)}
.adon-nav-on li.an-prod .an-list>li.an-on>a:before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:3px;background:var(--an-red)}
.adon-nav-on li.an-prod .an-list>li.an-on>a:after{color:var(--an-red)}
.adon-nav-on li.an-prod .an-list>li.an-all>a{font-weight:600}
.an-pane{grid-column:2;padding:20px 24px 16px;overflow:auto}
.an-pane-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:14px}
.an-pane-head b{font-size:22px;color:var(--an-ink);font-weight:600}
.an-pane-head a{font-size:15.5px;color:var(--an-red)!important;white-space:nowrap;padding:0!important;background:none!important}
.an-pane-head a:hover{text-decoration:underline}
.an-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.an-card{display:flex!important;flex-direction:column;border:1px solid var(--an-line);border-radius:12px;overflow:hidden;background:#fff;color:var(--an-ink)!important;padding:0!important;text-transform:none!important;transition:box-shadow .2s,transform .2s,border-color .2s}
.an-card:hover{box-shadow:0 10px 26px rgba(20,24,28,.12);transform:translateY(-2px);border-color:#d9dbde;background:#fff!important}
.an-card img{width:100%;aspect-ratio:2/1;object-fit:contain;background:#fff;padding:6px}
.an-card .an-noimg{display:block;aspect-ratio:2/1;background:var(--an-soft)}
.an-card .an-name{padding:9px 12px 0;font-size:16px;line-height:1.35;font-weight:600}
.an-card .an-count{padding:2px 12px 10px;font-size:13.5px;color:var(--an-mute);font-weight:400}
.an-card:hover .an-name{color:var(--an-red)}
.an-card-wide{grid-column:1/span 2}
.an-card-wide img{aspect-ratio:auto;max-height:230px}
.adon-nav-on li.an-mega>.nav-dropdown>li.an-foot{grid-column:2;display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:12px 24px 16px;border-top:1px solid var(--an-line)}
.an-foot a{display:inline-block!important;width:auto!important;margin:0!important;font-size:14.5px!important;padding:7px 14px!important;border-radius:999px;background:var(--an-soft);color:var(--an-ink)!important;text-transform:none!important;font-weight:400!important}
.an-foot a:hover{background:var(--an-tint);color:var(--an-red)!important}

/* ผลงาน: photo cards per booth system, grouped */
.adon-nav-on li.an-port>.nav-dropdown{width:min(980px,calc(100vw - 48px));padding:22px 24px}
.an-port-groups{display:grid;grid-template-columns:2fr 1fr;gap:28px}
.an-port-groups .an-grid{grid-template-columns:repeat(2,1fr)}
.an-port-groups .an-g1 .an-grid{grid-template-columns:repeat(4,1fr)}
.an-port-groups .an-g2 .an-grid{grid-template-columns:repeat(2,1fr)}
.an-port-groups{grid-template-columns:4fr 2fr}

/* ช่วยเหลือ / เกี่ยวกับ: icon tiles */
.adon-nav-on li.an-tiles>.nav-dropdown{width:min(640px,calc(100vw - 48px));padding:22px 24px}
.an-tilegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.an-tile{display:flex!important;flex-direction:column;align-items:flex-start;gap:10px;padding:16px 14px!important;border:1px solid var(--an-line);border-radius:12px;color:var(--an-ink)!important;font-size:16px!important;font-weight:600!important;line-height:1.35;text-transform:none!important;transition:border-color .2s,box-shadow .2s,transform .2s;background:#fff}
.an-tile:hover{border-color:#d9dbde;box-shadow:0 8px 22px rgba(20,24,28,.1);transform:translateY(-2px);color:var(--an-red)!important;background:#fff!important}
.an-ico{width:38px;height:38px;border-radius:10px;background:var(--an-tint);color:var(--an-red);display:flex;align-items:center;justify-content:center}
.an-ico svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.an-ext{font-weight:400;color:var(--an-mute);font-size:13.5px}
/* hide the original list items once the visual panel is built (they stay in the HTML for crawlers) */
.adon-nav-on li.an-built>.nav-dropdown>li.an-src{display:none!important}
}

/* ---------- Side menu (shop and category pages): close to the original, just tidier ---------- */
.adon-nav-on .widget_product_categories{position:sticky;top:110px;max-height:calc(100vh - 130px);overflow:auto;scrollbar-width:thin;padding-right:4px}
.adon-nav-on .widget_product_categories .widget-title{display:block;font-size:13px;letter-spacing:.06em;color:var(--an-mute);font-weight:600;text-transform:uppercase;margin-bottom:6px;font-size:14px}
.adon-nav-on .widget_product_categories .is-divider{display:none}
.an-filter{width:100%;margin:4px 0 10px!important;height:38px!important;border-radius:999px!important;border:1px solid var(--an-line)!important;background:var(--an-soft)!important;padding:0 14px!important;font-size:15px!important;box-shadow:none!important}
.an-filter:focus{border-color:#c9ccd0!important;background:#fff!important}
.adon-nav-on .product-categories .toggle{display:none!important}
.adon-nav-on .product-categories,.adon-nav-on .product-categories ul{list-style:none;margin:0;padding:0}
.adon-nav-on .product-categories>li{border-top:1px solid #ececec!important;margin:0;padding:0!important;position:relative}
.adon-nav-on .product-categories>li:first-child{border-top:0!important}
.adon-nav-on .product-categories li{position:relative;margin:0;padding:0!important}
.adon-nav-on .product-categories li>a{display:block;padding:10px 30px 10px 0;font-size:16.5px;line-height:1.4;color:var(--an-ink);transition:color .15s}
.adon-nav-on .product-categories li>a:hover{color:var(--an-red)}
.adon-nav-on .product-categories .children{margin:0 0 10px 2px!important;padding:0 0 0 14px!important;border-left:1px solid #e3e4e6}
.adon-nav-on .product-categories .children li{border:0!important}
.adon-nav-on .product-categories .children li>a{font-size:15px;padding:5px 28px 5px 0;color:#4a4f55}
.adon-nav-on .product-categories .children .children{margin-bottom:4px!important}
.adon-nav-on .product-categories li.current-cat>a{color:var(--an-red);font-weight:600}
.adon-nav-on .product-categories .children li.current-cat>a:before{content:"";position:absolute;left:-15px;top:6px;height:calc(100% - 12px);max-height:20px;width:2px;background:var(--an-red)}
.adon-nav-on .product-categories>li.current-cat-parent>a,.adon-nav-on .product-categories>li.current-cat-ancestor>a,.adon-nav-on .product-categories>li.an-open>a{font-weight:600}
.an-tog{position:absolute;right:0;top:9px;width:24px;height:24px;border:0;border-radius:6px;background:transparent;color:#9aa0a6;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;margin:0;min-height:0;line-height:1;box-shadow:none}
.children .an-tog{top:3px}
.an-tog:hover{background:var(--an-soft);color:var(--an-red)}
.an-tog:before{content:"";width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .2s}
li.an-open>.an-tog:before{transform:translateY(2px) rotate(225deg)}
.adon-nav-on .product-categories li.cat-parent:not(.an-open)>.children{display:none}
.adon-nav-on .product-categories.an-filtering li{display:none}
.adon-nav-on .product-categories.an-filtering li.an-hit,.adon-nav-on .product-categories.an-filtering li.an-hit-anc{display:block}
.adon-nav-on .product-categories.an-filtering li.an-hit-anc>.children{display:block!important}
.an-empty{display:none;padding:8px 0;font-size:15px;color:var(--an-mute)}
.an-empty.on{display:block}
@media (min-width:850px){
.adon-nav-on .header-nav-main .nav-dropdown>li.an-port-groups{display:grid!important;grid-template-columns:4fr 2fr;gap:28px;margin:0}
.adon-nav-on .header-nav-main .nav-dropdown>li.an-tilegrid{display:grid!important;grid-template-columns:repeat(3,1fr);gap:10px;margin:0}
.adon-nav-on .an-card .an-name,.adon-nav-on .an-tile{text-transform:none!important;letter-spacing:0}
.adon-nav-on #masthead .flex-left .header-nav-main>li:last-child{margin-right:14px!important}
}
@media (min-width:850px){
.adon-nav-on #masthead .flex-right{margin-left:14px}
.adon-nav-on li.an-tiles>.nav-dropdown,.adon-nav-on li.an-port>.nav-dropdown{padding-bottom:26px;max-height:none}
}
@media (min-width:850px){.adon-nav-on #masthead .header-social-icons{padding-left:16px!important}}
@media (min-width:850px) and (max-width:1365px){.adon-nav-on .header-nav-main>li>a.nav-top-link{padding-left:10px;padding-right:10px}.adon-nav-on .header-nav-main>li>a.nav-top-link:before{left:10px;right:10px}}
/* round 3: bigger text needs smaller steps on narrow desktops (checked 1000-1440px with the TH|EN pill) */
@media (min-width:850px) and (max-width:1199px){.adon-nav-on #masthead .header-nav-main>li>a.nav-top-link{font-size:15px;padding-left:6px;padding-right:6px}.adon-nav-on .header-nav-main>li>a.nav-top-link:before{left:6px;right:6px}.adon-nav-on #masthead #logo img{max-height:60px}.adon-nav-on .header-search>a.nav-top-link:after{display:none}}
@media (min-width:850px) and (max-width:1023px){.adon-nav-on #masthead .header-nav-main>li>a.nav-top-link{font-size:14px;padding-left:5px;padding-right:5px}.adon-nav-on #masthead #logo img{max-height:52px}}
