@st-namespace 'StripCard-deprecated-st-css';
:import {
    -st-from: "../../common/formatters.st";
    -st-named: color, fallback, zeroAsTrue, applyUnit, applyOpacity;
}

:import {
    -st-from: "../LegacyCard/mixins.st.css";
    -st-named: withBorder, withDynamicPadding, withDynamicSidePadding;
}

:vars {
    /*Defaults*/
    ImageWidth: 84px;
    ImageHeight: 84px;
    CardMinHeight: 92px;
    MediaInfoMargin: 32px;
    DefaultPadding: 32px;
    DefaultBorderWidth: 0;
    DefaultCardBG: color-1;
    DefaultMediaBG: color-5;
    DefaultBorderColor: color-5;
    MinWidth: 700px;
}

:vars {
    /*Overrides*/
    MainBGColor: --overridable;
    MainMediaColor: --overridable;
    MainBorderWidth: --overridable;
    MainBorderColor: --overridable;
    MainSidePadding: --overridable;
}

/*
 * Background color
 * @type color
 */
@property st-global(--wix-ui-tpa-strip-card-main-b-g-color);

/*
 * Media color
 * @type color
 */
@property st-global(--wix-ui-tpa-strip-card-main-media-color);

/*
 * Border width
 * @type size
 */
@property st-global(--wix-ui-tpa-strip-card-main-border-width);

/*
 * Border color
 * @type color
 */
@property st-global(--wix-ui-tpa-strip-card-main-border-color);

/*
 * Side padding
 * @type size
 */
@property st-global(--wix-ui-tpa-strip-card-main-side-padding);

:vars {
    cardBGColor: color(fallback(value(MainBGColor), value(DefaultCardBG)));
    borderWidth: applyUnit(fallback(zeroAsTrue(value(MainBorderWidth)), zeroAsTrue(value(DefaultBorderWidth))), px);
    borderColor: color(fallback(value(MainBorderColor), applyOpacity(color(value(DefaultBorderColor)), 0.2)));
    mediaBGColor: color(fallback(value(MainMediaColor), applyOpacity(color(value(DefaultMediaBG)), 0.2)));
}

.root {
    -st-states: roundMedia, sidePadding;
    -st-mixin: withBorder(
            BorderColor value(borderColor),
            BorderWidth value(borderWidth)
    ), withDynamicPadding(
            PaddingSize value(DefaultPadding),
            BorderWidth value(borderWidth)
    ), withDynamicSidePadding(
            PaddingSize fallback(zeroAsTrue(value(MainSidePadding)), value(DefaultPadding)),
            BorderWidth value(borderWidth)
    );
    display: flex;
    background-color: value(cardBGColor);
    min-height: value(CardMinHeight);
    box-sizing: border-box;
    height: 100%;
    width: 100%;
    min-width: value(MinWidth);
}

.root:not(:sidePadding) {
    padding-left: 0;
    padding-right: 0;
}

.mediaContainer {
    width: value(ImageWidth);
    height: value(ImageHeight);
    margin-right: value(MediaInfoMargin);
    flex-shrink: 0;
    background-color: value(mediaBGColor);
}

.root:roundMedia .mediaContainer {
    overflow: hidden;
    border-radius: 50%;
}

.infoContainer {
    height: auto;
    width: 100%;
}

/* st-namespace-reference="../../../../src/components/StripCard/StripCard.deprecated.st.css" */