/**
 * "Jobba hos oss" – länk i headern, formulär i utfällningspanelen,
 * länk i sidfoten och ansökningssidan.
 */

/* ---------------------------------------------------------------- */
/* Länken i headern – samma uttryck som menylänkarna                  */
/* ---------------------------------------------------------------- */

.header-jobb-wrapper {
	display: flex;
	align-items: center;
	margin-left: 24px;
}

.header-jobb-wrapper a.baras-jobb-link,
.header-jobb-wrapper a.baras-jobb-link:visited {
	font-family: "Playfair Display", sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 28px;
	color: #FFFBF0;
	white-space: nowrap;
	text-decoration: none;
	transition: color 0.3s;
}

.header-jobb-wrapper a.baras-jobb-link:hover,
.header-jobb-wrapper a.baras-jobb-link:focus {
	color: #F7D770;
}

/*
 * Headern rymmer inte länken när menyn är som bredast. Så här nås
 * ansökan i olika skärmbredder:
 *   >= 1360 px  länken i headern
 *   769–1359 px länken i sidfoten
 *   <= 768 px   menyalternativet i mobilmenyn
 *
 * Gränsen är satt efter restaurangsidornas meny, som är den längsta.
 * På sidor där temat döljer huvudmenyn – startsidan, bloggen, artiklar –
 * finns gott om plats, och där visas länken hela vägen ner till mobilmenyn.
 */
@media (max-width: 1359px) {
	.header-jobb-wrapper {
		display: none;
	}
}

/*
 * Headerlänken är avstängd, så temats egen padding gäller. Slås länken på
 * igen behövs den här regeln – annars radbryter restaurangsidornas meny
 * i spannet 1360–1599 px.
 *
 * @media (min-width: 1360px) and (max-width: 1599px) {
 *     .baras-bottom-header-wrapper { padding: 0 24px; }
 * }
 */

@media (min-width: 769px) {
	.home .header-jobb-wrapper,
	.blog .header-jobb-wrapper,
	.single-post .header-jobb-wrapper,
	.page-template-front-page .header-jobb-wrapper,
	.page-template-new-frontpage .header-jobb-wrapper,
	.post-type-archive-offer .header-jobb-wrapper,
	.page-template-status-changer .header-jobb-wrapper {
		display: flex;
	}
}

/* ---------------------------------------------------------------- */
/* Menyalternativ som bara hör hemma i mobilmenyn                     */
/* ---------------------------------------------------------------- */

/*
 * "Jobba hos oss" och "Tips & Guider" ligger i huvudmenyn för att komma
 * med i mobilmenyn – den byggs bara från huvudmenyn. På desktop är menyn
 * redan så bred att fler alternativ får den att radbryta, så där döljs de.
 * ("Tips & Guider" visas på desktop via sekundärmenyn respektive
 * restaurangmenyn, som har ett eget alternativ utan den här klassen.)
 */
#site-navigation .baras-jobb-menu-item,
#site-navigation .baras-tips-menu-item {
	display: none;
}

/*
 * Temat döljer alla mobilmenyalternativ utom knapparna på ett antal mallar
 * (startsidan, shoppen, avbokning, erbjudanden, statusändraren). Våra två
 * textlänkar ska synas ändå. Samma specificitet som temats regel, och den
 * här filen laddas efter – därför vinner den.
 */
ul.mr-menu-list.menu li.baras-jobb-menu-item,
ul.mr-menu-list.menu li.baras-tips-menu-item {
	display: list-item;
}

/* ---------------------------------------------------------------- */
/* Formuläret i utfällningspanelen                                    */
/* ---------------------------------------------------------------- */

.baras-slide-out-wrapper .jobb-content {
	display: none;
}

.slide-open.show-jobb-form .jobb-content {
	display: block;
}

.jobb-content .jobb-intro {
	margin: 12px 0 20px;
	color: #000;
}

.jobb-content .jobb-shortcode label {
	margin-bottom: 15px;
}

.jobb-content .jobb-shortcode input[type="file"] {
	display: block;
	width: 100%;
	margin-top: 5px;
	padding: 10px 0;
}

.jobb-content .jobb-shortcode .wpcf7-list-item {
	margin-left: 0;
}

.jobb-content .jobb-shortcode input.wpcf7-submit {
	margin-top: 20px;
}

/* ---------------------------------------------------------------- */
/* Sidfotslänk                                                        */
/* ---------------------------------------------------------------- */

.baras-jobb-footer-link {
	margin: 0 0 20px;
	text-align: center;
}

.baras-jobb-footer-link a {
	text-decoration: underline;
}

/* ---------------------------------------------------------------- */
/* Ansökningssidan (fallback utan JavaScript, och direktlänkar)       */
/* ---------------------------------------------------------------- */

.baras-jobb-form {
	max-width: 640px;
}

.baras-jobb-form .wpcf7 label {
	display: block;
	margin-bottom: 18px;
	font-weight: 600;
}

.baras-jobb-form .wpcf7 input[type="text"],
.baras-jobb-form .wpcf7 input[type="email"],
.baras-jobb-form .wpcf7 input[type="tel"],
.baras-jobb-form .wpcf7 input[type="file"],
.baras-jobb-form .wpcf7 select,
.baras-jobb-form .wpcf7 textarea {
	display: block;
	width: 100%;
	margin-top: 6px;
	padding: 10px 12px;
	border: 1px solid #ddd;
	background: #fff;
	font-weight: 400;
}

.baras-jobb-form .wpcf7 textarea {
	min-height: 140px;
}

.baras-jobb-form .cookie-policy {
	font-weight: 400;
}

.baras-jobb-form .cookie-policy a {
	margin-left: 4px;
	text-decoration: underline;
}

.baras-jobb-form .cookie-policy .wpcf7-list-item {
	margin-left: 0;
}

.baras-jobb-form .cookie-policy input[type="checkbox"] {
	margin-right: 6px;
}