/*
 * These styles are outputted both of the frontend and backend of the site
 * Please note any changes you do make may also make changes to the WP backend default styles.
 * Edit with caution
 */

/* Client color variables */
:root {
	--brand-1: #005836;
	--brand-2: #38b34b;
	--brand-3: #efefef;
	--brand-4: #ffffff;
	--brand-5: #ffffff;
	--brand-6: #ffffff;
	--brand-7: #ffffff;
	--brand-8: #ffffff;
	--text-color: #383a39;
	/* Add other brand colours as required. Note that if you add more than 4 you will need to update the colour picker in functions.php */
	
	--shadow: #efefef;
}

section{position: relative;}

.dark-green-text { color: var(--brand-1);}

.hero-content h1{font-size: 12vw;}

.color-grid { display: grid; grid-template-columns: repeat(5, 1fr); grid-gap: 2rem; }
.color-box { display: flex; align-items: center; justify-content: center; color: #fff; text-shadow: 0 .25rem .25rem rgba(0, 0, 0, .2); padding: 2rem; box-sizing: border-box; box-shadow: 0 .5rem .5rem rgba(0, 0, 0, .1); border-radius: 1rem; }

.brand-1 { background-color: var(--brand-1); }
.brand-2 { background-color: var(--brand-2); }
.brand-3 { background-color: var(--brand-3); }
.brand-4 { background-color: var(--brand-4); }
.brand-5 { background-color: var(--brand-5); }
.brand-6 { background-color: var(--brand-6); }
.brand-7 { background-color: var(--brand-7); }
.brand-8 { background-color: var(--brand-8); }
.brand-shadow { background-color: var(--shadow); }

a.button { background: var(--brand-2); padding: .5rem 1.5rem; color:#ffffff; display:inline-block; border-radius: 5000rem; text-decoration: none; cursor: pointer; transition: ease-in-out .2s;}
a.button:hover { background-color: var(--brand-1); color: #fff; padding: .5rem 2rem; transition: ease-in-out .2s;}

a.button1{ background: var(--brand-1); padding: .3rem 1.3rem; color:#ffffff; display:inline-block; border-radius: 5000rem; text-decoration: none; cursor: pointer; transition: ease-in-out .2s; border: 2px solid var(--brand-1);}
a.button1:hover { background: var(--brand-2); color: #fff; padding: .3rem 1.8rem; transition: ease-in-out .2s;}

/** Block Graphics **/
.block-graphics{position: absolute; width: 100%; height: 100%; top: 50%; left: 0; transform: translateY(-50%);}
.block-graphics .graphics-wrapper{position: relative; height: 100%; width: 100%;}
 
.block-graphic {position: absolute; width: 100%; height: 100%; transform: translateY(-50%);}
.block-graphic svg{height: 100%; width: 100%;}

/* WooCommerce Overides */
body .woocommerce-info::before { color: var(--brand-1); }
body .woocommerce-info { border-top-color: var(--brand-1); }
body .woocommerce-error, body .woocommerce-info, body .woocommerce-message { background-color: var(--brand-3); color: var(--brand-1); border-top: 3px solid var(--brand-2); }

/* Site Banner - from Theme options */
.site-banner { background-color: var(--brand-2); color: #fff; text-align: center; padding: 1rem 0; min-height: 3rem; z-index: 999; }
.site-banner p { margin: 0; }
.site-banner.fixed { position: fixed; width: 100%; }
.site-banner.fixed > header { margin-top: 10rem; }

/* Generic site header section */

.main-header { background: var(--brand-1); color: #fff !important; }
.main-header h1,
.main-header h2,
.main-header h3 { margin-bottom: 0; }
.main-header a { color: #fff; text-decoration: underline; }
.main-header a:hover { text-decoration: none; }
.main-header .container .col a.button:last-of-type { margin-left: 4rem; }
.header-overlay { position: absolute; z-index: 1; }


/* Credits Hero */
.credits-hero {position: relative;}
.credits-hero .grid{grid-template-columns: 2fr 1fr; grid-gap: 2rem;}
.credits-hero .text-col{position: relative; background-image: url('/wp-content/uploads/hero-text-bg.jpg'); background-position: center; background-size: cover; background-repeat: no-repeat; color: #fff; z-index: 10;}
.credits-hero .hero-overlay{position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;}

.credits-hero .content-wrapper{padding: 12.5rem 3rem; display: grid; align-items: center; justify-content: center; text-transform: uppercase;}

.credits-hero .image-col{background-position: center; background-size: cover; background-repeat: no-repeat; background-image: url('/wp-content/uploads/hero-image-bg.jpg');}

.credits-hero h1,
.credits-hero h2,
.credits-hero h3,
.credits-hero h4,
.credits-hero h5,
.credits-hero h6{color: #fff;}

.credits-hero h1{font-size: 7rem;}
.credits-hero h2{font-size: 3.25rem;}

.credits-hero h1+h2{margin-top: 2rem;}

/* Fix Gravity Forms wrapper in admin */
.gform-settings__wrapper { max-width: 80% !important; }
html .wrap.gforms_edit_form { font-size: 140%; }

/* WYSIWYG Formats */
p.alert-paragraph { display: flex; align-items: center; background: var(--brand-1); color: #fff; padding: 2rem; border-radius: 2rem; margin: 4rem 0; position: relative; }
p.alert-paragraph:before { content:""; display: block; background: transparent url('/wp-content/themes/toast/assets/images/warning.svg') center center no-repeat; background-size: contain; height: 4rem; width: 6rem; margin-right: 2rem; }
ul.boxed-list { background: var(--shadow); padding: 4rem 4rem 3.5rem 4rem; list-style: inside; }
section blockquote { padding: 0 0 0 6rem; border-left: 3rem solid var(--brand-1); margin: 0; }
section blockquote p { font-size: 4rem; line-height: 1.1; }
section blockquote p:last-of-type { margin-bottom: 0; }

/* Base table styles */
section[class*="block-"] table { width: 100%; border-collapse: collapse; table-layout: auto; }
section[class*="block-"] th, section[class*="block-"] td { text-align: left; padding: 8px; }
section[class*="block-"] th { background-color: #f2f2f2; color: #333; }
section[class*="block-"] tr:nth-child(even) { background-color: #f9f9f9; }
section[class*="block-"] tr:hover { background-color: #e8e8e8; }
section[class*="block-"] table, section[class*="block-"] th, section[class*="block-"] td { border: 1px solid #ddd; }
/* Responsive wrapper */
.wrap-table100 { overflow-x: auto; /* Enable horizontal scrolling */ }

@media screen and (max-width: 600px) {
  th, td {
    padding: 15px; /* Increase padding for smaller screens for better readability */
  }
}



/* ACF Admin Field overrides */
.block-editor .edit-post-sidebar .acf-fields > .acf-field.quarter { width: 20% !important; float: left !important; margin: 10px 5px 10px 16px !important; }
.block-editor .edit-post-sidebar .acf-fields > .acf-field.quarter.-c0 { clear: none !important; }
.block-editor .edit-post-sidebar .acf-fields > .acf-field.half { width: 20% !important; float: left !important; margin: 10px 5px 10px 16px !important; }
.block-editor .edit-post-sidebar .acf-fields > .acf-field.half.-c0 { clear: none !important; }

.block-editor-block-list__block.lmmt, .block-editor-block-list__block.mmmt, .block-editor-block-list__block.smmt{ z-index: 1;}
.acf-block-preview .block-feature-block{background-color: var(--brand-1); z-index: 1 !important; margin-top: 0 !important;}
.acf-block-preview .block-feature-block .container{max-width: 90% !important; }
.acf-block-preview .block-feature-block .content-wrapper{padding: 2rem 0 !important;}

/*Add your global styles below*/
.gallery dl.gallery-item img { border: 0 !important; /* Remove this if you want borders on the images in WP Galleries */ }

/*------------- Remove if neccessary -------------**/


/*------------- Remove iphone styling -------------**/
input[type=text], input[type=button] { -webkit-appearance: none; -webkit-border-radius: 0; }


/*------------- Do not remove the styles below this line -------------*/
li#wp-admin-bar-wpengine_adminbar, li#wp-admin-bar-wpseo-menu { display: none; } 
body.wp-admin .wp-block { padding: 0 !important; margin: 2rem 0 !important;} /* Removes the 2x padding or margin on blocks in the editor */
.wp-block{max-width:none;}
.admin-toast-support a, .admin-toast-support:hover a{background:#e88b39 !important;color:#ffffff !important;}
.admin-css-file a, .admin-css-file:hover a{background:#0c4e56 !important;color:#ffffff !important;}
#wp-admin-bar-directory-size .ab-item, li#wp-admin-bar-directory-size:hover {background: #d63638 !important; color: #fff !important; }
#wp-admin-bar-directory-size .ab-item:after { content: " of 3000 MB"; font-weight: normal;}
.ab-item span.mbs { font-weight: bold; }
.acf-repeater .acf-row:nth-child(odd) .acf-row-handle.order { background: var(--brand-1); }
.acf-repeater .acf-row:nth-child(even) .acf-row-handle.order { background: var(--brand-2); }
.acf-repeater .acf-row-handle.order { color: #fff !important; text-shadow: none !important; }




/* Adjust scale factor for different breakpoints */
@media (min-width: 993px) { /* Sets the margins and padding to standard over this viewport size */
    :root { --scale-factor: 1; }
}
@media (max-width: 992px) { /* Reduces the margins for the smaller screen sizes */
    :root { --scale-factor: 0.8; }
}
@media (max-width: 768px) {
    :root { --scale-factor: 0.6; }
}
@media (max-width: 576px) {
	:root { --scale-factor: 0.4; }
	p { word-break: break-word; }
	/* Site Banner */
	.site-banner.fixed { position: relative; width: 100%; }
	.site-banner.fixed > header { margin-top: 0rem; }
	.site-banner p { font-size: 80%; }
}