/* /Components/ActivityBar/SolutionExplorer/VsSolutionExplorerItem.razor.rz.scp.css */
/* CSS for VsProjectTreeNode component */


.vs-solution-explorer-item-root[b-h86cud8mdw] {
    flex: 1;
    min-width: 100%;
    width: max-content;
}

    .vs-solution-explorer-item-head[b-h86cud8mdw] {
        display: flex;
        flex-direction: row;
        justify-content: start;
        align-items: center;  

        padding: 0 50px;

        border-radius: var(--vs-default-borderradius);
    }

        .vs-solution-explorer-item-head:hover[b-h86cud8mdw] {
            background-color: var(--vs-palette-action-disabled);
        }

        .vs-solution-explorer-item-head-expand[b-h86cud8mdw] {
            display: flex;
            justify-content: center;
            align-items: center;  

            width: 20px;

            flex-shrink: 0;
        }

        .vs-solution-explorer-item-head-icon[b-h86cud8mdw] {
            display: flex;
            justify-content: center;
            align-items: center;  

            padding: 5px;

            flex-shrink: 0;
        }

        /* TODO косяк с тем, что кликать для открытия нужно именно по тексту (это сделано специально, чтобы кнопки expand активными оставались)
            однако, после content идёт большое пустое простанство, которое не кликаблильно, а надо сделать его кликабильным.
            Также надо сделать открытие по двум кликам, а не по одному.
        */

        .vs-solution-explorer-item-head-content[b-h86cud8mdw] {

        }
            .vs-solution-explorer-item-head-content.active[b-h86cud8mdw] {
                font-weight: var(--vs-typography-active-weight);
                color: var(--vs-palette-text-active);
            }


            .vs-solution-explorer-item-head-content span[b-h86cud8mdw] {
                overflow: hidden;

                white-space: nowrap;
                text-overflow: ellipsis;
            }

    .vs-solution-explorer-item-child[b-h86cud8mdw] {
        
    }
/* /Components/ActivityBar/SolutionExplorer/VsSolutionExplorerRoot.razor.rz.scp.css */
/* CSS for VsProjectTreeRoot component */


.vs-solution-explorer-root[b-9fetz9y2sw] {
    flex: 1;

    min-width: 100%;
    width: max-content;
}
/* /Components/ActivityBar/VsActivityBar.razor.rz.scp.css */
/* CSS for VsActivityBar component */

.vs-activitybar-root[b-6zlwtfbugx] {
    display: flex;

    padding: 0px;

    flex-shrink: 0;
}
/* /Components/ActivityBar/VsActivityBarButton.razor.rz.scp.css */
/* CSS for VsActivityBarButton component */

.vs-activitybar-btn[b-ql32nwc42z] {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 5px;

    width: 30px;
    min-height: 30px;

    writing-mode: vertical-rl;

    box-sizing: border-box;

    cursor: pointer;

    border-right: 5px solid var(--vs-palette-surface);
/*    border-radius: var(--vs-default-borderradius);*/
}

    .vs-activitybar-btn:hover[b-ql32nwc42z] {
        border-right: 5px solid var(--vs-palette-primary);
    }
/* /Components/ActivityBar/VsActivityBarPanel.razor.rz.scp.css */
/* CSS for VsSolutionExplorerPanel component */


.vs-activitybar-panel-root[b-3tx2fv4x6j] {
    position: absolute;
    top: 0;
    right: 30px;

    display: flex;
    flex-direction: column;

    width: 300px;
    height: 100%;
    min-width: 0;

    overflow: hidden;

    background: var(--vs-palette-surface);

    border: 1px solid var(--vs-palette-primary);
    border-radius: var(--vs-default-borderradius);

    box-shadow: -5px 0 0 2.5px var(--vs-palette-background);

    z-index: 10;
}

    .vs-activitybar-panel-header[b-3tx2fv4x6j] {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        flex-shrink: 0; 

        padding: 5px 10px;

        background: var(--vs-palette-surface);
    }

    .vs-activitybar-panel-content[b-3tx2fv4x6j] {
        position: relative;

        flex: 1;
        width: 100%;
        height: 100%;

        padding: 5px 10px;

        box-sizing: padding-box;

        overflow: auto;
    }
/* /Components/Common/Menu/VsMenu.razor.rz.scp.css */
/* CSS for VsMenu component */

.vs-menu-root[b-8nw5ghj54f] {
    position: relative;
    display: inline-block;

    margin: 0 5px;
    padding: 5px 10px;

    font-size: 15px;
    font-weight: 300;
    color: white;

    border-radius: var(--vs-default-borderradius);
}

    .vs-menu-root:hover[b-8nw5ghj54f] {
        background-color: var(--vs-palette-surface);
    }

    /*TODO надо сделать, чтобы когда меню было активно (содержимое dropdown открыто), то стиль был такой же как и у :hover*/

.vs-menu-label[b-8nw5ghj54f] {

}

.vs-menu-dropdown[b-8nw5ghj54f] {
    position: absolute;
/*    top: 0;*/
    left: 0;

    min-width: 200px;
    margin-top: 10px;
    padding: 5px;

    font-size: 12px;

    background-color: var(--vs-palette-surface);
        
    border-radius: var(--vs-default-borderradius);
    box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.3);

    z-index: 999;
}
/* /Components/Common/Menu/VsMenuItem.razor.rz.scp.css */
/* CSS for VsMenuItem component */

.vs-menu-item-root[b-4rosdnlvxr] {
    display: inline-flex;
    align-items: center;

    width: stretch;

    padding: 5px 10px;

    border-radius: var(--vs-default-borderradius);
}

    .vs-menu-item-root:hover[b-4rosdnlvxr] {
        background-color: var(--vs-palette-action-disabled);
    }

[b-4rosdnlvxr] .vs-menu-item-icon {
    margin-right: 10px;
    padding: 2px;
}

.vs-menu-item-text[b-4rosdnlvxr] {
    text-wrap: nowrap;
}
/* /Components/TabsBar/VsTabsBar.razor.rz.scp.css */
/* CSS for VsTabsBar component */


.vs-tabsbar-root[b-v4hgzhx2fn] {
    position: relative;
    display: flex;
    flex-wrap: wrap;

    min-height: 30px;

    background: var(--vs-palette-surface);

    border-top-left-radius: var(--vs-default-borderradius);
    border-top-right-radius: var(--vs-default-borderradius);

    z-index: 2;
}

    .vs-tabsbar-tab[b-v4hgzhx2fn] {
        display: flex;
        align-items: center;

        max-width: 400px;

        font-size: 13px;
        color: var(--vs-palette-text-secondary);

        text-decoration: none;
    }

        .vs-tabsbar-tab:hover[b-v4hgzhx2fn] {
            background-color: var(--vs-palette-gray-light);
            border-radius: var(--vs-default-borderradius);
        }


        .vs-tabsbar-tab.active[b-v4hgzhx2fn] {
            margin-bottom: -1px;

            color: var(--vs-palette-text-active);

            font-weight: var(--vs-typography-active-weight);

            border: 1px solid var(--vs-palette-primary);
            border-bottom: 2px solid var(--vs-palette-surface);
    
            border-top-left-radius: var(--vs-default-borderradius);
            border-top-right-radius: var(--vs-default-borderradius);
    
            z-index: 3;
        }

            .vs-tabsbar-tab.active:hover[b-v4hgzhx2fn] {
                background-color: var(--vs-palette-surface);

                border-radius: 0;
                border-top-left-radius: var(--vs-default-borderradius);
                border-top-right-radius: var(--vs-default-borderradius);
            }

            .vs-tabsbar-tab.active *[b-v4hgzhx2fn] {
                visibility: visible;
            }



        .vs-tabsbar-tab-content[b-v4hgzhx2fn] {
            padding: 5px 10px; 

            white-space: nowrap; 
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .vs-tabsbar-tab-pin[b-v4hgzhx2fn] {
            display: flex;
            align-items: center;
            justify-content: center;

            visibility: hidden;

            width: 36px;
            height: stretch;

            padding: 5px 10px;   
        }

            .vs-tabsbar-tab-pin:hover[b-v4hgzhx2fn] {
                background-color: var(--vs-palette-action-disabled);
                border-radius: var(--vs-default-borderradius);
            }

            .vs-tabsbar-tab:hover .vs-tabsbar-tab-pin[b-v4hgzhx2fn] {
                visibility: visible;
            }

        .vs-tabsbar-tab-close[b-v4hgzhx2fn] {
            display: flex;
            align-items: center;
            justify-content: center;

            visibility: hidden;

            width: 36px;
            height: stretch;

            padding: 5px 10px;   
        }

            .vs-tabsbar-tab-close:hover[b-v4hgzhx2fn] {
                background-color: var(--vs-palette-action-disabled);
                border-radius: var(--vs-default-borderradius);
            }

            .vs-tabsbar-tab:hover .vs-tabsbar-tab-close[b-v4hgzhx2fn] {
                visibility: visible;
            }
/* /Components/ToolBar/VsToolbar.razor.rz.scp.css */
/* CSS for VsToolbar component */


.vs-toolbar[b-0earivh3l5] {
    display: flex;
    flex-direction: row;

    width: fit-content;

    padding: 3px;

    color: var(--vs-pallete-textprimary);

    background: var(--vs-palette-surface);

    border: 1px solid rgb(0, 0, 0);
    border-left-width: 4px;
    border-radius: var(--vs-default-borderradius);
}
/* /Components/ToolBar/VsToolbarButton.razor.rz.scp.css */
/* CSS for VsIconButton component */

.vs-toolbar-btn[b-r7l9yh0kb1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 30px;
    height: 30px;

    padding: 1px;
    margin: 0 5px;

    box-sizing: border-box;

    cursor: pointer;

    border-radius: var(--vs-default-borderradius);
}

    .vs-toolbar-btn:hover[b-r7l9yh0kb1] {
        background-color: var(--vs-palette-action-disabled);
    }

.vs-toolbar-text[b-r7l9yh0kb1] {
    padding: 5px
}
/* /Components/VsCodeEditor.razor.rz.scp.css */
/* CSS for VsCodeEditor component */


.vs-editor-root[b-tgm4apgeel] {
    position: relative;
    display: inline-block;

    min-width: 100%;
    min-height: 100%;
}
    
    .vs-editor-lines[b-tgm4apgeel] {
        white-space: pre;

        font-family: "Cascadia Mono", "Cascadia Code", Consolas, monospace;

        font-size: 13px;
        font-weight: 400;
    }

        .vs-editor-line[b-tgm4apgeel] {
            display: flex;

            line-height: 18px;  
            height: 18px;

            text-wrap: nowrap;
        }

            .vs-editor-line:hover[b-tgm4apgeel] {
                background-color: var(--vs-palette-surface);

            }

            .vs-editor-line-gutter[b-tgm4apgeel] {
                position: sticky;
                left: 0;

                min-width: 50px;

                flex-shrink: 0;

                padding-left: 20px;
                padding-right: 15px;
                margin-right: 30px;

                text-align: right;
                user-select: none;

                box-sizing: border-box;

                color: var(--vs-palette-text-secondary);
                background-color: var(--vs-palette-background);
            }  

                .vs-editor-line:hover .vs-editor-line-gutter[b-tgm4apgeel] {
                    color: var(--vs-palette-text-primary);

                    background-color: var(--vs-palette-surface);
                    box-shadow: inset 3px 0 0 0 var(--vs-palette-primary);
                }
        
            .vs-editor-line-content[b-tgm4apgeel] {
                
            }
/* /Pages/Home.razor.rz.scp.css */
/* CSS for Home component */


.vs-window[b-me5k47xywg] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 10px 5px 10px 10px;

    height: 100vh;
    width: 100vw;

    color: var(--vs-palette-textprimary);

    background-color: var(--vs-palette-background);

    border: 1px solid var(--vs-palette-primary);
    border-radius: 10px;

    user-select: none;
}


.vs-header[b-me5k47xywg] {
    flex-shrink: 0;
        
    background: var(--vs-palette-background);
}

.vs-titlebar[b-me5k47xywg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    
    margin-bottom: 10px;

    font-size: 12px;
}

    .vs-titlebar-left[b-me5k47xywg] {
        display: inline-flex;
        align-items: center;
    }

        .vs-menu-list[b-me5k47xywg] {

        }

        .vs-solution-name[b-me5k47xywg] {
            padding: 5px 10px;

            color: var(--vs-palette-textprimary);

            background: var(--vs-palette-surface);

            border: 1px solid rgb(0, 0, 0);
            border-radius: var(--vs-default-borderradius);
        }

        [b-me5k47xywg] .vs-close-btn {
            margin-left: auto;
        }



.vs-toolbars[b-me5k47xywg] {
    display: flex;
    flex-wrap: wrap;

    margin-bottom: 20px;
}
    
    [b-me5k47xywg] .vs-toolbar {
        margin-right: 5px;
    }


.vs-workbench[b-me5k47xywg] {
    position: relative;
    display: flex;
    flex-direction: row;

    margin-bottom: 5px;

    flex: 1;
    min-width: 0;
    min-height: 0;

    overflow: hidden;
}


    .vs-editor-viewport[b-me5k47xywg] {
        position: relative;
        display: flex;
        flex-direction: column;

        flex: 1;
        min-width: 0;
        min-height: 0;

        box-sizing: padding-box;
    }

    
        .vs-tabsbar[b-me5k47xywg] {
            position: relative;
            flex-shrink: 0;

            z-index: 2;
        }


        .vs-editor-content[b-me5k47xywg] {
            position: relative;

            flex: 1;
            width: 100%;
            height: 100%;

            overflow-y: auto;
            overflow-x: auto;

            user-select: text;

            border: 1px solid var(--vs-palette-primary);

            border-bottom-left-radius: var(--vs-default-borderradius);
            border-bottom-right-radius: var(--vs-default-borderradius);
        }

    .vs-activitybar[b-me5k47xywg] {
        flex-shrink: 0;
    }


.vs-statusbar[b-me5k47xywg] {
    height: 24px;
    background-color: #854cc7;
    color: #ffffff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10px;
    font-size: 12px;
    flex-shrink: 0;
}

.vs-footer[b-me5k47xywg] {
    display: flex;
    flex-direction: row;

    justify-content: space-between;
}

.vs-footer-status-left[b-me5k47xywg], .vs-footer-status-right[b-me5k47xywg] {
    display: flex;
    gap: 16px;
}