.report-period[type=button] { color: #e8eaf6; font: inherit; font-size: 13px; cursor: pointer; text-align: left; }
.report-period[type=button]:hover { border-color: #7560ea; background: #252a49; }
.report-period[type=button]:focus-visible { outline: 2px solid #b9acff; outline-offset: 3px; }
.date-range-dialog { width: min(448px,calc(100% - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 24px; margin: auto; border: 1px solid #363e60; border-radius: 24px; background: #151a2e; color: #e8eaf6; box-shadow: 0 24px 80px #0007; }
.date-range-dialog[open] { display: grid; gap: 16px; }
.date-range-dialog::backdrop { background: #050713ba; backdrop-filter: blur(4px); }
.date-range-dialog button { font-family: inherit; }
.date-range-header { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.date-range-header h2 { margin: 0; font-size: 22px; font-weight: 500; }
.date-range-header .btn { padding: 8px 10px; font-size: 12px; min-height: 40px; }
.date-range-help { margin: 0; color: #9aa3c7; font-size: 12px; line-height: 1.6; }
.date-range-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.date-range-fields label { display: grid; gap: 8px; min-width: 0; font-size: 13px; }
.date-range-fields input { box-sizing: border-box; min-width: 0; width: 100%; padding: 10px; height: 44px; border: 1px solid #343c5c; border-radius: 10px; background: #101424; color: #e8eaf6; color-scheme: dark; font: inherit; font-size: 13px; }
.date-range-fields input:focus-visible { outline: 2px solid #b9acff; outline-offset: 2px; }
.calendar-navigation { display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; gap: 8px; }
.calendar-navigation h3 { margin: 0; text-align: center; font-size: 16px; font-weight: 500; text-transform: capitalize; }
.calendar-navigation .btn { padding: 0; min-height: 40px; font-size: 20px; }
.calendar-weekdays,.calendar-days { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 4px; }
.calendar-weekdays { color: #9aa3c7; font-size: 12px; text-align: center; }
.calendar-day { box-sizing: border-box; min-width: 0; height: 40px; padding: 0; border: 1px solid transparent; border-radius: 8px; background: transparent; color: #e8eaf6; cursor: pointer; font-size: 14px; }
.calendar-day.other-month { color: #818baa; }
.calendar-day:hover { border-color: #b9acff; background: #292a4b; }
.calendar-day.in-range { background: #322951; color: #e8eaf6; }
.calendar-day.range-start,.calendar-day.range-end { background: #7560ea; color: #fff; }
.calendar-day[aria-current=date] { border-color: #7560ea; }
.calendar-day:disabled { color: #535d7b; cursor: not-allowed; background: transparent; border-color: transparent; }
.calendar-day:focus-visible { outline: 2px solid #b9acff; outline-offset: 1px; }
.date-range-selection { color: #b9acff; font-size: 13px; line-height: 1.5; margin: 0; }
.date-range-error { color: #f4a4b7; font-size: 12px; line-height: 1.5; margin: 0; }
.date-range-error:empty { display: none; }
.date-range-actions { display: flex; justify-content: space-between; gap: 12px; padding-top: 8px; border-top: 1px solid #2b3353; }
.date-range-actions .btn { min-height: 44px; padding: 10px 14px; font-size: 13px; }
@media(max-width:359px) { .date-range-dialog { padding: 16px; border-radius: 16px; } .date-range-actions { flex-direction: column; } .date-range-fields { gap: 8px; } .calendar-days { gap: 2px; } .calendar-day { height: 38px; } }