/*======================================================================
MF-08

LIST FOUNDATION
Version : 3.0
======================================================================*/

.ms-list{

margin:0;

padding:0;

list-style:none;

display:flex;

flex-direction:column;

gap:var(--ms-space-4);

}


.ms-list-item{

display:flex;

align-items:flex-start;

gap:var(--ms-space-4);

width:100%;

}


.ms-list-icon{

display:flex;

align-items:center;

justify-content:center;

width:20px;

height:20px;

flex-shrink:0;

margin-top:2px;

color:var(--ms-gold);

}

.ms-list-icon svg{

width:18px;

height:18px;

fill:currentColor;

}

.ms-list-icon img{

width:18px;

height:18px;

object-fit:contain;

}


.ms-list-content{

flex:1;

display:flex;

flex-direction:column;

gap:var(--ms-space-2);

min-width:0;

}


.ms-list-xs{

gap:var(--ms-space-2);

}

.ms-list-sm{

gap:var(--ms-space-3);

}

.ms-list-md{

gap:var(--ms-space-4);

}

.ms-list-lg{

gap:var(--ms-space-6);

}

.ms-list-xl{

gap:var(--ms-space-8);

}


.ms-list-start .ms-list-item{

align-items:flex-start;

}

.ms-list-center .ms-list-item{

align-items:center;

}

.ms-list-end .ms-list-item{

align-items:flex-end;

}


.ms-list-divider .ms-list-item{

padding-bottom:var(--ms-space-4);

border-bottom:1px solid var(--ms-border);

}

.ms-list-divider .ms-list-item:last-child{

border-bottom:none;

padding-bottom:0;

}


.ms-list-inline{

display:flex;

flex-direction:row;

flex-wrap:wrap;

align-items:center;

gap:var(--ms-space-6);

}

.ms-list-inline .ms-list-item{

width:auto;

}


.ms-list-between{

display:flex;

flex-direction:column;

gap:var(--ms-space-4);

}

.ms-list-between .ms-list-item{

justify-content:space-between;

}


.ms-list-bordered{

border:1px solid var(--ms-border);

border-radius:var(--ms-radius-lg);

overflow:hidden;

}

.ms-list-bordered .ms-list-item{

padding:var(--ms-space-6);

border-bottom:1px solid var(--ms-border);

}

.ms-list-bordered .ms-list-item:last-child{

border-bottom:none;

}



.ms-list-surface{

background:var(--ms-surface);

border-radius:var(--ms-radius-lg);

padding:var(--ms-space-6);

}
