ktransformers/kt-kernel/python/cli/tui/styles/config.tcss

/* Configuration Screens Styles */

/* QuantConfigScreen */
QuantConfigScreen {
    align: center middle;
}

#quant-dialog {
    width: 80;
    height: auto;
    background: $surface;
    border: heavy $primary;
    padding: 1 2;
}

#quant-params {
    width: 100%;
    height: auto;
}

#quant-params > Label {
    height: 1;
}

#quant-params > Horizontal {
    height: 3;
    margin-bottom: 0;
}

#quant-params > Input {
    height: 3;
    margin-bottom: 0;
}

#quant-params > Checkbox {
    height: 3;
    margin: 1 0;
}

#quant-buttons {
    width: 100%;
    height: 3;
    align: center middle;
    layout: horizontal;
    margin-top: 1;
}

#quant-buttons > Button {
    min-width: 20;
    margin: 0 1;
}

/* RunConfigScreen */
RunConfigScreen {
    align: center middle;
}

#run-dialog {
    width: 100;
    height: auto;
    max-height: 90%;
    background: $surface;
    border: heavy $primary;
    padding: 1 2;
}

#run-content {
    width: 100%;
    height: auto;
    max-height: 30;
    overflow-y: auto;
    padding: 0;
    margin-bottom: 1;
}

#run-params {
    width: 100%;
    height: auto;
}

#run-params > Label {
    height: 1;
    margin: 0;
}

#run-params > Horizontal {
    height: 3;
    margin: 0;
}

#run-params > Input {
    height: 3;
    margin: 0 0 1 0;
}

#run-params > Select {
    height: 3;
    margin: 0 0 1 0;
}

#run-params > ScrollableContainer {
    margin: 0 0 1 0;
}

#run-buttons {
    width: 100%;
    height: auto;
    align: center middle;
    layout: horizontal;
    margin-top: 1;
    padding: 1 0;
}

#run-buttons > Button {
    min-width: 15;
    margin: 0 1;
}

/* GPU Selection Container */
#gpu-selection {
    width: 100%;
    height: auto;
    max-height: 8;
    border: solid $primary;
    padding: 0;
    margin-bottom: 1;
}

#gpu-selection Button {
    width: 100%;
    height: 1;
    min-height: 1;
    max-height: 1;
    margin: 0;
    padding: 0 1;
    text-align: left;
    border: none;
    content-align: left middle;
}

.gpu-item {
    width: 100%;
    height: 1;
    min-height: 1;
    max-height: 1;
    margin: 0;
    padding: 0 1;
    text-align: left;
    border: none;
}

.gpu-item-selected {
    background: $success;
    color: $text;
    text-style: bold;
    border-left: thick $success-lighten-2;
}

.gpu-item-unselected {
    background: $surface;
    color: $text-muted;
    text-style: none;
    border-left: thick $panel;
}

/* CPU Model List Container */
#cpu-model-list {
    width: 100%;
    height: auto;
    max-height: 6;
    border: solid $primary;
    padding: 0;
    margin-bottom: 1;
}

#cpu-model-list Button {
    width: 100%;
    height: 1;
    min-height: 1;
    max-height: 1;
    margin: 0;
    padding: 0 1;
    text-align: left;
    border: none;
    content-align: left middle;
    background: $surface;
    color: $text;
}

.cpu-model-item {
    width: 100%;
    height: 1;
    min-height: 1;
    max-height: 1;
    margin: 0;
    padding: 0 1;
    text-align: left;
    border: none;
    background: $surface;
    color: $text;
}

.cpu-model-linked {
    background: $accent-darken-1;
    color: $text;
    text-style: bold;
}

/* Selected state - higher priority */
Button.cpu-model-selected {
    background: $primary !important;
    color: $text !important;
    text-style: bold !important;
    border-left: thick $primary-lighten-2 !important;
}

/* VRAM Display */
#vram-display {
    width: 100%;
    height: auto;
    max-height: 10;
    padding: 1;
    margin-top: 0;
    margin-bottom: 0;
    border: solid $accent;
    background: $surface-darken-1;
    overflow-y: auto;
}