/* nhatdx-ss-styles */

        .nx-ss { position: relative; display: block; }
        .nx-ss > select.nx-ss-native {
            position: absolute !important; opacity: 0 !important; pointer-events: none !important;
            width: 1px !important; height: 1px !important; padding: 0 !important; margin: 0 !important;
            border: 0 !important; overflow: hidden; clip: rect(0 0 0 0);
        }

        .nx-ss-input {
            width: 100% !important; box-sizing: border-box; cursor: pointer;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C67930' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
            background-repeat: no-repeat !important; background-position: right 12px center !important;
            background-size: 15px !important; padding-right: 38px !important;
        }
        /* Theme dùng kiểu nhãn nổi: khi ô có giá trị nó chừa khoảng trên cho nhãn (đệm trên ~16px, dưới ~7px)
           làm chữ tụt xuống. Nhãn ở đây nằm ngoài ô nên cân đệm trên dưới cho chữ nằm giữa. */
        .nx-ss .nx-ss-input, .fl-wrap .nx-ss-input, .fl-is-active .nx-ss-input {
            padding-top: 0 !important; padding-bottom: 0 !important; line-height: normal !important;
            text-overflow: ellipsis; white-space: nowrap; overflow: hidden;
        }
        /* Trang thanh toán: cùng cỡ chữ, chiều cao với các ô nhập bên cạnh cho thẳng hàng */
        form.checkout .nx-ss-input { font-size: 14px !important; height: 44px !important; min-height: 44px !important; }
        .nx-ss.is-open .nx-ss-input {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C67930' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.2-3.2'/%3E%3C/svg%3E") !important;
        }

        .nx-ss-panel {
            position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 999;
            max-height: 264px; overflow-y: auto; padding: 6px;
            background: #fff; border: 1px solid #EAE4DD; border-radius: 12px;
            box-shadow: 0 14px 36px rgba(35, 27, 21, .16);
            display: none; -webkit-overflow-scrolling: touch;
        }
        .nx-ss.is-open .nx-ss-panel { display: block; }

        .nx-ss-item {
            display: block; padding: 10px 12px; border-radius: 8px; cursor: pointer;
            font-family: var(--nx-font, Tahoma, Verdana, sans-serif); font-size: 14px; line-height: 1.5; color: #342A22;
        }
        .nx-ss-item:hover, .nx-ss-item.is-active { background: #FBF8F4; color: #C67930; }
        .nx-ss-item.is-chosen { font-weight: 700; color: #C67930; }
        .nx-ss-item mark { background: #fff3bf; color: inherit; padding: 0; border-radius: 2px; }
        .nx-ss-empty {
            padding: 14px 12px; text-align: center;
            font-family: var(--nx-font, Tahoma, Verdana, sans-serif); font-size: 13.5px; color: #A5988A;
        }

        @media (max-width: 600px) {
            .nx-ss-panel { max-height: 220px; }
            .nx-ss-item { padding: 11px 12px; font-size: 13.5px; }
        }

