/* captcha.css */
/*.cpt-idn-captcha-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
}*/
.cpt-idn-captcha-wrap {
    display: flex;
    flex-wrap: nowrap; /* luôn nằm trên 1 dòng */
    justify-content: center; /* căn giữa theo chiều ngang */
    align-items: center; /* căn giữa theo chiều dọc */
    gap: 8px; /* khoảng cách giữa các phần tử */
    width: 100%; /* fit theo container */
    overflow: hidden; /* tránh tràn */
    box-sizing: border-box;
}

.cpt-idn-captcha-canvas {
    width: 130px;
    height: 50px;
    border-radius: 6px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    cursor: pointer;
}

.cpt-idn-refresh-icon {
    width: 20px;
    height: 20px;
    cursor: pointer;
    opacity: 0.7;
    transition: 0.2s;
}

    .cpt-idn-refresh-icon:hover {
        opacity: 1;
        transform: rotate(30deg);
    }

.cpt-idn-input {
    padding: 6px 8px;
    /*width: 100px;*/
    margin-top: 8px;
    flex: 1; /* để input tự co giãn */
    min-width: 80px; /* tránh quá nhỏ */
}

flex: 1; /* để input tự co giãn */
min-width: 80px; /* tránh quá nhỏ */
.cpt-idn-msg {
    margin-top: 10px;
    font-weight: bold;
}

/* Chrome, Safari, Opera */
#captchaInput::-webkit-input-placeholder {
    color: #555; /* màu chữ */
    font-style: italic; /* kiểu chữ */
    font-weight: bold; /* độ đậm */
    font-size: 10px; /* kích thước */
}

/* Firefox 19+ */
#captchaInput::-moz-placeholder {
    color: #555;
    font-style: italic;
    font-weight: bold;
    font-size: 10px;
}

/* IE 10+ */
#captchaInput:-ms-input-placeholder {
    color: #555;
    font-style: italic;
    font-weight: bold;
    font-size: 10px;
}

/* Edge */
#captchaInput::-ms-input-placeholder {
    color: #555;
    font-style: italic;
    font-weight: bold;
    font-size: 10px;
}

/* Firefox 18- */
#captchaInput:-moz-placeholder {
    color: #555;
    font-style: italic;
    font-weight: bold;
    font-size: 10px;
}