/**
 * Theme Name: Blocksy Child
 * Description: Blocksy Child theme
 * Author: Creative Themes
 * Template: blocksy
 * Text Domain: blocksy
 */

@font-face {
  font-family: 'SF Pro Display';
  src: url('/wp-content/uploads/2026/04/SF-Pro-Display-Semibold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'SF Pro Display';
  src: url('/wp-content/uploads/2026/04/SF-Pro-Display-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* 1. INPUT FIELD: STRIP WHITE BOX & ADD BORDER */
.page-id-2233 #fluentform_4 .ff-el-form-control {
    background-color: transparent !important;
    background: transparent !important;
    border: 1px solid #E1E2E4 !important;
    border-radius: 4px !important;
    color: #ffffff !important;
    padding: 12px 15px !important;
    height: auto !important;
    box-shadow: none !important;
    outline: none !important;
}

.page-id-2233 #fluentform_4 .ff-el-form-control::placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

/* 2. BUTTON: FORCE GOLD BRANDING */
.page-id-2233 #fluentform_4 button.ff-btn-submit.wpf_has_custom_css {
    background-color: #C9A847 !important;
    background: #C9A847 !important;
    color: #241A00 !important;
    border: none !important;
    border-radius: 4px !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    padding: 13px 30px !important;
    width: 100% !important;
    min-width: 100% !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

/* 3. BUTTON HOVER STATE */
.page-id-2233 #fluentform_4 button.ff-btn-submit.wpf_has_custom_css:hover {
    background-color: #ffffff !important;
    color: #C9A847 !important;
    border: 1px solid #C9A847 !important;
}

/* 4. LAYOUT: ALIGNMENT FOR THE ROW */
.page-id-2233 #fluentform_4 .ff-t-container {
    display: flex !important;
    align-items: center !important;
}







/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   MOBILE RESPONSIVENESS: FORM 4 (PAGE 2233)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

@media (max-width: 768px) {
    /* 1. Force the container to stack vertically */
    .page-id-2233 #fluentform_4 .ff-t-container {
        display: flex !important;
        flex-direction: column !important;
    }

    /* 2. Force each cell (input & button) to be 100% width */
    .page-id-2233 #fluentform_4 .ff-t-cell {
        width: 100% !important;
        flex-basis: 100% !important;
        max-width: 100% !important;
    }

    /* 3. Ensure the input field takes full width */
    .page-id-2233 #fluentform_4 .ff-el-form-control {
        width: 100% !important;
        display: block !important;
    }

    /* 4. Ensure button takes full width and aligns center */
    .page-id-2233 #fluentform_4 .ff_submit_btn_wrapper_custom {
        width: 100% !important;
        text-align: center !important;
    }
	
	/* Tighten vertical spacing for Form 4 on Page 2233 */
.page-id-2233 #fluentform_4 .ff-t-cell .ff-el-group {
    margin-bottom: 5px !important;
}

    .page-id-2233 #fluentform_4 button.ff-btn-submit {
        width: 100% !important;
        margin-top: 5px !important;
    }
}




