@import "menu";
@import "../../node_modules/yoastseo/css/tooltips";

#TB_window .wpseo_content_wrapper p {
	font-size: 14px;
	font-style: normal;
}

#TB_window .wpseo_content_wrapper label {
	margin: 0 10px 0 0;
	font-size: 14px;
	font-weight: 600;
}

.wpseo-premium-popup-title {
	margin: 1em 0;
	font-size: 1.3em;
}

.wpseo-premium-popup-icon {
	margin: 10px;
}

.edit-tags-php .column-description img {
	max-width: 100%;
	height: auto;
}

/* Select2 specific fixes for WordPress */
.select2-search__field {
	margin: 0;
}

.select2-results__option,
.select2-selection__choice,
.select2-search--inline {
	margin-bottom: 0;
}

.select2-container .select2-search--inline .select2-search__field {
	margin-top: 6px !important;
	line-height: inherit;
}

.yoast-label-strong {
	font-weight: 600;
}

// Responsive videos.
// Other common aspect ratios: 75% = 4:3, 66.66% = 3:2, 62.5% = 8:5.
.yoast-video-container-max-width {
	max-width: 560px;
}

.yoast-video-container {
	position: relative;
	padding-bottom: 56.25%; // 16:9.
	height: 0;
	overflow: hidden;
}

.yoast-video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

// Forms.
.yoast-settings {
	margin-bottom: 2em;
	// Mimic the WordPress table layout.
	padding-left: 220px;
}

.yoast-settings h2 {
	margin-bottom: 0;
	margin-left: -220px;
}

// By default, labels are left aligned to mimic the WordPress table layout.
.yoast-settings label {
	display: inline-block;
	width: 200px;
	padding-top: 4px;
	padding-right: 10px;
	margin-right: 6px;
	margin-left: -220px;
	font-size: 14px;
	line-height: 1.3;
	font-weight: 600;
	color: #23282d;
	vertical-align: top;
}

// Default vertical spacing between blocks of controls.
.yoast-settings label,
.yoast-settings fieldset,
.yoast-settings input[type="text"],
.yoast .yoast-settings__checkbox, // Needs higher specificity.
.yoast .yoast-settings__radio, // Needs higher specificity.
.yoast-settings textarea,
.yoast-settings select {
	margin-top: 2em;
	margin-bottom: 0.5em;
}

// Max-width for some elements.
.yoast-settings__textarea--medium {
	width: 100%;
	max-width: 600px;
}

// Checkboxes and radio buttons need selectors with higher specificity.
.yoast .yoast-settings__checkbox,
.yoast .yoast-settings__radio {
	vertical-align: top;
	// Ideally, checkboxes and radio buttons should have the same height of a
	// line of text. We fix the vertical alignment by other means.
	position: relative;
	top: 1px;
}

// Fieldsets for checkboxes and radio buttons.
.yoast-settings__group--checkbox,
.yoast-settings__group--radio {
	padding-top: 1em;
}

// Checkboxes and radio buttons within a fieldset need smaller vertical margins.
.yoast-settings__group--checkbox .yoast-settings__checkbox,
.yoast-settings__group--radio .yoast-settings__radio {
	margin: 0 4px 10px 0;
}

// Labels for checkboxes and radio buttons.
.yoast-settings__checkbox + label,
.yoast-settings__radio + label {
	width: auto;
	margin-left: 0;
	margin-right: 0;
	padding: 0;
	max-width: calc( 100% - 25px );
}

// Labels for checkboxes and radio buttons within a fieldset.
.yoast-settings__group--checkbox .yoast-settings__checkbox + label,
.yoast-settings__group--radio .yoast-settings__radio + label {
	margin-top: 0;
	margin-bottom: 10px;
	font-weight: 400;
}

// Other form elements.
.yoast-settings legend {
	font-size: 14px;
	font-weight: 600;
	color: #23282d;
}

.yoast-settings .description {
	margin-top: 0;
	font-size: 14px;
}

/* Icons in the posts and taxonomies table cells. */
td .wpseo-score-icon {
	display: inline-block;
	width: 12px;
	height: 12px;
	margin-left: 5px;
	border-radius: 50%;
	background: #888;
	line-height: 16px;
}

/* Adjust vertical alignment of the icons in the table cells. */
td .wpseo-score-icon {
	margin-top: 3px;
}

/* Table internal links, SEO, and Readability columns tooltips. */
.fixed th.column-wpseo-score,
.fixed th.column-wpseo-score-readability,
.fixed th.column-wpseo-links,
.fixed th.column-wpseo-linked {
	/* 42px */
	width: 3em;
	padding: 0;
}

/* Don't use selectors related to classes added with JavaScript to avoid flickering. */
th.column-wpseo-links a,
th.column-wpseo-linked a,
th.column-wpseo-score .yoast-tooltip,
th.column-wpseo-score-readability .yoast-tooltip {
	overflow: visible; /* Override WP property to make tooltips visible. */
	display: inline-block; /* To contain floats instead of using overflow. */
	vertical-align: middle;
	padding: 8px 0;
}

th.column-wpseo-score .yoast-tooltip,
th.column-wpseo-score-readability .yoast-tooltip {
	/* 11+20+11=42px */
	padding: 8px 11px;
}

.column-wpseo-links .yoast-tooltip-multiline::after {
	/* Edge doesn't support width: max-content; */
	width: 999px;
	max-width: 160px;
}

.column-wpseo-linked .yoast-tooltip-multiline::after {
	/* Edge doesn't support width: max-content; */
	width: 999px;
	max-width: 170px;
}

.yoast-column-header-has-tooltip {
	position: relative;
}

/* Generate the icons in the table columns, exclude Screen Options. */
.manage-column .yoast-column-header-has-tooltip:before {
	content: "";
	display: inline-block;
	width: 20px;
	height: 20px;
	padding: 0;
	vertical-align: top;
	text-decoration: none !important;
	color: #444;
}

.manage-column .yoast-linked-to:before {
	background: transparent url( "../../images/link-out-icon.svg" ) no-repeat 0 0;
	background-size: 20px;
}

.manage-column .yoast-linked-from:before {
	background: transparent url( "../../images/link-in-icon.svg" ) no-repeat 0 0;
	background-size: 20px;
}

.manage-column .yoast-column-seo-score:before {
	background: transparent url( "../../images/Yoast_SEO_negative_icon.svg" ) no-repeat 0 0;
	background-size: 20px;
}

.manage-column .yoast-column-readability:before {
	background: transparent url( "../../images/readability-icon.svg" ) no-repeat 0 0;
	background-size: 20px;
}

/* Do not allow link numbers to break in the table cells. */
td.column-wpseo-links,
td.column-wpseo-linked {
	word-wrap: normal;
}

/* Make the checkboxes lable in the Screen Options visible. */
#screen-meta .yoast-column-header-has-tooltip .screen-reader-text {
	position: static;
	width: auto;
	height: auto;
	visibility: visible;
}


@media screen and ( max-width: 782px ) {
	.yoast-settings {
		padding-left: 0;
	}

	.yoast-settings h2 {
		margin-left: 0;
	}

	.yoast-settings label {
		width: auto;
		padding: 0;
		margin-right: 0;
		margin-left: 0;
	}

	.yoast .yoast-settings__radio,
	.yoast-settings__radio + label {
		margin-bottom: 1em;
	}

	.yoast-settings__checkbox + label,
	.yoast-settings__radio + label {
		max-width: calc( 100% - 35px );
		padding-top: 8px;
	}

	.yoast-settings__group--checkbox .yoast-settings__checkbox + label,
	.yoast-settings__group--radio .yoast-settings__radio + label {
		padding-top: 4px;
	}

	.yoast-settings input[type="text"],
	.yoast-settings textarea,
	.yoast-settings select {
		display: block;
		width: 100%;
		margin-top: 0;
		margin-bottom: 0;
		padding: 7px 10px;
		max-width: none;
		line-height: 1.5;
		box-sizing: border-box;
	}
}
