/*
Theme Name: Frost Child - Kristina Ferro
Theme URI:
Description: Child theme of FrostWP, built for Scarlett FX Makeup.
Author: Ben Rollier
Author URI: https://benrollier.com
Template: frost
Version: 1.0.0
Text Domain: frost-child
*/

/*
This file's header comment block above is what WordPress reads to
register frost-child as a theme and link it to its parent ("frost").
The "Template:" value must exactly match the parent theme's actual
folder name under wp-content/themes/ — if FrostWP's folder isn't
literally named "frost", change this line to match or the child
theme won't recognize its parent at all.

Actual visual styling for this project lives in theme.json (colors,
spacing, font sizes) plus assets/css/navigation.css and
assets/css/typography.css (both enqueued from functions.php), rather
than in this file's body — that's the standard approach for a block
theme. Add rules below only for things that don't fit those two
mechanisms (e.g. a one-off fix you want to keep separate).
*/


/* Fonts
---------------------------------------- */
@font-face {
    font-family: 'Big Shoulders 18pt';
    src: url('assets/css/fonts/BigShoulders18pt-Black.woff2') format('woff2'),
        url('assets/css/fonts/BigShoulders18pt-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Big Shoulders 18pt';
    src: url('assets/css/fonts/BigShoulders18pt-Bold.woff2') format('woff2'),
        url('assets/css/fonts/BigShoulders18pt-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Big Shoulders 18pt';
    src: url('assets/css/fonts/BigShoulders18pt-ExtraBold.woff2') format('woff2'),
        url('assets/css/fonts/BigShoulders18pt-ExtraBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Big Shoulders 18pt';
    src: url('assets/css/fonts/BigShoulders18pt-ExtraLight.woff2') format('woff2'),
        url('assets/css/fonts/BigShoulders18pt-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Big Shoulders 18pt';
    src: url('assets/css/fonts/BigShoulders18pt-Light.woff2') format('woff2'),
        url('assets/css/fonts/BigShoulders18pt-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Big Shoulders 18pt';
    src: url('assets/css/fonts/BigShoulders18pt-Medium.woff2') format('woff2'),
        url('assets/css/fonts/BigShoulders18pt-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Big Shoulders 18pt';
    src: url('assets/css/fonts/BigShoulders18pt-Regular.woff2') format('woff2'),
        url('assets/css/fonts/BigShoulders18pt-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Big Shoulders 18pt';
    src: url('assets/css/fonts/BigShoulders18pt-SemiBold.woff2') format('woff2'),
        url('assets/css/fonts/BigShoulders18pt-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Big Shoulders 18pt';
    src: url('assets/css/fonts/BigShoulders18pt-Thin.woff2') format('woff2'),
        url('assets/css/fonts/BigShoulders18pt-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}


/*Backstage Icon addition*/
@font-face {
  font-family: "bobinacons";
  src: url("assets/css/fonts/bobinacons.eot?t=1791061267070"); /* IE9*/
  src: url("assets/css/fonts/bobinacons.eot?t=1791061267070#iefix") format("embedded-opentype"), url("assets/css/fonts/bobinacons.woff2?t=1791061267070") format("woff2"), url("assets/css/fonts/bobinacons.woff?t=1791061267070") format("woff"), url("assets/css/fonts/bobinacons.ttf?t=1791061267070") format("truetype"), url("assets/css/fonts/bobinacons.svg?t=1791061267070") format("svg");
}
[class^=hgi-], [class*=" hgi-"] {
  font-family: "bobinacons" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.hgi-backstage::before {
  content: "\f0000";
}

/*FORMINATOR FIXES*/
#forminator-module-251 button.forminator-button-submit {
background: linear-gradient(190deg, rgb(26, 201, 180) 0%, rgb(18, 122, 112) 100%) !important;
font-size: 1.5rem !important;
font-family: 'Big Shoulders' !important;
font-weight: 400 !important;
text-transform: uppercase;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
color: #ffffff;
transition: all .3s ease-in-out !important;
box-shadow: none;
}

/* 1. Setup the button container */
button.forminator-button-submit {
    position: relative;
    z-index: 1;
    overflow: hidden;
    background: linear-gradient(190deg, rgb(26, 201, 180) 0%, rgb(18, 122, 112) 100%) !important;
}

/* 2. Create the hover layer */
button.forminator-button-submit::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(190deg, rgb(18, 122, 112) 0%, rgb(26, 201, 180) 100%);
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
    z-index: -1; /* Place behind the text but above the button bg */
}

/* 3. Fade in the layer on hover */
button.forminator-button-submit:hover::before {
    opacity: 1 !important;
}

/* 4. Ensure text stays visible */
button.forminator-button-submit span {
    position: relative;
    z-index: 2;
}

.forminator-field:has(.forminatorSubmit) {
text-align: center;
}

.forminator-input {
box-shadow: -2px 2px 0px 0px rgba(0, 0, 0, 0.19) !important;
-webkit-appearance: none;
color: var(--kb-form-text-color, var(--global-palette5, #555352));
border: var(--kb-form-border-width, 1px) solid var(--kb-form-border-color, var(--global-gray-400, #cbd5e0));
font-size: var(--kb-form-font-size, 1rem);
line-height: var(--kb-form-line-height, 1.6);
border-radius: var(--kb-form-border-radius, 3px);
padding: var(--kb-form-v-padding, 0.4em) var(--kb-form-h-padding, 0.5em);
max-width: 100%;
background: var(--kb-form-background-color, var(--global-palette9, #fff));
}

.forminator-label {
font-size: 1rem !important;
font-weight: 400 !important;
}


.forminator-textarea {
-webkit-appearance: none;
color: var(--kb-form-text-color, var(--global-palette5, #555352));
border: var(--kb-form-border-width, 1px) solid var(--kb-form-border-color, var(--global-gray-400, #cbd5e0));
font-size: var(--kb-form-font-size, 1rem);
line-height: var(--kb-form-line-height, 1.6);
border-radius: var(--kb-form-border-radius, 3px);
padding: var(--kb-form-v-padding, 0.4em) var(--kb-form-h-padding, 0.5em);
max-width: 100%;
background: var(--kb-form-background-color, var(--global-palette9, #fff));
box-shadow: -2px 2px 0px 0px rgba(0, 0, 0, 0.19) !important;
}

.forminator-error-message {
background: #fed496 !important;
}


/* Defaults
---------------------------------------- */

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

html {
	scroll-behavior: smooth;
}

a,
button,
input:focus,
input[type="button"],
input[type="submit"],
textarea:focus,
.wp-element-button {
	transition: all 0.2s ease-in-out;
}

a,
a:focus,
a:hover,
a:not(.wp-element-button) {
	text-decoration-thickness: 1px;
}

b,
strong,
th {
	font-weight: var(--wp--custom--font-weight--bold);
}

mark {
	background: linear-gradient(90deg, var(--wp--preset--color--primary) 0%, var(--wp--preset--color--primary) 100%);
	background-position: 0 85%;
	background-repeat: repeat-x;
	background-size: 100% 15%;
}

/* -- Forms -- */

input,
select,
textarea {
	background-color: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--contrast);
	border-radius: 0;
	color: var(--wp--preset--color--contrast);
	font-family: var(--wp--preset--font-family--primary);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: var(--wp--custom--font-weight--light);
	line-height: var(--wp--custom--line-height--body);
	padding: 10px 20px;
	width: 100%;
}

input:focus,
textarea:focus {
	background-color: var(--wp--preset--color--neutral);
	outline: none;
}

input[type="checkbox"],
input[type="image"],
input[type="radio"] {
	width: auto;
}

input[type="button"],
input[type="email"],
input[type="search"],
input[type="submit"],
input[type="text"],
textarea {
	-webkit-appearance: none;
}

::placeholder {
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--small);
	opacity: 0.5;
}

/* Blocks
---------------------------------------- */

/* -- Code -- */

*:not(.wp-block-code) > code {
	background-color: var(--wp--preset--color--neutral);
	font-size: var(--wp--preset--font-size--small);
	padding: 5px 8px;
}

/* -- Navigation -- */

.wp-block-navigation__responsive-container.is-menu-open {
	padding: var(--wp--custom--spacing--gap);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: var(--wp--custom--spacing--gap);
}

.wp-block-navigation__responsive-container-close,
.wp-block-navigation__responsive-container-open {
	border: 1px solid currentColor;
	padding: 2px;
}

.has-background .wp-block-navigation__responsive-container-open:focus,
.has-background .wp-block-navigation__responsive-container-open:hover {
	color: var(--wp--preset--color--base);
}

/* -- Navigation Submenu -- */

.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container {
	background-color: var(--wp--preset--color--contrast);
	border: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
	padding: 10px;
}

.wp-block-navigation :where(.wp-block-navigation__submenu-container) a {
	padding: 2px 10px;
}

/* Utility
---------------------------------------- */

/* -- Box Shadow -- */

.is-style-shadow-light {
	box-shadow: var(--wp--preset--shadow--light);
}

.is-style-shadow-solid {
	box-shadow: var(--wp--preset--shadow--solid);
}


/* CUSTOM
---------------------------------------- */

.bioPic img {
padding: 5px;
}


.frost-child-offcanvas-close {
position: absolute;
top: 20px;
right: 20px;
}

.hireButtonMobile {
display: none;
}

.footerIcons {
    margin-top: 0px;
}

.footerList li {
    text-align: right;
    list-style: none;
}

li.current-menu-item a {
color: #1AC9B4;
}

li.menu-item a {
font-weight: bold;
font-size: 1rem !important;
}

/* Hide Kadence default SVG inside this specific block */
.backstageIcon svg {
  display: none !important;
}

/* Insert custom icon using your custom font icon set */
.backstageIcon .kb-svg-icon-wrap::before {
  content: "\f0000";
  font-family: 'bobinacons' !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 2rem;
  line-height: 2.5rem;
  color: #FFBC42;
  cursor: pointer;
}



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

@media only screen and (max-width: 600px) {

	/* -- Utility -- */

	.is-style-hidden-mobile {
		display: none !important;
	}

}

@media only screen and (max-width: 782px) {

	/* -- Columns -- */

	.is-style-columns-reverse {
		flex-direction: column-reverse;
	}
	
.dataRow {
margin-bottom: 30px;
}

ul.footerList {
padding: 0px;
margin-left: 0px !important;
}

ul.footerList li {
list-style: none;	
}

.footerLogo img {
max-width: 300px;
}

.footerColCenter, .footerColCenter p {
text-align: center;
}


.hireButtonMobile {
margin-top: 30px;
display: inline-block;
}

.hireButtonDesktop {
display: none;
}

.footerList li, .footerService{
text-align: center !important;
}

li.menu-item a {
font-size: 1.5rem !important;
}


}
