/*
Theme Name: CA Climate Assessment
Theme URI: https://template.webstandards.ca.gov/
Author: LCI Web Team
Template: lci-core
Description: California Climate Assessment is a child theme that extends the functionality of the base LCI Core theme. Requires PHP version 8.3 or higher.
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 8.3
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cca
Tags: Bootstrap, Responsive, Accessibility Ready
*/

/* --------------------------------------
 *          MAIN TYPOGRAPHY
 * --------------------------------------*/

 body 	{
	font-family: 'Lato', sans-serif;
}

p {
	line-height: 1.6em;
	margin-bottom: 1.2rem;
}

h1,h2,h3,h4,.h2,.h3,.h4 {
	margin-top: 2rem;
	margin-bottom: 0.5rem;
	font-weight: 700;
	line-height: 1.2em;
	letter-spacing: 0.015em;
	font-family: 'Lato', sans-serif;
}

h1 	{
	font-weight: 700;
	margin-top: 1rem;
	
	@media (min-width: 768px) { 
		font-weight: 600;
	}	
}

h2,.h2 	{
	font-size: 1.5rem;
	
	@media (min-width: 768px) { 
		font-size: 1.7rem;
	}
}

h3,.h3 	{
	font-size: 1.3rem;
	
	@media (min-width: 768px) { 
		font-size: 1.4rem;
	}	
}

h4,.h4	{
	font-size: 1.0rem;
	margin-top: 1rem;
	
	@media (min-width: 768px) { 
		font-size: 1.rem;
		font-weight: 700;
		margin-top: 1rem;
	}
}

.icon-bar h2,
.card-featured h2
	{
	font-size: 1.6rem;
	}

.icon-bar h3,
.card-featured h3
	{
	font-size: 1.45rem;
	}

.icon-bar h4,
.card-featured h4
	{
	font-size: 1.15rem;
	}


h2+h3, h2+h4, h2+h5, h2+p,
h3+h4, h3+h5, h3+p
h4+h5,h4+p,
h5+p
	{
	margin-top: .5rem;
	}

article h2,
article h3
	{
	font-weight: 600;
	}

strong
	{
	color: #000000;
	font-weight: 700;
	}
.btn-highlight,
.btn-highlight:hover {
	color: #FFFFFF;
}
/* -------------------
 * BREADCRUMB
 * -------------------*/
ol.breadcrumb+h1
	{
	margin-top: 0.5rem;
	}
ol.breadcrumb
	{
	margin: 8px 0px 24px -8px;
	font-size: 80%;
	}
ol.breadcrumb li {
	padding: 0 8px;
	border-left: 1px dotted #777777;
	height: 1em;
	line-height: 1em;
	&:first-child {
		border-left: none;
	}
}
.title-bannerimg ol.breadcrumb li {
	margin-bottom: 8px;
}
.breadcrumb > .active {
	color: #999999;
}
figure {
	border: none;
	background: none;
}
/* ---------------------
 * BRANDING
 * ---------------------*/
.branding {
    & .header-organization-banner {
        & a {
            & .logo-assets {
                & .logo-text {
					padding-left: 12px;
                    .logo-state, .logo-dept {
						font-family: 'Lato', sans-serif;
                        color: var(--white, #ffffff);
                    }
					.logo-state {
						padding-left: 2px;
					}
                }
            }
        }
    }
}
.breadcrumb
	{
	background: none;
	}
.image-header
	{
	background: none;
	background-position: -2000px -2000px;
	background-size: 1%;
	background-repeat: no-repeat;
	
	}

/*---------------------------------
 * TITLE BANNER (LANDING PAGE)
 * --------------------------------*/
.title-bannerimg 	{
	width: 100%;
	overflow: hidden;
	background-position: center;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-attachment: fixed;
	display: flex;
	position: relative;
	border-bottom: 2px solid var(--color-p2,#1767a4);
	margin-bottom: 1.5rem;
	& .title-banner-bar {
		width: 100%;
		transition: all 0.5s;
		background: rgba(255,255,255,0.95);
		margin-top: 30%;
		padding: 12px 12px 0px;
		& .title-banner-content {
			padding: 0px 0px 24px;
			max-width: 516px;
			margin: 0px auto;
			transition: all 0.5s;
			color: #333333;
			& h1 {
				margin-bottom: 0px;
			}
			& .breadcrumb {
				margin: 8px 0px 16px -8px;
			}
		}	
	}
	@media (min-width: 768px) {
		flex-direction: row-reverse;
		min-height: 60vh;
		border-bottom-width: 6px;
		& .title-banner-bar {
			margin: 0px;
			width: 66.66666667%;
			background: rgba(255,255,255,0.9);
			display: flex;
			flex-direction: column-reverse;
			padding: 24px 24px 36px;
			& .title-banner-content {
				width: 100%;
				margin: 0px;
				max-width: 495px;
				& h1 {
					margin-top: 1rem;
					&:before {
						margin-bottom: 10px;
						content: " ";
						background:  var(--color-p2,#1767a4);
						margin-right: calc(100% - 115px);
						display: block;
						height: 6px;
					}
				}
			}
		}
	}
	@media (min-width: 992px) {
		& .title-banner-bar {
			width: 33.33333333%;
			& .title-banner-content {
				max-width: 370px;
			}
		}		
	}
}
.homepage .title-bannerimg {
	margin-bottom: 0rem;
}
.homepage .title-bannerimg {
	align-items: center;
	min-height: 400px;
	@media (min-width: 768px) {
		min-height: 65vh;
	}
	& .title-banner-bar {
		border-left: 12px solid var(--color-p2, #1767a4);
		width: 100%;
		margin: 0px;
		
		@media (min-width: 1200px) {
			border-left-width: 15px;
			padding-right: 64px;
			width: 66%;
		}
		& .title-banner-content {
			max-width: inherit;
			font-size: 125%;
			& h1 {
				margin-bottom: 1rem;
				line-height: 1;
				font-weight: 800;
				font-size: 2em;
				@media (min-width: 768px) {
					font-size: 2.25em;
				}
				@media (min-width: 1200px) {
					font-size: 2.5em;
				}	
				&::before {
					display: none;
				}
			}
		}
	}


}


/* Small devices */
@media (min-width: 768px) { 


	.icon-bar h2,
	.card-featured h2
		{
		font-size: 1.78rem;
	}

	.icon-bar h3,
	.card-featured h3
		{
		font-size: 1.55rem;
		}

	.icon-bar h4,
	.card-featured h4
		{
		font-size: 1.25rem;
		}


	.image-header
		{
		background-position: right center; 
		background-size: auto 80%;
		padding-right: 4rem;
		}
}
/* Medium devices */
@media (min-width: 992px) { 

	



}

/* Large devices */
@media (min-width: 1280px) { 


}

/* ----------------------
 * Global Header
 * ----------------------*/
.ca-gov-logo-svg {
	background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8192 4563'><path fill='%23ffffff' d='M7850 3454l-4 2c-6-125-108-382-197-463 39-115-15-173-46-212-18-23-79-39-106-49-97-147-304-280-593-365-188-55-410-91-661-96-11 0-24-1-37-1-25 0-53 1-84 3-230 13-583 64-665 64h-7c-35-2-120-40-221-79-119-47-257-98-360-98 0 0-21 0-31 2-97 12-324 157-409 203-58 32-335 150-345 153-133 45-227 197-267 223-4-16-54-86-125-86s-17 1-25 3c-86 36-80 99-80 130-17-7-42-38-89-37s-37 4-59 14c-95 51-44 134-66 163-34 45-146 157-188 234-18 32 2 115-12 148-37 91-238 251-256 288-7 17 47 71 114 123 61 48 82 79 175 104s385-51 443-57h1c17 0 47 11 86 21 34 9 75 17 121 17s26 0 39-2c60-13 100-40 133-73 54-55 86-125 148-152 47-21 108-37 161-37s50 4 70 13c-99 177-77 414-112 448-39 37-69 76-92 113-85 130-97 248-137 276-11 8-26 10-42 10-46 0-109-22-154-22s-20 1-29 4c-53 19-176 133-131 160 14 1 216 1 428 1h184c6 0 118-103 124-103h299c28-4 25-49 154-115 146-57 76-339 263-554 2 0 57-52 70-52 65 0 174 118 566 118s487-135 541-135 81 41 81 54c-175 298 266 632 230 653-1 1-3 1-4 1-15 0-58-24-122-24s-55 4-87 15c-72 24-129 114-74 141 15 0 190 1 364 1s194 0 263-1c22-3 20-45 19-86-1-27-1-53 5-68 18-24 35-108 81-167 46-50 81-89 119-89s31 7 47 21c83 45 282 70 395 111 47 17 80 36 82 62-2 14-13 18-29 18s-15-1-23-2c-28-4-64-13-99-13s-36 3-52 9c-51 19-103 75-118 116-8 22-5 40 16 45h470c54 0 34-108 154-348 18-68-151-160-175-288-16-84-32-250-34-412l3-1 1-1hZ'/><path fill='%23ffffff' d='M5362 193h774l711 1843c-187-43-388-67-598-72h-44c-30 0-61 1-90 3h-10c-13 1-26 2-39 3l-312-807-327 846c-9-4-18-8-27-11-19-8-39-16-59-24-156-62-269-113-422-121-153-7-208 25-208 25l651-1685ZM2279 4542c478 0 838-95 1157-264l69-174c-113 17-258 49-374 21s-180-75-289-161c-42-33-109-87-161-159-120 28-248 43-389 43-924 0-1569-643-1569-1563s681-1568 1550-1550c476 10 919 194 1318 593l283-718C3432 236 2874 30 2292 30S1107 249 685 646C246 1058 4 1639 4 2281c0 1332 936 2262 2275 2262v-1h0Z'/><path fill='%23ffffff' d='M2886 1844l-148-424-148 424h-446l361 276-128 424 361-276 361 276-128-424 361-276h-446 1-Z'/></svg>")
    no-repeat;
}

.global-header {
	background: var(--color-p2, #046b99);
  	& .section-default {
    	background: var(--color-p2, #046b99);
		@media (min-width: 768px) {
			border-bottom: none;
			&::after {
				content: none;
			}
		}
		
	}
    &::after {
      	border-bottom: 1px solid var(--gray-200, #d4d4d7);
		@media (min-width: 768px) {
			border-bottom: none;
			content: none;
		}		
    }
	@media (min-width: 768px) {
		border-bottom: none;
		content: none;
	}	
}
.toggle-menu {
    span {
        background-color:#FFFFFF;
    }
}
.full-width-nav {
    & .nav-item, .nav-item-search {
		@media (width >= 992px) {
    		& .first-level-link, & .first-level-btn {
        		color: var(--white, #ffffff);
				&:hover, &:focus {
					background-color: var(--color-p2-dark, #14588b);
				}
				&.has-sub {
                    .carrot {
                        position: absolute;
                        right: 0.75rem;
                        top: 0.35rem;
                        transition: all 0.5s 
						cubic-bezier(0.57, 0.2, 0.21, 0.89);
                    }
                }
    		}
		}
	}
	
    &:hover, &:focus {
        & > a, & .first-level-btn, & .first-level-link {
            > span[class^="ca-gov-icon"] {
                color: var(--white, #ffffff);
            }
        }
    }
}

.top-level-nav {
	& .nav-item {
		.sub-nav {
			@media (width >= 992px) {
				background: var(--color-p2-dark, #14588b);
            }
			.second-level-link {
				color: var(--white,#ffffff);
			}
        }
    }
}

.full-width-nav .main-navigation {
	&.dropdown {
		& .second-level-nav {
			& .unit1 {
				a.second-level-link:hover, a.second-level-link:focus {
					@media (width >= 992px) {                        
						background-color: var(--color-p2-darker, #104873);
                    }
                }
            }
        }
    }
}
.utility-header {
    background: var(--color-p3, #1d3c51);
    a, p, a:hover {
      color: var(--white, #ffffff);
    }
}

.featured-search {
	& input[type="search"].search-textfield {
		@media (width >= 992px) {
			border-color: var(--color-p2-dark, #14588b) !important;
        }
    }
}
.search-container {
    & #Search {
        .gsc-search-button {
			@media (width >= 992px) {
				background-color: var(--color-p2-darker, #104873);
				border-color: var(--color-p2-dark, #14588b);
				 &:hover, &:focus {
					background-color: var(--color-p2-darkest, #092942);
				}
			}
        }
    }
}
/*--------------------------
 * LISTS
 * -------------------------*/
ol.wp-block-list li,
ul.wp-block-list li,
.cagov-step-list li ul li,
.cagov-step-list li ol li
	{
	margin-bottom: 0.5rem;
	position: relative;
	}
ol.list-alpha-lower,
ol.list-alpha
	{
	list-style-type: lower-alpha;
	}
ol.wp-block-list.list-alpha-upper
	{
	list-style-type: upper-alpha;
	}
ol.list-roman-lower
	{
	list-style-type: lower-roman;
	}
ol.wp-block-list.list-roman-upper
	{
	list-style-type: upper-roman;
	}
.wp-block-list ol,
.wp-block-list ul,
.cagov-step-list li ul,
.cagov-step-list li ol
	{
	margin-top: 0.5rem;
	}
.wp-block-list p + ol,
.wp-block-list p + ul
	{
	margin-top: 0rem;
	}
ol.wp-block-list,
ol.wp-block-list ol,
ul.wp-block-list ol,
.cagov-step-list li ol,
.cagov-step-list li ol ol,
.cagov-step-list li ul ol
	{
	padding-inline-start: 2rem;
	}
ol.wp-block-list li,
.cagov-step-list li ol li
	{
	padding-inline-start: 0.5rem;
	}
ul.wp-block-list,
ul.wp-block-list ul,
ol.wp-block-list ul,
.cagov-step-list li ul,
.cagov-step-list li ul ul,
.cagov-step-list li ol ul
	{
	padding-left: 0rem;
	}
ul.wp-block-list li,
.wp-block-list ul > li,
.cagov-step-list li ul li
	{
	list-style: none; 
	position: relative;
	padding-inline-start: 1rem;
	}
ul.wp-block-list li::before,
.wp-block-list ul > li::before,
.cagov-step-list li ul li::before
	{
	font-family: "Font Awesome 6 Pro";
	-webkit-font-smoothing: antialiased;
	display: inline-block;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	font-size: 0.9rem;
	line-height: 1.4;
	font-weight: 900;
	color: var(--color-p1, #545351);
	content: "\f0da";
	position: absolute;
	top: 7px;
	left: 2px;
	}
.wp-block-list li ul li::before,
.cagov-step-list li ul li ul li::before
	{
	font-weight: 400;
	color: #999999;
	content: "\f0da";
	}
/*--------------------------
 * COVER IMAGE/IMAGE BANNER
 * -------------------------*/
.wp-block-cover,
.wp-block-cover-image {
	min-height: initial;
}
/* -------------------------
 * CARD HIGHLIGHT
 * -------------------------*/
.card {
	background: none;
}

body .card-highlight {
	gap: 30px;

	& h2,h3,h4,h5 {
		margin-top: 0px;
		&:before {
			margin-bottom: 10px;
			content: "";
			width: 40%;
			display: block;
			height: 6px;
			background: var(--color-p1, #545351);
		}
	}
	& .card-body{
		padding: 0px 0px 18px;
		order: 2;
		-webkit-order: 2;
		@media (min-width: 992px) {
			order: initial;
			-webkit-order: initial;
		}	
	}
	& .card-img {
		border-radius: 0px;
		object-fit: cover;
		order: 1;
		-webkit-order: 1;
		@media (min-width: 992px) {
			max-height: none;
			order: initial;
			-webkit-order: initial;
		}
	}
}

/* -----------------------------------
 * DOCUMENT LISTING CARD and CCA CARD
 * -----------------------------------*/
.card-cta {
	font-size: 85%;
	color: #666666;
	padding: 16px 0px;
}
.card.card-document-listing, .card.card-cca {
	border: 1px solid #999999;
	height: auto;
	& .lci-link {
		transition: box-shadow 0.4s linear;
		&::after {
			content: "";
			background: var(--color-p2,#1767a4);
			height: 4px;
			width: 0%;
			transition: all 0.4s;
			display: block;
			padding-top: 4px;	
			position: absolute;
			top: 0px;
			left: 0px;
		}
		&:hover::after {
			width: 30%;
    		transition: all 0.6s;
		}
	}
	&:hover {
		box-shadow: 0px 0px 15px rgba(0,0,0,0.2);
		transition: box-shadow 0.6s linear;
	}
	& p {
		margin-bottom: 0.6rem;
	}
	& .card-cta {

		padding-bottom: 0px;
	}
}
.card.card-cca {
	& figure.card-img {
		margin-bottom: 0px;
		& img {
			max-height: 180px;
		}
	}
	& .card-img {
		border-radius: 0px;
		
	}
	& h3.lci-link a {
		&::before {
			content: "";
			position: absolute;
			top: 0px;
			left: 0px;
			width: 100%;
			height: 100%;
		}
	}
	& .lci-link, h3.lci-link a {
		&::after {
			top: calc(100% - 4px);
			z-index: +2;
		}
		&:hover::after {
			width: 70%;
			max-width: 500px;
		}
	}
}


/* -------------------------
 * PANEL
 * -------------------------*/
.panel {
	border-color: #999999;
	.panel-heading {
		margin-top: 0.25rem;
	}
}
/* ----------------------------
 * LIST LINKS 
 * ----------------------------*/
.list-links {
	& .list-links-item  {
		margin-bottom: 12px;
		&:hover {
			background: none;
		}
		& a.link-grid {
			transition: box-shadow 0.4s linear;
			border-radius: 2px;
			border: 1px solid #666666;
			&::before {
				content: "";
				background: var(--color-p2,#1767a4);
				height: 4px;
				width: 0%;
				transition: all 0.4s;
				display: block;
				padding-top: 4px;	
				position: absolute;
				top: 0px;
				left: 0px;
			}
			&:hover::before,&:focus::before  {
				width: 20%;
    			transition: all 0.6s;
			}
			&:hover,&:focus {
				background: rgba(255,255,255,0);
				box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
				transition: box-shadow 0.6s linear;
			}
		}
	}
}


/* ----------------------------
 * SEARCH AND FILTER 
 * ----------------------------*/
.research-search > .wp-block-group__inner-container {
	@media (min-width: 768px) {
		display: flex;
		gap: 32px;
		align-items: flex-start;
	
		& .research-search-controls {
			flex: 1 0 30%;
		}
		& .research-search-results {
			flex: 1 0 70%;
		}
	}
}
.search-filter-label {

	font-weight: 900;
}
.research-loop li {
	padding-bottom: 32px;
	border-bottom: 1px solid #BBBBBB;
}
.research-loop-pag {
	margin-top: 16px;
}
.research-loop-description {
	font-size: 90%;
}
.research-loop-tags, .research-loop-categories {
	font-size: 85%;
	margin-top: calc(1rem - 6px);
	& .wp-block-post-terms__prefix {
		display: inline-block;
		margin-right: 0.5rem;
	}
	
	& a:not(.btn) {
		display: inline-block;
		padding: 2px 8px;
		background: #D7D6D5;
		border-radius: 2px;
		text-decoration: none;
		color: #111111;
		transition: background 0.3s;
		margin-right: 0.25rem;
		margin-bottom: 6px;
		&:hover {
			background: var(--color-p1-lightest,#AFB8CE);
		}
	}
}
