@st-namespace 'Divider-st-css';
@st-import [ --wix-color-37 ] from '@wix/tpa-style-webpack-plugin/stylable-variables.st.css';
@st-import [ createColor ] from '../../common/formatters.st';
@st-import [ --wst-system-line-1-width, --wst-system-line-1-color-rgb ] from '@wix/wix-site-theme-variables/stylable-variables.st.css';

/*
 * Divider color
 * @type color
 * @default --wix-color-37
 */
@property st-global(--wix-ui-tpa-divider-main-divider-color);

/*
 * Divider width
 * @type size
 * @default 1px
 */
@property st-global(--wix-ui-tpa-divider-main-divider-width);

/*
 * Divider color opacity
 * @type size
 * @default 100%
 */
@property st-global(--wix-ui-tpa-divider-main-divider-opacity);

.root {
    -st-states: direction(enum(vertical, horizontal));

    /** Stylesheet agent overrides **/
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
}

.root:direction(horizontal) {
    border-bottom-style: solid;
    border-width: 0 0 var(--wix-ui-tpa-divider-main-divider-width, var(--wst-system-line-1-width,  1px)) 0;
    border-bottom-color: createColor(--wix-ui-tpa-divider-main-divider-color, var(--wst-system-line-1-color-rgb, var(--wix-color-37)));
    opacity: var(--wix-ui-tpa-divider-main-divider-opacity, 1);
    max-width: 100%;
}

.root:direction(vertical) {
    border-left-style: solid;
    border-width: 0 0 0 var(--wix-ui-tpa-divider-main-divider-width, var(--wst-system-line-1-width,  1px));
    border-left-color: createColor(--wix-ui-tpa-divider-main-divider-color, var(--wst-system-line-1-color-rgb, var(--wix-color-37)));
    opacity: var(--wix-ui-tpa-divider-main-divider-opacity, 1);
    min-height: 100%;
}

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