/* ========================================
   MOBILE RESPONSIVE - NEWS DETAIL PAGE
   FIX: Judul tidak terpotong & hapus card untuk news kecil
   ======================================== */

@media (max-width: 991px) {

    /* Prevent horizontal scroll */
    html,
    body {
        overflow-x: hidden !important;
    }

    /* Container */
    section.pb-0 .container {
        padding-left: 0.875rem !important;
        padding-right: 0.875rem !important;
    }

    /* Row & Columns - Full Width */
    section.pb-0 .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    section.pb-0 [class*="col-"] {
        padding-left: 0.875rem !important;
        padding-right: 0.875rem !important;
    }

    /* Article Title - Full Display (No Truncate) */
    .wrap__article-detail-title h1 {
        font-size: 1.5rem !important;
        line-height: 1.4 !important;
        margin-bottom: 1rem !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        white-space: normal !important;
    }

    /* Featured Image */
    .wrap__article-detail-image img {
        width: 100% !important;
        height: auto !important;
        border-radius: 12px !important;
    }

    /* Article Content - Better Reading */
    .wrap__article-detail-content p {
        font-size: 1rem !important;
        line-height: 1.7 !important;
        margin-bottom: 1.25rem !important;
    }

    /* Share On Section */
    .total-views {
        padding: 1rem !important;
        background: #f8f9fa !important;
        border-radius: 12px !important;
        margin-bottom: 1.25rem !important;
    }

    .total-views .share {
        font-size: 0.875rem !important;
        font-weight: 600 !important;
        margin-bottom: 0.75rem !important;
        display: block !important;
    }

    /* Social Share Buttons - Icon Only (Square) */
    .total-views .list-inline {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 0.625rem !important;
        margin-bottom: 0 !important;
    }

    .total-views .list-inline-item {
        flex: 0 0 auto !important;
        margin: 0 !important;
    }

    .btn-social-o {
        width: 44px !important;
        height: 44px !important;
        padding: 0 !important;
        font-size: 1.125rem !important;
        border-radius: 10px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        transition: all 0.2s ease !important;
        border: none !important;
    }

    .btn-social-o i,
    .btn-social-o svg {
        font-size: 1.125rem !important;
        width: 18px !important;
        height: 18px !important;
    }

    .btn-social-o span {
        display: none !important;
    }

    .btn-social-o.facebook {
        background: #1877f2 !important;
        color: #fff !important;
    }

    .btn-social-o.twitter,
    .btn-social-o.x-twitter {
        background: #000 !important;
        color: #fff !important;
    }

    .btn-social-o.linkedin,
    .btn-linkedin-o {
        background: #0a66c2 !important;
        color: #fff !important;
    }

    .btn-social-o.whatsapp {
        background: #25d366 !important;
        color: #fff !important;
    }

    .btn-social-o.telegram {
        background: #0088cc !important;
        color: #fff !important;
    }

    .btn-social-o:active {
        transform: scale(0.95) !important;
    }

    /* Sidebar Small News - NO CARD, Simple List */
    .wrapper__list__article-small .card__post-list {
        display: flex !important;
        gap: 0.875rem !important;
        margin-bottom: 1.125rem !important;
        padding-bottom: 1.125rem !important;
        border-bottom: 1px solid #e9ecef !important;
        background: transparent !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }

    .wrapper__list__article-small .card__post-list:last-child {
        border-bottom: none !important;
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }

    .wrapper__list__article-small .image-sm {
        flex: 0 0 35% !important;
        max-width: 35% !important;
    }

    .wrapper__list__article-small .image-sm img {
        border-radius: 10px !important;
        height: 85px !important;
        width: 100% !important;
        object-fit: cover !important;
    }

    .wrapper__list__article-small .card__post__body {
        flex: 1 !important;
        max-width: 65% !important;
        padding: 0 !important;
    }

    /* Sidebar Titles - Full Display (No Truncate) */
    .wrapper__list__article-small .card__post__title h6 {
        font-size: 0.9375rem !important;
        font-weight: 600 !important;
        line-height: 1.45 !important;
        margin-bottom: 0.375rem !important;
        color: #212529 !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        white-space: normal !important;
    }

    .wrapper__list__article-small .card__post__title h6 a {
        color: #212529 !important;
        display: block !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }

    .wrapper__list__article-small .card__post__author-info .list-inline-item {
        font-size: 0.75rem !important;
        color: #868e96 !important;
    }
}

/* Mobile Only (Small Screens) */
@media (max-width: 575px) {
    section.pb-0 .container {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }

    section.pb-0 [class*="col-"] {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }

    .wrap__article-detail-title h1 {
        font-size: 1.375rem !important;
    }

    .btn-social-o {
        width: 40px !important;
        height: 40px !important;
    }

    .btn-social-o i,
    .btn-social-o svg {
        font-size: 1rem !important;
        width: 16px !important;
        height: 16px !important;
    }
}