/*
Theme Name:     Coresurgery
Theme URI:
Description:    Astra child theme.
Author:         Me
Author URI:
Template:       astra
Version:        0.1.0
*/


@tailwind base;
@tailwind components;
@tailwind utilities;

/*
 * ---------------------------------------------------------------------------------------------------------------------
 * Theme Overrides / Global
 * =====================================================================================================================
 */

:root {
	--clr-dark: #282D3D;
	--clr-blue: #2249D6;
	--clr-light-blue: #E5EBFF;
	--clr-grey: #EEEEEE;
	--clr-bg-grey: #E5E8EF;
	--clr-white: #ffffff;
	--clr-black: #000000;

	--fw-regular: 400;
	--fw-bold: 700;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
li {
	font-optical-sizing: auto;
}

.ast-container .cs-text-editor p,
.ast-container .cs-text-editor li {
	font-size: 1rem;
	line-height: 1.5rem;
}

header.entry-header,
nav.navigation {
	display: none !important;
}

.single.ast-page-builder-template .entry-header + .entry-content {
	margin-bottom: 0 !important;
}

.site-content .ast-container {
	display: block;
}

.site-content p {
	margin-bottom: 1em !important;
}

.site-content a {
	color: var(--clr-blue);
}

#ast-scroll-top {
	background-color: var(--clr-blue);
}

#ast-scroll-top .ast-icon.icon-arrow svg {
	transform: translate(0,100%) rotate(180deg);
	margin: 0 auto;
}


.cor-hero__content-gradient {
	background: rgb(34,73,214);
	background: -moz-linear-gradient(90deg, rgba(34,73,214,1) 0%, rgba(229, 232, 239,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(34,73,214,1) 0%, rgba(229, 232, 239,1) 100%);
	background: linear-gradient(90deg, rgba(34,73,214,1) 0%, rgba(229, 232, 239,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2249d6",endColorstr="#e5e8ef",GradientType=1);
}


ul {
	list-style: disc;
	margin: 0 0 1.5em 3em;
}
ul li {
	margin-bottom: 0.5em;
}

.single-post img {
	border-radius: 0.5rem !important;
}


/*
 * ---------------------------------------------------------------------------------------------------------------------
 * Accordion
 * =====================================================================================================================
 */

.accordion {
	background-color: var(--clr-white);
	color: var(--clr-dark);
	cursor: pointer;
	padding: 1em;
	width: 100%;
	text-align: left;
	border: 1px solid var(--clr-black);
	outline: none;
	transition: 0.4s;
	/*margin-bottom: 0.5em;*/
}

.active,
.accordion:hover,
.accordion:active,
.accordion:visited,
.accordion:focus {
	background-color: var(--clr-blue);
	border-color: var(--clr-blue);
	color: var(--clr-white);
}

/* Style the accordion panel. Note: hidden by default	 */
.panel {
	padding: 0 1em;
	background-color: white;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
}



/*
 * ---------------------------------------------------------------------------------------------------------------------
 * CTA
 * =====================================================================================================================
 */

.wp-block-heading {
	font-size: 1.5rem !important;
	line-height: 2rem !important;
	color: var(--clr-white) !important;
}

p.has-text-align-right {
	color: var(--clr-white) !important;
}

a.wp-block-button__link {
	background-color: var(--clr-dark) !important;
	color: var(--clr-white) !important;
	border-color: var(--clr-white) !important;
}



/*
 * ---------------------------------------------------------------------------------------------------------------------
 * Gravity Forms
 * =====================================================================================================================
 */
input[type="submit"],
input[type="submit"]:hover,
input[type="submit"]:active,
input[type="submit"]:visited,
input[type="submit"]:focus {
	background-color: var(--clr-dark) !important;
	color: var(--clr-white) !important;
	border-color: var(--clr-white) !important;
}




/*
 * ---------------------------------------------------------------------------------------------------------------------
 * ---------------------------------------------------------------------------------------------------------------------
 * Media Queries
 * =====================================================================================================================
 * =====================================================================================================================
 */

/* Small phone (~320px) */
@media only screen and (min-width: 20em)
{
	.cor-content-bg__left,
	.cor-content-bg__right {
		background-image: none;
	}
}

/* Low DPI Laptop (~1280px) */
@media only screen and (min-width: 80em)
{
	/*.wp-block-column {
		margin-left: 28em !important;
	}*/

	.wp-block-cover .wp-block-cover__inner-container,
	.wp-block-cover-image .wp-block-cover__inner-container {
		width: 1280px;
	}

	.cor-content-bg__left {
		background-image: url(/wp-content/themes/coresurgery/images/bg/cs-bg__logo-left-001.webp);
		background-position: top left;
		background-size: contain;
		background-repeat: no-repeat;
	}

	.cor-content-bg__right {
		background-image: url(/wp-content/themes/coresurgery/images/bg/cs-bg__logo-right-001.webp);
		background-position: bottom right;
		background-size: contain;
		background-repeat: no-repeat;
	}

	.ast-narrow-container .site-content > .ast-container {
		max-width: 100%;
		padding: 0;
	}
}




/* HD Monitor (~1920px) */
@media only screen and (min-width: 120em)
{
	/*.wp-block-column {
		margin-left: 28em !important;
	}*/

	.wp-block-cover .wp-block-cover__inner-container,
	.wp-block-cover-image .wp-block-cover__inner-container {
		width: 1536px;
	}
}
