/* Alerts */

p.alert {
    background-clip: padding-box;
    background-color: var(--accent-color-background, hsla(0,0%,93%,.05));
    border: 1px solid;
    border-color: var(--accent-color,#ececec);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #607182;
    display: block;
    margin: 40px 0;
    padding: 30px 30px 30px 100px!important;
    position: relative;
}

.is--primary {
    --accent-color: #189eff;
    --accent-color-hover: #0093fe;
    --accent-color-active: #0084e4;
    --accent-color-shadow: rgba(24,158,255,.33);
    --accent-color-background: rgba(24,158,255,.1);
    --accent-color-background-hover: rgba(24,158,255,.15);
    --accent-color-background-active: rgba(24,158,255,.2);
    --accent-color-background-opaque: rgba(24,158,255,.95);
    --button-text-color: #fff
}

.is--secondary {
    --accent-color: #607182;
    --accent-color-hover: #607182;
    --accent-color-active: #556473;
    --accent-color-shadow: rgba(96,113,130,.33);
    --accent-color-background: rgba(96,113,130,.1);
    --accent-color-background-hover: rgba(96,113,130,.15);
    --accent-color-background-active: rgba(96,113,130,.2);
    --accent-color-background-opaque: rgba(96,113,130,.95);
    --button-text-color: #fff
}

.has--background-sw6,.is--shopware-6,.is--sw6 {
    --accent-color: #4059f0;
    --accent-color-hover: #2844ee;
    --accent-color-active: #1231eb;
    --accent-color-shadow: rgba(64,89,240,.33);
    --accent-color-background: rgba(64,89,240,.1);
    --accent-color-background-hover: rgba(64,89,240,.15);
    --accent-color-background-active: rgba(64,89,240,.2);
    --accent-color-background-opaque: rgba(64,89,240,.95);
    --button-text-color: #fff
}

.is--ecosystem {
    --accent-color: #20a789;
    --accent-color-hover: #1c9277;
    --accent-color-active: #187c66;
    --accent-color-shadow: rgba(32,167,137,.33);
    --accent-color-background: rgba(32,167,137,.1);
    --accent-color-background-hover: rgba(32,167,137,.15);
    --accent-color-background-active: rgba(32,167,137,.2);
    --accent-color-background-opaque: rgba(32,167,137,.95);
    --button-text-color: #fff
}

.is--info {
    --accent-color: #189eff;
    --accent-color-hover: #0093fe;
    --accent-color-active: #0084e4;
    --accent-color-shadow: rgba(24,158,255,.33);
    --accent-color-background: rgba(24,158,255,.1);
    --accent-color-background-hover: rgba(24,158,255,.15);
    --accent-color-background-active: rgba(24,158,255,.2);
    --accent-color-background-opaque: rgba(24,158,255,.95);
    --button-text-color: #fff
}

.is--community,.is--green,.is--success {
    --accent-color: #37d046;
    --accent-color-hover: #2dc03c;
    --accent-color-active: #28ac35;
    --accent-color-shadow: rgba(55,208,70,.33);
    --accent-color-background: rgba(55,208,70,.1);
    --accent-color-background-hover: rgba(55,208,70,.15);
    --accent-color-background-active: rgba(55,208,70,.2);
    --accent-color-background-opaque: rgba(55,208,70,.95);
    --button-text-color: #fff
}

.is--notice,.is--warning,.is--yellow {
    --accent-color: #ffaf02;
    --accent-color-hover: #e89e00;
    --accent-color-active: #ce8d00;
    --accent-color-shadow: rgba(255,175,2,.33);
    --accent-color-background: rgba(255,175,2,.1);
    --accent-color-background-hover: rgba(255,175,2,.15);
    --accent-color-background-active: rgba(255,175,2,.2);
    --accent-color-background-opaque: rgba(255,175,2,.95);
    --button-text-color: #fff
}

.is--error,.is--red {
    --accent-color: #de294c;
    --accent-color-hover: #ce2041;
    --accent-color-active: #b81c3a;
    --accent-color-shadow: rgba(222,41,76,.33);
    --accent-color-background: rgba(222,41,76,.1);
    --accent-color-background-hover: rgba(222,41,76,.15);
    --accent-color-background-active: rgba(222,41,76,.2);
    --accent-color-background-opaque: rgba(222,41,76,.95);
    --button-text-color: #fff
}

.is--enterprise,.is--gold {
    --accent-color: #eac096;
    --accent-color-hover: #e6b381;
    --accent-color-active: #e2a76c;
    --accent-color-shadow: hsla(30,67%,75%,.33);
    --accent-color-background: hsla(30,67%,75%,.2);
    --accent-color-background-hover: hsla(30,67%,75%,.3);
    --accent-color-background-active: hsla(30,67%,75%,.4);
    --accent-color-background-opaque: rgba(42,49,56,.95);
    --button-text-color: #2a3138
}

/* Lightbox */

.lightbox--items {
    margin-bottom: 20px;
    margin-top: 20px;
}

.lightbox--items .item {
    position: relative
}


.lightbox--items .item  img {
    border: 2px solid #e5e5e5;
    border-radius: 4px;
}