// WIDGET */
@import "../dependencies/variables-epic.less";
@import "../dependencies/mixin.less";

.widget{
	.widget-title{
		margin-top: 0;
		margin-bottom: 1.5rem;
		font-size: 1.8rem;
		font-weight: 600;
	}

	ul{
		list-style: disc;
		padding-left: 1.8rem;
	}
}

.sidebar{
	&.sidebar-primary, &.sidebar-secondary {
		.widget{
			.global-boxed();
		}
	}
}


.sidebar-header-right{
	.widget-title{
		display: none;
	}
}

.social{
	list-style: none;
	padding-left: 0;
	margin-bottom: 0;
	li{
		display: inline-block;
		a{
			font-size: 4rem;
			padding: 0.5rem;
			
			.fa-facebook, .fa-facebook-square{
				.custom-link-color(@facebook-color, darken(@facebook-color, 10%));
			}
			
			.fa-twitter-square, .fa-twitter{
				.custom-link-color(@twitter-color, darken(@twitter-color, 10%));
			}

			.fa-instagram{
				.custom-link-color(@instagram-color, darken(@instagram-color, 10%));
			}

			.fa-pinterest, .fa-pinterest-square{
				.custom-link-color(@pinterest-color, darken(@pinterest-color, 10%));
			}

			.fa-google-plus, .fa-google-plus-square{
				.custom-link-color(@gplus-color, darken(@gplus-color, 10%));
			}

			.fa-tumblr, .fa-tumblr-square{
				.custom-link-color(@tumblr-color, darken(@tumblr-color, 10%));
			}
		}

		&:first-of-type{
			a{
				padding-left: 0;
			}
		}

		&:last-of-type{
			a{
				padding-right: 0;
			}
		}
	}

	 &.circle{
    li{
      padding: 0.5rem 0.8rem;
      border-radius: 5rem;
      margin-right: 1rem;
      background: @light-gray;
			a{
				font-size: 1.5rem;
				padding: 0;
			}

      &.facebook{
        padding: 0.5rem 1rem;
        &:hover{
         background: darken(@facebook-color, 10%);
         a{
          color: darken(@white, 10%);
          }
        }
      }

      &.twitter{
        &:hover{
         background: darken(@twitter-color, 10%);
         a{
          color: darken(@white, 10%);
          }
        }
      }

      &.google-plus{
        &:hover{
         background: darken(@gplus-color, 10%);
         a{
          color: darken(@white, 10%);
          }
        }
      }
    }
  }
}


.widget_contact_info{
	ul{
		list-style: none;
		margin-left: 0;
		padding-left: 0;
		li{
			margin-bottom: 1rem;
			label, span{
				display: block;
			}
			label{
				margin-bottom: 0;
			}
		}
	}

	.contact-maps{
		margin-top: 2rem;
		iframe{
			max-width: 100%;
			height: 300px;
		}
	}
}

.widget_gallery{
	.content{
		figure{
			display: inline-block;
			padding: 0.1rem 0.1rem;
			img{
				width: 100px;
				height: 100px;
			}
		}
	}
}

.widget_accordion{
	.accordion{
		padding: 0;
	}
}

.widget_categories_icon{
	padding: 2rem 0;

	.widget-title, .content ul li a{
		padding: 0 2rem;
	}

	.content{
		.fa{
		  position: absolute;
		  right: 2rem;
		  top: 1rem;
		  .rounded-icon(2rem, 1rem, 1px, solid, 50px);
		}

		ul{
			list-style: none;
			padding-left: 0;
			li{
				border-bottom: 1px solid @light-gray; 
				padding: 2rem 0;
				position: relative;

				&:last-of-type{
					border-bottom: 0;
				}

				&:hover{
					&:extend(.tertiary-bg);
				}
			}
		}
	}
}

.widget_tag_cloud{
	.tagcloud{
		a{
			font-size: 1.5rem !important;
			&:extend(.primary-bg);
			margin-bottom: 0.5rem;
			line-height: 3rem;
			color: @white;
			padding: 0 1.5rem;
			display: inline-block;
			&:hover{
				&:extend(.secondary-bg);
				text-decoration: none;
			}
		}
	}
}

.widget_recent_posts{
	ul{
		list-style: none;
		padding-left: 0;
		li{
			.clearfix;
			margin-bottom: 1rem;
		}

		.featured-thumb{
			width: 25%;
			height: auto;
		    margin: 0 1rem 0 0;
		}

		.recent-title{
			width: 75%;
			height: auto;
			margin-bottom: 0;
		}
	}
}

.widget_recent_comments{
	ul{
		list-style: none;
		padding-left: 0;
		li{
			.clearfix;
			margin-bottom: 1rem;
		}

		.featured-thumb{
			width: 20%;
			height: auto;
		    margin: 0 1rem 0 0;
			img{
				border-radius: 50%;
			}
		}

		.rcomment{
			width: 75%;
			height: auto;
			margin-bottom: 0;
		}
	}
}

.widget_archive{
	.side-menu;
}

.widget_categories{
	.side-menu;
}