.primary-form {}
.primary-form .form-control {background:none; border-bottom:1px solid #444; padding-left:0; padding-right:0}
.primary-form label {padding-left:0;}
.primary-form .form-control:focus ~ label, .primary-form .form-floating>.form-control:not(:placeholder-shown)~label {left:-3px}
.primary-form textarea.form-control {height: auto;}
.primary-form .form-control:focus {border-color:var(--main-color); border-width:2px}
.primary-form .cta-btn a:hover .cta-ico:before {transform: scale(6);}
.primary-form .form-check {padding-left: 1.75em;cursor: pointer;}
.primary-form .form-check-label {cursor: pointer;}
.primary-form .form-check .form-check-input {margin-top: 3px;margin-left: -1.75em;width: 1.2em;height: 1.2em;border-radius: 2px;}
.form-check-input:focus, .form-control:focus, .form-select:focus {box-shadow:none}
.form-check-input:checked {background-color:var(--main-color); border-color: var(--main-color)}


.search-input {background-color: #f2f2f2;border-radius: 3px;height: 48px;}
.search-input input, .search-input input:focus, .search-input .input-group-text, .select-input .input-group-text {background: none; font-size: 14px;}
.select-input {position:relative}
.select-input {border: 1px solid #ced4da; border-radius: 3px;}
.select-input select {border: none;height: 46px;background-color: transparent;font-size: 14px;cursor: pointer;}
.select-input .input-group-text + select {margin-left: -44px !important; padding-left: 40px;}
.select-input i, .search-input i {font-size:20px}


.floating-label {border-bottom: 1px solid #edebeb;padding: 12px 0 1px;}
.floating-label .form-floating .form-select {font-size:14px;background-position: right .75rem top .75rem;}
.floating-label .form-floating label {font-size:13px}
.floating-label .btn-circle, .sec-search .btn-circle.btn-toggle {background:var(--main-color);padding:0;color:#fff;font-size: 20px;border-radius:50%;height: 40px;width: 40px;display: flex;justify-content: center;align-items: center;margin-top: 6px;margin-left: auto;}
.floating-label .form-control {height:48px}

option:hover,
option:focus,
option:active,
option:checked {background-color: var(--main-color) !important; color: #fff;}

.datepicker {position: relative;}
.datepicker i {pointer-events: none;} 
.datepicker img {position:absolute; width:20px; right:8px; top:8px}
input[type="date"]::-webkit-calendar-picker-indicator {
    background: transparent;
    bottom: 0;
    color: transparent;
    cursor: pointer;
    height: auto;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: auto;
}

.form-switch {display:flex;justify-content: space-between;padding: 0;margin-bottom: 1rem;align-items: center;}
.form-switch label {flex:1}
.form-switch .form-check-input {width: 2.8em;height: 1.6em;}

.sec-fiter-search.floating-label .search-input input {padding-left: 0;}

.form-control {border-radius:.25rem;height: auto;}

.search-input .dropdown-menu {left:0 !important; right: 0 !important;padding: 12px;box-shadow: 0 2px 8px rgb(0 0 0 / 22%);transform: none !important;top: 100% !important;border: none;}
.search-input .dropdown-menu li, .search-input .dropdown-menu a {display: block;}
.search-input .dropdown-menu a {display: block; color:#444; padding: 12px 12px 14px;font-size: 14px;-webkit-text-stroke-width: 0.12px;margin: 0 -12px;}
.search-input .dropdown-menu a:hover {background-color: #0a5597; color: #fff;}

.search-input .dropdown-menu input {border: 1px solid #8b8b8b;margin-bottom: 8px;padding-left: 12px !important;height: 44px;}
.search-input .dropdown-menu input:focus {border-color:var(--main-color)}

.home_search .select2-container {
    background-color: #fff;
    border-radius: 3px;
    height: 32px;
    width: 100% !important;
}

.home_search .select2-container--default .select2-selection--single .select2-selection__arrow {
    right: 17px !important;
}

.home_search .select2-container.select2-container--default.select2-container--open {
    margin-top: 0px !important;
}

.home_search .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-top: 5px;
}

.select2 {/* padding-top: 1.625rem; */}
.select2 .select2-selection {border: none !important;background: none !important;}
.select2-container--default .select2-selection--single .select2-selection__rendered {padding-left: 12px !important; color: #212529!important; line-height: 1.35rem !important;font-size: 14px !important;padding-top: 1.625rem;}
.select2-results__option {display:block}
.select2-container--default .select2-results__option::first-child {background-color: #ddd !important;}
.select2-container.select2-container--default.select2-container--open {margin-top: 2px; z-index: 10000;}
.select2-container--open .select2-dropdown--below {box-shadow: 0 2px 8px rgb(0 0 0 / 22%); border-radius: 5px !important; font-size:14px;border-top: 1px solid #aaa !important;}

.select2-container--default .select2-selection--single .select2-selection__arrow b {font-family: 'icomoon' !important; font-style: normal; border: none !important; font-size: 22px;color: #555;top: 8px !important;}
.select2-container--default .select2-selection--single .select2-selection__arrow b::before {content: "\e903";}
.select2-search--dropdown .select2-search__field {outline-offset: unset; box-shadow: none; outline-width: 0;}
.select2-container--default .select2-selection--single .select2-selection__placeholder{ color: #212529 !important; }
.form-floating .select2-container.select2-container--default.select2-container--open {margin-top: 0px;}

@media (min-width: 992px) {
    .multi-form .col-lg-1 {width: 13.8888889%;}

    .floating-label .col-lg-1 {width: 5%;padding: 0;}
    .floating-label .col-lg-2 {width: 14%;}

    .floating-label .row > div {position:relative;}
    .floating-label .row > div:nth-of-type(n+2)::after {position:absolute; content:''; top:12px; bottom:12px; right:0; width:1px; background:#edebeb}
    .floating-label .row > div:nth-last-of-type(-n+2)::after {display:none}

    .floating-label .form-floating .form-select {border: none;}
}


@media (max-width: 820px) {
    .sec-fiter-search.floating-label div[data-bs-toggle=button], .sec-search div[data-bs-toggle=button] {display:block !important}
    .sec-fiter-search .row > *, .sec-search .row > * {margin-top: 0;margin-bottom: .6rem;width: 100%;}
    .sec-fiter-search .row .row {margin-top: 0}
    
    .floating-label .btn-circle, .sec-search .btn-circle.btn-toggle {border-radius:.25rem; width:100%}
    .floating-label .btn-circle i {display:none}
    .floating-label .btn-circle::after, .sec-search .btn-circle.btn-toggle::after {content:'Tìm kiếm sản phẩm' !important; font-size:16px; margin-left:8px}

    .floating-label form .btn-circle {padding:0;background: var(--main-color) !important;color: #fff;text-align: center;flex-direction: initial;justify-content: center;margin-top: 40px;}
    .floating-label .select2-container--default .select2-selection--single .select2-selection__rendered {border: 1px solid #ced4da;border-radius: 0.25rem;padding-bottom: 0.625rem;}
    .select2-container--default .select2-selection--single .select2-selection__arrow b {left: 0 !important;margin-left: -10px !important;}
    

    .form-switch .form-check-input:focus {border-color: rgba(0,0,0,.25);}
    .sec-search .sec-search-wrap {padding: 6px 12px 12px !important;min-height: 64px;}
    .sec-fiter-search {padding-bottom:1rem; margin-top: 0; min-height: 75px;}
    .sec-fiter-search form, .sec-search form {position: fixed;top:0;bottom:0;left:0;right:0;background:#fff;z-index: 9999;padding: 72px 20px 20px;transition: all .3s;transform: translateX(100%);opacity: 0;height: 100vh;overflow-y: auto;flex-direction: column;}
    
    .sec-fiter-search .active .btn-toggle, .sec-search .active .btn-toggle {position: fixed;top:0;right: 5px;width: 48px;height:48px;display: flex;align-items: center;justify-content: center;z-index: 10000;background: none !important;border: none;}
    .sec-fiter-search .active .btn-toggle span, .sec-search .active .btn-toggle span {display:none !important}
    .sec-fiter-search .active .btn-toggle::before, .sec-fiter-search .active .btn-toggle::after, .sec-search .active .btn-toggle::before, .sec-search .active .btn-toggle::after {height: 2.4px;width: 48%;background: #aeaeae;content:'';transform:rotate(45deg);position:absolute;border-radius: 8px;}
    .sec-fiter-search .active .btn-toggle::after, .sec-search .active .btn-toggle::after {content:'' !important;transform:rotate(-45deg);margin-left: 0;}
    .sec-fiter-search .active ~ form, .sec-search .active ~ form {opacity: 1; transform: translateX(0%)}
    .select2-m {
        margin-bottom: 40px !important;
    }

    .home_search .select2-container--default .select2-selection--single .select2-selection__arrow { right: 1px !important; }
    .home_search .select2-container { height: 39px; width: 100% !important; }
    .home_search .select2-container--default .select2-selection--single .select2-selection__rendered { padding-top: 7px; }
}

