/*
 * Proxenta Design System
 */
:root {
    --proxenta-peach: rgb(241, 208, 174);
    --proxenta-peach-70: rgb(242, 216, 190);
    --proxenta-peach-50: rgb(246, 227, 209);
    --proxenta-peach-30: rgb(250, 238, 227);
    --proxenta-peach-10: rgb(253, 249, 246);

    --proxenta-peach-dark: rgb(205, 162, 118);
    --proxenta-peach-darker: rgb(128, 101, 73);

    --proxenta-black: rgb(8, 31, 45);
    --proxenta-black-70: rgb(82, 98, 108);
    --proxenta-black-50: rgb(132, 143, 150);
    --proxenta-black-30: rgb(181, 188, 192);
    --proxenta-black-10: rgb(230, 233, 234);
    --proxenta-red: rgb(220, 95, 90);
    --proxenta-green: rgb(103, 158, 114);

    --prx-card-border: none;

    /* Flow background color */
    --slds-g-color-surface-container-1: var(--proxenta-black);
}

/* Flow navigarion bar*/
.navigationBar {
    border: none !important;
}

.prx-card,
.comm-login-form__container {
    font-family: 'HelveticaNeue', sans-serif;
    border-radius: var(--dxp-s-form-element-radius-border);
    padding: 2rem;
    border: var(--prx-card-border);
}

html,
body {
    height: unset;
}

body {
    margin: 0;
}

hr {
    background-color: var(--mds-white-opacity-20);
    height: 1px;
    border: 0;
}

.align-center {
    text-align: center;
    align-items: center;
}

.overflow-hidden>community_builder-output-rich-text {
    overflow: hidden;
}

.invisible {
    display: none !important;
}

.form {
    background-color: var(--proxenta-black-10)
}

.nav-item {
    text-decoration: none !important;
    padding: 0px 8px;
}

.max-width-768px {
    max-width: 768px;
}

/* Radius obrazkov v gride produktov */
.dxp-block-image-host {
    border-radius: var(--dxp-s-form-element-radius-border);
    background-size: cover !important;
}

/* File Upload */

.prx-upload>lightning-file-upload {
    width: 100%;
}

.prx-upload .slds-file-selector,
.prx-upload .slds-file-selector__dropzone {
    width: 100%;
}

.prx-upload .slds-file-selector__body {
    width: 100%;
    text-align: center;
    display: block;
}

.prx-upload .slds-file-selector__text {
    margin-top: 1rem;
}

.prx-upload .slds-file-selector__dropzone>slot {
    width: 100%;
    padding: 2rem;
}

/* .section-max-width {
    max-width: var(--dxp-s-section-columns-max-width);
    margin: auto;
} */

/* Header & Footer */
.community_byo-scoped-header-and-footer__header-content,
.community_byo-scoped-header-and-footer__footer-content {
    background-color: initial !important;
}

.slds-form-element__static {
    color: var(--dxp-g-brand);
}

/* ----------------------------------------------------------------*/
.bg-theme {
    background-color: var(--dxp-g-root);
}

.bg-peach {
    background-color: var(--proxenta-peach);
}

.bg-peach-10 {
    background-color: var(--proxenta-peach-10);
}

.bg-peach-30 {
    background-color: var(--proxenta-peach-30);
}

.bg-peach-50 {
    background-color: var(--proxenta-peach-50);
}

.bg-peach-70 {
    background-color: var(--proxenta-peach-70);
}

.bg-black {
    background-color: var(--proxenta-black);
}

.bg-black-10 {
    background-color: var(--proxenta-black-10);
}

.bg-black-30 {
    background-color: var(--proxenta-black-30);
}

.bg-black-50 {
    background-color: var(--proxenta-black-50);
}

.bg-black-70 {
    background-color: var(--proxenta-black-70);
}

.color-black {
    color: var(--proxenta-black) !important;
}

.color-black-10 {
    color: var(--proxenta-black-10) !important;
}

.color-black-30 {
    color: var(--proxenta-black-30) !important;
}

.color-black-50 {
    color: var(--proxenta-black-50) !important;
}

.color-black-70 {
    color: var(--proxenta-black-70) !important;
}

.color-red {
    color: var(--proxenta-red) !important;
}

.color-green {
    color: var(--proxenta-green) !important;
}

.color-peach {
    color: var(--proxenta-peach) !important;
}

.color-peach-10 {
    color: var(--proxenta-peach-10) !important;
}

.color-peach-30 {
    color: var(--proxenta-peach-30) !important;
}

.color-peach-50 {
    color: var(--proxenta-peach-50) !important;
}

.color-peach-70 {
    color: var(--proxenta-peach-70) !important;
}

.color-white {
    color: var(--proxenta-peach-10) !important;
}