/* Shared filter system: one visual contract for Django list and dashboard screens. */
[data-filter-panel] {
  border: 1px solid #dbe4ef;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
}

[data-filter-panel] form {
  align-items: end;
}

[data-filter-panel] label {
  display: block;
  margin-bottom: 6px;
  color: #334155;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.25rem;
}

[data-filter-panel] input:not([type='hidden']),
[data-filter-panel] select,
[data-filter-panel] textarea,
[data-filter-panel] [data-filter-control],
[data-filter-panel] [data-week-trigger],
[data-filter-panel] [data-dashboard-category-toggle],
[data-filter-panel] [data-dashboard-subcategory-toggle] {
  min-height: 40px;
  border: 1px solid #dbe4ef;
  border-radius: 9px;
  background: #fff;
  color: #1e293b;
  box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
  transition: border-color 150ms ease, box-shadow 150ms ease, background-color 150ms ease;
}

[data-filter-panel] input:not([type='hidden']),
[data-filter-panel] select,
[data-filter-panel] textarea {
  padding: 9px 12px;
}

[data-filter-panel] input:not([type='hidden']):focus,
[data-filter-panel] select:focus,
[data-filter-panel] textarea:focus,
[data-filter-panel] [data-filter-control]:focus,
[data-filter-panel] [data-week-trigger]:focus,
[data-filter-panel] [data-dashboard-category-toggle]:focus,
[data-filter-panel] [data-dashboard-subcategory-toggle]:focus {
  border-color: #0d9488;
  box-shadow: 0 0 0 3px rgb(20 184 166 / 0.14);
  outline: 0;
}

[data-filter-panel] input::placeholder,
[data-filter-panel] textarea::placeholder {
  color: #94a3b8;
}

[data-filter-panel] p,
[data-filter-panel] .filter-help {
  color: #64748b;
  font-size: 0.75rem;
  line-height: 1rem;
}

[data-filter-panel] .filter-actions,
[data-filter-panel] form > .col-span-full:last-child,
[data-filter-panel] form > .filter-actions:last-child {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 4px;
  padding-top: 16px;
  border-top: 1px solid #e2e8f0;
}

[data-filter-panel] .filter-actions a,
[data-filter-panel] .filter-actions button,
[data-filter-panel] form > .col-span-full:last-child a,
[data-filter-panel] form > .col-span-full:last-child button {
  min-height: 40px;
}

[data-filter-panel] [data-week-menu],
[data-filter-panel] [data-dashboard-category-menu],
[data-filter-panel] [data-dashboard-subcategory-menu] {
  border-color: #dbe4ef;
  border-radius: 9px;
  box-shadow: 0 10px 24px rgb(15 23 42 / 0.12);
}

html.dark [data-filter-panel] {
  border-color: #3f3f46;
  background: #18181b;
}

html.dark [data-filter-panel] label { color: #e4e4e7; }

html.dark [data-filter-panel] input:not([type='hidden']),
html.dark [data-filter-panel] select,
html.dark [data-filter-panel] textarea,
html.dark [data-filter-panel] [data-filter-control],
html.dark [data-filter-panel] [data-week-trigger],
html.dark [data-filter-panel] [data-dashboard-category-toggle],
html.dark [data-filter-panel] [data-dashboard-subcategory-toggle] {
  border-color: #52525b;
  background: #09090b;
  color: #f4f4f5;
}

html.dark [data-filter-panel] .filter-actions,
html.dark [data-filter-panel] form > .col-span-full:last-child { border-color: #3f3f46; }

@media (max-width: 639px) {
  [data-filter-panel] .filter-actions,
  [data-filter-panel] form > .col-span-full:last-child { flex-direction: column-reverse; }
  [data-filter-panel] .filter-actions a,
  [data-filter-panel] .filter-actions button,
  [data-filter-panel] form > .col-span-full:last-child a,
  [data-filter-panel] form > .col-span-full:last-child button { width: 100%; }
}
