.icon-button{align-items:center;border-radius:50%;background:rgba(var(--colors-mono-01-rgb),.75);border:.0625rem solid var(--colors-mono-01);display:flex;justify-content:center;touch-action:manipulation;transition:var(--transitions-primary);&:hover{background:rgba(var(--colors-mono-01-rgb),.9)}&[disabled]{cursor:not-allowed;.icon{opacity:.25}}&.xs{--size: 1.5rem;height:var(--size);width:var(--size);.icon{font-size:1.25rem}}&.sm{--size: 2.5rem;height:var(--size);width:var(--size)}&.md{--size: 3.75rem;height:var(--size);width:var(--size);.icon{font-size:2.5rem}}&.lg{--size: 5rem;height:var(--size);width:var(--size);.icon{font-size:3.5rem}}}.popover-content{animation:popover-content-show .16s ease-out;transform-origin:var(--kb-popover-content-transform-origin);z-index:30}.popover-arrow{fill:rgba(var(--colors-mono-01-rgb),.95)}@keyframes popover-content-show{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.date-time-picker{--date-time-picker-control-border-width: .0625rem;--date-time-picker-control-height: var(--form-control-height, 2.375rem);--date-time-picker-control-padding: .125rem;--date-time-picker-control-radius: var(--form-control-radius, var(--radius-sm));display:flex;flex-direction:column;width:min(100%,21rem);&[data-show-time]{width:min(100%,23.5rem)}.label{color:var(--colors-mono-10);font-size:.875rem;font-weight:500;line-height:1.25rem;padding-inline-start:.0625rem;user-select:none}.anchor{width:100%}.control{align-items:center;background-color:var(--colors-mono-02);border:var(--date-time-picker-control-border-width) solid var(--colors-mono-07);border-radius:var(--date-time-picker-control-radius);box-sizing:border-box;color:inherit;display:inline-flex;gap:.375rem;min-height:var(--date-time-picker-control-height);overflow:hidden;padding:var(--date-time-picker-control-padding);transition:all var(--transitions-primary);width:100%;&:hover{border-color:var(--colors-mono-09)}&:focus-within{outline:.0625rem solid var(--colors-cool-blue);outline-offset:.0625rem}&[data-invalid]{border-color:var(--colors-scarlett)}&[data-disabled]{opacity:.6}}.input{appearance:none;background:transparent;border:0;border-radius:0;box-shadow:none;color:inherit;flex:1 1 auto;font-size:1rem;line-height:1.5rem;min-width:0;outline:none;padding:.25rem .375rem .25rem .5625rem;&:hover,&:focus,&:focus-visible,&:active{appearance:none;background:transparent;border:0;box-shadow:none;outline:none}&::placeholder{color:var(--colors-mono-06)}}.trigger{align-items:center;background:transparent;border:0;border-radius:calc(var(--date-time-picker-control-radius) - var(--date-time-picker-control-padding) - var(--date-time-picker-control-border-width));box-sizing:border-box;color:var(--colors-mono-08);cursor:pointer;display:inline-flex;flex:0 0 auto;height:calc(var(--date-time-picker-control-height) - (var(--date-time-picker-control-padding) * 2) - .125rem);justify-content:center;min-width:calc(var(--date-time-picker-control-height) - (var(--date-time-picker-control-padding) * 2) - .125rem);outline:none;padding:0;touch-action:manipulation;transition:var(--transitions-primary);&:hover,&:focus-visible{background:rgba(var(--colors-mono-11-rgb),.04);color:var(--colors-cool-blue)}&[data-open]{color:var(--colors-cool-blue)}&[disabled]{cursor:not-allowed}.icon{color:inherit;font-size:1.25rem}}.hint{color:var(--colors-mono-05);font-size:.75rem;line-height:1rem;user-select:none}.error-message{color:var(--colors-scarlett);font-size:.75rem;line-height:1rem;user-select:none}}.date-time-picker-content{--date-time-picker-week-count: 6;--date-time-picker-week-row-height: 2.1rem;--date-time-picker-week-row-gap: .125rem;background:transparent;max-width:calc(100vw - 1rem);min-width:0;width:min(18rem,calc(100vw - 1rem));z-index:1302;&.with-time{width:min(20.5rem,calc(100vw - 1rem))}.panel{background-color:var(--colors-mono-02);border:1px solid var(--colors-mono-06);border-radius:.875rem;box-shadow:0 1rem 2rem -1rem #00000040,0 .5rem 1rem -.5rem #0000002e;color:var(--colors-mono-11);display:flex;flex-direction:column;gap:1rem;padding:.875rem;width:100%}.calendar{display:flex;flex-direction:column;gap:.5rem}.header{align-items:center;display:flex;justify-content:space-between}.nav{align-items:center;background:transparent;border:0;border-radius:999rem;color:var(--colors-mono-10);cursor:pointer;display:inline-flex;height:1.75rem;justify-content:center;outline:none;touch-action:manipulation;transition:var(--transitions-primary);width:1.75rem;&:hover,&:focus-visible{background:rgba(var(--colors-cool-blue-rgb),.12);color:var(--colors-cool-blue)}.icon{color:inherit;font-size:1.25rem}}.month{color:var(--colors-mono-11);font-size:.9375rem;font-weight:700;line-height:1.25rem}.weekdays{color:var(--colors-mono-07);display:grid;grid-template-columns:repeat(7,minmax(2.1rem,1fr));font-size:.8125rem;gap:.125rem;text-align:center}.weekday{padding:.25rem 0}.grid{display:flex;flex-direction:column;gap:.125rem;min-height:calc((var(--date-time-picker-week-row-height) * var(--date-time-picker-week-count)) + (var(--date-time-picker-week-row-gap) * (var(--date-time-picker-week-count) - 1)))}.week{display:grid;grid-template-columns:repeat(7,minmax(2.1rem,1fr));gap:.125rem}.day{align-items:center;background:transparent;border:0;border-radius:.625rem;color:var(--colors-mono-11);cursor:pointer;display:inline-flex;font-size:.8125rem;height:2.1rem;justify-content:center;line-height:1rem;outline:none;touch-action:manipulation;transition:var(--transitions-primary);width:100%;&:hover,&:focus-visible{background:rgba(var(--colors-cool-blue-rgb),.12);color:var(--colors-cool-blue)}&[data-selected]{background:rgba(var(--colors-cool-blue-rgb),.12);color:var(--colors-cool-blue);font-weight:600}&[data-outside-month]{color:var(--colors-mono-06)}&:disabled{color:var(--colors-mono-05);cursor:not-allowed;opacity:.55}}.time-row{align-items:stretch;display:flex;flex-wrap:nowrap;gap:.375rem}.time-select-field{flex:1 1 0;min-width:0}.time-select{min-height:2.25rem;padding-block:.25rem;padding-inline:.625rem}.time-select-field .select-trigger-icon{margin-left:.375rem}.meridiem{align-items:stretch;background:var(--colors-mono-02);border:.0625rem solid var(--colors-mono-07);border-radius:var(--radius-sm);box-sizing:border-box;display:inline-flex;flex:0 0 auto;height:2.25rem;overflow:hidden}.meridiem-option{background:transparent;border:0;color:var(--colors-mono-09);cursor:pointer;display:inline-flex;flex:0 0 auto;font-size:.8125rem;font-weight:600;justify-content:center;line-height:1.25rem;height:100%;min-width:2.625rem;outline:none;padding:.5rem .625rem;touch-action:manipulation;transition:var(--transitions-primary);+.meridiem-option{border-left:.0625rem solid var(--colors-mono-07)}&:hover,&:focus-visible{color:var(--colors-mono-11)}&[data-selected]{background:rgb(from var(--colors-cool-blue) r g b / .14);color:var(--colors-cool-blue)}}.set{background:var(--colors-cool-blue);border-color:transparent;color:var(--colors-mono-01);flex:0 0 auto;height:2.25rem;width:2.25rem;transition:var(--transitions-primary);.icon{color:var(--colors-mono-01);transition:var(--transitions-primary)}&:hover{filter:brightness(.92);.icon{color:var(--colors-mono-11)}}}}.select-content.time-select-content{z-index:1303}@media(max-width:32rem){.date-time-picker-content{width:min(18rem,calc(100vw - .75rem));&.with-time{width:min(20rem,calc(100vw - .75rem))}.panel{padding:.8125rem}}}