/*
 * "Submit Your Resume" header dropdown (#nav-widget). Version 1.0.0.
 *
 * Every rule is scoped to html.dis-rd, which js/dis-resume-dropdown.js adds from
 * <head>, so with JavaScript off the panel stays open as the theme styles it.
 * Everything sits inside the theme's desktop range: at 980px and below style.css
 * hides #nav-widget, and that is left alone.
 */
@media only screen and ( min-width: 981px ) {

	/* The tab: same top and height as the 45px nav items, inside the header. */
	html.dis-rd #nav-widget h3 {
		box-sizing: border-box;
		height: 45px;
		min-height: 0;
		margin: 0;
		padding: 0;
		line-height: 45px;
	}

	html.dis-rd #nav-widget .dis-rd-toggle {
		display: block;
		width: 100%;
		height: 45px;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: transparent;
		-webkit-appearance: none;
		appearance: none;
		color: inherit;
		font: inherit;
		letter-spacing: inherit;
		line-height: inherit;
		text-align: center;
		text-transform: inherit;
		cursor: pointer;
	}

	html.dis-rd #nav-widget .dis-rd-toggle:focus-visible {
		outline: 2px solid #fff;
		outline-offset: -3px;
	}

	/* The panel: collapses through a one-row grid, so its height is never hard-coded
	   and it can still grow to fit CF7's response message. */
	html.dis-rd #nav-widget .textwidget {
		display: grid;
		grid-template-rows: 0fr;
		grid-template-columns: minmax( 0, 1fr );
		visibility: hidden;
		transition: grid-template-rows 180ms ease, visibility 0s linear 180ms;
	}

	html.dis-rd #nav-widget .textwidget > * {
		min-height: 0;
		overflow: hidden;
	}

	html.dis-rd #nav-widget.dis-rd-open .textwidget {
		grid-template-rows: 1fr;
		visibility: visible;
		transition: grid-template-rows 180ms ease, visibility 0s;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	html.dis-rd #nav-widget .textwidget,
	html.dis-rd #nav-widget.dis-rd-open .textwidget {
		transition: none;
	}
}
