.dual-date{position:relative;width:100%}
.dual-date-field{display:flex;width:100%;position:relative}
.dual-date-field>input{width:100%;padding-inline-end:3.25rem!important}
.dual-date-field>button{position:absolute;inset-inline-end:.4rem;top:50%;transform:translateY(-50%);width:2.45rem;height:2.45rem;border:0;background:transparent;color:#f8c94e;display:grid;place-items:center;cursor:pointer;padding:0}
.dual-date-field>button:hover{background:#123c5c;border-radius:.65rem}
.dual-date-field>button svg{width:1.35rem;height:1.35rem}
.dual-date-help{display:block;margin-top:.38rem;color:#8fb5cf;font-size:.78rem;line-height:1.45}
.dual-date-popover{position:fixed;z-index:2147483647;display:block;box-sizing:border-box;contain:layout paint;width:20rem!important;min-width:17.5rem!important;max-width:calc(100vw - 1.5rem)!important;max-height:calc(100vh - 1.5rem)!important;overflow:auto!important;padding:.8rem;border:1px solid #315a76;border-radius:1rem;background:#071c32;box-shadow:0 18px 55px #0009;color:#eaf5ff}
.dual-date-popover *{box-sizing:border-box}.dual-date-popover button{position:static;float:none;transform:none;max-width:none;font-family:inherit}
.dual-date-popover[hidden]{display:none!important}
.dual-date-modes{display:grid;grid-template-columns:1fr 1fr;background:#0b2944;border-radius:.7rem;padding:.2rem;margin-bottom:.75rem}
.dual-date-modes button{border:0;border-radius:.55rem;background:transparent;color:#9fc3df;padding:.55rem;cursor:pointer;font:inherit}
.dual-date-modes button.active{background:#f6c84f;color:#06172a;font-weight:800}
.dual-date-popover header{display:flex;align-items:center;justify-content:space-between;margin:.25rem 0 .65rem}
.dual-date-popover header button{border:1px solid #254a66;border-radius:.55rem;background:#0b2944;color:#ddecf7;width:2.1rem;height:2.1rem;display:grid;place-items:center;cursor:pointer;font:inherit;font-size:1.35rem}
.dual-date-popover header .dual-date-year-title{width:auto;height:auto;min-width:10rem;padding:.45rem .7rem;border-color:transparent;background:transparent;font:inherit;font-weight:800}
.dual-date-popover header .dual-date-year-title:hover{border-color:#315a76;background:#0b2944}
.dual-date-weekdays,.dual-date-days{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:.2rem;text-align:center}
.dual-date-weekdays span{font-size:.78rem;color:#78a5c5;padding:.25rem}
.dual-date-days button{box-sizing:border-box!important;position:static!important;float:none!important;width:auto!important;min-width:0!important;max-width:none!important;height:2.15rem!important;min-height:2.15rem!important;margin:0!important;aspect-ratio:auto!important;border:0;border-radius:.55rem;background:transparent;color:#eaf5ff;display:grid!important;place-items:center;cursor:pointer;font:inherit;padding:0!important}
.dual-date-days button:hover{background:#17476b}
.dual-date-days button.today{outline:1px solid #f6c84f;color:#ffd967;font-weight:800}
.dual-date-years{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem;min-height:13rem;align-content:center}
.dual-date-years button{border:1px solid #254a66;border-radius:.65rem;background:#0b2944;color:#eaf5ff;padding:.75rem .3rem;cursor:pointer;font-weight:700;font-family:inherit}
.dual-date-years button:hover{border-color:#50bde8;background:#123c5c}
.dual-date-years button.selected{border-color:#f6c84f;background:#f6c84f;color:#06172a}
.dual-date-today{margin-top:.65rem;border:0;background:transparent;color:#ffd15a;cursor:pointer;font:inherit}
.dual-date-gregorian{display:grid;gap:.5rem;padding:.5rem}
.dual-date-gregorian input{color-scheme:dark;width:100%}
.dual-date-gregorian small{color:#8fb5cf}
html[dir="rtl"] .dual-date-popover{direction:rtl}
@media(max-width:520px){.dual-date-popover{max-width:calc(100vw - 1.5rem)}.dual-date-years{min-height:11rem}}