/*!
 * Content Editor Styling
 * Summernote and Rich Text Editor Content Styling for First Choice Cars
 * Bootstrap 4.6.2 Compatible
 */

/* =======================================================
   SUMMERNOTE CONTENT STYLING (MINIMAL)
   ======================================================= */

/* Basic Table Responsiveness Only */
.blog-data,
.offer-data,
#general-text {
    overflow-x: auto;
}

.blog-data table,
.offer-data table,
#general-text table {
    width: 100%;
    max-width: 100%;
}

/* =======================================================
   CONTENT LAYOUT STYLING
   ======================================================= */

/* Banner Image Styling */
.offer-banner-image,
.blog-banner-image {
    width: 100%;
    max-height: 360px;
    object-fit: cover;
    margin-bottom: 16px;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.07);
}

/* Social Share Icons */
.article-share.gn-media-share-links.share-list {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: nowrap;
    justify-content: flex-end;
    gap: 16px;
}

.article-share .fa-brands {
    font-size: 1.6rem;
    color: #242424;
    transition: color 0.15s;
    line-height: 1;
    display: inline-block;
}

.article-share .fa-brands:hover,
.article-share .fa-brands:focus {
    color: #c6a76f;
}

.article-share .share-link {
    display: inline-block;
    outline: none;
}

/* =======================================================
   RESPONSIVE DESIGN
   ======================================================= */

/* Tablet and Small Desktop */
@media (max-width: 768px) {
    .blog-data table,
    .offer-data table,
    #general-text table {
        font-size: 0.875rem;
    }

    .offer-banner-image,
    .blog-banner-image {
        max-height: 280px;
    }

    .article-share.gn-media-share-links.share-list {
        justify-content: center;
        gap: 12px;
    }

    .article-share .fa-brands {
        font-size: 1.4rem;
    }
}

/* Mobile */
@media (max-width: 480px) {
    .blog-data table,
    .offer-data table,
    #general-text table {
        font-size: 0.75rem;
    }

    .offer-banner-image,
    .blog-banner-image {
        max-height: 220px;
        border-radius: 8px;
    }

    .article-share .fa-brands {
        font-size: 1.2rem;
    }

    .article-share.gn-media-share-links.share-list {
        gap: 8px;
    }
}

/* =======================================================
   PRINT STYLES
   ======================================================= */

@media print {
    .article-share,
    .offer-banner-image,
    .blog-banner-image {
        display: none !important;
    }

    .blog-data table,
    .offer-data table,
    #general-text table {
        border: 1px solid #000 !important;
        box-shadow: none !important;
    }
}

/* =======================================================
   FRONTEND CONTENT DISPLAY
   ======================================================= */

/* Basic Image Styling for Frontend Content Display */
.blog-data img,
.offer-data img,
#general-text img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    margin: 10px 0;
}