/* CBD4YOU generated article heading hierarchy.
 * Keep semantic H3 headings, but size them more calmly than the theme's
 * default large heading treatment. Only AI-generated article widgets receive
 * c4yai-generated-content, so the rest of the site is not affected.
 */
.c4yai-generated-content h3,
.elementor-widget-heading.c4yai-generated-content .elementor-heading-title {
    font-size: 32px !important;
    line-height: 1.18 !important;
}

@media (max-width: 1024px) {
    .c4yai-generated-content h3,
    .elementor-widget-heading.c4yai-generated-content .elementor-heading-title {
        font-size: 28px !important;
    }
}

@media (max-width: 767px) {
    .c4yai-generated-content h3,
    .elementor-widget-heading.c4yai-generated-content .elementor-heading-title {
        font-size: 24px !important;
        line-height: 1.22 !important;
    }
}

/* Sentence line-break helper.
 * Every complete sentence starts on a new visual line. The original <p>
 * structure remains intact, so related sentences stay in the same editorial
 * paragraph without adding paragraph-sized spacing after every full stop.
 */
.c4yai-generated-content br.c4yai-sentence-break {
    display: block;
}

/* Good to know quick-reference list.
 * The AI prompt supplies one approved icon per item. Keep the list clean and
 * aligned without the browser's default bullet markers.
 */
.c4yai-generated-content ul.c4yai-good-to-know {
    list-style: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.c4yai-generated-content ul.c4yai-good-to-know > li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 12px 0;
    padding: 0;
}

.c4yai-generated-content ul.c4yai-good-to-know > li:last-child {
    margin-bottom: 0;
}

.c4yai-generated-content ul.c4yai-good-to-know > li > i {
    flex: 0 0 1.25em;
    width: 1.25em;
    text-align: center;
    margin-top: 0.18em;
}

.c4yai-generated-content ul.c4yai-good-to-know > li > span {
    flex: 1 1 auto;
    min-width: 0;
}

/* Good to know icons are rendered as inline SVG by frontend.js so they do not
 * depend on the theme's Font Awesome version or icon font being loaded. */
.c4yai-generated-content ul.c4yai-good-to-know > li > .c4yai-gkt-icon {
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(79, 111, 63, 0.09);
    color: #4f6f3f;
    margin-top: -2px;
}

.c4yai-generated-content ul.c4yai-good-to-know > li > .c4yai-gkt-icon svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Hide any stale Font Awesome placeholder that survived old generated HTML. */
.c4yai-generated-content ul.c4yai-good-to-know > li > i.fa,
.c4yai-generated-content ul.c4yai-good-to-know > li > i.fas,
.c4yai-generated-content ul.c4yai-good-to-know > li > i.fa-solid {
    display: none !important;
}