
.header {
    position: relative;
    padding: 0 7px;

    ::deep {
        .name,
        .type {
            height: 34px;
            line-height: 34px;
            white-space: nowrap;
            text-overflow: ellipsis;
        }
    }
}

.influences {
    position: absolute;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;

    &.left {
      left: 2px;
    }

    &.right {
      right: 2px;
    }
}

.header-double-rare,
.header-double-unique,
.header-double-relic {
    ::deep {
        .name,
        .type {
            height: 27px;
            line-height: 23px;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .name {
            padding-top: 4px;
        }

        .type {
            padding-bottom: 4px;
        }
    }
}

.header-currency {
    background: url('/images/items/header-currency-left.png') top left repeat-y, url('/images/items/header-currency-right.png') top right repeat-y, url('/images/items/header-currency-middle.png') top center repeat;
}

.header-gem {
    background: url('/images/items/header-gem-left.png') top left repeat-y, url('/images/items/header-gem-right.png') top right repeat-y, url('/images/items/header-gem-middle.png') top center repeat;
}

.header-relic {
    background: url('/images/items/header-relic-left.png') top left repeat-y, url('/images/items/header-relic-right.png') top right repeat-y, url('/images/items/header-relic-middle.png') top center repeat;
}

.header-double-relic {
    background: url('/images/items/header-double-relic-left.png') top left repeat-y, url('/images/items/header-double-relic-right.png') top right repeat-y, url('/images/items/header-double-relic-middle.png') top center repeat;
}

.header-double-rare {
    background: url('/images/items/header-double-rare-left.png') top left repeat-y, url('/images/items/header-double-rare-right.png') top right repeat-y, url('/images/items/header-double-rare-middle.png') top center repeat;
}

.header-double-unique {
    background: url('/images/items/header-double-unique-left.png') top left repeat-y, url('/images/items/header-double-unique-right.png') top right repeat-y, url('/images/items/header-double-unique-middle.png') top center repeat;
}

.header-magic {
    background: url('/images/items/header-magic-left.png') top left repeat-y, url('/images/items/header-magic-right.png') top right repeat-y, url('/images/items/header-magic-middle.png') top center repeat;
}

.header-normal {
    background: url('/images/items/header-normal-left.png') top left repeat-y, url('/images/items/header-normal-right.png') top right repeat-y, url('/images/items/header-normal-middle.png') top center repeat;
}

.header-prophecy {
    background: url('/images/items/header-prophecy-left.png') top left repeat-y, url('/images/items/header-prophecy-right.png') top right repeat-y, url('/images/items/header-prophecy-middle.png') top center repeat;
}

.header-rare {
    background: url('/images/items/header-rare-left.png') top left repeat-y, url('/images/items/header-rare-right.png') top right repeat-y, url('/images/items/header-rare-middle.png') top center repeat;
}

.header-unique {
    background: url('/images/items/header-unique-left.png') top left repeat-y, url('/images/items/header-unique-right.png') top right repeat-y, url('/images/items/header-unique-middle.png') top center repeat;
}
