.input-field{flex-direction:column;margin-bottom:10px;display:flex}.input-field:last-child{margin-bottom:0}.input-field label{color:#84898c;margin-bottom:.5rem;font-weight:600}.input-field input::placeholder{color:#84898c;font-family:Sarabun,sans-serif;font-size:var(--font-h4);line-height:var(--font-h4-lh)}.input-field input,.input-field textarea{height:50px;font-family:Sarabun,sans-serif;font-size:var(--font-h4);line-height:var(--font-h4-lh);resize:none;border:none;border-radius:5px;padding:.75rem;transition:border-color .3s}.input-field input:focus,.input-field textarea:focus{font-size:var(--font-h4);line-height:var(--font-h4-lh);zoom:normal;outline:none}.input-field input:focus-visible,.input-field textarea:focus-visible{outline:none}.input-field .input-with-icon{background-color:#fff;border:none;border-radius:10px;align-items:center;height:50px;padding:10px 10px 10px 20px;display:flex;position:relative}.input-field .input-with-icon input{font-family:Sarabun,sans-serif;font-size:var(--font-h4);line-height:var(--font-h4-lh);border:none;border-radius:10px;outline:none;flex:1;padding:.75rem;transition:border-color .3s}.input-field .input-with-icon .input-icon{color:#84898c;justify-content:center;align-items:center;display:flex}.input-field .input-with-icon:focus-within .input-icon,.input-field .input-with-icon.has-value .input-icon{color:#000}.input-field .textarea-container{position:relative}.input-field .textarea-container textarea{box-sizing:border-box;width:100%;padding:12px 12px 20px}.input-field .char-count{color:#c3c6c8;font-size:14px;position:absolute;bottom:8px;right:12px}.input-field .error-message{color:#e30004;font-size:var(--font-h4);line-height:var(--font-h4-lh);text-align:right;margin-top:.5rem}.input-field.error .input-with-icon .input-icon{color:#e30004!important}.input-field.error .input-with-icon input{color:#e30004}.input-field.error .input-with-icon input::placeholder{color:#e30004!important}@media screen and (max-width:980px){.input-field .input-with-icon{padding-left:10px}.input-field .input-icon{width:30px;height:30px}}
.custom-select{cursor:pointer;width:100%;position:relative}.custom-select .select-header{font-size:var(--font-h4);line-height:var(--font-h4-lh);background-color:#fff;border:1px solid #ccc;border-radius:10px;justify-content:space-between;align-items:center;padding:10px 10px 10px 20px;display:flex}.custom-select .select-header .placeholder{color:#84898c}.custom-select .select-header .selected{color:#000}.custom-select .select-header .placeholder.open,.custom-select .select-header .selected.open{color:#e4bf45}.custom-select .select-header .arrow{color:#84898c;margin-right:10px;transition:transform .3s;transform:rotate(90deg)}.custom-select .select-header .arrow.open{color:#e4bf45;transform:rotate(-90deg)}.custom-select .select-menu{z-index:10;width:100%;max-height:200px;font-size:var(--font-h4);line-height:var(--font-h4-lh);background:#fff;border:1px solid #ccc;border-radius:10px;position:absolute;top:100%;left:0;overflow-y:auto;transform:translateY(10px);box-shadow:0 4px 10px #0000001a}.custom-select .select-menu .select-option{color:#84898c;padding:13px 20px 14px}.custom-select .select-menu .select-option:hover{color:#ad5d5d;background-color:#0000;font-weight:600}
