/* Public reference observed on 2026-11-06. Only the search filter is restyled. */
html body.sp-site-page aside#sp-filter-drawer.ty-filter-modal {
 --ty-filter-text:#152233;
 --ty-filter-muted:#3a4757;
 --ty-filter-action:#094171;
 --ty-filter-action-hover:#07345a;
 inset:0 0 0 auto!important;
 transform:none!important;
 width:min(480px,100vw)!important;
 height:100vh!important;
 height:100dvh!important;
 max-height:none!important;
 border:0!important;
 border-radius:0!important;
 box-shadow:-8px 0 32px #15223326!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-popup-form {
 height:100%!important;
 max-height:100vh!important;
 max-height:100dvh!important;
 font:400 16px/1.5 "Nunito Sans","Noto Sans Thai",Arial,sans-serif!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal form.ty-popup-form[data-ty-popup][data-ty-popup-version] :is(button,input,select,label,legend,summary) {
 font-family:"Nunito Sans","Noto Sans Thai",Arial,sans-serif!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-modal-heading {
 position:relative;
 min-height:72px!important;
 padding:14px 24px!important;
 gap:16px;
 border-bottom:1px solid #acb8c7;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-modal-heading #ty-filter-title {
 flex:1;
 margin:0!important;
 color:#152233!important;
 font:700 18px/24px "Nunito Sans","Noto Sans Thai",Arial,sans-serif!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal form:not([data-ty-view=main]) .ty-modal-heading #ty-filter-title {text-align:center;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-modal-heading > :is(.ty-back,[data-sp-filter-close]) {
 width:32px!important;
 height:32px!important;
 flex:0 0 32px!important;
 color:#3a4757!important;
 font-size:32px!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal form .ty-modal-scroll {
 display:flex;
 flex-direction:column;
 flex:1 1 auto!important;
 padding:0 24px!important;
 scrollbar-gutter:stable;
 scrollbar-width:thin;
 scrollbar-color:#888 #f4f4f4;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-main-section {
 flex:0 0 auto;
 margin:0!important;
 padding:18px 0!important;
 border:0!important;
 border-bottom:1px solid #e0e6ed!important;
 border-radius:0!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-main-section > summary {
 min-height:40px!important;
 padding:0!important;
 gap:16px;
 background:transparent!important;
 border-radius:0!important;
 color:#152233!important;
 font:600 16px/22px "Nunito Sans","Noto Sans Thai",Arial,sans-serif!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-main-section > summary > .ty-icon {
 width:34px!important;
 height:34px!important;
 flex-basis:34px!important;
 padding:8px!important;
 border-radius:50%!important;
 background:#f1f3f5!important;
 color:#152233!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-main-section > summary::after {
 margin-left:auto!important;
 width:8px;
 height:8px;
 flex-basis:8px;
 border-color:#152233!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-main-section > summary small {
 font-size:14px!important;
 font-weight:400!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-inline-section > summary {
 min-height:24px!important;
 margin-bottom:16px;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-inline-section > summary > .ty-icon {display:none!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-section-body {padding:0!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-main-section.ty-screen-active {
 padding:16px 0 24px!important;
 border:0!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal :is(.ty-selection-values,.ty-product-group-values,.ty-check-options,.ty-publication-options,.ty-seller-choices,.ty-sort-choices) {
 display:grid!important;
 grid-template-columns:minmax(0,1fr)!important;
 gap:16px!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-check {
 min-height:24px!important;
 padding:0!important;
 gap:8px;
 font:400 15px/22px "Nunito Sans","Noto Sans Thai",Arial,sans-serif!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-check input {
 appearance:none!important;
 -webkit-appearance:none!important;
 flex:0 0 24px!important;
 width:24px!important;
 height:24px!important;
 border:2px solid #acb8c7!important;
 border-radius:4px!important;
 background:#fff!important;
 cursor:pointer;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-check input:checked {
 border-color:#094171!important;
 background:#094171 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12 4 4L19 6' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/22px 22px no-repeat!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-check input[type=checkbox]:indeterminate {
 border-color:#094171!important;
 background:#094171 linear-gradient(#fff,#fff) center/12px 2px no-repeat!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-choice-count {margin-left:4px;color:#3a4757;font-size:14px;font-weight:400;white-space:nowrap;}
/* Single choices look like the multiple ones: a check mark, no round button (2026-11-13). */
html body.sp-site-page #sp-filter-drawer.ty-filter-modal :is(button,input,summary):focus-visible {outline:3px solid #094171!important;outline-offset:3px;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-product-group {
 margin:24px 0 0!important;
 padding:0!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-product-group > legend {
 margin:0 0 20px!important;
 font:600 16px/22px "Nunito Sans","Noto Sans Thai",Arial,sans-serif!important;
 color:#152233!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-model-more {
 margin-top:16px;
 padding:0;
 border:0;
 background:transparent;
 color:#094171;
 font-size:16px;
 text-decoration:underline;
 cursor:pointer;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal :is(.ty-choice-search,.ty-select-search) {
 position:sticky!important;
 top:0;
 z-index:2;
 height:44px!important;
 min-height:44px!important;
 margin:0 0 24px!important;
 padding:0 16px 0 44px!important;
 border:1px solid #acb8c7!important;
 border-radius:9999px!important;
 background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10' cy='10' r='6.5' fill='none' stroke='%23152233' stroke-width='1.8'/%3E%3Cpath d='m15 15 5 5' stroke='%23152233' stroke-width='1.8'/%3E%3C/svg%3E") 16px center/20px 20px no-repeat!important;
 font-size:16px!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal form.ty-popup-form[data-ty-popup] input[type=search]:is(.ty-choice-search,.ty-select-search) {
 position:sticky!important;
 min-height:44px!important;
 height:44px!important;
 padding:0 16px 0 44px!important;
 border:1px solid #acb8c7!important;
 border-radius:9999px!important;
 font-size:16px!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-select-panel {padding:16px 0 24px!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-select-option {
 min-height:48px!important;
 padding:12px 0!important;
 border-bottom:1px solid #e0e6ed!important;
 color:#152233!important;
 font:400 15px/22px "Nunito Sans","Noto Sans Thai",Arial,sans-serif!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-price-inputs {
 display:grid;
 grid-template-columns:minmax(0,1fr) minmax(0,1fr);
 gap:16px;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-price-bound {display:grid;gap:8px;font-size:14px!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-price-control {display:flex;align-items:center;border:1px solid #acb8c7;border-radius:24px;overflow:hidden;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-price-control input {
 min-width:0!important;
 height:44px!important;
 min-height:44px!important;
 padding:0 16px!important;
 border:0!important;
 border-radius:0!important;
 font-size:16px!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-price-control > span {padding:10px 12px;border-left:1px solid #acb8c7;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-selection .ty-selection-all {display:none!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-modal-actions {
 padding:16px 24px!important;
 border-top:1px solid #e0e6ed;
 background:#fff;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-modal-action-row {grid-template-columns:auto minmax(0,1fr);gap:16px;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-modal-actions :is(.ty-reset-all,.ty-clear-current) {
 grid-column:1!important;
 grid-row:1!important;
 order:0!important;
 width:auto!important;
 min-height:44px!important;
 height:44px!important;
 padding:0 16px!important;
 border:1px solid #094171!important;
 border-radius:9999px!important;
 background:#fff!important;
 color:#094171!important;
 font:700 16px/44px "Nunito Sans","Noto Sans Thai",Arial,sans-serif!important;
 white-space:nowrap;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-modal-actions button[type=submit] {
 grid-column:2;
 grid-row:1;
 height:44px!important;
 min-height:44px!important;
 padding:0 16px!important;
 border:0!important;
 border-radius:9999px!important;
 background:#ec5a13!important;
 color:#fff!important;
 font:700 16px/44px "Nunito Sans","Noto Sans Thai",Arial,sans-serif!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-modal-actions button[type=submit]:hover {background:#c84608!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal form[data-ty-view=main] .ty-keyword-section {display:none!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-category-section {order:0;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-location-section {order:1;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-price-section {order:2;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-selection {order:3;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-features {order:4;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-sort-section {order:5;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-listing-type-section {order:6;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-seller-section {order:7;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-publication-section {order:8;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-popup-status {order:9;}
html body.sp-site-page aside#sp-filter-drawer.ty-filter-modal:has(form[data-ty-view=main]) {height:100vh!important;height:100dvh!important;max-height:none!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal form[data-ty-view=main] {height:100%!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal form[data-ty-view=main] .ty-modal-scroll {flex:1 1 auto!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-inline-section > .ty-section-body {padding:0!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-inline-section .ty-check {min-height:24px!important;padding:0!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal :is([hidden],.ty-choice-hidden) {display:none!important;}
@media(max-width:360px) {
 html body.sp-site-page #sp-filter-drawer.ty-filter-modal :is(.ty-modal-heading,.ty-modal-actions) {padding-left:16px!important;padding-right:16px!important;}
 html body.sp-site-page #sp-filter-drawer.ty-filter-modal form .ty-modal-scroll {padding-left:16px!important;padding-right:16px!important;}
 html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-modal-action-row {gap:8px;}
 html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-modal-actions :is(.ty-reset-all,.ty-clear-current,button[type=submit]) {padding-left:12px!important;padding-right:12px!important;font-size:14px!important;}
}
/* 2026-11-13 — Highlight bands (hover, selection, selected category) span the full panel width. */
html body.sp-site-page #sp-filter-drawer.ty-filter-modal {--ty-band-pad:24px;}
@media(max-width:360px) {html body.sp-site-page #sp-filter-drawer.ty-filter-modal {--ty-band-pad:16px;}}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-select-list {margin:0 calc(-1 * var(--ty-band-pad))!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-select-option {
 width:100%!important;
 padding:12px calc(var(--ty-band-pad) + 28px) 12px var(--ty-band-pad)!important;
 border-radius:0!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-select-option:is(:hover,.is-active) {background:var(--ty-filter-hover,#dce7f2)!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-select-option[aria-selected=true] {background:var(--ty-filter-selected,#dce7f2)!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-select-option[aria-selected=true]::after {right:var(--ty-band-pad)!important;top:50%!important;transform:translateY(-50%);}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal .ty-category-section.ty-category-selected > summary {
 margin:0 calc(-1 * var(--ty-band-pad))!important;
 padding-left:var(--ty-band-pad)!important;
 padding-right:var(--ty-band-pad)!important;
 border-radius:0!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal form[data-ty-view=section] .ty-screen-active .ty-check {
 margin-left:calc(-1 * var(--ty-band-pad))!important;
 margin-right:calc(-1 * var(--ty-band-pad))!important;
 padding-left:var(--ty-band-pad)!important;
 padding-right:var(--ty-band-pad)!important;
 border-radius:0!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal form[data-ty-view=section] .ty-screen-active .ty-check:hover {background:var(--ty-filter-hover,#dce7f2)!important;}
/* Taller bands: each choice row is 44px high, the gap between rows moves inside the band. */
html body.sp-site-page #sp-filter-drawer.ty-filter-modal form[data-ty-view=section] .ty-screen-active :is(.ty-selection-values,.ty-product-group-values,.ty-check-options,.ty-publication-options,.ty-seller-choices,.ty-sort-choices) {gap:0!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal form[data-ty-view=section] .ty-screen-active .ty-check {min-height:46px!important;padding-top:11px!important;padding-bottom:11px!important;align-items:center!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal form[data-ty-view=section] .ty-screen-active .ty-product-group + .ty-product-group {margin-top:16px!important;}
/* 2026-11-13 — Choices use check marks (no round buttons) everywhere in the filters. */
html body.sp-site-page #sp-filter-drawer.ty-filter-modal input:is([type=radio],[type=checkbox]) {
 appearance:none!important;-webkit-appearance:none!important;
 width:22px!important;height:22px!important;min-width:22px!important;flex:0 0 22px!important;margin:0!important;padding:0!important;
 border:2px solid #acb8c7!important;border-radius:6px!important;box-shadow:none!important;
 background:#fff none no-repeat center/16px 16px!important;cursor:pointer;vertical-align:middle;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal input:is([type=radio],[type=checkbox])::before,
html body.sp-site-page #sp-filter-drawer.ty-filter-modal input:is([type=radio],[type=checkbox])::after {content:none!important;display:none!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal input:is([type=radio],[type=checkbox]):checked {
 border-color:#094171!important;background-color:#094171!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E")!important;
}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal input[type=checkbox]:indeterminate {border-color:#094171!important;background:#094171 linear-gradient(#fff,#fff) no-repeat center/10px 2px!important;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal input:is([type=radio],[type=checkbox]):focus-visible {outline:2px solid #f47708!important;outline-offset:2px;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal input:is([type=radio],[type=checkbox]):disabled {opacity:.45;cursor:not-allowed;}
html body.sp-site-page #sp-filter-drawer.ty-filter-modal label:has(> input:is([type=radio],[type=checkbox])) {display:flex!important;align-items:center;gap:12px;}
/* 2026-11-13 — Category bar on inner pages: the content starts right below it (no double header gap). */
html body.sp-site-page:not(.sp-home-page):has(#ty-home-nav) main.sp-site-surface {padding-top:20px!important;}
html body.sp-site-page:not(.sp-home-page):has(#ty-home-nav) main.sp-site-surface .adv-banner-head {margin-top:0!important;}
/* 2026-11-13 — Same white page background as the home page on every page (light theme). */
html:not([data-theme="dark"]) body.sp-site-page {background:#fff!important;}
html:not([data-theme="dark"]) body.sp-site-page main.sp-site-surface {background:#fff!important;}