/*
Theme Name: UE-Vantanera
Theme URI: https://un-ev.com
Author: Georg Kettele
Author URI: https://www.georgkettele.com
Description: Custom Theme for UE Block Theme
Tags: Blog, Research, Portfolio, Architecture, Landscape, Designer, Discourse 
Version: 1.0
Requires at least: 5.0
Tested up to: 5.4
Requires PHP: 8.0
Text Domain: ue-domain
*/


/* WPForms :root CSS Variables Override */

/* Method 1: Direct :root override (for black background forms) */
/* WPForms :root CSS Variables Override */

/* Method 1: Direct :root override (for black background forms) */
:root {
    /* Label Colors - WHITE for black background */
    --wpforms-label-color: #ffffff !important;
    --wpforms-label-sublabel-color: #ffffff !important;
    --wpforms-field-required-color: #ffffff !important;
    
    /* Input Field Styles - Square with white borders */
    --wpforms-field-border-color: #ffffff !important;
    --wpforms-field-border-color-focus: #ffffff !important;
    --wpforms-field-background-color: transparent !important;
    --wpforms-field-text-color: #ffffff !important;
    --wpforms-field-border-style: solid !important;
    --wpforms-field-border-size: 1px !important;
    --wpforms-field-border-radius: 0px !important; /* Square corners */
    --wpforms-field-size-input-height: 48px !important;
    --wpforms-field-size-input-spacing: 0px !important;
    --wpforms-field-size-font-size: 32px !important;
    --wpforms-field-size-line-height: 1.3 !important;
    --wpforms-field-size-padding-h: 0px !important;
    
    /* Label Sizing */
    --wpforms-label-size-font-size: 16px !important;
    --wpforms-label-size-line-height: 1.3 !important;
    --wpforms-label-size-spacing: 5px !important;
    --wpforms-label-size-sublabel-font-size: 14px !important;
    --wpforms-label-size-sublabel-line-height: 1.3 !important;
    
    /* Submit Button - Square with white border */
    --wpforms-button-background-color: yellow !important;
    --wpforms-button-background-color-hover: black !important;
    --wpforms-button-text-color: #000000 !important;
    --wpforms-button-text-color-hover: yellow !important;
    --wpforms-button-border-color: #000000 !important;
    --wpforms-button-border-color-hover: #000000 !important;
    --wpforms-button-size-font-size: 24px !important;
    --wpforms-button-border-radius: 0px !important; /* Square button */
    --wpforms-button-size-height: auto !important;
    --wpforms-button-size-padding: 16px 32px !important; /* py-4 px-8 equivalent */
    --wpforms-button-size-margin: 10px 0 0 0 !important;
    
    /* Container */
    --wpforms-container-shadow: none !important;
    
    /* Error States */
    --wpforms-field-error-color: #ff6b6b !important;
    --wpforms-field-error-border-color: #ff6b6b !important;
    --wpforms-field-error-background-color: rgba(255, 107, 107, 0.1) !important;
}

/* Field Width Controls */
.wpforms-field {
    width: 100% !important;
    max-width: 100% !important;
}

/* Make name field container full width */
.wpforms-field-name {
    width: 100% !important;
}

/* Name field row - full width with flex */
.wpforms-field-name .wpforms-field-row {
    display: flex !important;
    width: 100% !important;
    gap: 15px !important; /* Space between first and last name */
}

/* First and last name inputs - each 50% minus gap */
.wpforms-field-name .wpforms-field-row-block {
    flex: 1 !important;
    width: calc(50% - 7.5px) !important;
    max-width: none !important;
}

/* All other input fields 100% width */
.wpforms-field input[type="text"],
.wpforms-field input[type="email"],
.wpforms-field textarea {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 0 !important;
    border-bottom: 1px solid #ffffff !important;
    border-top: 0px solid #ffffff !important;
    border-left: 0px solid #ffffff !important;
    border-right: 0px solid #ffffff !important;
    background: transparent !important;
    color: #ffffff !important;
}

/* Ensure name field inputs are also 100% of their container */
.wpforms-field-name input[type="text"] {
    width: 100% !important;
}

/* CHECKBOX STYLING - Larger custom checkbox */
.wpforms-field-checkbox input[type="checkbox"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    width: 24px !important;
    height: 24px !important;
    border: 2px solid #ffffff !important;
    border-radius: 0 !important;
    background: transparent !important;
    cursor: pointer !important;
    position: relative !important;
    margin-right: 12px !important;
    flex-shrink: 0 !important;
}

/* Checkbox checked state */
.wpforms-field-checkbox input[type="checkbox"]:checked {
    background: #ffffff !important;
    border-color: #ffffff !important;
}

/* Custom checkmark */
.wpforms-field-checkbox input[type="checkbox"]:checked::after {
    content: "✓" !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    color: #000000 !important;
    font-size: 16px !important;
    font-weight: bold !important;
    line-height: 1 !important;
}

/* Checkbox list item layout */
.wpforms-field-checkbox li {
    display: flex !important;
    align-items: flex-start !important;
    margin-bottom: 10px !important;
    gap: 12px !important;
}

/* Checkbox inline label */
.wpforms-field-checkbox .wpforms-field-label-inline {
    color: #ffffff !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    cursor: pointer !important;
    flex: 1 !important;
    margin: 0 !important;
}

/* Checkbox focus state */
.wpforms-field-checkbox input[type="checkbox"]:focus {
    outline: 2px solid rgba(255, 255, 255, 0.5) !important;
    outline-offset: 2px !important;
}

/* Submit button styling */
.wpforms-submit {
    display: inline-block !important;
    text-align: center !important;
    border: 1px solid #000 !important;
    border-radius: 0 !important;
    padding: 16px 32px !important; /* py-4 px-8 */
    background: yellow !important;
    color: #000 !important;
    font-size: 32px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.wpforms-submit:hover {
    background: #ffffff !important;
    color: #000000 !important;
    border-color: #ffffff !important;
}

/* Focus states */
.wpforms-field input[type="text"]:focus,
.wpforms-field input[type="email"]:focus,
.wpforms-field textarea:focus {
    border-color: #ffffff !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Placeholder text color */
.wpforms-field input::placeholder,
.wpforms-field textarea::placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

/* Labels and sublabels */
.wpforms-field-label,
.wpforms-field-sublabel {
    color: #ffffff !important;
}

/* Required asterisk */
.wpforms-required-label {
    color: #ffffff !important;
}

/* Ensure form container doesn't restrict width */
.wpforms-container {
    width: 100% !important;
    max-width: 100% !important;
}

.wpforms-form {
    width: 100% !important;
    max-width: 100% !important;
}

.wpforms-field-container {
    width: 100% !important;
}

/* CHECKBOX STYLING - Hide default and create custom */
.wpforms-field-checkbox input[type="checkbox"] {
    opacity: 0 !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
}

/* Custom checkbox styling */
.wpforms-field-checkbox input[type="checkbox"] + label::before {
    content: "" !important;
    display: inline-block !important;
    width: 24px !important;
    height: 24px !important;
    border: 2px solid #ffffff !important;
    border-radius: 0 !important;
    background: transparent !important;
    margin-right: 12px !important;
    position: relative !important;
    vertical-align: top !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
}

/* Checkbox checked state */
.wpforms-field-checkbox input[type="checkbox"]:checked + label::before {
    background: #FCEA0D !important;
    border-color: #FCEA0D !important;
}

/* Custom checkmark */
.wpforms-field-checkbox input[type="checkbox"]:checked + label::after {
    content: "✓" !important;
    position: absolute !important;
    left: 7px !important;
    top: 2px !important;
    color: #000000 !important;
    font-size: 16px !important;
    font-weight: bold !important;
    line-height: 1 !important;
    pointer-events: none !important;
}

/* Checkbox list item layout */
.wpforms-field-checkbox li {
    display: flex !important;
    align-items: flex-start !important;
    margin-bottom: 10px !important;
    gap: 12px !important;
}

/* Checkbox inline label */
.wpforms-field-checkbox .wpforms-field-label-inline {
    color: #ffffff !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    cursor: pointer !important;
    flex: 1 !important;
    margin: 0 !important;
}

/* Checkbox focus state */
.wpforms-field-checkbox input[type="checkbox"]:focus {
    outline: 2px solid rgba(255, 255, 255, 0.5) !important;
    outline-offset: 2px !important;
}

.wpforms-field-large{
    padding-bottom: 24px !important;
}