.form-control { display: block; width: 100%; padding: 10px 17px; height: 40px; font-size: 13px; font-weight: 600; border-radius: 15px; color: #181c32; background-color: #ffffff; border: 1px solid #e1e3ea; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } .ant-select-selection-item { font-weight: 600 !important; font-size: 13px !important; } .form-group { margin-bottom: 25px; } .ant-select-disabled { background: #fff; border: 0; .ant-select-selector { background: #fff !important; color: #181c32 !important; } .ant-select-arrow { display: none; } } .ant-picker-disabled { background-color: #fff !important; border: 0; input { color: #181c32 !important; font-weight: 600; } } @media (prefers-reduced-motion: reduce) { .form-control { transition: none; } } .form-control[type="file"] { overflow: hidden; } .form-control[type="file"]:not(:disabled):not([readonly]) { cursor: pointer; } .form-control:focus { color: #181c32; background-color: #ffffff; border-color: var(#b5b5c3); outline: 0; /* box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.08); */ } .form-control::-webkit-date-and-time-value { height: 1.5em; } .form-control::placeholder { font-size: 14px; color: #a1a5b7; font-weight: 400; opacity: 1; } .form-control:disabled, .form-control[readonly] { background-color: #fff; border: none; opacity: 1; } /* ======== FLOATING LABEL ======== */ .floating-label-content { position: relative; width: 100%; margin-bottom: 20px; } .floating-label-content textarea { min-height: 120px; padding: 10px 20px; } .floating-label { position: absolute; left: 15px; top: 8px; font-size: 14px; font-weight: 500; padding: 0 7px; background: #fff; color: #757575; cursor: text; transition: 0.2s ease all; border-radius: 20px; } .floating-input:focus, .floating-select:focus { outline: none; } .floating-input:focus~.floating-label { top: -10px; left: 10px; font-size: 12px; } .floating-input:not(:-moz-placeholder-shown)~.floating-label { top: -10px; left: 10px; font-size: 12px; } .floating-input:not(:-ms-input-placeholder)~.floating-label { top: -10px; left: 10px; font-size: 12px; } .floating-input:not(:placeholder-shown)~.floating-label { top: -10px; left: 10px; font-size: 12px; } .floating-select:not([value=""]):valid~.floating-label { top: -10px; left: 10px; font-size: 12px; } textarea { min-height: 120px; padding: 14px 20px; } /* ======== END FLOATING LABEL ======== */ .label-form { font-size: 14px; font-weight: 400; color: #1f2233; margin-bottom: 4px; } .icon-password { cursor: pointer; position: absolute; right: 15px; color: #c1c1c1; top: 0px; font-size: 25px; border-radius: 27px; } /* INPUT IMAGE */ .image-input { position: relative; } .image-input .content-btn { display: flex; position: absolute; left: -11px; top: -10px; gap: 3px; flex-direction: column; z-index: 4; } .image-input input { display: none; } .image-input label { display: block; color: #FFF; background: #000; padding: 0.3rem 0.6rem; font-size: 115%; cursor: pointer; } .image-input label i { font-size: 125%; margin-right: 0.3rem; } .image-input label:hover i { animation: shake 0.35s; } // .ant-upload-wrapper .ant-upload { // background-size: contain !important; // width: 100% !important; // height: 200px !important; // border-radius: 20px; // border: 1px dashed #f1f1f1; // } .image-input span { display: none; text-align: center; cursor: pointer; } .image-preview{ width: 100%; height: 315px; background-size: contain; } // .ant-image-mask-info { // border-radius: 20px; // } @keyframes shake { 0% { transform: rotate(0deg); } 25% { transform: rotate(10deg); } 50% { transform: rotate(0deg); } 75% { transform: rotate(-10deg); } 100% { transform: rotate(0deg); } } /* INPUT IMAGE */ .searchInput { border-radius: 15px; padding-left: 2.6rem; background-color: #fff !important; transition: all 0.2s; border: 1px solid #0049af24; height: 40px; } .searchInput:focus { background-color: #fff !important; //width: 300px !important; transition: all 0.2s; } .icon-search { position: absolute; top: 11px; left: 13px; font-size: 18px; } .error-form { font-size: 11px; color: var(--danger); margin-top: 5px; margin-left: 22px; } .error .form-control { border: 1px solid var(--danger); } .error .floating-label { color: var(--danger); } .ant-select-selector { padding: 0 !important; } .ant-select-selection-search { left: 0 !important; }