/*
Theme Name: Easy Blog PBJ 1
Theme URI: https://Bookings.PhotoboothJamaica.com/
Description: A child theme for Easy Blog
Author: Your Photobooth Jamaica
Author URI: https://PhotoboothJamaica.com/
Template: easy-blog
Version: 2.0
Text Domain: easy-blog-pbj-1
*/

/* Import parent theme styles */
@import url("../easy-blog/style.css");

/* Container styling */
.form-container {
  max-width: 800px;
  margin: 0 auto;
  padding: 0px;
}

/* Ensure all populated input and select fields are blue, bold, and wider */
.form-container input[type="text"],
.form-container input[type="email"],
.form-container input[type="tel"],
.form-container input[type="number"],
.form-container input[type="date"],
.form-container input[type="password"],
.form-container select {
    color: blue !important;
    font-weight: bold !important;
    width: 100% !important;
    max-width: 600px !important;
    box-sizing: border-box !important;
}

.form-divider {
    height: 5px !important;
    border-width: 1px !important;
    background-color: #ccc !important;
    border: none !important;
    width: 100% !important;
}

/* Reset default margins/padding for rows and cells */
.form-row,
.form-cell {
  margin: 0;
  padding: 0 !important;
}

/* Each form row with reduced vertical spacing */
.form-row {
  margin-bottom: 0.3em !important;  /* 0.3em bottom margin */
  clear: both;
  margin: 0 !important;
  padding: 0 !important;
}

/* Clear floats within a row */
.form-row::after {
  content: "";
  display: table;
  clear: both;
}

.form-cell {
    padding: 0.2em 10px 0.2em 0; /* Top 0.2em, Right 10px, Bottom 0.2em, Left 0 */
    box-sizing: border-box;
    display: block;
}

/* Centered content */
.center {
  text-align: center;
}

/* Ensure half-width cells do not have extra padding or misalignment */
.form-cell.half {
    width: 50%;
    float: left;
    padding: 0 5px 0 0 !important; /* Top 0, Right 5px, Bottom 0, Left 0 */
    margin: 0 !important; /* Removes any margin pushing content */
    box-sizing: border-box; /* Ensures correct width calculation */
}

/* For cells sharing a row (33.33% width) */
.third {
  width: 33.33%;
  float: left;
}

/* Responsive: stack columns on smaller screens */
@media (max-width: 600px) {
  .half,
  .third {
    width: 100%;
    float: none;
  }
}

#QUOTE-Font {
font-size: 18px;
letter-spacing: 2px;
word-spacing: 2px;
color: #333333;
font-weight: bold;
text-decoration: none;
font-style: normal;
font-variant: normal;
text-transform: none;
}

#MC4WP-Required {
font-family: \'Oswald\';
font-size: 18px;
letter-spacing: 2px;
word-spacing: 2px;
color: #FF0000;
font-weight: bold;
text-decoration: none;
font-style: normal;
font-variant: normal;
text-transform: none;
}

#MC4WP-Multiple {
font-family: \'Oswald\';
font-size: 12px;
letter-spacing: 2px;
word-spacing: 2px;
color: #FFFF00;
font-weight: normal;
text-decoration: none;
font-style: normal;
font-variant: normal;
text-transform: none;
}

#MC4WP-Font {
font-size: 18px;
letter-spacing: 2px;
word-spacing: 2px;
color: #000000;
font-weight: bold;
text-decoration: none;
font-style: normal;
font-variant: normal;
text-transform: none;
}

#MC4WP-Font2 {
font-size: 24px;
letter-spacing: 2px;
word-spacing: 2px;
color: #000000;
font-weight: BOLD;
text-decoration: underline;
font-style: normal;
font-variant: normal;
text-transform: none;
}

#MC4WP-Font3 {
font-size: 12px;
letter-spacing: 2px;
word-spacing: 2px;
color: #0000ff;
font-weight: normal;
text-decoration: none;
font-style: normal;
font-variant: normal;
text-transform: none;
}

#MC4WP-Font-Red {
font-size: 18px;
letter-spacing: 2px;
word-spacing: 2px;
color: #ff0000;
font-weight: normal;
text-decoration: none;
font-style: normal;
font-variant: normal;
text-transform: none;
}

#MC4WP-Button {
  background: #3498db;
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
  border-radius: 30px;
  font-family: Arial;
  color: #ffffff !important;
  font-size: 20px;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
}

.wpcf7-form-control.wpcf7-select.form-control option {
    color: #0000ff; /* Change text color */
    font-weight: bold; /* Set font weight */
    background-color: #fff; /* Background color */
}

  table.form-table {
    width: 100%;
    border-collapse: collapse;
    border: none !important;
  }
  .form-table td {
    border: none !important;
    padding: 8px 5px;
    vertical-align: top;
  }

  .form-table textarea {
    border: none !important;
    outline: none;
    box-shadow: none;
  }
/* Inline label and options */
.inline-label {
    display: inline-block;
    margin-right: 15px;
    font-weight: bold;
}

.inline-options {
    display: inline-block;
}

/* Normalize default mobile behavior */
.inline-form input[type="radio"],
.inline-options input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: #fff;
    border: 2px solid #ccc;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    margin-right: 5px;
    vertical-align: middle;
    position: relative;
}

.inline-form input[type="radio"]:checked::before,
.inline-options input[type="radio"]:checked::before {
    content: '';
    display: block;
    background-color: #0073aa; /* Adjust as needed */
    border-radius: 50%;
    width: 8px;
    height: 8px;
    position: absolute;
    top: 3px;
    left: 3px;
}

/* Ensure "Are you a Business or Company?" stays inline */
.inline-form {
    display: flex;
    align-items: center;
    gap: 10px; /* Adds spacing between elements */
}

.inline-form label {
    margin: 0;
    font-weight: bold;
}

/* Unique styling for experience option checkboxes */
.experience-option {
    display: flex;
    align-items: center;
    flex-wrap: nowrap; /* Prevents wrapping */
    gap: 8px; /* Adds spacing between checkbox and label */
    width: 100%; /* Ensures full width */
}

/* Adjust label for experience options */
.experience-option label {
    white-space: nowrap; /* Prevents wrapping */
    font-size: 16px; /* Ensures consistent font size */
    font-weight: 500 !important;
    overflow: hidden;
    text-overflow: ellipsis; /* Truncates long text with "..." */
    color: blue !important;
}

/* 🔶 Popular Photo Booth Upgrade Notice Box */
.popular-upgrade-notice {
    background-color: #fff8e1;
    border-left: 6px solid #ffa000;
    padding: 12px 20px;
    font-size: 16px;
    font-weight: bold;
    color: #e65100;
    border-radius: 4px;
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
}

.popular-upgrade-notice span {
    font-weight: normal;
    font-size: 14px;
    display: block;
    margin-top: 4px;
}

.email-match-message {
    background-color: #e6f4ea;
    border-left: 5px solid #34a853;
    padding: 12px 16px;
    font-size: 15px;
    color: #202124;
    margin-bottom: 15px;
    border-radius: 4px;
    font-family: 'Segoe UI', sans-serif;
}

.pbj-quote-header {
    text-align: center !important;
    color: #000 !important;
    font-weight: 600 !important;
    font-size: 30px !important;
}

/* 🔹 Design Header Message Block Styling */
.event-intro-message {
    text-align: center;
    color: red;
    font-weight: 600;
    font-size: 24px;
    margin-bottom: 15px;
}

/* 🔹 Requirements Block Styling */
.event-requirements-message {
    font-size: 15px;
    color: black;
    font-weight: 500;    
    line-height: 1.6;
    padding: 10px 20px;
    margin-bottom: 5px;
}

label.tight-label {
  line-height: 1.1 !important; /* Or try 1.0 or even 1.05 for tighter spacing */
}

label.tight-label br {
  line-height: 1px !important; /* Doesn't always impact rendering but safe to include */
}

/* Spinner Animation */
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Spinner */
.spinner-inline {
  display: inline-block;
  width: 18px;
  height: 18px;
  border: 2px solid #fff;
  border-top: 2px solid #0d47a1; /* dark blue spinner top */
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
  margin-right: 8px;
  vertical-align: middle;
}

/* Submit Button Styling */
.submit-button {
  padding: 12px 24px;
  font-size: 16px;
  background-color: #daa250;
  color: white;
  border: none;
  border-radius: 20px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.submit-button:hover {
  background-color: #b71c1c;
}

.submit-button:disabled {
  background-color: #ccc;
  cursor: not-allowed;
}

/* 🔵 Processing Button Styling */
.processing-button {
  padding: 12px 24px;
  font-size: 16px;
  background-color: #0d47a1; /* deep blue */
  color: white;
  border: none;
  border-radius: 20px;
  cursor: not-allowed;
}

div[pbj-show-if],
div[pbj-hide-if],
span[pbj-show-if],
span[pbj-hide-if],
p[pbj-show-if],
p[pbj-hide-if],
label[pbj-show-if],
label[pbj-hide-if],
section[pbj-show-if],
section[pbj-hide-if],
li[pbj-show-if],
li[pbj-hide-if],
tr[pbj-show-if],
tr[pbj-hide-if],
td[pbj-show-if],
td[pbj-hide-if] {
  display: none;
}

/* === Custom Fonts === */

/* Carolena Narashy */
@font-face {
  font-family: 'Carolena Narashy';
  src: url('fonts/Carolena-Narashy.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* Peanut Butter */
@font-face {
  font-family: 'Peanut Butter';
  src: url('fonts/Peanut-Butter.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* Rich Brilliant */
@font-face {
  font-family: 'Rich Brilliant';
  src: url('fonts/Rich-Brilliant.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

/* Shine Flower */
@font-face {
  font-family: 'Shine Flower';
  src: url('fonts/Shine-Flower.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

/* Shine Monday */
@font-face {
  font-family: 'Shine Monday';
  src: url('fonts/Shine-Monday.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

/* === Inline image row (scoped) === */
/* v1.0 — 2025-09-25 America/Jamaica — Nova */
.form-row-inline {
  display: flex;
  justify-content: center;
  gap: 60px;  /* increased spacing between blocks (was 20px) */
  flex-wrap: wrap;
  margin-bottom: 0.3em;
  clear: both;
}

.form-row-inline .form-cell {
  text-align: center;
  float: none !important;    /* neutralize .form-cell.half float */
  width: auto !important;    /* neutralize .form-cell.half width */
  padding: 0 !important;     /* keep tight spacing around images */
  box-sizing: border-box;
}

.form-row-inline .form-cell.half {
  float: none !important;    /* extra safety if "half" remains in markup */
  width: auto !important;
  padding: 0 !important;
}

/* keep images responsive */
.form-row-inline img {
  max-width: 100%;
  height: auto;
  display: block;            /* plays nice with .aligncenter margins */
  margin: 0 auto;
}

/* Mobile: stack neatly */
@media (max-width: 600px) {
  .form-row-inline {
    flex-direction: column;
    align-items: center;
  }
}

/* === Inline image row labels === */
/* v1.1 — 2025-09-25 America/Jamaica — Nova */
.form-row-inline .image-label {
  font-size: 12px;       /* small font */
  font-weight: 500;
  color: #444;           /* subtle dark grey */
  text-align: center;    /* center within cell */
  margin-bottom: 4px;    /* space between text and image */
  font-family: Arial, sans-serif;
}