:root {
    /* Width of SVG element */
    --isometry-graphic-width: 100%;

    /* Hovered element: self */
    --isometry-graphic-colors-hover-selfFill: #8d867a;
    --isometry-graphic-colors-hover-selfStroke: #fff;

    /* Hovered element: siblings */
    --isometry-graphic-colors-hover-siblingsFill: #a19a8d;
    --isometry-graphic-colors-hover-siblingsStroke: #fff;

    /* Clicked element: self */
    --isometry-graphic-colors-selected-selfFill: #80796f;
    --isometry-graphic-colors-selected-selfStroke: #fff;

    /* Clicked element: siblings */
    --isometry-graphic-colors-selected-siblingsFill: #ada599;
    --isometry-graphic-colors-selected-siblingsStroke: #fff;

    /* Clicked element: siblings hovered */
    --isometry-graphic-colors-selected-siblingsHoveredFill: #8a8379;
    --isometry-graphic-colors-selected-siblingsHoveredStroke: #fff;

    /* Disabled building */
    --isometry-graphic-colors-disabled-Fill: #dfdfdf;
    --isometry-graphic-colors-disabled-Stroke: #777575;

    /* Color change animation duration */
    --isometry-graphic-animation-colorDuration: .25s;

    /* Clicked element: upper floor animation */
    --isometry-graphic-animation-upper-verticalOffest: -1250px;
    --isometry-graphic-animation-upper-opacity: 0;

    /* Upper floor animation duration */
    --isometry-graphic-animation-upper-verticalOffestDuration: .5s;
    --isometry-graphic-animation-upper-opacityDuration: .25s;
}

svg {
    width: var(--isometry-graphic-width);
    height: auto;
}
svg > g, 
svg > g polygon, 
svg > g path, 
svg > g polyline, 
svg > polygon, 
svg > path {
    cursor: pointer;
    transition: fill var(--isometry-graphic-animation-colorDuration), 
        stroke var(--isometry-graphic-animation-colorDuration), 
        opacity var(--isometry-graphic-animation-upper-opacityDuration), 
        transform var(--isometry-graphic-animation-upper-verticalOffestDuration);
}
svg > g.selectable.hovered polygon, 
svg > g.selectable.hovered path, 
svg > polygon.selectable.hovered, 
svg > path.selectable.hovered {
    stroke: var(--isometry-graphic-colors-hover-selfStroke);
    fill: var(--isometry-graphic-colors-hover-selfFill);
}
/*
svg > g.selectable.hovered.sibling polygon, 
svg > g.selectable.hovered.sibling path, 
svg > polygon.selectable.hovered.sibling, 
svg > path.selectable.hovered.sibling {
    stroke: var(--isometry-graphic-colors-hover-siblingsStroke);
    fill: var(--isometry-graphic-colors-hover-siblingsFill);
}
    */
svg > g.selectable.selected polygon, 
svg > g.selectable.selected path, 
svg > polygon.selectable.selected, 
svg > path.selectable.selected {
    stroke: var(--isometry-graphic-colors-selected-selfStroke);
    fill: var(--isometry-graphic-colors-selected-selfFill);
}
/*
svg > g.selectable.selected.sibling polygon, 
svg > g.selectable.selected.sibling path, 
svg > polygon.selectable.selected.sibling, 
svg > path.selectable.selected.sibling {
    stroke: var(--isometry-graphic-colors-selected-siblingsStroke);
    fill: var(--isometry-graphic-colors-selected-siblingsFill);
}

svg > g.selectable.selected.hovered.sibling polygon, 
svg > g.selectable.selected.hovered.sibling path, 
svg > polygon.selectable.selected.hovered.sibling, 
svg > path.selectable.selected.hovered.sibling {
    stroke: var(--isometry-graphic-colors-selected-siblingsHoveredStroke);
    fill: var(--isometry-graphic-colors-selected-siblingsHoveredFill);
}
*/
svg > g.disabled, 
svg > g.disabled polygon, 
svg > g.disabled path, 
svg > g.disabled polyline, 
svg > polygon.disabled, 
svg > path.disabled {
    stroke: var(--isometry-graphic-colors-disabled-Stroke);
    fill: var(--isometry-graphic-colors-disabled-Fill);
}
svg > g.upper, 
svg > polygon.upper, 
svg > path.upper {
    transform: translateY(var(--isometry-graphic-animation-upper-verticalOffest));
    opacity: var(--isometry-graphic-animation-upper-opacity);
}

/* List */
#myTable, 
#myTable th, 
#myTable td {
    border: none;
    border-collapse: collapse;
}

#myTable th, 
#myTable td {
    padding: 15px 10px;
}

#myTable thead {

}

html.dark #myTable thead{
    background-color: var(--color-light-white);
}

#myTable tbody tr, .border-grundrisse-info{
    
}

html.dark tbody tr, html.dark .border-grundrisse-info{
    border-bottom: 1px solid #494949 !important;
}

#myTable tbody tr.hovered td {
    background-color: #e7e7e7;
}

html.dark #myTable tbody tr.hovered td {
    background-color: #474747;
}

#myTable tbody tr.hovered .pdf-icon-download {
    background-image: url("data:image/svg+xml,%3Csvg width='42' height='42' viewBox='0 0 42 42' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='1' y='1' width='40' height='40' rx='20' fill='%23938D84'/%3E%3Crect x='1' y='1' width='40' height='40' rx='20' stroke='%23938D84' stroke-width='2'/%3E%3Cpath d='M21.0003 11.667V23.0003M21.0003 23.0003L25.0003 19.0003M21.0003 23.0003L17.0003 19.0003M11.667 25.0003V27.667C11.667 28.3742 11.9479 29.0525 12.448 29.5526C12.9481 30.0527 13.6264 30.3337 14.3337 30.3337H27.667C28.3742 30.3337 29.0525 30.0527 29.5526 29.5526C30.0527 29.0525 30.3337 28.3742 30.3337 27.667V25.0003' stroke='white' stroke-width='2' stroke-linecap='square' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

#myTable tbody tr.hovered .bewerben-button-arrow{
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_523_180)'%3E%3Cpath d='M16.9495 8L20.9491 11.9996L16.9495 16M20.9294 11.9996L12.2547 11.9996L3.05078 11.9996' stroke='white' stroke-width='1.25'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_523_180'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    transition: all 0.3s;
}

#myTable tbody tr.hovered .bewerben-button{
    background-color: var(--color-lage) !important;
    color: var(--color-white) !important;
}

#myTable tbody tr.selected td {
    background-color: #e7e7e7;
}

.haus-container {
    display: grid; 
    grid-template-columns: 1fr 1fr 1fr; 
    gap: 0.5rem 0.5rem;    
}

.dark-mode .pdf-icon{
    filter: invert(1);
}