/* ---------------------------------------------------------------------------
   Adjustments to styles.min.css.

   Kept in a separate file rather than edited into the minified theme sheet, so
   the original stays intact and every deviation from it is visible in one place.
   Must be loaded after styles.min.css.
   --------------------------------------------------------------------------- */

/* -- Panel boxes (.well-global) --------------------------------------------
   The box shipped with 4rem (64px) of padding, which left the three
   related-post links marooned in the middle of a very large panel.

   Note the scope: .well-global is shared by RelatedPosts.ascx and
   CommentForm.ascx, so this tightens the Add Comment box as well. That is
   deliberate - the two panels sit stacked on a post page, and leaving one at
   64px and the other at 24px would read as a mistake. To confine the change to
   related posts only, swap the .well-global selectors below for #relatedPosts.
   ------------------------------------------------------------------------- */

.well-global {
    margin-bottom: 1.5rem;
    padding: 1.5rem;
    background: #f7f7f7;
    /* The stock #eee border all but vanishes against the fill, so it is nudged
       a shade darker to keep the panel edge legible. */
    border-color: #e4e4e4;
}

.well-global .well-global-title {
    margin-bottom: 0.85rem;
    font-size: 1.1rem;
}

.related-posts .related-posts-item {
    margin-bottom: 0.65rem;
}

.related-posts .related-posts-item a {
    line-height: 1.35;
}

.related-posts .related-posts-item p {
    margin-top: 0.15rem;
    color: #666;
    line-height: 1.4;
}

/* styles.min.css drops the padding and border entirely below 800px so the block
   runs full width on phones. That rule sits in an earlier file, so without
   restating it here the padding above would leak back in at small sizes. */
@media screen and (max-width: 800px) {
    .well-global {
        padding: 0;
        border: 0;
        /* The fill goes too. Below this width the theme drops the panel's padding
           and border so the block runs edge to edge, and a background with no
           padding would put the text hard against the colour. */
        background: none;
    }
}