.zf-component-demo{max-width:1040px;margin:32px auto;padding:0 20px;color:#172033;font:14px/1.5 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}
.zf-component-demo h1{font-size:24px;margin:0 0 6px}.zf-component-demo .sub{color:#667085;margin-bottom:24px}
.zf-demo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.zf-demo-card{background:#fff;border:1px solid #dfe4ea;border-radius:10px;padding:18px;box-shadow:0 2px 8px rgba(16,24,40,.05)}
.zf-demo-card h2{font-size:15px;margin:0 0 12px}.zf-demo-card label{display:block;font-weight:600;margin-bottom:6px}
.zf-demo-result{min-height:20px;margin-top:8px;color:#475467;font-size:12px}.zf-demo-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.zf-demo-btn{border:1px solid #cfd6df;border-radius:7px;background:#fff;padding:8px 12px;cursor:pointer}.zf-demo-btn.primary{background:#1a56a8;color:#fff;border-color:#1a56a8}
.zf-select-host{position:relative}.zf-select-clear{position:absolute;right:28px;top:50%;z-index:4;transform:translateY(-50%);border:0;background:transparent;color:#7b8794;font-size:18px;line-height:1;cursor:pointer;padding:4px}
.zf-select-host .choices{margin-bottom:0}.zf-select-host .choices__inner{min-height:38px;border:1px solid #d0d7e2;border-radius:7px;background:#fff;padding:5px 32px 3px 10px;font-size:13px}
.zf-select-host .choices.is-focused .choices__inner,.zf-select-host .choices.is-open .choices__inner{border-color:#1a56a8;box-shadow:0 0 0 2px rgba(26,86,168,.1)}
.zf-select-host .choices__list--dropdown,.zf-select-host .choices__list[aria-expanded]{z-index:30;border-color:#d0d7e2}.zf-select-host .choices__item--choice.is-highlighted{background:#edf4ff;color:#1a56a8}
.zf-select-host .choices__list--multiple .choices__item{background:#edf4ff;border-color:#bed3f2;color:#1a56a8}.zf-select-host .choices__button{border-left-color:#9cbce5}
.zf-date-input{box-sizing:border-box;width:100%;min-height:38px;border:1px solid #d0d7e2;border-radius:7px;background:#fff;padding:7px 10px;color:#172033;font:inherit}
.zf-date-input:focus{outline:0;border-color:#1a56a8;box-shadow:0 0 0 2px rgba(26,86,168,.1)}
.air-datepicker{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;--adp-accent-color:#1a56a8;--adp-cell-background-color-selected:#1a56a8;--adp-cell-background-color-selected-hover:#164887;--adp-day-name-color:#667085}
.air-datepicker-cell:focus-visible{outline:2px solid #1a56a8;outline-offset:-2px}
.zf-cascader-host{position:relative}.zf-cascader{position:relative}.zf-cascader-trigger{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;width:100%;min-height:38px;border:1px solid #d0d7e2;border-radius:7px;background:#fff;padding:7px 34px 7px 10px;color:#172033;text-align:left;font:inherit;cursor:pointer}.zf-cascader-trigger:focus{outline:0;border-color:#1a56a8;box-shadow:0 0 0 2px rgba(26,86,168,.1)}
.zf-cascader-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.zf-cascader-value.is-placeholder{color:#98a2b3}.zf-cascader-arrow{position:absolute;right:10px;color:#667085}.zf-cascader-clear{position:absolute;right:28px;top:7px;z-index:2;border:0;background:#fff;color:#7b8794;font-size:18px;line-height:24px;cursor:pointer}.zf-cascader-clear[hidden]{display:none}
.zf-cascader-panel{position:absolute;top:calc(100% + 5px);left:0;z-index:60;min-width:min(620px,calc(100vw - 32px));max-width:calc(100vw - 32px);border:1px solid #d0d7e2;border-radius:9px;background:#fff;box-shadow:0 12px 30px rgba(16,24,40,.14)}.zf-cascader-panel[hidden]{display:none}.zf-cascader-columns{display:flex;max-width:100%;overflow:auto}.zf-cascader-column{flex:1 0 180px;max-height:280px;overflow:auto;border-right:1px solid #edf0f4;padding:6px}.zf-cascader-column:last-child{border-right:0}.zf-cascader-option{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;border-radius:6px;background:transparent;padding:8px;color:#344054;text-align:left;font:inherit;cursor:pointer}.zf-cascader-option:hover,.zf-cascader-option:focus,.zf-cascader-option[aria-selected="true"]{outline:0;background:#edf4ff;color:#1a56a8}.zf-cascader-option:disabled{color:#98a2b3;cursor:not-allowed}
.zf-cascader-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #edf0f4;padding:8px 10px}.zf-cascader-path{min-width:0;overflow:hidden;color:#667085;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.zf-cascader-use{flex:0 0 auto;border:1px solid #1a56a8;border-radius:6px;background:#1a56a8;color:#fff;padding:6px 10px;cursor:pointer}.zf-cascader-use[hidden]{display:none}.zf-cascader-error{border-top:1px solid #fee4e2;padding:7px 10px;color:#b42318;font-size:12px}
@media(max-width:680px){.zf-cascader-panel{min-width:100%}.zf-cascader-column{flex-basis:150px}}
.zf-demo-modal-mask{position:fixed;inset:0;background:rgba(15,23,42,.38);display:flex;align-items:center;justify-content:center;z-index:100}.zf-demo-modal{width:min(420px,calc(100vw - 32px));background:#fff;border-radius:10px;padding:20px}.zf-demo-modal h3{margin:0 0 14px}.zf-demo-modal-ft{display:flex;justify-content:flex-end;margin-top:16px}