/**
 * Paragraph Block Styles
 *
 * This file contains styles for WordPress block editor paragraph blocks.
 * It provides typography styling, text alignment options, font size variations,
 * drop cap styling, background colors, text colors, and responsive adjustments
 * for mobile devices.
 *
 * @package VGA
 * @since 1.0.0
 */

/* Paragraph Wrapper */
.wp-block-paragraph,
.entry-content p {
  margin-bottom: 1.5rem;
  margin: 1.2rem 0;
  line-height: 1.8;
  color: var(--wp--preset--color--foreground);
  font-size: 18px;
  max-width: 718px;
}

/* Paragraph */
.wp-block-paragraph:last-child,
.entry-content p:last-child {
  margin-bottom: 0;
}

/* Drop Cap */
.wp-block-paragraph.has-drop-cap:not(:focus)::first-letter,
.entry-content p.has-drop-cap:not(:focus)::first-letter {
  font-size: 3.5em;
  font-weight: 700;
  float: left;
  line-height: 0.8;
  margin: 0.1em 0.1em 0 0;
  text-transform: uppercase;
  font-style: normal;
}

/* Text Alignment */
.wp-block-paragraph.has-text-align-left,
.entry-content p.has-text-align-left {
  text-align: left;
}
.wp-block-paragraph.has-text-align-center,
.entry-content p.has-text-align-center {
  text-align: center;
}
.wp-block-paragraph.has-text-align-right,
.entry-content p.has-text-align-right {
  text-align: right;
}
.wp-block-paragraph.has-text-align-justify,
.entry-content p.has-text-align-justify {
  text-align: justify;
}

/* Font Size */
.wp-block-paragraph.has-small-font-size,
.entry-content p.has-small-font-size {
  font-size: var(--wp--preset--font-size--small);
}
.wp-block-paragraph.has-normal-font-size,
.entry-content p.has-normal-font-size {
  font-size: var(--wp--preset--font-size--normal);
}
.wp-block-paragraph.has-large-font-size,
.entry-content p.has-large-font-size {
  font-size: var(--wp--preset--font-size--large);
}
.wp-block-paragraph.has-larger-font-size,
.entry-content p.has-larger-font-size {
  font-size: var(--wp--preset--font-size--larger);
}
.wp-block-paragraph.has-huge-font-size,
.entry-content p.has-huge-font-size {
  font-size: var(--wp--preset--font-size--huge);
}

/* Background */
.wp-block-paragraph.has-background,
.entry-content p.has-background {
  padding: 1rem 1.5rem;
  border-radius: 4px;
}
.wp-block-paragraph.has-primary-background-color,
.entry-content p.has-primary-background-color {
  background-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--background);
}
.wp-block-paragraph.has-secondary-background-color,
.entry-content p.has-secondary-background-color {
  background-color: var(--wp--preset--color--secondary);
  color: var(--wp--preset--color--background);
}

/* Color */
.wp-block-paragraph.has-primary-color,
.entry-content p.has-primary-color {
  color: var(--wp--preset--color--primary);
}
.wp-block-paragraph.has-secondary-color,
.entry-content p.has-secondary-color {
  color: var(--wp--preset--color--secondary);
}

/* Links */
.wp-block-paragraph a,
.entry-content p a {
  font-weight: bold;
  color: var(--color-black);
  text-decoration: underline;
  text-decoration-color: var(--color-light-green);
  text-decoration-thickness: 2px;
  text-underline-offset: 2px;
  transition: text-decoration-thickness 0.2s ease;
}

.wp-block-paragraph a:hover,
.entry-content p a:hover,
.wp-block-paragraph a:focus,
.entry-content p a:focus {
  color: var(--color-black);
  text-decoration-color: var(--color-light-green);
  text-decoration-thickness: 3px;
}

/* Mobile */
@media (max-width: 1080px) {
  /* Paragraph Wrapper */
  .wp-block-paragraph,
  .entry-content p {
    margin-bottom: 1rem;
  }

  /* Drop Cap */
  .wp-block-paragraph.has-drop-cap:not(:focus)::first-letter,
  .entry-content p.has-drop-cap:not(:focus)::first-letter {
    font-size: 2.5em;
  }

  /* Background */
  .wp-block-paragraph.has-background,
  .entry-content p.has-background {
    padding: 0.75rem 1rem;
  }
}