﻿.splitViewContainer {
    height: 100%;
    background: inherit;
    display: flex;
    overflow-y:auto;
    overflow-x:hidden;
}
.companyInformationSmartView {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    width: 605px;
    height: 100%;
}

    .companyInformationSmartView
    .companyStatusRow {
        width: 100%;
        display: flex;
        white-space: nowrap;
        gap: 5px;
        flex-wrap: wrap;
    }

    .companyInformationSmartView
    .companyStatusItem {
        font-size: 14px;
        margin-right: 10px;
    }
        .companyInformationSmartView
        .companyStatusItem
        .material-icons {
            margin-top: -2px;
        }

    .companyInformationSmartView
    .accentedItem {
        font-weight: 600;
    }
    .companyInformationSmartView
    .companyStatusItem
    img {
        height: 17px;
    }
    .companyInformationSmartView
    .companyStatusItem
    a:hover {
        color: var(--color-fg-default);
        text-decoration: underline;
    }

    .companyInformationSmartView
    .favouritesList {
        display: flex;
        flex-wrap: wrap;
        gap: 5px;
        width: 100%
    }


    .companyInformationSmartView
    .favouritesListItem {
        background-color: var(--AccentedButton);
        padding: 2px 10px;
        border-radius: 8px;
        color: var(--ButtonText);
        cursor: pointer;
        height: 20px;
    }
        .companyInformationSmartView
        .favouritesListItem:hover {
            background: var(--HoverText);
        }
        .companyInformationSmartView
        .favouritesListItem
        .material-icons {
            margin: -2px 2px 0 0;
        }

    .companyInformationSmartView
    .informationKeyPoints {
        -webkit-font-smoothing: antialiased;
        overflow: hidden;
        clear: both;
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin: 10px 0;
    }
    .companyInformationSmartView
    .informationKeyItem {
        -webkit-font-smoothing: antialiased;
        float: left;
        position: relative;
        display: inline-flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        box-sizing: border-box;
        min-width: 170px;
    }
    .companyInformationSmartView
    .smartChartContainer.neutralColor {
        background-color: var(--NeutralColor);
    }
    .companyInformationSmartView
    .smartChartContainer.positiveColor {
        background-color: var(--PositiveColor);
        color: var(--PositiveTextColor);
    }
    .companyInformationSmartView
    .smartChartContainer.negativeColor {
        background-color: var(--NegativeColor);
        color: var(--NegativeTextColor);
    }
.informationKeyItem
.keyPointRow
{
    width:100%;
}
.informationKeyItem
.keyPointValue {
    -webkit-font-smoothing: antialiased;
    -webkit-box-direction: normal;
    margin-bottom: 8px;
    margin: 11px auto 6px auto;
    white-space: nowrap;
    word-wrap: break-word;
    display: block;
    letter-spacing: 0px;
    font-size: 32px;
    font-weight: bold;
}
.companyInformationSmartView
.keyPointValueSmall {
    -webkit-font-smoothing: antialiased;
    -webkit-box-direction: normal;
    margin-bottom: 8px;
    margin: 11px auto 6px auto;
    white-space: nowrap;
    word-wrap: break-word;
    display: block;
    letter-spacing: 0px;
    font-size: 28px;
    font-weight: bold;
}
.companyInformationSmartView 
.keyPointChartValue {
    -webkit-font-smoothing: antialiased;
    -webkit-box-direction: normal;
    margin-bottom: 8px;
    margin: -4px auto 6px auto;
    white-space: nowrap;
    word-wrap: break-word;
    display: block;
    letter-spacing: 0px;
    font-size: 22px;
    font-weight: bold;
}

.companyInformationSmartView
.keyPointStats {
    color: var(--ButtonText);
    padding: 4px 3px 4px 8px;
    border-radius: 7px;
    width: fit-content;
    margin: 0 auto;
}

.companyInformationSmartView
.keyPointCurrency {
    font-size: 16px;
    margin-left: 3px;
    font-weight: 400;
    color: inherit;
}
.companyInformationSmartView
.keyPointStats.neutralColor {
    color: var(--color-fg-default);
    background-color: var(--NeutralColor);
}

.companyInformationSmartView
.keyPointStats.positiveColor {
    background-color: var(--PositiveHardColor);
}

.companyInformationSmartView
.keyPointStats.negativeColor {
    background-color: var(--NegativeHardColor);
}
.companyInformationSmartView
.informationKeyItem
.keyPointIcon {
    float: left;
    border-radius: 20px;
    padding: 5px 5px;
    background: var(--color-bg-default);
    color: var(--color-fg-default);
}
.companyInformationSmartView
.informationKeyItem
.keyPointLabel {
    -webkit-font-smoothing: antialiased;
    -webkit-box-direction: normal;
    white-space: nowrap;
    display: inline;
    letter-spacing: 0.25px;
    font-size: 14px;
    font-weight: 600;
    margin-top: 7px;
    margin-left: 6px;
    float: left;
}

    .companyInformationSmartView .companyInfoItemList {
        line-height: normal;
        white-space: nowrap;
        margin-top: 5px;
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        gap: 2px;
    }
    .companyInformationSmartView
    .companyInfoItemList
    .labelText {
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 330px;
        margin: 2px 0 0 4px;
        float: left;
    }
        .companyInformationSmartView
        .companyInfoItemList
        .labelPreText {
            overflow: hidden;
            max-width: 100px;
            margin: 2px 0 0 0;
            float: left;
        }
.companyInformationSmartView
.roundedItem {
    border: 1px solid var(--LightButtonBackground);
    background-color: var(--LightButtonBackground);
    color: var(--color-fg-default);
    padding: 2px 10px;
    border-radius: 8px;
    cursor: default;
    pointer-events: none;
    white-space: nowrap;
    float: left;
    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%; /* 18px */
    letter-spacing: 0.06px;
    margin: 0 5px 2px 0;
}
.companyInformationSmartView
.smartChartContainer {
    padding: 6px 3px 12px 12px;
    border: 1px solid var(--LightGrey);
    background: var(--Background) 0% 0% no-repeat padding-box;
    border-radius: 8px;
    box-shadow: 1px 1px var(--LighterGrey);
    display: inline-flex;
    margin: 10px 5px 5px 0;
}
    .companyInformationSmartView
    .smartChartContainer:last-child {
        margin-right: 0;
    }
.companyInformationSmartView
.leftDataPointColumn {
    -webkit-font-smoothing: antialiased;
    float: left;
    position: relative;
    display: inline-flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
}

    .companyInformationSmartView
    .rightDataPointColumn {
        padding: 0px;
    }
    .companyInformationSmartView
    .multiMudChart {
        position: absolute;
        background: transparent;
        width: 100px;
        height: 90px;
    }
.companyInformationSmartView
.multiMudChart2 {
    position: absolute;
    background: transparent;
    width: 400px;
    height: 200px;
}

.companyInformationSmartView
.mud-charts-xaxis {
    font-size: 20px;
}
.companyInformationSmartView
.mud-charts-yaxis {
    display: none;
}
    .companyInformationSmartView
    .mud-charts-bar-series {
        /*    transform: scaleX(1);
*/
}
    .companyInformationSmartView
    .mud-chart-bar {
        stroke-width: 40px;
    }
.companyInformationSmartView
.smartContainer {
    padding: 8px;
    display: flex;
    border: 1px solid var(--LightGrey);
    border-radius: 8px;
    float: left;
    width: 100%;
    margin:5px 0;
}
    .companyInformationSmartView
    .smartContainer
    .smartContainerColumn {
        float: left;
        width: 40%;
        margin-bottom: 6px;
    }
.smartContainerColumnSeparator
{
    border-left:1px solid var(--LightGrey);
    margin: 0 10px;
}
.smartContainer
.smartValue {
    float: left;
    font-size: 16px;
    font-weight: bold;
    margin-left: 3px;
    margin-right: 3px;
}
.companyInformationSmartView
.smartViewContent {
/*    overflow-y:auto;
*/

}

.companyInformationSmartView
.largestOwnersContainer {
    width: 322px;
    display: flex;
    white-space: nowrap;
    flex-wrap: wrap;
    gap: 5px;
    flex-wrap: wrap;
    overflow-y: auto;
    max-height: 140px;
}
    .companyInformationSmartView
    .structureSmartContainer {
        width: 100%;
        white-space: nowrap;
        flex-wrap: wrap;
        gap: 5px;
        flex-wrap: wrap;
        margin-top: 10px;
    }
.companyInformationSmartView
.smartItem {
    background-color: var(--NeutralColor);
    border-radius: 14px;
    padding: 8px;
    display: flex;
    white-space: nowrap;
    height: 30px; 
    min-width: 225px;
}
.largestOwnersContainer
.smartItem {
    width: 315px;
}

.companyInformationSmartView
.smartEntityItem {
    font-size: 14px;
    width: 260px;
    margin-top: -1px;
    overflow: hidden;
    height: 19px;
    text-overflow: ellipsis;
    cursor:pointer;
    
}
.companyInformationSmartView
.largestOwnerStake {
    font-size: 16px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: -3px;
}
    .companyInformationSmartView
    .shortSummary {
        width: 100%;
        min-height: 22px;
    }
.smartItem
.material-icons {
    float: left;
    width: 18px;
}
.companyInformationSmartView
.shortSummaryText {
    font-size: 16px;
    max-width: 800px;
    justify-self: center;
    min-height: 22px;
    margin: 12px 0 16px 0;
}
.companyInformationSmartView
.smartViewExpansionPanel {
    min-width: 400px;
    max-width: 800px;
    flex: 1 1 25%; /* Grow, Shrink, Basis */
    gap: 10px;
    padding: 8px 8px 0 8px;
    /*    border: 1px solid var(--LightGrey);
    border-radius: 8px;*/
}
    .companyInformationSmartView
    .smartHeader {
        font-size: 14px;
        font-weight: 600;
        line-height: 150%; /* 21px */
        letter-spacing: 0.035px;
        white-space: nowrap;
        width: 100%;
        display: flex;
        margin-bottom:4px;
        margin-top:8px;
    }
    .companyInformationSmartView
    .descriptionText {
        font-size: 16px;
        letter-spacing: 0px;
        padding: 5px 5px 0px 5px;
        margin-bottom: 8px;
        line-height: 1.5;
        border-bottom: 1px solid var(--StandardBorder);
    }
    .companyInformationSmartView
    .diagramContainer {
        margin-top: 20px;
        display: flex;
        flex-wrap: wrap;
    }
.companyInformationSmartView
.diagramItemContainer {
    float: left;
    min-width: 420px;
    margin-left: 0;
    margin-right: 0;
    border-radius: 5px;
    margin-right: 15px;
    background: var(--color-neutral-lighter-grey);
    border: 1px solid var(--StandardBorder);
    box-shadow: 1px 1px var(--BoxShadow);
    padding: 5px;
    margin-bottom: 20px;
}
    .companyInformationSmartView
    .diagramItemInnerContainer {
        background: var(--color-bg-default);
        border-radius: 5px;
        display: inline-block;
        width: 100%;
    }
.companyInformationSmartView
.companyInformationDiagram {
    width: 380px;
    margin:0;
}
    .companyInformationSmartView
    .chartHeader {
        text-align: center;
        font-size: 16px;
        width: 100%;
        font-weight: bold;
        margin: 5px auto;
    }


.splitscreen_vertical_add:after {
    font-family: 'Material Symbols Outlined';
    content: "\f4fc";
}

.splitscreen_right:after {
    font-family: 'Material Symbols Outlined';
    content: "\f674";
}


.material-symbols-outlined {
    font-family: 'Material Symbols Outlined';
}

.splitScreenButton {
    font-size: 24px;
    min-width: 30px;
    margin-right: 0px;
    margin-left: 8px;
    padding-bottom: 3px;
    padding-right: 9px;
}

.smartDropdownMenu {
    position: absolute;
    z-index: 500;
    margin-left: 7px;
    margin-top: 2px;
    right:10px;
}

.companyInfoSplitViewContainer
.toolBar {
    width: 100%;
    display: flex;
    display: inline-block;
    float: left;
}

    .companyInfoSplitViewContainer
    .toolBar
    .toolBarIcon {
        flex-grow: 1;
        cursor: pointer;
        margin: 0 5px;
        display: inline-flex;
    }
        .companyInfoSplitViewContainer
        .toolBar
        .toolBarIcon
        .toolBarIconText
        {
            font-size: 16px;
            font-weight: 600;
            margin: 1px 4px;
        }
        .companyInfoSplitViewContainer
        .toolBar
        .toolBarIcon
        .material-icons {
            font-size: 24px;
        }

        .companyInfoSplitViewContainer
        .toolBar
        .toolBarIcon.close {
            flex-grow: 1000;
            margin-left:0;
        }
    .companyInfoSplitViewContainer
    .toolBar
    .toolBarPipe {
        flex-grow: 1;
        font-size: 24px;
        margin: -5px 10px;
        color: var(--LightGrey);
    }

    .companyInfoSplitViewContainer {
        background: var(--color-bg-default);
        border-radius: 10px;
        padding: 10px 10px 10px 10px;
        margin: 10px;
        width: 100%;
    }

    .companyInfoSplitViewContainer
    .toolBar
    .toolBarLeftContainer {
        display: flex;
        float: left;
    }

    .companyInfoSplitViewContainer
    .toolBar
    .toolBarRightContainer {
        display: flex;
        float: right;
    }

.registrationNumberContainer
{
    float: right;
    margin-top: 15px;
    white-space: nowrap;
    height: 20px;
    display: flex;
}
    .registrationNumberContainer
    .registrationNumberText {
        user-select: all;
        font-size: 14px;
    }
    .registrationNumberContainer
    .copyButton {
        cursor: pointer;
    }
.shareIcons {
    float:left;
    cursor: pointer;
    margin-left: 10px;
}
    .shareIcons
    .material-icons {
        float: left;
        font-size: 24px;
        margin-left: 5px;
        margin-right: 10px;
        margin-top: 2px;
    }

.companyInformationSmartView
.positiveValue {
    color: var(--PositiveStrongColor);
}
.companyInformationSmartView
.negativeValue {
    color: var(--NegativeStrongColor);
}
.companyInformationSmartView
.positiveValueText {
    color: var(--PositiveTextColor);
}

.companyInformationSmartView
.negativeValueText {
    color: var(--NegativeTextColor);
}

.companyInformationSmartView
.mud-table-pagination-select .mud-input .mud-input-root, .mud-input-slot.mud-input-root.mud-input-root-text.mud-input-root-adorned-start, .mud-icon-root.mud-icon-default.mud-svg-icon.linkItem {
    color: var(--TabButtonText)!important;
}

.linkItem {
    color: var(--LinkText);
}
.smartDropdownMenu
.profile.selected {
    background-color: var(--LightGrey);
}
    .smartDropdownMenu
    .profile.selected::after {
        content: "\e876";
        font-family: 'Material Symbols Outlined';
        font-size: 20px;
        color: var(--PositiveTextColor);
        margin-left: 5px;
        margin-right: 5px;
        padding-top: 0;
    }

.smartDropdownMenu
.dropdownMenu {
    width: 260px;
}
.smartDropdownMenu
.dropdownMenu li {
    width: 100%;
}
.smartDropdownMenu
.dropMenuText {
    font-size: 14px;
    margin: 5px 0 1px 10px;
    width: 180px;
    float: left;
    font-weight: 400;
}
.splitScreenPopup
.dropMenuText {
    width: 180px;
}

.smartMenuDropdownMenu
.dropMenuText {
    margin: 0 0 1px 10px;
}
.smartDropdownMenu
.profile {
    padding: 12px 0;
    height: 50px;
    cursor: pointer;
    float: left;
    width: 100%;
}
    .smartDropdownMenu
    .profile:hover {
        background: transparent;
        cursor: default;
        background-color: var(--HoverButtonLightBackground);
        color: var(--color-fg-default);
        cursor: pointer;
    }

    .smartDropdownMenu
    .profile
    .picon {
        width: 30px;
        float: left;
        margin-left: 5px;
        text-align:right;
    }
.smartDropdownMenu
.dropdownMenu .material-icons {

    font-size: 24px;
}
.smartDropdownMenu
.dropdownMenu
.material-symbols-outlined {
    padding-left: 5px;
}



.flexContainer {
    float:left;
}

.singleColWidth .smartChartContainer:nth-child(n+2) {
    display: none;
}

.threeColWidth .smartChartContainer:nth-child(n+4) {
    display: none;
}

.singleColWidth .smartChartContainer.positiveColor {
    background: var(--color-bg-default);
}
.singleColWidth .smartChartContainer.negativeColor {
    background: var(--color-bg-default);
}
.singleColWidth
.smartChartContainer {
    width: 575px;
    float: left;
    display: flex;
    background: var(--color-bg-default);
    border: 1px solid #ddd;
    border-radius: 8px;
}

.smartChartContainerChart {
    display: flex;
    align-items: center;
    padding-top: 35px;
    height: 140px;
    margin-top: -10px;
}

.smartMenuDropdownMenu {
    float: left;
}

    .smartMenuDropdownMenu
    .material-icons {
        font-size: 24px;
        color: var(--color-fg-default);
        cursor: pointer;
    }

.smartContainerColumn
.smartHeader:first-child {
    margin-top: 0;
}
.companyInformationSmartView
.axis text {
    display: none;
}
.companyInformationSmartView
.main.svelte {
    width: 100px;
}


/*
    TODO: fix this width by setting class name
*/
.companyInformationSmartView
main.svelte-1wtg6dj {
    width: unset;
}

.companyInformationSmartView
.bar {
    width: 10px;
}
.disabledSelect {
    pointer-events: none; /* Prevents any interaction with the div */
    opacity: 0.5; /* Reduces the opacity to indicate disabled state */
}
.companyInfoSplitViewContainer
.companyNameHeader {
    font-size: 18px;
    font-weight: 600;
    margin-top:0;
    margin-bottom: 10px;
    line-height: 2;
}
.companyInfoSplitViewContainer
.progressBarContainer {
    margin:150px 200px;
}

.companyInformationSmartView
.singleColWidth
.informationKeyItem
.keyPointIcon {
    color: var(--FixedBlack);
    background-color: var(--StandardBoxBackround);
}
.companyInformationSmartView
.mud-expand-panel.mud-expand-panel-border {
    border-bottom: none;
}

.companyInformationSmartView
.mud-expand-panel .mud-expand-panel-header {
    padding: 0;
}

.companyInformationSmartView
.mud-expand-panel .mud-expand-panel-content {
    padding: 0;
    font-size:16px;
/*    font-style:italic;
*/}

.disabledSelect {cursor:none; pointer-events:none;}

.threeColWidth {
    overflow: hidden;
    white-space: nowrap;
}

    .threeColWidth
    .keyPointValueSmallText {
        overflow: hidden;
        text-overflow: ellipsis;
        float: left;
        max-width: 154px;
    }

.chart-tooltip.svelte-1bqnkxt {
    min-width: 26ch;
    font-size: 16px;
}

.s-chart-container.svelte-1x04w7 {
    margin: 0;
    overflow: visible;
}
.smartDropdownMenu
.exportIcon {
    height: 30px;
    margin-top: -3px;
    float:left;
    margin-left: 10px;
}

.smartMenuDropdownMenu
.smartDropdownMenu {
    right:130px;
}

.ownershipContainer {
    min-height:140px;
}

.companyInformationSmartView .informationKeyItem .keyPointLabel2 {
    -webkit-font-smoothing: antialiased;
    -webkit-box-direction: normal;
    white-space: nowrap;
    display: inline;
    letter-spacing: 0.25px;
    font-size: 14px;
    font-weight: 600;
    margin: 13px 0 6px 35px;
    text-align: center;
    float: left;
}

.keyPointStats.largeStats {

    padding: 5px 4px 5px 9px;
    border-radius: 8px;
    font-size: 14px;
}

.mud-collapse-wrapper-inner {

    padding-bottom: 0;
}

@media (max-height:900px) {
    .companyInformationSmartView 
    .smartChartContainer {
        padding: 5px 3px 6px 12px;
        margin: 5px 5px 3px 0;
    }
    .companyInformationSmartView .keyPointValueSmall {
        margin: 3px auto 3px auto;
        font-size: 21px;
    }
    .companyInformationSmartView .informationKeyItem .keyPointLabel {
        font-size: 13px;
        margin-top: 5px;
    }
    .companyInformationSmartView .smartContainer {
        padding: 5px;
        margin: 3px 0;
    }

    .companyInformationSmartView .smartItem {
        padding: 4px;
        height: 22px;
    }

    .companyInformationSmartView .largestOwnerStake {
        font-size: 12px;
        margin-top: -1px;
    }
    .smartChartContainerChart {
        height: 125px;
        margin-top:-5px;
    }
    .companyInformationSmartView .smartViewExpansionPanel {
        padding: 0 8px;
    }
    .mud-expand-panel .mud-expand-panel-header {
        /* min-height: 48px; */
        padding: 8px 24px;
    }
    .companyInformationSmartView .smartHeader {
        font-size: 12px;
        margin-bottom: 4px;
        margin-top: 8px;
    }
    .companyInformationSmartView .informationKeyItem .keyPointIcon {
        width: 29px;
        padding: 5px 2px;
    }
    .companyInfoSplitViewContainer .companyNameHeader {
        font-size: 16px;
        margin-bottom: 0;
        line-height: 1.7;
    }
    .registrationNumberContainer {
        margin-top: 5px;
    }
    .companyInformationSmartView .informationKeyItem .keyPointLabel2 {
        margin: 10px 0 5px 35px;
    }
}