@import url( 'mixins.less' );

.wf-wrap {
	&.about-wrap {
		.theme-screenshot {
			float: left;
			max-width: 320px;
			margin-right: 1.618em;
			margin-bottom: 1.618em;
		}
	}

	.getting-started-buttons {
		.button {
			margin-right: 10px;
		}

		.dashicons:before {
			line-height: 26px;
		}
	}

	ul.theme-info {
		color: #666;

		> li:first-child {
			float: left;
			margin-right: 10px;
			padding-right: 10px;
			border-right: 1px solid rgba(0,0,0,0.1);
		}
	}

	table.theme-info {
		tbody {
			td {
				padding-bottom: 2px;
			}
		}

		tfoot {
			td {
				padding-top: 5px;
				font-size: 12px;
				color: #999;

				strong {
					font-weight: normal;
				}
			}
		}
	}

	.plugin-name {
		strong {
			display: block;
		}
	}

	table.theme-info,
	table.wf-plugins {
		margin-bottom: 1.618em;
		max-width: 621px;

		tr {
			td {
				&:first-child {
					width: 63%;
				}
			}
		}

		.actions,
		.version {
			text-align: right;
			width: 100px;
		}
	}

	table.wf-plugins {
		span.active {
			background-color: #7ad03a;
			color: #fff;
			padding: 0 11px 2px;
			line-height: 26px;
			display: inline-block;
			.border_radius(3px);
			font-weight: 700;
		}
	}

	.woo-notice {
		.woo_notice;
	}
	.woo-notice p {
		margin: .5em 0;
		padding: 2px;
	}

	.spacer {
		margin: 2.618em 0 1.618em;
		clear: both;
	}
}

// Mobile
@media screen and (max-width: 782px) {
	.wf-wrap {
		&.about-wrap {
			.theme-name {
				word-wrap: break-word;
			}
			.wp-list-table {
				&.wf-plugins {
					margin-top: 50px;
					.plugin-title, .column-name {
						padding-left: 10px;
					}
				}
			}
		}
	}

	.wf-wrap {
		.getting-started-buttons {
			.dashicons:before {
				line-height: 21px;
			}
		}
	}
}

// Retina
@media only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
{
	.wf-wrap {
		&.about-wrap {
			.theme-screenshot {
				max-width: 600px;
			}
		}
	}
}