/**
 * Theme Name:       RikkerMediaHub Divi Child
 * Theme URI:        https://rikkermediahub.com/
 * Template:         Divi
 * Version:          2.3.0
 * Author:           RikkerMediaHub
 * Author URI:       https://rikkermediahub.com/
 * Description:      Child theme for Divi with custom styling (WPForms, MailerLite, login page, and full-width layout fixes).
 * Text Domain:      rikkermediahub-divi-child
 * License:          GPL-2.0-or-later
 */
/* 1. Google Fonts import */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&family=Oswald:wght@400;600;700&display=swap');

/* WPForms styling is enqueued separately via assets/css/forms.css */
/* mailerlite opmaak*/

/* 2. Universele wrapper voor MailerLite-formulieren */
div[id^="mailerlite-form_"] {
  border-radius: 10px !important;
  font-family: 'Montserrat', sans-serif !important;
  color: #232323 !important;            /* Donkergrijs */
}

/* 3. Koppen en titels */
div[id^="mailerlite-form_"] .ml-block-form__title,
div[id^="mailerlite-form_"] .form_title {
  font-family: 'Oswald', sans-serif !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
  color: #E53935 !important;            /* Rood */
  margin-bottom: 0.5em !important;
}

/* 4. Ondertitels en beschrijvingen */
div[id^="mailerlite-form_"] .ml-block-form__description,
div[id^="mailerlite-form_"] .form_subtitle {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 1rem !important;
  color: #232323 !important;
  margin-bottom: 1.5em !important;
}

/* 5. Input- en textarea-velden */
div[id^="mailerlite-form_"] input[type="text"],
div[id^="mailerlite-form_"] input[type="email"],
div[id^="mailerlite-form_"] textarea {
  width: 100% !important;
  padding: 5px 5px !important;
  border: 1px solid #232323 !important; /* Dieprood */
  border-radius: 6px !important;
  background-color: #FFFFFF !important;  /* Wit */
  font-family: 'Montserrat', sans-serif !important;
  font-size: 1rem !important;
  color: #232323 !important;
  margin-bottom: 1.2em !important;
  transition: border-color 0.3s ease !important;
}

div[id^="mailerlite-form_"] input:focus,
div[id^="mailerlite-form_"] textarea:focus {
  border-color: #24325F !important;      /* Donkerblauw */
  outline: none !important;
}

/* 6. Checkbox- en radiolabels */
div[id^="mailerlite-form_"] .ml-checkbox-group label,
div[id^="mailerlite-form_"] .ml-radio-group label {
  font-family: 'Montserrat', sans-serif !important;
  color: #232323 !important;
  margin-left: 5px !important;
}

/* 7. Submit-knop */
div[id^="mailerlite-form_"] .ml-block-form__submit,
div[id^="mailerlite-form_"] button {
  font-family: 'Oswald', sans-serif !important;
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  color: #FFFFFF !important;
  background-color: #E53935 !important;  /* Rood */
  border: none !important;
  border-radius: 6px !important;
  padding: 12px 30px !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  transition: background-color 0.3s ease !important;
}

div[id^="mailerlite-form_"] .ml-block-form__submit:hover,
div[id^="mailerlite-form_"] button:hover {
  background-color: #B71C1C !important;  /* Dieprood */
}

/* 8. Links en hover-states */
div[id^="mailerlite-form_"] a {
  color: #24325F !important;             /* Donkerblauw */
  text-decoration: underline !important;
}

div[id^="mailerlite-form_"] a:hover {
  color: #E5734C !important;             /* Zacht terracotta */
}

/* 9. Foutmeldingen en validatietekst */
div[id^="mailerlite-form_"] .ml-form-field-error,
div[id^="mailerlite-form_"] .form_error {
  font-family: 'Montserrat', sans-serif !important;
  color: #E53935 !important;             /* Rood */
  font-size: 0.9rem !important;
  margin-top: -0.8em !important;
  margin-bottom: 1em !important;
}

/* Maak content 100% breed en haal de zijbalk weg */
#left-area {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}

#sidebar {
  display: none !important;
}

/* Haal de verticale lijn/spacer van Divi weg */
#main-content .container:before {
  display: none !important;
}

/* Eventuele padding-correcties voor beide zijbalk-varianten */
.et_right_sidebar #left-area {
  padding-right: 0 !important;
}

.et_left_sidebar #left-area {
  padding-left: 0 !important;
}