/*
 Theme Name: maroelaguesthousebrits
 Theme URI: https://www.myguru.co.za
 Description: Designed & Developed by MyGuru.
 Author: MyGuru
 Author URI: https://www.myguru.co.za
 Template: Divi
 Version: 1.0.0
*/
 
/* =Theme customization starts here
------------------------------------------------------- */



:root {
  /* Fluid sizes */
  --h1-size: clamp(2.5rem, 1.5rem + 3.6vw, 4.35rem);
  --h2-size: clamp(1.85rem, 1.3rem + 2.2vw, 2.85rem);
  --h3-size: clamp(1.5rem, 1.15rem + 1.4vw, 2.1rem);
  --h4-size: clamp(1.25rem, 1.05rem + 0.9vw, 1.65rem);
  --h5-size: clamp(1.125rem, 1rem + 0.55vw, 1.35rem);
  --h6-size: clamp(1rem, 0.95rem + 0.3vw, 1.2rem);
}

h1 {
  font-size: var(--h1-size);
  font-weight: 800;
  line-height: 1.2;
}

h2 {
  font-size: var(--h2-size);
  font-weight: 700;
  line-height: 1.25;
}

h3 {
  font-size: var(--h3-size);
  font-weight: 600;
  line-height: 1.3;
}

h4 {
  font-size: var(--h4-size);
  font-weight: 600;
  line-height: 1.35;
}

h5 {
  font-size: var(--h5-size);
  font-weight: 600;
  line-height: 1.4;
}

h6 {
  font-size: var(--h6-size);
  font-weight: 600;
  line-height: 1.4;
}





/* =========================================================
   Gravity Forms – Comprehensive Dark Theme Styling
   ========================================================= */

/* Labels */
.gform_wrapper .gfield_label,
.gform_wrapper .gform-field-label,
.gform_wrapper .gsection_title {
    color: #1c1917 !important;
}

/* Required asterisk */
.gform_wrapper .gfield_required {
    color: #1c1917 !important;
}

/* Field descriptions */
.gform_wrapper .gfield_description,
.gform_wrapper .gfield_description p {
    color: rgba(255, 255, 255, 0.55) !important;
}

/* All standard inputs + textarea */
.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="url"],
.gform_wrapper input[type="number"],
.gform_wrapper input[type="password"],
.gform_wrapper input[type="date"],
.gform_wrapper input[type="time"],
.gform_wrapper input[type="search"],
.gform_wrapper textarea,
.gform_wrapper .ginput_container input,
.gform_wrapper .ginput_container textarea {
    color: #1c1917 !important;
    background-color: #fafafa !important;
    border: 1px solid rgba(248, 250, 252, 0.14) !important;
    border-radius: 0.3rem !important;
    padding: 25px !important;
    box-shadow: none !important;
}

/* Placeholder text – improved contrast */
.gform_wrapper input::placeholder,
.gform_wrapper textarea::placeholder {
    color: rgba(255, 255, 255, 0.55) !important;
    opacity: 1 !important;
}

/* Focus state */
.gform_wrapper input:focus,
.gform_wrapper textarea:focus,
.gform_wrapper select:focus {
    border-color: rgba(14, 165, 233, 0.6) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.15) !important;
}

/* =========================================================
   NATIVE DROPDOWNS
   ========================================================= */

.gform-theme--framework .gfield--type-select,
.gform-theme--framework .gfield--input-type-select {
    --gf-ctrl-bg-color: #fafafa;
    --gf-ctrl-border-color: rgba(248, 250, 252, 0.14);
    --gf-ctrl-color: #1c1917;
    --gf-ctrl-radius: 0.3rem;
}

body .gform_wrapper .gform_body .gform_fields .gfield select,
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container_select select,
.gform-theme--framework .gfield--type-select select,
.gform-theme--framework .gfield--input-type-select select {
    color: #1c1917 !important;
    -webkit-text-fill-color: #1c1917 !important;
    background-color: #fafafa !important;
    border: 1px solid rgba(248, 250, 252, 0.14) !important;
    border-radius: 0.3rem !important;
    padding: 16px 20px !important;
    line-height: 1.4 !important;
    height: auto !important;
    min-height: 51px !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

/* Options when the list is open */
body .gform_wrapper select option {
    background-color: #fafafa !important;
    color: #1c1917 !important;
}

/* =========================================================
   VALIDATION ERRORS
   ========================================================= */

/* Main validation summary box at the top */
.gform_wrapper .gform_validation_errors,
.gform-theme--framework .gform_validation_errors {
    background-color: #2a1a1a !important;
    border: 1px solid #f87171 !important;
    border-radius: 0.3rem !important;
    color: #fecaca !important;
    padding: 18px 22px !important;
    margin-bottom: 25px !important;
}

.gform_wrapper .gform_validation_errors .gform_submission_error,
.gform_wrapper .gform_validation_errors h2 {
    color: #fecaca !important;
    font-weight: 500 !important;
}

.gform_wrapper .gform_validation_errors ol,
.gform_wrapper .gform_validation_errors li,
.gform_wrapper .gform_validation_errors a {
    color: #fecaca !important;
}

/* Individual field error state */
.gform_wrapper .gfield_error {
    background: transparent !important;
}

/* Error message under the field */
.gform_wrapper .gfield_validation_message,
.gform_wrapper .validation_message,
.gform_wrapper .gfield_error .gfield_description {
    color: #c02b0a !important;
    font-weight: 400 !important;
}

/* =========================================================
   ENHANCED UI (Chosen.js) – just in case
   ========================================================= */

.gform_wrapper .chosen-container-single .chosen-single,
.gform_wrapper .chosen-container .chosen-single {
    background-color: #ece7dd !important;
    background-image: none !important;
    border: 1px solid rgba(248, 250, 252, 0.14) !important;
    border-radius: 0.3rem !important;
    color: #1c1917 !important;
    height: auto !important;
    line-height: normal !important;
    padding: 16px 20px !important;
    box-shadow: none !important;
}

.gform_wrapper .chosen-container-single .chosen-single span {
    color: #1c1917 !important;
}

.gform_wrapper .chosen-container-single .chosen-single div b {
    background: none !important;
}

.gform_wrapper .chosen-container .chosen-drop {
    background-color: #212733 !important;
    border: 1px solid rgba(248, 250, 252, 0.14) !important;
    border-radius: 0.3rem !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.35) !important;
}

.gform_wrapper .chosen-container .chosen-results li {
    color: #1c1917 !important;
}

.gform_wrapper .chosen-container .chosen-results li.highlighted {
    background-color: #0ea5e9 !important;
    color: #1c1917 !important;
}

/* =========================================================
   SUBMIT BUTTON
   ========================================================= */

.gform-theme.gform-theme--framework.gform-theme--orbital .gform_wrapper .gform_footer button.gform_button,
.gform-theme.gform-theme--framework.gform-theme--orbital .gform_wrapper .gform_footer input[type="submit"],
.gform-theme.gform-theme--framework.gform-theme--orbital .gform_wrapper .gform_button,
#gform_wrapper_1 .gform_footer button#gform_submit_button_1 {
    font-size: 20px !important;
    font-weight: 300 !important;
    padding: 16px 50px !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    letter-spacing: 1px !important;
    position: relative !important;
    overflow: hidden !important;
    margin: 30px auto 0 !important;
    display: block !important;
    width: 100% !important;
    min-height: 54px !important;
    text-transform: none !important;
    cursor: pointer !important;
    background: #c9a24b !important;
    transition: transform 0.25s ease !important;
}

.gform-theme.gform-theme--framework.gform-theme--orbital .gform_wrapper .gform_footer button.gform_button:hover,
.gform-theme.gform-theme--framework.gform-theme--orbital .gform_wrapper .gform_footer input[type="submit"]:hover,
.gform-theme.gform-theme--framework.gform-theme--orbital .gform_wrapper .gform_button:hover,
#gform_wrapper_1 .gform_footer button#gform_submit_button_1:hover {
    transform: translateY(-2px) !important;
}