/* SignalPi UI-Akzente. Pico macht das meiste; hier nur Statusfarben + Flash. */

.signal-buy, .pnl-pos { color: var(--pico-color-green-600); font-weight: 600; }
.signal-sell, .pnl-neg { color: var(--pico-color-red-600); font-weight: 600; }
.signal-hold { color: var(--pico-color-grey-500); }

.status-filled { color: var(--pico-color-green-600); }
.status-rejected, .status-cancelled { color: var(--pico-color-grey-500); }
.status-created, .status-accepted { color: var(--pico-color-orange-600); }

.badge {
    display: inline-block;
    padding: .15rem .55rem;
    border-radius: .75rem;
    font-size: .75rem;
    font-weight: 600;
    margin-left: .5rem;
    vertical-align: middle;
}
.badge-active { background: var(--pico-color-green-100); color: var(--pico-color-green-700); }
.badge-paused { background: var(--pico-color-red-100); color: var(--pico-color-red-700); }

.flash { padding: .75rem 1rem; border-radius: .4rem; margin-bottom: 1rem; }
.flash-ok    { background: var(--pico-color-green-50);   border-left: 4px solid var(--pico-color-green-600); }
.flash-info  { background: var(--pico-color-blue-50);    border-left: 4px solid var(--pico-color-blue-600); }
.flash-error { background: var(--pico-color-red-50);     border-left: 4px solid var(--pico-color-red-600); }

.pagination { display: flex; gap: 1rem; align-items: center; margin-top: 1rem; }
.pagination span { color: var(--pico-color-grey-500); }

.error { color: var(--pico-color-red-700); }

.htmx-indicator { display: none; color: var(--pico-color-grey-500); }
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator { display: inline; }

.chart-container { width: 100%; height: 520px; }