/* Image Aspect Ratio Fixes - All Sections */

/* ============================================
   MAIN POST SECTION (Homepage hero)
   ============================================ */

/* Main featured article (left) - 900x600 */
.main-post-section-style-1 .rt-post-overlay-xl.layout-1 .post-img a {
    display: block;
    aspect-ratio: 900 / 600;
}

.main-post-section-style-1 .rt-post-overlay-xl.layout-1 .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Medium posts on the right - 696x491 */
.main-post-section-style-1 .post-md.style-10 .post-img a {
    display: block;
    aspect-ratio: 696 / 491;
}

.main-post-section-style-1 .post-md.style-10 .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ============================================
   TOP STORIES SECTION
   ============================================ */

/* Grid posts - 551x431 */
.top-stories-style-1 .rt-post-grid .post-img a {
    display: block;
    aspect-ratio: 551 / 431;
}

.top-stories-style-1 .rt-post-grid .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ============================================
   WHAT'S NEW SECTION
   ============================================ */

/* Large post - 900x600 */
.whats-new-style-1 .rt-post-overlay-lg .post-img a {
    display: block;
    aspect-ratio: 900 / 600;
}

.whats-new-style-1 .rt-post-overlay-lg .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Small posts (style-2) - 143x110 */
.whats-new-style-1 .post-sm.style-2 .post-img a {
    display: block;
    aspect-ratio: 143 / 110;
}

.whats-new-style-1 .post-sm.style-2 .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ============================================
   LIFE STYLE SECTION
   ============================================ */

/* Medium overlay - 900x600 */
.rt-post-overlay-md .post-img a {
    display: block;
    aspect-ratio: 900 / 600;
}

.rt-post-overlay-md .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ============================================
   LATEST NEWS SECTION
   ============================================ */

/* Post style-2 - 696x491 */
.post-md.style-2 .post-img a {
    display: block;
    aspect-ratio: 696 / 491;
}

.post-md.style-2 .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ============================================
   FEATURED POST SECTION (tabs)
   ============================================ */

/* Small grid posts (style-8) - 343x250 */
.post-md.style-8 .post-img a {
    display: block;
    aspect-ratio: 343 / 250;
}

.post-md.style-8 .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ============================================
   SECTION PAGE (list view)
   ============================================ */

/* Post style-9 - 696x491 */
.post-md.style-9 .post-img a {
    display: block;
    aspect-ratio: 696 / 491;
}

.post-md.style-9 .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Section page featured - 900x500 */
.section-articles-grid .rt-post-overlay-lg .post-img a {
    display: block;
    aspect-ratio: 900 / 500;
}

.section-articles-grid .rt-post-overlay-lg .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Section page grid - 696x491 */
.section-articles-grid .rt-post-grid .post-img a {
    display: block;
    aspect-ratio: 696 / 491;
}

.section-articles-grid .rt-post-grid .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ============================================
   SIDEBAR
   ============================================ */

/* Sidebar small posts - 100x100 */
.rt-sidebar .post-sm .post-img {
    flex-shrink: 0;
}

.rt-sidebar .post-sm .post-img a {
    display: block;
    width: 100px;
    height: 100px;
}

.rt-sidebar .post-sm .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 4px;
}

/* ============================================
   NEWSLETTER PAGE
   ============================================ */

.post-wrap-style-3 .post-img a {
    display: block;
    aspect-ratio: 696 / 491;
}

.post-wrap-style-3 .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ============================================
   GENERAL GRID POSTS
   ============================================ */

.rt-post-grid .post-img a {
    display: block;
    aspect-ratio: 16 / 10;
}

.rt-post-grid .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ============================================
   LO MAS NUEVO / WHAT'S NEW SECTION
   ============================================ */

/* Large post - 900x600 (3:2 ratio) */
.rt-post-overlay.rt-post-overlay-lg .post-img {
    position: relative;
    overflow: hidden;
}

.rt-post-overlay.rt-post-overlay-lg .post-img a.img-link {
    display: block;
    aspect-ratio: 3 / 2;
}

.rt-post-overlay.rt-post-overlay-lg .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Small posts style-2 - 143x110 */
.rt-post.post-sm.style-2 .post-img {
    flex-shrink: 0;
}

.rt-post.post-sm.style-2 .post-img a {
    display: block;
    width: 143px;
    height: 110px;
    overflow: hidden;
}

.rt-post.post-sm.style-2 .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Medium overlay posts - 900x600 (3:2 ratio) */
.rt-post-overlay.rt-post-overlay-md .post-img {
    position: relative;
    overflow: hidden;
}

.rt-post-overlay.rt-post-overlay-md .post-img a.img-link {
    display: block;
    aspect-ratio: 3 / 2;
}

.rt-post-overlay.rt-post-overlay-md .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* XL overlay posts - main featured */
.rt-post-overlay.rt-post-overlay-xl .post-img {
    position: relative;
    overflow: hidden;
}

.rt-post-overlay.rt-post-overlay-xl .post-img a.img-link {
    display: block;
    aspect-ratio: 1 / 1;
}

.rt-post-overlay.rt-post-overlay-xl .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ============================================
   ARTICLE CONTENT IMAGES (CKEditor content)
   ============================================ */

/* Images inside article content should display at actual size */
.rt-main-post-single .post-body .post-content img {
    max-width: 100%;
    height: auto !important;
    width: auto;
    object-fit: contain;
    display: block;
    margin: 20px auto;
}

/* Handle CKEditor image wrappers */
.rt-main-post-single .post-body .post-content figure {
    max-width: 100%;
    margin: 20px auto;
    text-align: center;
}

.rt-main-post-single .post-body .post-content figure img {
    max-width: 100%;
    height: auto !important;
    width: auto;
}

.rt-main-post-single .post-body .post-content figcaption {
    font-size: 0.875rem;
    color: #666;
    margin-top: 8px;
    font-style: italic;
}

/* Handle images with inline styles from CKEditor */
.rt-main-post-single .post-body .post-content p img,
.rt-main-post-single .post-body .post-content span img {
    max-width: 100%;
    height: auto !important;
}

/* ============================================
   ARTICLE AUTHOR BOX
   ============================================ */

.article-authors-box {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
}

.article-authors-box .author-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.article-authors-box .author-avatar img {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--color-primary);
    transition: transform 0.3s ease;
}

.article-authors-box .author-avatar:hover img {
    transform: scale(1.1);
}

.article-authors-box .author-avatar .author-initial {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 600;
    font-size: 16px;
}

.article-authors-box .author-info {
    line-height: 1.4;
}

.article-authors-box .author-info a {
    color: var(--color-primary);
    font-weight: 600;
    text-decoration: none;
}

.article-authors-box .author-info a:hover {
    text-decoration: underline;
}

.article-authors-box .author-info > span {
    font-size: 14px;
    color: #666;
}

.article-authors-box .author-info .author-time {
    display: block;
    font-size: 13px;
    color: #999;
}

/* Dark mode support */
[data-theme=dark] .article-authors-box {
    border-bottom-color: #333;
}

[data-theme=dark] .article-authors-box .author-info > span {
    color: #aaa;
}

[data-theme=dark] .article-authors-box .author-info .author-time {
    color: #888;
}

/* Article excerpt styling */
.article-excerpt {
    font-size: 1.125rem;
    color: #555;
    line-height: 1.6;
    margin-bottom: 20px;
}

[data-theme=dark] .article-excerpt {
    color: #bbb;
}
