/*
 Theme Name:   Antibiotic Policy Group
 Theme URI:    https://antibioticpolicy.org
 Description:  Custom WordPress theme.
 Author:       Design Science & DigitalGarden
 Template:     generatepress
 Version:      0.9.1
*/

/* Base */

*, ::after, ::before {
    box-sizing: border-box;
}

.dynamic-content-template {
	margin-bottom: 0 !important;
}

/* Banner with circle image */

.banner__media-circle img {
	clip-path: circle(60% at 50% 92%);
}

@media (min-width: 769px) and (max-width: 1200px) {
	.banner__media-circle {
		max-width: 50% !important;
	}
	.banner__media-circle img {
		clip-path: circle(81% at 75% 99%);
;
	}
}

/* Swiper */

.swiper {
	--swiper-navigation-color: var(--base);
	--swiper-pagination-color: var(--base-3);
	--swiper-pagination-bullet-inactive-color: #807F7F;
	--swiper-pagination-bullet-width: 13px;
	--swiper-pagination-bullet-height: 13px;
	--swiper-pagination-bullet-horizontal-gap: 7px;
	--swiper-pagination-bottom: 15px;
	--swiper-pagination-bullet-inactive-opacity: 1;
}

.swiper-button-prev,
.swiper-button-next {
	transition: color 0.3s ease;
}

.swiper-button-prev:hover,
.swiper-button-next:hover {
	--swiper-navigation-color: var(--base-3);
}

@media (max-width: 1024px) {
	.swiper-button-prev,
	.swiper-button-next {
		display: none;
	}
}


/* Max width for huge screens */

body {
	max-width: 2200px;
	margin-left: auto;
	margin-right: auto;
}

/* Button inline flex margin collapse correction to match heading bottom margin on paragraphs */

p + .btn {
	margin-top: 12px;
}

@media (max-width: 768px) {
	p + .btn {
		margin-top: 6px;
	}
}

/* Links */

a,
button {
  -webkit-tap-highlight-color: transparent;
}

a,
.text-link-btn {
	text-underline-offset: 3px;
}

.contain--text a:hover,
.site-footer a:hover,
.text-link-btn:hover {
    text-decoration-thickness: 2px;
}

:focus {
	outline: 2px solid black;
	outline-offset: 3px;
}

.text--white :focus {
	outline: 2px solid white;
}

/* Hover underline effect */

.hoverline {
  position: relative;
}

.hoverline::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 3.38px;
  border-radius: 16.2px;
  background: transparent;
  bottom: 0;
  right: 0;
  width: 25%;
  transform-origin: right;
  transition: background 0.3s ease, width 0.3s ease, transform 0.3s ease;
}

@media (max-width: 1024px) {
	.hoverline::after {
		background: transparent;
	}
}

.hoverline--blue:hover::after,
.hoverline--blue.current-menu-item::after,
.gb-block-is-current .hoverline--blue::after {
	background: var(--accent);
}

.hoverline--green:hover::after,
.hoverline--green.current-menu-item::after,
.gb-block-is-current .hoverline--green::after {
	background: var(--accent-2);
}

.hoverline--red:hover::after,
.hoverline--red.current-menu-item::after,
.gb-block-is-current .hoverline--red::after {
	background: var(--accent-3);
}

.hoverline--yellow:hover::after,
.hoverline--yellow .current-menu-item::after,
.gb-block-is-current.hoverline--yellow::after {
	background: var(--accent-4);
}

.hoverline--black:hover::after,
.hoverline--black.current-menu-item::after,
.gb-block-is-current .hoverline--black::after {
	background: var(--contrast-2);
}

.hoverline:hover::after,
.current-menu-item::after,
.gb-block-is-current .hoverline::after {
  width: 100%;
}

/* External links */

.contain--text a[target='_blank']:not(.btn)::after {
  position: absolute;
  content: '';
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-left: 10px;
  background-size: 100%;
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.8989 0.84082H15.0489V3.99087' stroke='black' stroke-width='1.6875' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M13.474 9.417V14.2287C13.474 14.4376 13.3911 14.6379 13.2434 14.7856C13.0957 14.9332 12.8954 15.0162 12.6865 15.0162H1.66152C1.45267 15.0162 1.25236 14.9332 1.10468 14.7856C0.956992 14.6379 0.874023 14.4376 0.874023 14.2287V3.20353C0.874023 2.99467 0.956992 2.79436 1.10468 2.64667C1.25236 2.49899 1.45267 2.41602 1.66152 2.41602H6.47315' stroke='black' stroke-width='1.6875' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M7.17432 8.71594L15.0493 0.84082' stroke='black' stroke-width='1.6875' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  transform: translateY(0.25em);
}

/* Hide empty paragraphs */

p:empty {
  display: none;
}

/* List block */

.wp-block-list {
  margin: 0 0 22px;
}

@media (max-width: 768px) {
  .wp-block-list {
    margin: 0 0 22px 19px;
  }
}

.wp-block-list .wp-block-list {
	margin: 0 0 5px 19px;
}

/* Post content */

.contain--text .dynamic-entry-content p + h2,
.contain--text .dynamic-entry-content p + h3,
.contain--text .dynamic-entry-content ol + h2,
.contain--text .dynamic-entry-content ul + h3 {
	margin-top: 50px;
}

.contain--text .dynamic-entry-content ol,
.contain--text .dynamic-entry-content ul {
	margin-left: 0;
}

.contain--text .dynamic-entry-content ol ol,
.contain--text .dynamic-entry-content ul ul,
.contain--text .dynamic-entry-content ul ol,
.contain--text .dynamic-entry-content ol ul {
	margin-left: 19px;
	margin-bottom: 5px;
}

@media (max-width: 768px) {
	.contain--text .dynamic-entry-content ol,
	.contain--text .dynamic-entry-content ul {
		margin-left: 19px;
	}
}

.contain--text .dynamic-entry-content img {
	margin: 12px 0;
	border-radius: 16px;
}

/* Sticky header */

header.gb-is-sticky {
	padding-top: 10px;
	padding-bottom: 10px;
}

header.gb-is-sticky .header__primary-logo {
	width: 140px;
}

header.gb-is-sticky .header__secondary-logo {
	width: 70px;
}

/* Overlay */

#overlay-content {
	padding-right: 30px;
}

.gb-overlay--width-full .gb-overlay__content {
	width: 100%;
}

/* Forms */

@media (max-width: 768px) {
	.wsf-button-primary {
		width: 100% !important;
	}
}

/* Filters */

.filters {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 40px;
	margin-top: 32px;
}

@media (max-width: 1024px) {
	.filters {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 24px;
	}
}

@media (max-width: 767px) {
	.filters {
		grid-template-columns: 1fr;
	}
}

.filters__label {
	font-weight: bold;
	margin-bottom: 12px;
	text-align: center;
}

@media (max-width: 767px) {
	.filters__label {
		text-align: left;
	}
}

.filters__btn {
	padding: 12px 32px;
	background-color: transparent;
	border: 2px solid var(--accent-2);
	border-radius: 32px;
	display: block;
	margin: 0 0 8px;
	text-decoration: none;
	line-height: 1;
	font-weight: 700;
	color: var(--contrast-4);
    transition: all 0.25s ease;
}

.filters__btn:hover {
    color: var(--contrast-2);
}

.filters__btn:first-child {
	margin-top: 35px;
}

.filters__btn.active {
	background-color: var(--accent-2);
	color: white;
}

.no-results-message {
	margin-bottom: 0;
}

.hide {
	display: none;
}

/* Tabs */

#project-directory {
  overflow: auto;
  scroll-margin-top: 70px;
}

/* Terms */

.terms {
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
}

.terms__btn {
	padding: 8px 21px;
	font-weight: 500;
	text-decoration: none;
	background-color: var(--accent-2);
	border-radius: 22px;
	color: white;
	flex-shrink: 0;
	transition: opacity 0.3s ease;
}

.terms__btn:hover {
	opacity: 0.85;
}

/* Search icon (core block) */

.wp-block-search__button {
	background-image: url('img/search.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 37px;
    padding: 0;
    width: 41px;
    height: 41px;
    color: transparent !important;
}


/* Search title block */
h1.wp-block-query-title {
  margin-bottom: 0;
}

/* ----- Admin Guide ----- */

body.page-id-1002 header,
body.page-id-1002 footer {
	display: none !important;
}

body.page-id-1002 {
	background-color: #f0f0f1;
	padding: 40px;
}

body.page-id-1002 a {
	color: black;
	text-decoration-thickness: 2px;
	text-decoration-color: var(--accent);
}

body.page-id-1002 a:hover {
	text-decoration-color: black;
}

body.page-id-1002 details {
	margin: 0 0 16px;
	background: white;
	padding: 15px 25px;
	border-radius: 5px;
	color: #444;
}

body.page-id-1002 details summary {
	color: black;
	font-weight: bold;
	padding: 15px 25px !important;
	margin: -15px -25px -15px !important;
	transition: all 0.25s ease;
}

body.page-id-1002 details summary::marker {
	margin-right: 10px;
}

body.page-id-1002 details[open] summary::marker {
	color: var(--accent);
}

body.page-id-1002 details:not([open]):hover summary {
	color: var(--accent);
}

body.page-id-1002 details[open] summary {
	margin-bottom: 6px !important;
}

body.page-id-1002 ul,
body.page-id-1002 ol {
	margin-left: 30px;
}