/*
  K2 UI – Contact Form Theme CSS
  File: contact-form-theme.css
  Purpose: Applies theme tokens to structural classes defined in contact-form.css
  background-color: var(--k2-bg-muted) !important;
  color: var(--k2-bg-muted-text) !important;
*/


.k2-contactform {
  background-color: var(--k2-bg-primary); /* typically white or surface color */
  color: var(--k2-bg-primary-text);
}

.k2-form-title {
  color: var(--k2-text-primary);
}

.k2-form-intro {
  color: var(--k2-color-gray-500);
}

.k2-form-section {
    color: var(--k2-color-gray-700);
    background-color: var(--k2-bg-muted) !important;
    
  
}
.k2-form-section-title {
   color: var(--k2-color-gray-700);
}


.k2-form-label {
  color: var(--k2-color-gray-800);
}

.k2-form-field > input,
.k2-form-field > textarea,
.k2-form-field > select {
  background-color: var(--k2-surface);
  border: 1px solid var(--k2-color-gray-300);
  color: var(--k2-text);
}

.k2-form-field > input:focus,
.k2-form-field > textarea:focus,
.k2-form-field > select:focus {
  border-color: var(--k2-bg-dark);
  box-shadow: 0 0 0 2px var(--k2-bg-light);
}

.k2-form-field > .k2-radio-group > label,
.k2-form-field > .k2-checkbox-group > label {
  color: var(--k2-text);
}

.k2-form-footer {
  color: var(--k2-color-gray-500);
}

/* Button themes */
.k2-form .k2-btn-primary {
  background-color: var(--k2-primary);
  color: #fff;
  border-radius: var(--k2-radius-md);
  padding: 0.6rem 1.25rem;
  transition: background-color 0.3s ease;
}

.k2-form .k2-btn-primary:hover {
  background-color: var(--k2-primary-dark);
}

.k2-form .k2-btn-secondary {
  background-color: var(--k2-color-gray-200);
  color: var(--k2-text);
  border-radius: var(--k2-radius-md);
  padding: 0.6rem 1.25rem;
  transition: background-color 0.3s ease;
}

.k2-form .k2-btn-secondary:hover {
  background-color: var(--k2-color-gray-300);
}

/* Optional field background indicator */
.k2-form-field[data-optional="true"] .k2-contactform-label::after {
  content: " (optional)";
  color: var(--k2-color-gray-500);
  font-weight: normal;
  font-size: 0.85em;
}