.date-field{position:relative;display:inline-flex;min-width:0;width:50%}.date-pair .date-field>input{width:100%;padding:6px 12px;height:32px;min-height:32px;font-size:13px;line-height:19.5px;cursor:pointer}.date-field>button{position:absolute;right:5px;top:7px;width:16px;height:16px;min-height:16px;border:0;border-radius:50%;padding:0;line-height:14px;background:#fff;color:#aaa;opacity:0}.date-field:hover>button,.date-field>button:focus{opacity:1}.calendar-popup{position:fixed;z-index:180;width:280px;height:302px;background:#fff;color:#505050;border:1px solid #fff;border-radius:4px;box-shadow:0 2px 8px #00000026;font-size:16px;line-height:24px}.calendar-input-wrap{height:34px;padding:6px 10px;position:relative;border-bottom:1px solid #e8e8e8}.calendar-input-wrap .calendar-input{width:100%;height:22px;min-height:22px;border:0;border-radius:0;padding:6px 12px;font-size:13px;line-height:19.5px;outline:none}.calendar-input-wrap>button{position:absolute;right:8px;top:7px;width:20px;min-height:20px;height:20px;padding:0;background:none;border:0;color:#aaa}.calendar-header{height:40px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e8e8e8;padding:0 7px}.calendar-header button{border:0;background:none;border-radius:0;min-height:28px;height:28px;padding:0 5px;color:#999;font-size:18px}.calendar-header>span{display:flex;justify-content:center;flex:1}.calendar-header>span button{font-size:16px;color:#505050}.calendar-body{height:226px;padding:8px 12px}.calendar-body table{width:254px;height:210px;table-layout:fixed;border-collapse:collapse;font-size:16px}.calendar-body th{font-weight:400;text-align:center;height:30px;line-height:18px;font-size:12px}.calendar-body td{padding:0;text-align:center;height:30px}.calendar-body td>button{display:block;margin:auto;width:24px;height:24px;min-height:24px;border:1px solid transparent;border-radius:2px;background:none;padding:0;font-size:16px;line-height:22px;color:#505050}.calendar-body td>button.outside{color:#bfbfbf}.calendar-body td>button.today{border-color:#55ab80;color:#55ab80;font-weight:600}.calendar-body td>button.selected{background:#d1ded5;color:#55ab80}.calendar-body td>button:hover,.calendar-body td>button.cursor:focus{background:#ddebe1}.calendar-choices{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,1fr);height:210px;align-items:center}.calendar-choices>button{margin:auto;border:0;background:none;min-height:28px;height:28px;padding:0 8px;font-size:13px}.calendar-choices>button.selected,.calendar-choices>button:hover{background:#d1ded5;color:#55ab80}