/*
 Theme Name:     Webfar Divi Child
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme made by Webfar
 Author:         Webfar
 Author URI:     https://www.webfar.dk
 Template:       Divi
 Version:        1.1.0
*/

/* Custom Blocks Styling  */

/* Gutenberg Block variables */

:root {
  --fact-box-link-hover-text-decoration: none;
  --fact-border-radius: 0px;
  --primary-fact-background: #eeeeee;
  --primary-fact-text-color: #4a4549;
  --primary-fact-link-color: #9d3f51;

  --secondary-fact-background: #eaf8f9;
  --secondary-fact-text-color: #4a4549;
  --secondary-fact-link-color: #9d3f51;

  --image-border-radius: 0px;
  --image-caption-background: transparent;
  --image-caption-text-color: #4a4549;
  --image-caption-text-font-size: 14px;
  --image-caption-padding: 0;
  --image-caption-font-style: italic;
  --image-caption-line-height: 1.4;

  --button-border-radius: 0px;
  --primary-button-background: #4a4549;
  --primary-button-text-color: #ffffff;
  --primary-button-background-hover: transparent;
  --primary-button-text-color-hover: #4a4549;
  --secondary-button-background: transparent;
  --secondary-button-text-color: #4a4549;
  --secondary-button-background-hover: #4a4549;
  --secondary-button-text-color-hover: #ffffff;

  --blockquote-border-color: #9d3f51;
}

/* Helper classes */
.gap-5 {
  gap: 5px;
}
.gap-10 {
  gap: 10px;
}
.gap-15 {
  gap: 15px;
}
.gap-20 {
  gap: 20px;
}
.gap-25 {
  gap: 25px;
}
.gap-30 {
  gap: 30px;
}

/* Custom Block Styles */

/* Primary Fact Box */
.wp-block-group.is-style-primary-fact-left p,
.wp-block-group.is-style-primary-fact-right p,
.wp-block-group.is-style-primary-fact-full p,
.wp-block-group.is-style-secondary-fact-left p,
.wp-block-group.is-style-secondary-fact-right p,
.wp-block-group.is-style-secondary-fact-full p {
  padding-bottom: 10px !important;
}

.wp-block-group.is-style-primary-fact-left,
.wp-block-group.is-style-primary-fact-right,
.wp-block-group.is-style-primary-fact-full {
  background: var(--primary-fact-background);
  border-radius: var(--fact-border-radius);
  color: var(--primary-fact-text-color);
  padding: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
}

.is-style-primary-fact-left h2,
.is-style-primary-fact-left h3,
.is-style-primary-fact-left h4,
.is-style-primary-fact-left h5,
.is-style-primary-fact-right h2,
.is-style-primary-fact-right h3,
.is-style-primary-fact-right h4,
.is-style-primary-fact-right h5,
.is-style-primary-fact-full h2,
.is-style-primary-fact-full h3,
.is-style-primary-fact-full h4,
.is-style-primary-fact-full h5 {
  color: var(--primary-fact-text-color);
}

.et_pb_post_content_0_tb_body.et_pb_post_content .is-style-primary-fact-full a,
.et_pb_post_content_0_tb_body.et_pb_post_content .is-style-primary-fact-left a,
.et_pb_post_content_0_tb_body.et_pb_post_content .is-style-primary-fact-right a,
.et_pb_post_content_0_tb_body.et_pb_post_content
  .is-style-primary-fact-full
  li
  a,
.et_pb_post_content_0_tb_body.et_pb_post_content
  .is-style-primary-fact-left
  li
  a,
.et_pb_post_content_0_tb_body.et_pb_post_content
  .is-style-primary-fact-right
  li
  a {
  color: var(--primary-fact-link-color) !important;
}

.is-style-primary-fact-full a:hover,
.is-style-primary-fact-left a:hover,
.is-style-primary-fact-right a:hover,
.is-style-primary-fact-full li a:hover,
.is-style-primary-fact-left li a:hover,
.is-style-primary-fact-right li a:hover {
  text-decoration: var(--fact-box-link-hover-text-decoration);
}
/* White Default */

.wp-block-group.is-style-secondary-fact-left,
.wp-block-group.is-style-secondary-fact-right,
.wp-block-group.is-style-secondary-fact-full {
  background: var(--secondary-fact-background);
  border-radius: var(--fact-border-radius);
  color: var(--secondary-fact-text-color);
  padding: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
}

.is-style-secondary-fact-left h2,
.is-style-secondary-fact-left h3,
.is-style-secondary-fact-left h4,
.is-style-secondary-fact-left h5,
.is-style-secondary-fact-right h2,
.is-style-secondary-fact-right h3,
.is-style-secondary-fact-right h4,
.is-style-secondary-fact-right h5,
.is-style-secondary-fact-full h2,
.is-style-secondary-fact-full h3,
.is-style-secondary-fact-full h4,
.is-style-secondary-fact-full h5 {
  color: var(--secondary-fact-text-color) !important;
}

/* Left */
.wp-block-group.is-style-primary-fact-left,
.wp-block-group.is-style-secondary-fact-left {
  float: left;
  margin: 10px 15px 10px 0 !important;
  width: 50%;
}

/* Right */
.wp-block-group.is-style-primary-fact-right,
.wp-block-group.is-style-secondary-fact-right {
  float: right;
  margin: 10px 0 10px 15px !important;
  width: 50%;
}

/* Full */
.wp-block-group.is-style-primary-fact-full,
.wp-block-group.is-style-secondary-fact-full {
  float: none;
  width: 100%;
}

.et_pb_post_content_0_tb_body.et_pb_post_content
  .is-style-secondary-fact-full
  a,
.et_pb_post_content_0_tb_body.et_pb_post_content
  .is-style-secondary-fact-left
  a,
.et_pb_post_content_0_tb_body.et_pb_post_content
  .is-style-secondary-fact-right
  a,
.et_pb_post_content_0_tb_body.et_pb_post_content
  .is-style-secondary-fact-full
  li
  a,
.et_pb_post_content_0_tb_body.et_pb_post_content
  .is-style-secondary-fact-left
  li
  a,
.et_pb_post_content_0_tb_body.et_pb_post_content
  .is-style-secondary-fact-right
  li
  a {
  color: var(--secondary-fact-link-color) !important;
}

.is-style-secondary-fact-full a:hover,
.is-style-secondary-fact-left a:hover,
.is-style-secondary-fact-right a:hover,
.is-style-secondary-fact-full li a:hover,
.is-style-secondary-fact-left li a:hover,
.is-style-secondary-fact-right li a:hover {
  text-decoration: var(--fact-box-link-hover-text-decoration);
}

/* Images */

/* Caption general styling */
figcaption.wp-element-caption {
  margin-top: 10px;
  background: var(--image-caption-background);
  text-align: left;
  padding: var(--image-caption-padding);
  font-size: var(--image-caption-text-font-size);
  color: var(--image-caption-text-color);
  font-style: var(--image-caption-font-style);
  line-height: var(--image-caption-line-height);
}
/* Image Full */

figure.is-style-image-full {
  margin: 0;
}
.is-style-image-full img {
  width: 100%;
}
.is-style-image-full img,
.is-style-image-left img,
.is-style-image-right img {
  border-radius: var(--image-border-radius);
  margin-bottom: 15px;
}
.is-style-image-full-caption img,
.is-style-image-left-caption img,
.is-style-image-right-caption img {
  border-radius: var(--image-border-radius) var(--image-border-radius) 0 0;
}
.is-style-image-full-caption figcaption.wp-element-caption {
  border-radius: var(--image-border-radius) var(--image-border-radius) 0 0 !important;
}

.is-style-image-left,
.is-style-image-left-caption {
  width: 50%;
  float: left;
  margin: 0 30px 0 0;
}

.is-style-image-right,
.is-style-image-right-caption {
  width: 50%;
  float: right;
  margin: 0 0 0 30px;
}

.is-style-image-left-caption figcaption.wp-element-caption,
.is-style-image-right-caption figcaption.wp-element-caption {
  border-radius: 0 0 var(--image-border-radius) var(--image-border-radius);
}

blockquote.is-style-primary-blockquote {
  border-left: 5px solid var(--blockquote-border-color);
  margin: 40px 0;
  padding-left: 30px;
}

/* Custom block button */
.is-style-primary-btn,
.is-style-secondary-btn {
  margin: 20px 0;
}

.et_pb_post_content_0_tb_body.et_pb_post_content
  .is-style-primary-btn
  .wp-block-button
  a {
  color: var(--primary-button-text-color) !important;
  border-radius: var(--button-border-radius);
  border: 1px solid var(--primary-button-background);
  background: var(--primary-button-background);
}

.et_pb_post_content_0_tb_body.et_pb_post_content
  .is-style-primary-btn
  .wp-block-button
  a:hover {
  color: var(--primary-button-text-color-hover) !important;
  background: var(--primary-button-background-hover);
  text-decoration: none;
}

.et_pb_post_content_0_tb_body.et_pb_post_content
  .is-style-secondary-btn
  .wp-block-button
  a {
  color: var(--secondary-button-text-color) !important;
  border-radius: var(--button-border-radius);
  border: 1px solid var(--secondary-button-text-color);
  background: var(--secondary-button-background);
}

.et_pb_post_content_0_tb_body.et_pb_post_content
  .is-style-secondary-btn
  .wp-block-button
  a:hover {
  color: var(--secondary-button-text-color-hover) !important;
  background: var(--secondary-button-background-hover);
  text-decoration: none;
}

/* Custom block styles mobile */

@media all and (max-width: 980px) {
  /* Fact Boxes Default Full */
  .wp-block-group.is-style-primary-fact-left,
  .wp-block-group.is-style-primary-fact-right,
  .wp-block-group.is-style-secondary-fact-left,
  .wp-block-group.is-style-secondary-fact-right {
    float: none;
    margin: 0 0 10px 0 !important;
    width: 100%;
  }

  /* Images default styles mobile */
  .is-style-image-left,
  .is-style-image-left-caption,
  .is-style-image-right,
  .is-style-image-right-caption {
    float: none;
    margin: 0 0 15px 0;
    width: 100%;
  }

  /* Images full width too */
  .is-style-image-left img,
  .is-style-image-left-caption img,
  .is-style-image-right img,
  .is-style-image-right-caption img {
    width: 100%;
  }
}

/* Indent numbered list in Gutenberg Editor */

ol.wp-block-list {
  padding-left: 40px;
  list-style-position: outside;
}