/* === Contact Page CSS v6 - Full Visual Parity === */

/* Banner Title - matches old site exactly */
.inside-banner { padding: 20px 15px; letter-spacing: 1px; }

/* ShareThis */
.social-btn { margin: 0 0 15px 0; }
.contact-body { padding: 0; }
.content-body.row { display: block; }

/* Tabs - exact match of old site #brand02 */
.contact-tabs { margin: 0; }
#contact-tab-nav ul { list-style: none; margin: 0; padding: 0; display: flex; }
#contact-tab-nav ul li.tab-item { text-align: center; width: calc(100%/2); font-size: 18px; padding: 15px; color: #999; font-weight: 400; border-bottom: 1px solid #ddd; cursor: pointer; position: relative; line-height: 1.4; display: flex; align-items: center; justify-content: center; transition: all 0.3s; }
#contact-tab-nav ul li.tab-item:hover { color: #a00000; }
#contact-tab-nav ul li.tab-item.active { color: #a00000; font-size: 18px; border: 1px solid #ddd; border-bottom: 0; background: #fff; position: relative; }
#contact-tab-nav ul li.tab-item.active:before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 0; height: 0; border-style: solid; border-width: 20px 20px 0 0; border-color: #a00000 transparent transparent transparent; }
#contact-tab-nav ul li.tab-item.active:after { content: ""; display: block; width: 15%; height: 3px; background: #a00000; position: absolute; bottom: -1px; left: calc(50% - 7.5%); }
.tab-content { color: #333; font-size: 16px; font-weight: 300; border: 1px solid #ddd; background: #fff; margin-bottom: 5px; width: 100%; min-height: 370px; overflow: hidden; border-top: 0; padding: 15px; }
.tab-panel { display: none; }
.tab-panel.active { display: block; }

/* Form Wrapper */
.contact-form-wrapper { padding: 0; }
.contact-form-wrapper > p { margin: 0; padding: 0; }

/* Section Dividers */
.contact-section { border-top: 1px solid #e6ded6; padding-top: 20px; margin-top: 20px; }

/* Section Titles - match .form-title */
h3.form-section-title { font-size: 20px; color: #a66b28; padding: 12px 0; margin: 25px 0 10px 0; font-weight: 400; letter-spacing: 3px; line-height: 1.4; position: relative; z-index: 1; }
h3.form-section-title:before { content: ""; display: block; width: 4px; height: 4px; background: #a66b28; position: absolute; bottom: 0; left: 0; z-index: -1; border-radius: 10px; }
h3.form-section-title:after { content: ""; display: block; width: 30px; height: 4px; background: #a66b28; position: absolute; bottom: 0; left: 8px; z-index: -1; border-radius: 10px; }

/* Subsection Titles - match .form-title02 */
h4.form-subsection-title { margin: 25px 0 10px 0; background: rgba(166,107,40,.6) url("/images/title_bg.png") repeat center center; display: table; padding: 4px 15px; color: #fff; font-size: 17px; font-weight: 300; border-radius: 3px; line-height: 1.4; }

/* Required & Notes */
.contact-form-wrapper .required, h3.form-section-title .required { color: #d10d0d; font-size: 12px; padding: 0 5px; }
.form-note { font-size: 13px; color: #d10d0d; margin: 5px 0; display: block; width: 100%; }

/* 2-column layout - match .opinion-main */
.form-row-2col { display: flex; flex-wrap: wrap; }
.form-row-2col .form-field { flex: 1; padding: 10px; min-width: 250px; }
.form-field { padding: 10px 0; }
.form-field label { display: flex; align-items: center; width: 100%; padding: 5px 5px; font-weight: 400; font-size: 16px; color: #222; margin-bottom: 0; }

/* Text inputs - match .input-main-style01 */
.contact-form-wrapper input[type="text"],
.contact-form-wrapper input[type="email"],
.contact-form-wrapper input[type="tel"],
.contact-form-wrapper input[type="date"],
.contact-form-wrapper .wpcf7-text,
.contact-form-wrapper .wpcf7-email,
.contact-form-wrapper .wpcf7-tel,
.contact-form-wrapper .wpcf7-date { background: #fff; flex: 1; width: 100%; border: 0; border-bottom: 1px solid #ccc; margin: 0; padding: 8px 15px; font-size: 16px; color: #222; font-weight: 300; min-height: 45px; border-radius: 0; box-sizing: border-box; }
.contact-form-wrapper input:focus, .contact-form-wrapper select:focus, .contact-form-wrapper textarea:focus { outline: none; box-shadow: 3px 3px 8px rgba(0,0,0,.1), -3px -3px 8px #fff; border-bottom: 1px #a00000 solid; }

/* Select - match .input-main-select select */
.contact-form-wrapper select, .contact-form-wrapper .wpcf7-select { background: #fff; flex: 1; margin-right: 0; padding: 8px 15px; border: 0; border-bottom: 1px solid #ccc; font-size: 16px; color: #222; font-weight: 300; min-height: 45px; width: 100%; border-radius: 0; appearance: none; -webkit-appearance: none; }

/* Textarea */
.contact-form-wrapper textarea, .contact-form-wrapper .wpcf7-textarea { background: #fff; width: 100%; border: 0; border-bottom: 1px solid #ccc; margin: 0; padding: 8px 15px; font-size: 16px; color: #222; font-weight: 300; min-height: 120px; border-radius: 0; box-sizing: border-box; resize: vertical; }

/* Branch Selection - match old site grouped layout */
.branch-selection { display: flex; flex-wrap: wrap; }
.branch-group { display: flex; align-items: center; margin: 0 0 15px 0; width: calc(100%/2); }
.branch-region { width: auto; min-width: 40px; padding: 5px 15px 5px 5px; font-weight: 400; font-size: 16px; color: #222; }
.branch-options .wpcf7-radio .wpcf7-list-item { margin: 0 15px 0 0; }
.branch-options .wpcf7-list-item-label { font-size: 16px; padding-left: 5px; }

/* Consultation Groups - match old site */
.consult-group { padding: 10px 0; }
.consult-group-label { display: block; width: 100%; padding: 5px 5px; font-weight: 400; font-size: 16px; color: #222; }
.consult-group .wpcf7-checkbox { display: flex; flex-wrap: wrap; }
.consult-group .wpcf7-checkbox .wpcf7-list-item { display: inline-flex; align-items: center; padding: 3px 0; margin-right: 2vmin; }
.consult-group .wpcf7-list-item-label { font-size: 16px; color: #222; padding-left: 5px; }

/* Radio & Checkbox global */
.contact-form-wrapper .wpcf7-radio { display: flex; flex-wrap: wrap; }
.contact-form-wrapper .wpcf7-radio .wpcf7-list-item { display: inline-flex; align-items: center; margin: 5px 20px 5px 0; }
.contact-form-wrapper .wpcf7-radio .wpcf7-list-item-label { font-size: 16px; color: #222; padding-left: 5px; }
.contact-form-wrapper .wpcf7-checkbox { display: flex; flex-wrap: wrap; }
.contact-form-wrapper .wpcf7-checkbox .wpcf7-list-item { display: inline-flex; align-items: center; padding: 3px 0; margin-right: 2vmin; }
.contact-form-wrapper .wpcf7-checkbox .wpcf7-list-item-label { font-size: 16px; color: #222; padding-left: 5px; }

/* File upload */
.contact-form-wrapper input[type="file"], .contact-form-wrapper .wpcf7-file { background: #fff; width: 100%; border: 0; border-bottom: 1px solid #ccc; padding: 8px 15px; font-size: 16px; min-height: 45px; }

/* Composite treatment - vertical with dividers */
.composite-treatment-section .wpcf7-checkbox { display: block; }
.composite-treatment-section .wpcf7-checkbox .wpcf7-list-item { display: block; margin: 0; padding: 16px 0; border-bottom: 1px solid #ddd; }
.composite-treatment-section .wpcf7-checkbox .wpcf7-list-item:last-child { border-bottom: 0; }

/* Appointment section - vertical rows with dividers */
.appointment-section .appointment-row { border-bottom: 1px solid #ddd; padding: 18px 0; }
.appointment-section .appointment-row:last-of-type { border-bottom: 0; }
.appointment-row-title { display: block; font-size: 16px; font-weight: 700; color: #222; margin-bottom: 10px; padding: 0; }
.appointment-section .wpcf7-radio, .appointment-section .wpcf7-checkbox { display: flex; flex-wrap: wrap; }
.appointment-section .wpcf7-list-item { margin-right: 24px; margin-bottom: 8px; }

/* CAPTCHA */
.captcha-field { display: flex; align-items: center; gap: 15px; flex-wrap: wrap; padding: 10px 0; }
.captcha-input { flex: 0 0 auto; }
.captcha-input img { display: block; height: 45px; width: auto; border: 1px solid #ddd; border-radius: 3px; }
.captcha-image { flex: 1; min-width: 180px; }
.captcha-image input { background: #fff; width: 100%; border: 0; border-bottom: 1px solid #ccc; padding: 8px 15px; font-size: 16px; min-height: 45px; border-radius: 0; }

/* Action Buttons - horizontal, match old site */
.contact-form-actions { display: flex; align-items: center; justify-content: center; gap: 18px; background: #f2f2f2; padding: 18px 20px; margin-top: 24px; }
.contact-reset-btn { min-width: 150px; height: 46px; border: 0; color: #fff; font-size: 16px; font-weight: 400; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 3px; background: #999; transition: all 0.3s; }
.contact-reset-btn:hover { background: #666; box-shadow: 0 0 0 3px rgba(102,102,102,.4); }
.contact-form-actions .wpcf7-submit { min-width: 150px; height: 46px; border: 0; color: #fff; font-size: 16px; font-weight: 400; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 3px; background: #610706; letter-spacing: 2px; transition: all 0.3s; }
.contact-form-actions .wpcf7-submit:hover { background: #a00000; box-shadow: 0 0 0 3px rgba(160,0,0,.3); }
.btn-icon { font-size: 18px; }
.form-actions { display: none !important; }

/* Placeholder */
.contact-form-wrapper ::placeholder { color: #999; }

/* Response & Validation */
.wpcf7 .wpcf7-response-output { margin: 15px 0 !important; padding: 10px 15px !important; font-size: 14px; border-radius: 3px; }
.wpcf7-not-valid-tip { color: #d10d0d; font-size: 13px; margin: 5px 0; display: block; }
.wpcf7 .wpcf7-spinner { margin: 0 10px; }

/* Label styling - match old site label with inline display */
label { margin-bottom: 0; padding: 3px 2vmin 3px 0; display: inline-block; }

/* === Responsive === */
@media screen and (max-width:900px) {
    h3.form-section-title { font-size: 18px; }
    h4.form-subsection-title { font-size: 16px; }
    .branch-group { width: 100%; }
    #contact-tab-nav ul li.tab-item { font-size: 18px; }
}
@media screen and (max-width:767px) {
    .form-row-2col { display: block; }
    .form-row-2col .form-field { padding: 10px 0; }
    .tab-content { padding: 15px 10px; }
    .consult-group .wpcf7-checkbox .wpcf7-list-item { width: 100%; }
    .captcha-field { flex-direction: column; }
}
@media screen and (max-width:575px) {
    label { padding: 3px 0; display: block; width: 100%; }
    #contact-tab-nav ul li.tab-item { font-size: 16px; padding: 12px; }
    .form-field label { width: 100%; }
}
@media screen and (max-width:400px) {
    .contact-form-actions { flex-direction: column; }
    .contact-reset-btn, .contact-form-actions .wpcf7-submit { width: 100%; }
}

/* === Fix buttons: horizontal layout matching old site === */
.contact-form-actions {
  background: #f3f3f3;
  padding: 15px 5px;
  margin: 4vmin 0 0 0;
  text-align: center;
}
.contact-form-actions p {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin: 0;
}
.contact-form-actions p br {
  display: none;
}
.contact-reset-btn {
  padding: 8px 20px;
  font-size: 16px;
  font-weight: 400;
  color: #fff;
  background: #999;
  min-width: 100px;
  border-radius: 3px;
  border: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  cursor: pointer;
}
.contact-reset-btn:hover {
  background: #666;
  box-shadow: 0 0 0 3px rgba(102,102,102,.5);
}
.contact-submit-btn {
  padding: 8px 20px;
  font-size: 16px;
  font-weight: 400;
  color: #fff !important;
  background: #610706 !important;
  min-width: 100px;
  border-radius: 3px;
  border: 0;
  cursor: pointer;
}
.contact-submit-btn:hover {
  background: #a00000 !important;
  box-shadow: 0 0 0 3px rgba(160,0,0,.3);
}

/* Submit button paper plane icon */
.contact-submit-btn::before {
  content: "✈";
  margin-right: 6px;
  font-size: 16px;
}

/* Fix: buttons same width, same shape, submit icon */
.contact-reset-btn,
.contact-submit-btn {
  min-width: 160px !important;
  padding: 12px 24px !important;
  border-radius: 3px !important;
  font-size: 18px !important;
  font-weight: 600 !important;
}

/* ShareThis tab toggle - use height:0 not display:none so buttons initialize */
.share-hidden {
  height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}
