:root{--df-gap:16px;--df-small-gap:6px;--df-border-radius:.5rem;--df-padding:8px 12px;--df-border:1px solid #ccc;--df-focus-border-color:#007bff;--df-error-color:red;--df-label-color:#333;--df-description-color:#666;--df-background-color:#fff;--df-font-size:14px;--df-button-padding:8px 12px;--df-button-radius:4px;--df-button-color:#007bff;--df-button-hover-color:#0056b3;--color-gray-400:#9ca3af}.dark{--df-background-color:#1e1e1e;--df-label-color:#f5f5f5;--df-padding:8px 12px;--df-description-color:#bbb;--df-text-color:#e0e0e0;--df-border:1px solid #444;--df-border-color:#444;--df-focus-border-color:#39f;--df-error-color:#ff6b6b;--df-button-color:#39f;--df-button-hover-color:#1a73e8}.df-form-container{font-size:var(--df-font-size)}.df-form,.df-form-container{display:flex;flex-direction:column;gap:var(--df-gap);width:100%}.df-form{margin:auto}.df-field-container{display:flex;flex-direction:column;gap:var(--df-small-gap)}.df-field-wrapper{display:flex;align-items:center;gap:8px}.df-field-label-wrapper{display:flex;align-items:center;gap:4px}.df-label{font-weight:500;color:var(--df-label-color)}.df-required-label{color:var(--df-error-color);font-size:12px}.df-date,.df-email,.df-number,.df-select,.df-tel,.df-text,.df-textarea,.df-time,.df-url{width:100%;padding:var(--df-padding);border:var(--df-border);border-radius:var(--df-border-radius);outline:none;transition:border-color .2s;background:var(--df-background-color);color:var(--df-text-color)}.df-date:focus,.df-email:focus,.df-number:focus,.df-select:focus,.df-tel:focus,.df-text:focus,.df-textarea:focus,.df-time:focus .df-date,.df-url:focus{border-color:var(--df-focus-border-color)}.df-password-wrapper{display:flex;align-items:center;border:var(--df-border);border-radius:var(--df-border-radius);padding:var(--df-padding);width:100%;position:relative;background:var(--df-background-color)}.df-password{flex:1;border:none;outline:none;background:inherit;color:var(--df-text-color)}.df-password-eye-button-wrapper{color:var(--color-gray-400);background:none}.df-password-eye-button{background:none;border:none;cursor:pointer}.df-multi-select-wrapper,.df-radio-wrapper{display:flex;flex-direction:column;padding:4px;width:100%;gap:var(--df-small-gap)}.df-checkbox,.df-radio{width:16px;height:16px;accent-color:var(--df-focus-border-color)}.df-multi-select{width:16px;height:16px}.df-select-options-wrapper{position:relative;width:100%}.df-checkbox-wrapper,.df-multi-select-options-wrapper,.df-radio-options-wrapper{display:flex;flex-direction:row;align-items:center;gap:var(--df-small-gap);color:var(--df-label-color)}.df-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--df-background-color) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23666' d='M7 10l5 5 5-5z'/></svg>") no-repeat right 10px center;background-size:16px;padding-right:30px}.df-field-description{font-size:12px;color:var(--df-description-color)}.df-field-error{font-size:12px;color:var(--df-error-color)}.df-form-action-wrapper{display:flex;justify-content:space-between;gap:10px}.df-submit-button{padding:var(--df-button-padding);border:none;border-radius:var(--df-button-radius);cursor:pointer;transition:all .2s;background-color:var(--df-button-color);color:#fff;flex:1}.df-submit-button:hover{background-color:var(--df-button-hover-color)}.df-form-reset-button{color:#4b5563;font-weight:500;font-size:13px;flex:1}.disabled{cursor:not-allowed;opacity:.5}