/* ======================================================
   <!-- Dividing Line -->
/* ====================================================== */
@import '@uixkit/core/_global/scss/mixins';
@import '@uixkit/core/_global/scss/functions';
@import '@uixkit/core/_global/scss/variables';
.uix-separator-base {
    display: block;
    clear: both;
    width: 100%;
    height: 0;
    border-top-width: thin;
    border-top-color: var(--uix-dividing-line-color);
    border-top-style: solid;
    outline: none;
    margin: 1.5rem auto;

	&.uix-separator-base--solid {
		border-top-style: solid;
	}

	&.uix-separator-base--dashed {
		border-top-style: dashed;
	}

	&.uix-separator-base--dotted {
		border-top-style: dotted;
	}

	&.uix-separator-base--double {
		bborder-top-style: solid;
		border-bottom: 1px solid var(--uix-dividing-line-color);
		height: 3px;
	}

	&.uix-separator-base--black {
		border-color: rgba(255,255,255,.1);
	}

}

.uix-separator-gradient {
    clear: both;
    display: block;
    width: 100%;
    margin: 1.5rem auto;
    position: relative;
    height: 1px;
    background: var(--uix-dividing-line-color);
    background: linear-gradient(to right,rgba(var(--uix-dividing-line-color),0) 0,rgba(var(--uix-dividing-line-color),1) 35%,rgba(var(--uix-dividing-line-color),1) 70%,rgba(var(--uix-dividing-line-color),0) 100%);

	&.uix-separator-gradient--black {
		background: rgba(255,255,255,.1);
		background: linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.1) 35%,rgba(255,255,255,.1) 70%,rgba(255,255,255,0) 100%);

	}


}

.uix-separator-shadow {
    clear: both;
    width: 100%;
    margin: 1.5rem auto;

	span {
		display: block;
		height: 20px;
		overflow: hidden;

		i {
			display: block;
			height: 25px;
			width: 100%;
			margin: -25px auto 0;
			content: '';
			border-radius: 10.41666667px;
			box-shadow: 0 0 8px var(--uix-dividing-line-color);
		}
	}

	&.uix-separator-shadow--black {
		span {
			i {
				box-shadow: 0 0 8px rgba(255,255,255,.1);
			}
		}

	}


}
