/*
Theme Name: VOGET.CO Base
Description: Reusable Salient child theme for agency client builds — WordPress Font Library bridges (Salient typography dropdown + front-end @font-face), bundled WPBakery page-builder elements (Gallery, Countdown), and front-end admin tweaks. Deployed byte-identical to every client site; the only per-site work is menu-location remapping on the theme switch.
Theme URI: https://voget.co
Author: VOGET.CO
Author URI: https://voget.co
Template: salient
Version: 1.7.0
Text Domain: vogetco-base
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* =========================================================================
   Gravity Forms — flat / square baseline
   -------------------------------------------------------------------------
   Border COLOUR / WIDTH, input BACKGROUND and TEXT colour, and the hover
   border colour are driven by **Salient Theme Options → Form Styling**
   (tab 28). `vogetco_base_gravity_forms_bridge()` in functions.php reads
   those option values and re-expresses them as the Gravity Forms Theme
   Framework CSS API custom properties (--gf-*), because Salient's own
   Form-Styling CSS targets `body input[type=text]` selectors that lose to
   GF 2.7+ framework markup. That panel is the source of truth; the
   monochrome `--nectar-*` palette is only the fallback for options left
   unset.

   Typography (field labels + descriptions ← Salient "Label"; input text ←
   Salient "Body", size ← Form Styling input size) is also bridged into --gf-*
   tokens there. This stylesheet sets only what those panels have NO control
   over — 5px corner radius, no shadow, plain focus ring, field gap — plus the
   token-consuming `!important` rules that beat Salient's
   `form label { font-size:…!important }` (which hits simple fields' <label> but
   not the <legend> multi-input fields like Name use). `!important` throughout:
   GF 2.7+ prints a per-form inline <style> (`#gform_wrapper_<id>…`, ID
   specificity 1,2,0) after the page stylesheets, and an !important custom-
   property / declaration wins regardless of specificity or order (the pattern
   GF's docs recommend). Validation red (--gf-color-danger) left intact for a11y.
   Refs: https://docs.gravityforms.com/css-api/ · https://docs.css.gravity.com/
   ========================================================================= */

.gform-theme,
.gform-theme--framework,
.gform-theme--foundation,
[data-parent-form] {
	--gf-radius: 5px !important;
	--gf-ctrl-radius: 5px !important;
	--gf-ctrl-btn-radius: 5px !important;
	--gf-ctrl-shadow: none !important;
	--gf-ctrl-btn-shadow: none !important;
	--gf-ctrl-btn-shadow-hover: none !important;

	/* plain focus ring instead of the default blue glow */
	--gf-ctrl-outline-color-focus: rgba(0, 0, 0, 0.35) !important;
	--gf-ctrl-outline-width-focus: 2px !important;

	/* vertical gap between fields — GF default is 40px (row-gap on .gform_fields) */
	--gf-form-gap-y: 10px !important;
	/* space between a label and its input, and around descriptions (GF dflt 8px) */
	--gf-label-space-primary: 4px !important;
	--gf-desc-space: 4px !important;
}

/* Field labels + descriptions: one family / size / weight / case, from the
   tokens the bridge fills from Salient "Label" typography. Needed because
   Salient's Typography CSS forces its own values on GF labels with
   `!important` at up to (0,3,1) — e.g. `body .gform_wrapper .top_label
   .gfield_label { text-transform:uppercase!important; font-size:21px }` on
   sites whose Label style is uppercase (slaplabels.com), and
   `form label { font-size:…!important }` which hits simple fields' <label> but
   not the <legend> multi-input fields (Name, Address, …) render. The
   `html body .gform_wrapper.gform-theme` prefix (0,3,2+) beats those. All
   sizes equal; case follows Salient "Label" text-transform (default none);
   descriptions keep their own (muted) colour, labels take the darker ink. */
html body .gform_wrapper.gform-theme .gfield_label,
html body .gform_wrapper.gform-theme legend.gfield_label,
html body .gform_wrapper.gform-theme .gform-field-label,
html body .gform_wrapper.gform-theme .gfield_description,
html body .gform_wrapper.gform-theme .ginput_counter,
html body .gform_wrapper.gform-theme .charleft,
html body .gform_wrapper.gform-theme .gform_required_legend {
	font-family: var(--gf-ctrl-label-font-family-primary) !important;
	font-size: var(--gf-ctrl-label-font-size-primary) !important;
	font-weight: var(--gf-ctrl-label-font-weight-primary) !important;
	letter-spacing: var(--gf-ctrl-label-letter-spacing-primary) !important;
	text-transform: var(--vc-gf-label-transform, none) !important;
}

/* Labels use the Label line-height; utility text (description, char counter,
   required legend) stays tight so it doesn't inflate the row. */
html body .gform_wrapper.gform-theme .gfield_label,
html body .gform_wrapper.gform-theme legend.gfield_label,
html body .gform_wrapper.gform-theme .gform-field-label {
	line-height: var(--gf-ctrl-label-line-height-primary) !important;
}
html body .gform_wrapper.gform-theme .gfield_description,
html body .gform_wrapper.gform-theme .ginput_counter,
html body .gform_wrapper.gform-theme .charleft,
html body .gform_wrapper.gform-theme .gform_required_legend {
	line-height: 1.35 !important;
}

.gform-theme .gfield_required {
	color: currentColor !important;   /* Salient tints <label> asterisks only */
}

/* Input / textarea / select TEXT: Salient "Body" typography (bridge tokens),
   size from Form Styling's input-text-size. `!important` beats Salient's
   `.container-wrap input[type=text] { font-size:… }`. */
.gform-theme .gfield input,
.gform-theme .gfield textarea,
.gform-theme .gfield select {
	font-family: var(--gf-ctrl-font-family) !important;
	font-size: var(--gf-ctrl-font-size, 1rem) !important;
	font-weight: var(--gf-ctrl-font-weight) !important;
	letter-spacing: var(--gf-ctrl-letter-spacing) !important;
}

/* GF "legacy markup" forms (no .gform-theme wrapper, so the CSS API does not
   apply) get the same flat look; colour + width come from the --vc-gf-*
   variables the bridge sets on :root, monochrome as the fallback. */
.gform_wrapper:not(.gform-theme) .gfield input:not([type=submit]):not([type=button]):not([type=image]):not([type=file]):not([type=radio]):not([type=checkbox]),
.gform_wrapper:not(.gform-theme) .gfield textarea,
.gform_wrapper:not(.gform-theme) .gfield select {
	border: var(--vc-gf-border-width, 2px) solid var(--vc-gf-border-color, var(--nectar-font-color, #1a1a1a)) !important;
	border-radius: 5px !important;
	background-color: var(--vc-gf-bg-color, transparent) !important;
	color: var(--vc-gf-text-color, var(--nectar-font-color, #1a1a1a)) !important;
	box-shadow: none !important;
}

.gform_wrapper:not(.gform-theme) .gform_footer input[type=submit],
.gform_wrapper:not(.gform-theme) .gform_footer button,
.gform_wrapper:not(.gform-theme) .gform_page_footer input[type=submit],
.gform_wrapper:not(.gform-theme) .gform_page_footer button {
	border: var(--vc-gf-border-width, 2px) solid var(--vc-gf-border-color, var(--nectar-font-color, #1a1a1a)) !important;
	border-radius: 5px !important;
	background: var(--vc-gf-border-color, var(--nectar-font-color, #1a1a1a)) !important;
	color: var(--nectar-bg-color, #fff) !important;
	box-shadow: none !important;
	text-shadow: none !important;
}