/* SKmobilecare catalogue filter: a compact three-level product tree (brand → family → generation) with native keyboard disclosure. */
/* Bộ lọc catalogue SKmobilecare: cấp đóng hiển thị +, cấp mở hiển thị −; đời máy luôn theo từng dòng. */
.skm-demo-filter-brands{padding-right:0}
.skm-demo-brand-group,.skm-demo-model-group{border-top:1px solid #edf1f6}
.skm-demo-brand-group:first-child{border-top:0}
.skm-demo-brand-group summary,.skm-demo-model-group summary{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;padding:8px 4px 8px 1px;color:#52657f;cursor:pointer;list-style:none;font-family:"Be Vietnam Pro",sans-serif;font-size:10px;font-weight:700;line-height:1.3}
.skm-demo-brand-group summary::-webkit-details-marker,.skm-demo-model-group summary::-webkit-details-marker{display:none}
.skm-demo-brand-group summary span,.skm-demo-model-group summary span{min-width:0;display:flex;flex-direction:column;gap:2px}
.skm-demo-brand-group summary b,.skm-demo-model-group summary b{overflow-wrap:anywhere}
.skm-demo-brand-group summary small,.skm-demo-model-group summary small{color:#94a4b8;font-size:8px;font-weight:500}
.skm-demo-brand-group summary>i,.skm-demo-model-group summary>i{display:grid;place-items:center;flex:0 0 16px;width:16px;height:16px;border:1px solid #cbd7e6;border-radius:50%;color:#55708d;font-size:13px;font-style:normal;line-height:1;transition:background .18s cubic-bezier(.23,1,.32,1),color .18s cubic-bezier(.23,1,.32,1),border-color .18s cubic-bezier(.23,1,.32,1)}
.skm-demo-brand-group:not([open]) summary>i:before,.skm-demo-model-group:not([open]) summary>i:before{content:"+"!important}
.skm-demo-brand-group[open] summary,.skm-demo-model-group[open] summary{color:var(--demo-blue)}
.skm-demo-brand-group[open] summary>i,.skm-demo-model-group[open] summary>i{border-color:var(--demo-blue);background:var(--demo-blue);color:#fff}
.skm-demo-brand-group[open] summary>i:before,.skm-demo-model-group[open] summary>i:before{content:"−"!important}
.skm-demo-brand-children{margin:0 0 6px 8px;padding:3px 0 3px 8px;border-left:1px solid #dce5f1}
.skm-demo-filter-list .skm-demo-brand-children>a,.skm-demo-filter-list .skm-demo-brand-generations>a{padding:6px 3px 6px 1px!important;font-size:9px!important}
.skm-demo-filter-list .skm-demo-brand-children>a+a{border-top:1px solid #edf1f6}
.skm-demo-filter-list .skm-demo-brand-children>.skm-demo-brand-all,.skm-demo-filter-list .skm-demo-brand-generations>.skm-demo-brand-all{color:#7689a2;font-weight:700}
.skm-demo-filter-list .skm-demo-brand-children>.skm-demo-brand-all.is-active,.skm-demo-filter-list .skm-demo-brand-generations>.skm-demo-brand-all.is-active{color:var(--demo-blue)}
.skm-demo-model-group{margin-top:3px;border-top:0}
.skm-demo-model-group summary{padding:7px 2px 7px 0;font-size:9px}
.skm-demo-model-group summary small{font-size:7px}
.skm-demo-model-group summary>i{flex-basis:14px;width:14px;height:14px;font-size:12px}
.skm-demo-brand-generations{margin:0 0 5px 7px;padding:2px 0 2px 7px;border-left:1px dashed #dce5f1}
.skm-demo-filter-list .skm-demo-brand-generations>a{display:flex!important;align-items:center;justify-content:space-between;gap:8px;width:100%;min-width:0;padding:7px 3px 7px 1px!important;font-size:9px!important;color:#63758c;line-height:1.35;white-space:normal!important}
.skm-demo-filter-list .skm-demo-brand-generations>a+a{border-top:1px solid #edf1f6}
.skm-demo-filter-list .skm-demo-brand-generations>a i{flex:0 0 auto;font-style:normal;color:#9dafc5}
@media (max-width:660px){.skm-demo-brand-group summary{padding:9px 4px 9px 1px}.skm-demo-filter-brands{max-height:360px}.skm-demo-filter-list .skm-demo-brand-generations>a{padding:8px 3px 8px 1px!important;font-size:9.5px!important}}