/* Grapes ECS Monitor - Single Panel Layout */

/* Main app styling */
Screen {
    background: $surface;
}

/* Loading screen */
LoadingScreen {
    align: center middle;
    width: 100%;
    height: 100%;
    content-align: center middle;
}

#loading-message {
    text-align: center;
    width: auto;
    height: auto;
    padding: 2 4;
    background: $panel;
    border: solid $primary;
}

/* Main container - single panel layout */
#main-container {
    height: 1fr;
    width: 100%;
}

/* Tree view widget */
TreeView {
    height: 100%;
    width: 100%;
}

#tree-title {
    height: 1;
    padding: 0 1;
    background: $primary;
    color: $text;
}

#tree-table {
    height: 1fr;
}

/* Data tables */
DataTable {
    height: 1fr;
}

DataTable > .datatable--cursor {
    background: $accent;
}

DataTable > .datatable--header {
    background: $primary-darken-2;
    text-style: bold;
}

/* Footer */
Footer {
    background: $panel;
}

/* Notification toast */
.notification {
    dock: bottom;
    layer: notification;
    width: auto;
    max-width: 50%;
    padding: 1 2;
    margin: 1;
    background: $success;
    color: $text;
}

/* Status colors */
.healthy {
    color: $success;
}

.unhealthy {
    color: $error;
}

.warning {
    color: $warning;
}

.unknown {
    color: $text-muted;
}

/* Metrics panel */
#metrics-panel {
    dock: bottom;
    height: 14;
    display: none;
    background: $panel;
    border-top: solid $primary;
    padding: 0 1;
}

#metrics-panel.visible {
    display: block;
}

#metrics-title {
    height: 1;
    background: $primary;
    padding: 0 1;
}

#charts-row {
    height: 1fr;
    width: 100%;
}

.chart-container {
    width: 1fr;
    height: 100%;
    padding: 0 1;
}

#metrics-status {
    height: 1;
    color: $text-muted;
}

/* Debug console */
#debug-console {
    dock: bottom;
    height: 14;
    display: none;
    background: $panel;
    border-top: solid $primary;
}

#debug-console.visible {
    display: block;
}

#debug-log {
    height: 1fr;
    background: $surface;
    scrollbar-gutter: stable;
}
