//Deaful List
.list-group{
	.list-group-item{
		background-color: var(--bg-white);
		border-color: var(--border-color);
		color: var(--title);
		&.active{
			--title: #fff!important;
			background-color: var(--primary);
			color: var(--theme-text-color);
		}
		&-primary{
			background-color: var(--primary-light);
		}
		&-secondary{
			background-color: var(--secondary-light);
		}
		&-success{
			background-color: $success-light;
		}
		&-danger{
			background-color: $danger-light;	
		}
		&-warning{
			background-color: $warning-light;
		}
		&-info{
			background-color: $info-light;
		}
		&-light{
			background-color: $light;
		}
		&-dark{
			background-color: $dark-light;
		}
	}
}


.dz-list{
    & > ul > li{
        border-bottom: 1px solid var(--border-color);
        padding: 12px 0;
        .dz-media{
            margin-right: 15px;
            min-width: 15px;
        }
        .list-icon {
            margin-right: 15px;
            display: flex;
            align-items: center;
            justify-content: center;
            i{
                font-size: 20px;
                line-height: 1;
            }
			svg {
                path{
                    fill: var(--title);
                }
				width: 20px;
				height: 20px;
			}
			&.icon-sm{
                i{
                    font-size: 18px;
                }
				svg {
					width: 18px;
					height: 18px;
					transform: scale(1.1);
				}
			}
		}
        .item-content{
            display: flex;
            align-items: center;
            position: relative;
            .dz-icon{
                i{
                    color: rgba(0, 0, 0, 0.4);
                }
            }
            .title{
                color: var(--title);
                font-weight: 500;
                text-transform: capitalize;
                margin-bottom: 0;
            }
        }
        .item-link{
            &::after{
                content: "\e844";
                font-family: 'feather' !important;
                right: 0;
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                font-weight: 500;
                font-size: 20px;
            }
        }
    }
	.dz-list-group{
		.list-group-items{
			padding: 15px 0;
			position: relative;
			.item-link{
				display: flex;
				align-items: center;
				&::after{
					content: "\e844";
					font-family: 'feather' !important;
					right: 0;
					position: absolute;
					top: 50%;
					transform: translateY(-50%);
					font-weight: 500;
					font-size: 20px;
				}
			}
			.dz-icon{
				margin-right: 15px;
				border-radius: 10px;
			}
			.list-content{
				.title{
					margin-bottom: 0;
					text-transform: capitalize;
				}
				.active-status{
					margin-bottom: 0;
					font-size: 12px;
					color: var(--text-light);
				}
			}
		}
	}
    &.list-space{
        & > ul > li{
            padding-left: 20px;
            padding-right: 20px;
            a{
                &.item-link{
                    &:after{
                        right: 20px;
                    }
                }
            }
        }
    }
	&.style-1{
		ul{
			li{
				border-bottom: 0;
				a{
					color: var(--body-color);
				}
			}
			.item-content {
				.dz-icon{
					margin-right: 15px;
					width: auto;
					height: auto;
					svg{
						width: 20px;
						height: 20px;
						svg{
							path{
								fill: var(--body-color);
							}
						}
					}
					i{
						font-size: 20px;
						color: var(--body-color);
					}
				}
				.dz-inner{
					.title{
						font-weight: 400;
						color: var(--title);
                        font-size: 16px;
                        line-height: 1;
					}
				}
			}
		}
	}
	&.style-2{
		ul{
			li{
				padding: 15px;
				margin: 0 -15px;
				a{
					color: var(--rgba-primary-3);
				}
			}
			.item-content {
				.dz-icon{
					margin-right: 15px;
					width: auto;
					height: auto;
					svg{
						width: 20px;
						height: 20px;
						svg{
							path{
								fill: var(--rgba-primary-3);
							}
						}
					}
					i{
						font-size: 20px;
						color: var(--rgba-primary-3);
					}
				}
				.dz-inner{
					.title{
						font-weight: 400;
						color: var(--title);
                        font-size: 16px;
                        line-height: 1;
					}
				}
			}
		}
	}
	&.style-3{
		ul{
			li{
				a{
					color: var(--body-color);
				}
			}
			.item-content {
				.dz-icon{
					margin-right: 12px;
				}
				.dz-inner{
					.title{
						font-weight: 500;
						color: var(--title);
                        font-size: 16px;
                        line-height: 1;
					}
				}
			}
			.item-link{
				&::after{
					opacity: 0.5;
				}
			}
		}
	}
}

// Search List ==
.recent-search-list{
	ul{
		li{
			width: 100%;
			padding-bottom: 15px;
			&.search-content{
				display: flex;
				align-items: center;
				color: var(--title);
				font-size: 14px;
				.left-content{
					display: flex;
					align-items: center;
					flex: 1;
					i{
						font-size: 20px;
						color: var(--primary);					
					}
				} 
				.remove{
					color: var(--rgba-primary-5);
					font-size: 22px;
				} 
			}
		}
	}
}