/* Style for the container of our date inputs */
.date-range-fields {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.date-range-fields input[type="date"] {
    flex: 1;
    min-height: calc(2.25rem + 2px); /* Match the Bootstrap input height */
    width: 100%; /* Make inputs take full width on small screens */
}

/* Placeholder styling for date inputs */
.date-range-fields input[type="date"]::placeholder {
    color: #6c757d; /* Use secondary text color */
    opacity: 1;
}

/* Hide the original input field */
#dateRangeInput {
    display: none;
}

/* Hide the calendar button since it's no longer needed with separate date inputs */
#dateRangeCalendarBtn {
    display: none !important;
}

/* Responsive styles for filters container */
#dateRangeContainer {
    flex-wrap: wrap;
}

/* Ensure dropdowns have enough space on small screens */
.dropdown.theme-dropdown {
    min-width: 0;
    width: 100%;
}
/* В шапке селектор темы не растягиваем на всю ширину — иначе меню привязано к узкой кнопке */
.header .dropdown.theme-dropdown {
    width: auto;
}