.v-card
{

    background-color: transparent;
}

/* In your CSS file or inside a <style> block */
.wrap-title
{
    white-space: normal;
    word-break:  break-word;
    important: true;
}

.article-content
{
    /* max-width: 800px; */
    margin:             0 auto;
    /* padding:            1rem 1.5rem; */
    margin-top:         1.6rem;
    line-height:        1.6;
    color:              #1a1a1a; /* Vuetify primary text color */
    font-family:        "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --v-border-opacity: 1;
}

.article-content h1,
.article-content h2,
.article-content h3,
.article-content h4,
.article-content h5,
.article-content h6
{
    margin-top:    2rem;
    margin-bottom: 1rem;
    color:         #1a1a1a;
}

.article-content h1
{
    font-size: 2.25rem; /* h1 - Vuetify typography */
}

.article-content h2
{
    font-size:      1.75rem; /* h2 */
    border-bottom:  1px solid rgba(0, 0, 0, 0.12); /* Vuetify divider style */
    padding-bottom: 0.3em;
}

.article-content h3
{
    font-size: 1.5rem; /* h3 */
}

.article-content h4
{
    font-size: 1.25rem; /* h4 */
}

.article-content h5
{
    font-size: 1rem; /* h5 */
}

.article-content h6
{
    font-size: 0.875rem; /* h6 */
}

.article-content p
{
    margin-bottom: 1.25rem;
    font-size:     1.2rem; /* body-large in Vuetify */
    font-weight:   400;
}

.article-content ul,
.article-content ol
{
    margin-bottom: 1.5rem;
    padding-left:  1.5rem;
}

.article-content li
{
    margin-bottom: 0.5rem;
    font-size:     1.2rem;
}

.article-content blockquote
{
    border-left:  4px solid #dadce0; /* Vuetify-like muted border */
    padding-left: 1rem;
    margin:       1.5rem 0;
    color:        #5f6368; /* Vuetify muted text */
    font-style:   italic;
}

.article-content code
{
    /* background-color: #f5f5f5; !* Vuetify surface color *! */
    padding:       0.2em 0.4em;
    border-radius: 4px;
    font-family:   "Courier New", Courier, monospace;
    color:         navy; /* Example color for inline code */
}

.article-content pre
{
    /* background-color: #f5f5f5; */
    padding:       1rem;
    overflow-x:    auto;
    border-radius: 6px;
    margin-bottom: 1.5rem;
    font-size:     0.875rem;
    /* color:            #e60000; !* Example color for code blocks *! */
    border:        1px solid rgba(0, 0, 0, 0.08);
}

.article-content a
{
    /* color:           #1565c0; !* Vuetify blue link *! */
    text-decoration: none;
}

.article-content a:hover
{
    text-decoration: underline;
}

.article-content hr
{
    border:     0;
    border-top: 1px solid rgba(0, 0, 0, 0.12); /* Vuetify divider */
    margin:     2rem 0;
}

.article-content table
{
    width:           100%;
    border-collapse: collapse;
    margin:          1.5rem 0;
    font-size:       0.875rem; /* body-large in Vuetify */
}

.article-content th,
.article-content td
{
    text-align:    left;
    padding:       0.75rem 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); /* Vuetify divider style */
}

.article-content th
{
    font-weight:      600;
    color:            #1a1a1a;
    background-color: transparent;
}

.article-content tr:hover
{
    background-color: rgba(0, 0, 0, 0.04); /* Subtle hover effect */
}

.article-content caption
{
    caption-side: bottom;
    color:        #5f6368;
    font-size:    0.75rem;
    text-align:   right;
    margin-top:   0.5rem;
}

.image-row
{
    display:         flex;
    flex-wrap:       nowrap;
    justify-content: center; /* Center images horizontally */
    overflow-x:      hidden;
    width:           100vw;
    min-width:       0; /* Fix for Firefox */
    white-space:     nowrap;
    gap:             16px;
    align-items:     stretch;
}

.image_thumbnail
{
    height:        30vh;
    width:         auto;
    object-fit:    cover;
    flex-shrink:   0;
    border-radius: 8px;
    max-width:     100%;
    box-sizing:    border-box;
}