@import url("/kitchen-theme-base.css");

/* Match the Web Dark Mode palette for monitor side panels and dialogs. */
:root{
 --ui-panel:#101828;--ui-subtle:#1a2231;--ui-hover:#1d2939;
 --ui-heading:#f2f4f7;--ui-text:#d0d5dd;--ui-muted:#98a2b3;
 --ui-border-strong:#475467;--ui-accent:#7592ff;--ui-brand-tint:#465fff1f;
 --ui-warning:#fec84b;--ui-warning-tint:#b5470826;
 --ui-danger:#fda29b;--ui-error-tint:#b4231826
}

#right,dialog{color-scheme:dark}
.side-pane,#todos-panel{background:var(--ui-panel);color:var(--ui-text)}
.pane-title,#todos-panel .pane-title,.history-topbar{background:var(--ui-hover);color:var(--ui-heading)}
.group-title,.history-heading,.history-event-action{color:var(--ui-heading)}
.pane-count,.pane-placeholder-label,.todo-placeholder,.todo-entry small,#todo-category,
.history-line-time,.history-event-time,.history-event-source,.history-empty,.history-loading{color:var(--ui-muted)}
#ingredients,#todo-list{scrollbar-color:var(--ui-border-strong) var(--ui-panel)}
.summary-item,.history-line,.history-event{background:var(--ui-subtle);color:var(--ui-text)}
.summary-item.strong{background:var(--ui-warning);color:var(--ui-panel)}
.summary-item.soft{background:var(--ui-warning-tint);color:var(--ui-warning)}

.monitor-dialog,#tag-dialog{background:var(--ui-panel);color:var(--ui-text);border-color:var(--ui-border-strong)}
.history-context{color:var(--ui-text)}
.history-event:nth-of-type(even){background:var(--ui-hover)}
#detail-status,.history-error,#todo-error{color:var(--ui-danger)}
#todos-panel :is(.todo-entry,#todo-more),
dialog :is(.settings-actions button,.stamp-choice,#tag-choices .order-tag,#tag-form button,
 #monitor-location,#tag-label,#todo-answer){
 background:var(--ui-subtle);color:var(--ui-text);border-color:var(--ui-border-strong)
}
#todos-panel :is(.todo-entry,#todo-more):hover:enabled,
dialog :is(.settings-actions button,.stamp-choice,#tag-choices .order-tag,#tag-form button):hover:enabled{
 background:var(--ui-hover);color:var(--ui-heading)
}
#todos-panel :focus-visible,dialog :focus-visible{outline-color:var(--ui-accent)}
.dialog-close{color:var(--ui-muted)}
.dialog-close:hover:enabled{background:var(--ui-subtle);color:var(--ui-heading);border-color:var(--ui-border-strong)}
.todo-entry-done .todo-entry-title{color:var(--ui-muted)}
#tag-choices .order-tag[aria-pressed="true"]{background:var(--ui-brand-tint);color:var(--ui-accent)}
dialog .stamp-choice[aria-current="true"]{border-color:var(--ui-accent)}

#order-details-card .order{background:var(--ui-panel)}
#order-details-card .order-header{background:var(--ui-hover);color:var(--ui-heading)}
#order-details-card .order-header.done{color:var(--ui-text)}
#order-details-card .order-extra small{color:var(--ui-muted)}
#order-details-card .order-line{background:var(--ui-subtle);color:var(--ui-text)}
#order-details-card .order-line.done{background:var(--ui-panel);color:var(--ui-muted);text-decoration-color:var(--ui-muted)}
#order-details-card .order-line.changed{background:var(--ui-warning-tint);color:var(--ui-warning);box-shadow:inset 9px 0 var(--ui-warning)}
#order-details-card .line-discount{background:var(--ui-hover);color:var(--ui-text)}
#order-details-card .order-line.unmapped:not(.done),#order-details-card .order-line.unmapped.done{color:var(--ui-danger)}
#order-details-card :is(.order.cancelled .order-header,.order.cancelled .order-line,.order-line.refunded,.refund-label){
 background:var(--ui-error-tint);color:var(--ui-danger)
}