
/* GitDiffViewer CSS - GitKraken-like Design */

Screen {
    background: transparent;
    color: $text;
}

/* Logo styling */
AnimatedLogo .logo-text {
    text-style: bold;
    color: #bb9af7;
    text-align: center;
    margin: 0 0;
}

Header {
    color: $text;
    background: transparent;
    text-style: bold;
}

.panel-header, #diff-header {
    text-align: center;
    padding: 0 1;
    background: transparent;
    color: $text;
    text-style: bold;
    border-bottom: solid #6c7086;
    max-height: 2;
}

#sidebar {
    width: 20%;
    height: 1fr;
    border: solid #6c7086;
    background: transparent;
    overflow: auto;
}

#diff-panel {
    width: 50%;
    height: 1fr;
    border: solid #6c7086;
    background: transparent;
    overflow: auto;
}

#status-panel {
    width: 30%;
    height: 1fr;
    border: solid #6c7086;
    background: transparent;
    overflow-y: scroll;
    scrollbar-size: 1 1;
    scrollbar-color: #9399b2;
}

/* Status tabs container */
#status-tabs {
    height: 1fr;
    background: transparent;
}

#unstaged-tab, #staged-tab {
    background: transparent;
}

#unstaged-tab > VerticalScroll, #staged-tab > VerticalScroll {
    height: 1fr;
    background: transparent;
    overflow-y: auto;
    scrollbar-size: 1 1;
    scrollbar-color: #9399b2;
}

.hint {
    color: #9399b2;
    text-style: italic;
    padding: 0 1;
    margin: 0 0 1 0;
}



#unstaged-tree, #staged-tree {
    height: 1fr;
    background: transparent;
    overflow-y: auto;
    scrollbar-size: 1 1;
    scrollbar-color: #9399b2;
}

#file-tree {
    height: 1fr;
    background: transparent;
    overflow-y: auto;
    scrollbar-size: 1 1;
    scrollbar-color: #9399b2;
}

#diff-content {
    height: 1fr;
    overflow-y: auto;
}

.diff-markdown {
    padding: 0;
    background: transparent;
    border: none;
}

#history-content {
    height: 1fr;
    overflow-y: auto;
}



.commit-input {
    width: 100%;
    height: 6;
    border: solid #6c7086;
    background: transparent;
    padding: 0 1;
}

.commit-button {
    width: 100%;
    margin-top: 1;
    background: #9ece6a;
    color: black;
    text-style: bold;
}

.commit-button:hover {
    background: #9ece6a 60%;
}

.commit-button:disabled {
    background: transparent;
    color: $text-disabled;
}

/* GAC Configuration Modal Styles */
.gac-label {
    margin: 1 0 0 0;
    color: #bb9af7;
    text-style: bold;
}

.gac-input {
    margin: 1 0;
    width: 100%;
    border: solid #6c7086;
    background: transparent;
    color: white;
    padding: 0 1;
}

.gac-select {
    margin: 1 0;
    width: 100%;
    border: solid #6c7086;
}

.gac-buttons {
    align: center bottom;
    height: auto;
    margin: 2 0 0 0;
}

.test-button {
    background: #ff6b35;
    color: white;
    margin: 0 1;
    text-style: bold;
}

.test-button:hover {
    background: #ff8c5a;
}

.save-button {
    background: #bb9af7;
    color: white;
    margin: 0 1;
    text-style: bold;
}

.save-button:hover {
    background: #9bb8ff;
}

.cancel-button {
    background: #666666;
    color: white;
    margin: 0 1;
    text-style: bold;
}

.cancel-button:hover {
    background: #888888;
}

/* GAC button styling */
.gac-button {
    background: #ff6b35;
    color: white;
    margin: 0 0 0 1;
    text-style: bold;
    width: 8;
    height: 6;
}

.gac-button:hover {
    background: #ff8c5a;
}

/* Commit message row layout */
.commit-message-row {
    width: 100%;
    height: 6;
    margin: 0 0 1 0;
}

/* Commit Section Styles - Now in center panel tab */
.commit-label {
    margin: 0 0 0 0;
    color: #bb9af7;
    text-style: bold;
    height: 1;
}

.commit-input {
    margin: 0 0 1 0;
    border: solid #6c7086;
    background: transparent;
    color: white;
    height: 6;
}

.commit-body {
    margin: 0 0 1 0;
    border: solid #6c7086;
    background: transparent;
    color: white;
    height: 20;
    min-height: 15;
    width: 100%;
    padding: 1;
}

.commit-button {
    margin: 1 0;
    background: #bb9af7;
    color: white;
    text-style: bold;
    width: 100%;
}

.commit-button:hover {
    background: #9bb8ff;
}

.commit-section {
    padding: 2;
    height: 1fr;
    layout: vertical;
    overflow-y: auto;
}



/* Hunk styling */
.hunk-container {
    layout: vertical;
    width: 100%;
    border: none;
    margin: 0;
    height: auto;
}

.hunk-header {
    background: transparent;
    color: $text;
    text-style: bold;
    padding: 0;
}

/* Tab styling */
TabbedContent {
    height: 1fr;
}

TabPane > Static {
    background: transparent;
    color: $text;
    text-style: bold;
}

TabbedContent > TabPane {
    background: transparent;
}

.added {
    background: #9ece6a 60%;
    color: black;
    width: 100%;
    padding: 0 1;
    height: auto;
}

.removed {
    background: #d3869b 60%;
    color: white;
    width: 100%;
    padding: 0 1;
    height: auto;
}

.unchanged {
    background: transparent;
    width: 100%;
    padding: 0 1;
    height: auto;
}

.hunk-buttons {
    width: 100%;
    height: auto;
    align: center middle;
    padding: 1 0;
}

.stage-button, .unstage-button {
    width: 12;
    margin: 0 1;
    height: auto;
    border: solid #6c7086;
    background: transparent;
    color: $text;
    text-style: bold;
}

.stage-button:hover, .unstage-button:hover {
    background: #9ece6a 60%;
}

.discard-button {
    width: 12;
    margin: 0 1;
    height: auto;
    border: solid #6c7086;
    background: transparent;
    color: $text;
    text-style: bold;
}

.discard-button:hover {
    background: #d3869b 60%;
}

.error {
    background: red;
    color: white;
    text-style: bold;
    width: 100%;
    padding: 0 1;
}

.info {
    background: transparent;
    color: $text;
    width: 100%;
    padding: 0 1;
}

Footer {
    color: $text;
    background: transparent;
}

Tabs {
    background: transparent;
}

Tabs > Tab {
    color: $text;
    background: transparent;
    text-style: bold;
}

Tabs > Tab.--active {
    background: transparent;
    border-bottom: solid #6c7086;
}

Tabs > Tab:hover {
    background: #9399b2;
}

/* Git status colors in tree */
Tree > .modified {
    color: #a9a1e1;
    text-style: bold;
}

Tree > .staged {
    color: #9ece6a;
    text-style: bold;
}

Tree > .untracked {
    color: #a9a1e1;
    text-style: bold;
}

Tree > .unchanged {
    color: $text;
}

Tree > .directory {
    color: #bb9af7;
    text-style: bold;
}

Tree > .tree--node {
    padding: 0 1;
    background: transparent;
}
