﻿.divitemcategories {
    width: 1200px;
    min-height: 20px;
    margin-right: auto;
    margin-left: auto;
    position: relative;
}

    .divitemcategories label {
        font-size: 24px;
        font-weight: bold;
        text-align: left;
        border-bottom-style: solid;
        border-color: #f26123;
        display: none;
        width: 230px;
        margin-top: 50px;
        cursor:pointer;
    }



.divitemincategories {
    width: 1200px;
    margin-right: auto;
    margin-left: auto;
}

.divleft {
    vertical-align: top;
    width: 230px;
     /* padding-top: 10px; */
}

.divright {
    padding-left: 10px;
}



.ulitemgroup {
    background-color: #ffffff;
    display: none;
    width: calc(100% - 10px);
    margin: 0 0 10px 0;
    padding: 20px 5px;
    list-style-type: none;
}

    .ulitemgroup li {
        width: calc(100% - 10px);
        margin: 0;
        padding: 5px;
        cursor: pointer;
    }
        .ulitemgroup li:hover {
            background-color: aliceblue;
        }

ul.ulitemgroup li.selected {
    background-color: aliceblue !important;
}

.divmenushadow {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 2px 8px 0 rgba(0, 0, 0, 0.19);
}


.divfilterleftpand {
    background-color: #ffffff;
    display: block;
    width: calc(100% - 10px);
    margin-bottom: 10px;
    padding: 20px 5px;
   

}

    .divfilterleftpand span {
        display: block;
        margin-bottom: 10px;
         text-decoration: underline;
    }

.lblpricerange {
    display: block;
    margin-bottom: 5px;
    padding-left: 5px;
    cursor: pointer;
}

    .lblpricerange:hover {
        color: #f26123;
    }



.divtoppanel {
    text-align: left;
    padding: 5px;
    background-color: #f26123;
}

    .divtoppanel select {
        font-family: Sukhumvit Set;
        width: 150px;
        height: 32px;
        margin-right: 20px;
    }
    .divtoppanel label{
        margin-right: 5px;
    }



.divbottompanel {
    text-align: center;
    margin-bottom: 10px;
    padding: 5px;
}



.checkbox-wrapper-43 input[type="checkbox"] {
    display: none;
    visibility: hidden;
}

.checkbox-wrapper-43 label {
    display: inline-block;
}

.checkbox-wrapper-43 .check {
    cursor: pointer;
    position: relative;
    margin: auto;
    width: 18px;
    height: 18px;
    -webkit-tap-highlight-color: transparent;
    transform: translate3d(0, 0, 0);
}

.checkbox-wrapper-43 .check:before {
    content: "";
    position: absolute;
    top: -15px;
    left: -15px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(34,50,84,0.03);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.checkbox-wrapper-43 .check svg {
    position: relative;
    z-index: 1;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke: #c8ccd4;
    stroke-width: 1.5;
    transform: translate3d(0, 0, 0);
    transition: all 0.2s ease;
}

.checkbox-wrapper-43 .check svg path {
    stroke-dasharray: 60;
    stroke-dashoffset: 0;
}

.checkbox-wrapper-43 .check svg polyline {
    stroke-dasharray: 22;
    stroke-dashoffset: 66;
}

.checkbox-wrapper-43 .check:hover:before {
    
}

.checkbox-wrapper-43 .check:hover svg {
    stroke: #4285f4;
}

.checkbox-wrapper-43 input[type="checkbox"]:checked + .check svg {
    stroke: #4285f4;
}

.checkbox-wrapper-43 input[type="checkbox"]:checked + .check svg path {
    stroke-dashoffset: 60;
    transition: all 0.3s linear;
}

.checkbox-wrapper-43 input[type="checkbox"]:checked + .check svg polyline {
    stroke-dashoffset: 42;
    transition: all 0.2s linear;
    transition-delay: 0.15s;
}

.checkbox-wrapper-43 label:last-child {
    margin-left: 15px;
    padding-top: 3px;
}


.selected-price {
    color: #f26123;
    font-weight: bold;
}



.label-white {
  color: white;
}

.label-white {
  color: white;
  font-weight: bold;
  margin-right: 10px;
}

.filter-controls {
  padding: 6px 10px;
  border-radius: 4px;
  border: none;
  font-size: 14px;
}

/* กล่องคำค้นหา */
.search-info {
  display: flex;
  align-items: center;
  gap: 10px;
}

.search-label {
  background-color: #ffffff;;
  color: #f26123;
  margin-left: 10px;
  /* padding: 6px 12px; */
  /* border-radius: 4px; */
   font-weight: bold; 
}

/* ปุ่มล้างค่าการค้นหา - โทนเทา */
.clear-label {
  color: #ffffff;              /* สีตัวอักษรเทาเข้ม */
  border: none;                /* ไม่มีกรอบ */
  cursor: pointer;
  font-weight: bold;
  
}

.clear-label:hover {
  color: #131212;
  text-decoration: underline;
}