/*
 * AIE Solicitor Directory: firm articles on theme pages.
 *
 * Loaded with tokens.css only, on single posts, the blog index and archives
 * (ArticleAttribution). The theme owns the article and the blog cards; this
 * sheet styles only the plugin's own output on the Abuse Injury Group design
 * (docs/DESIGN_SYSTEM.md):
 *
 * - the byline "Contributed by {firm}" (p.aie-ui.aie-article-byline), a
 *   sentence in DM Sans 600, muted, with the firm name (span.aie-byline-firm)
 *   in plum - a name, not a category label, so it is never set in capitals;
 * - the featured image the plugin prints at the top of a single firm article
 *   (figure.aie-ui.aie-article-featured-image), in a 20px-radius frame;
 * - and, at the end, the guards that stop a firm article showing its featured
 *   image twice or an empty image frame. They use the classes the plugin adds
 *   (post_class: .aie-firm-article and --has-image / --no-image; body_class
 *   on a single firm article: .aie-firm-article-single and the same modifier)
 *   and WordPress's own image wrappers (.post-thumbnail in classic themes,
 *   .wp-block-post-featured-image in block themes, .wp-post-image on the
 *   image itself).
 *
 * The theme's stylesheets print after this one, so selectors carry one more
 * class or element than the theme rules they meet.
 */

/* ------------------------------------------------------------------ */
/* Byline                                                              */
/* ------------------------------------------------------------------ */

p.aie-ui.aie-article-byline {
    display: block;
    max-width: 100%;
    margin: 0 0 1.25rem;
    padding: 0;
    color: var(--aie-muted);
    font-family: var(--aie-font-body);
    font-size: 0.95rem;
    font-style: normal;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: 0;
    text-align: left;
    text-transform: none;
    overflow-wrap: break-word;
    background: none;
    border: 0;
}

p.aie-ui.aie-article-byline .aie-byline-firm {
    color: var(--aie-plum);
    font: inherit;
    letter-spacing: inherit;
    text-transform: none;
}

/* ------------------------------------------------------------------ */
/* Featured image of a single firm article                             */
/* ------------------------------------------------------------------ */

figure.aie-ui.aie-article-featured-image {
    display: block;
    max-width: 100%;
    margin: 0 0 1.75rem;
    padding: 0;
    overflow: hidden;
    background: var(--aie-pale);
    border-radius: var(--aie-radius-card);
}

.aie-ui.aie-article-featured-image .aie-article-featured-image__img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 560px;
    margin: 0;
    object-fit: cover;
    border: 0;
    border-radius: var(--aie-radius-card);
    box-shadow: none;
}

/* ------------------------------------------------------------------ */
/* One image, never an empty frame                                     */
/* ------------------------------------------------------------------ */

/* An image-less firm article shows no empty media frame, on blog cards and
   in the article itself (post_class puts the classes on the post element). */
.aie-firm-article.aie-firm-article--no-image :is(.post-thumbnail, .wp-post-image, .wp-block-post-featured-image) {
    display: none;
}

/* Single firm article without an image: also the template's own image
   frame printed outside any post element. Other posts' cards are left
   alone. */
.aie-firm-article-single.aie-firm-article--no-image :is(.post-thumbnail, .wp-block-post-featured-image):not(:is(.hentry, .wp-block-post) *) {
    display: none;
}

/* Single firm article with an image: the plugin prints the image at the top
   of the article, where a site rule that hides theme featured images cannot
   remove it. The theme's own copy is hidden so the image shows once: first
   a copy the template prints outside any post element (for example above
   the article)... */
.aie-firm-article-single.aie-firm-article--has-image :is(.post-thumbnail, .wp-block-post-featured-image):not(:is(.hentry, .wp-block-post) *) {
    display: none;
}

/* ...then a copy inside the article itself: the post element that holds the
   plugin's image. Related posts and query loops keep their thumbnails. Kept
   as a separate rule so a browser without :has() still applies the rule
   above. */
.aie-firm-article-single.aie-firm-article--has-image :is(.hentry, .wp-block-post):has(.aie-article-featured-image) :is(.post-thumbnail, .wp-block-post-featured-image) {
    display: none;
}

/* Nothing of the plugin's moves when less motion is requested, even where a
   theme animates images. */
@media (prefers-reduced-motion: reduce) {
    .aie-ui.aie-article-byline,
    .aie-ui.aie-article-featured-image,
    .aie-ui.aie-article-featured-image .aie-article-featured-image__img {
        transform: none;
        transition: none;
        animation: none;
    }
}