/* ================================================================
   QAMSA — KNOWLEDGE DETAIL RESPONSIVE LAYER
   SECTION: MOBILE-FIRST CONTENT DETAILS UX
   ----------------------------------------------------------------
   Scope: content_details.php only
   Purpose: eliminate mobile overflow and preserve the existing
            Qamsa desktop design while improving touch usability.
   ================================================================ */

.qamsa-content-page {
    overflow-x: hidden;
}

.qamsa-content-page main,
.qamsa-content-page main .row,
.qamsa-content-page main [class*="col-"] {
    min-width: 0;
}

/* ================================================================
   SECTION: BREADCRUMBS
   ================================================================ */

.qamsa-content-page nav[aria-label="Breadcrumb"] {
    overflow: hidden;
}

.qamsa-content-page nav[aria-label="Breadcrumb"] .breadcrumb {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

.qamsa-content-page nav[aria-label="Breadcrumb"] .breadcrumb::-webkit-scrollbar {
    display: none;
}

.qamsa-content-page nav[aria-label="Breadcrumb"] .breadcrumb-item {
    flex: 0 0 auto;
}

.qamsa-content-page nav[aria-label="Breadcrumb"] .breadcrumb-item.active {
    max-width: min(70vw, 320px) !important;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ================================================================
   SECTION: KNOWLEDGE HEADER
   ================================================================ */

.qamsa-content-page .knowledge-title,
.qamsa-content-page .knowledge-summary,
.qamsa-content-page .knowledge-body,
.qamsa-content-page .contribution-content,
.qamsa-content-page .reference-content {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.qamsa-content-page .knowledge-info {
    min-width: 0;
}

.qamsa-content-page .knowledge-value {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
}

.qamsa-content-page .knowledge-value h6 {
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* ================================================================
   SECTION: AUTHOR STRIP
   ================================================================ */

.qamsa-content-page .author-strip {
    min-width: 0;
}

.qamsa-content-page .author-strip .d-flex.align-items-center {
    min-width: 0;
}

.qamsa-content-page .author-strip-meta {
    min-width: 0;
}

/* ================================================================
   SECTION: KNOWLEDGE MEDIA
   ================================================================ */

.qamsa-content-page .knowledge-media,
.qamsa-content-page .knowledge-carousel,
.qamsa-content-page .carousel-inner {
    max-width: 100%;
    min-width: 0;
}

.qamsa-content-page .knowledge-image {
    max-width: 100%;
    height: auto;
}

/* ================================================================
   SECTION: KNOWLEDGE BODY
   ================================================================ */

.qamsa-content-page .knowledge-body {
    max-width: 100%;
    overflow-wrap: anywhere;
}

.qamsa-content-page .knowledge-body img,
.qamsa-content-page .knowledge-body video,
.qamsa-content-page .knowledge-body iframe {
    max-width: 100%;
}

.qamsa-content-page .knowledge-body iframe {
    width: 100%;
    border: 0;
}

.qamsa-content-page .knowledge-body table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
}

.qamsa-content-page .knowledge-body pre {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.qamsa-content-page .knowledge-body code {
    overflow-wrap: anywhere;
}

/* ================================================================
   SECTION: CONTENT ACTIONS
   ================================================================ */

.qamsa-content-page .content-actions {
    min-width: 0;
}

.qamsa-content-page .content-actions-grid {
    padding-left: 20px;
    padding-right: 20px;
}

.qamsa-content-page .content-action-btn {
    min-width: 0;
    min-height: 68px;
    width: 100%;
    touch-action: manipulation;
}

.qamsa-content-page .content-action-btn small {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qamsa-content-page .more-action {
    min-width: 0;
}

.qamsa-content-page .content-more-menu {
    max-width: calc(100vw - 32px);
}

/* ================================================================
   SECTION: CONTENT STATISTICS
   ================================================================ */

.qamsa-content-page .content-statistics {
    min-width: 0;
}

.qamsa-content-page .content-stat {
    min-width: 0;
}

/* ================================================================
   SECTION: DISCUSSION
   ================================================================ */

.qamsa-content-page #discussionSection,
.qamsa-content-page #discussionComposer {
    min-width: 0;
    overflow: hidden;
}

.qamsa-content-page .discussion-summary,
.qamsa-content-page .community-highlight,
.qamsa-content-page .reference-quote,
.qamsa-content-page .reply-context {
    min-width: 0;
    max-width: 100%;
}

.qamsa-content-page .summary-item {
    min-width: 0;
}

.qamsa-content-page .summary-item strong,
.qamsa-content-page .summary-item small {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.qamsa-content-page .contribution-header,
.qamsa-content-page .contribution-actions,
.qamsa-content-page .reply-composer {
    min-width: 0;
}

.qamsa-content-page .contributor-avatar {
    flex: 0 0 auto;
}

.qamsa-content-page .contribution-children {
    min-width: 0;
}

.qamsa-content-page .contribution-action-btn,
.qamsa-content-page .reply-tool {
    touch-action: manipulation;
}

/* ================================================================
   SECTION: DISCOVERY RAIL
   ================================================================ */

.qamsa-content-page .discovery-scroll {
    max-width: 100%;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
}

.qamsa-content-page .discovery-card {
    scroll-snap-align: start;
    flex: 0 0 300px;
}

/* ================================================================
   SECTION: FLOATING ACTION DOCK
   ================================================================ */

.qamsa-content-page #floatingActionDock {
    max-width: calc(100vw - 24px);
}

.qamsa-content-page .floating-action {
    min-width: 0;
    min-height: 44px;
    touch-action: manipulation;
}

/* ================================================================
   SECTION: SMALL PHONES — <576px
   ================================================================ */

@media (max-width: 575.98px) {

    .qamsa-content-page main.container-xl {
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
        margin-top: 12px !important;
    }

    .qamsa-content-page nav[aria-label="Breadcrumb"] {
        padding: 10px 12px !important;
        margin-bottom: 12px !important;
        border-radius: 14px;
    }

    .qamsa-content-page nav[aria-label="Breadcrumb"] .breadcrumb {
        font-size: .72rem !important;
        padding-bottom: 2px;
    }

    .qamsa-content-page .row.g-4 {
        --bs-gutter-x: .75rem;
        --bs-gutter-y: .75rem;
    }

    .qamsa-content-page article.p-4 {
        padding: 14px !important;
        border-radius: 18px;
    }

    .qamsa-content-page .knowledge-info.glass-panel.p-3 {
        padding: 12px !important;
        border-radius: 15px;
    }

    .qamsa-content-page .knowledge-title {
        font-size: 1.28rem;
        line-height: 1.35;
        margin-bottom: .7rem;
    }

    .qamsa-content-page .knowledge-summary {
        font-size: .9rem;
        line-height: 1.7;
        padding-left: 12px;
    }

    .qamsa-content-page .knowledge-info.p-4 {
        padding: 4px !important;
        margin-bottom: 8px !important;
        border: 0;
        background: transparent;
    }

    .qamsa-content-page .knowledge-info .row {
        --bs-gutter-x: .5rem;
        --bs-gutter-y: .5rem;
    }

    .qamsa-content-page .knowledge-info .col-6 {
        width: 50%;
    }

    .qamsa-content-page .knowledge-item {
        padding: 9px 10px;
        min-height: 54px;
        gap: 8px;
        border-radius: 12px;
    }

    .qamsa-content-page .knowledge-icon {
        width: 30px;
        height: 30px;
        border-radius: 8px;
        font-size: .78rem;
    }

    .qamsa-content-page .knowledge-item small {
        font-size: .58rem;
        letter-spacing: .04em;
    }

    .qamsa-content-page .knowledge-item h6 {
        font-size: .76rem;
        line-height: 1.25;
    }

    .qamsa-content-page .author-strip {
        padding: 12px;
        border-radius: 14px;
    }

    .qamsa-content-page .author-strip > .d-flex {
        align-items: flex-start !important;
        flex-direction: column;
    }

    .qamsa-content-page .author-strip > .d-flex > .d-flex {
        width: 100%;
    }

    .qamsa-content-page .author-strip > .d-flex > .btn {
        width: 100%;
    }

    .qamsa-content-page .author-strip-avatar {
        width: 44px;
        height: 44px;
    }

    .qamsa-content-page .author-strip-meta {
        gap: 7px 12px;
        font-size: .7rem;
    }

    .qamsa-content-page .knowledge-media {
        border-radius: 15px;
        margin-bottom: 14px !important;
    }

    .qamsa-content-page .knowledge-image {
        max-height: 360px;
    }

    .qamsa-content-page .carousel-control-prev,
    .qamsa-content-page .carousel-control-next {
        width: 42px;
    }

    .qamsa-content-page .carousel-control-prev-icon,
    .qamsa-content-page .carousel-control-next-icon {
        width: 34px;
        height: 34px;
    }

    .qamsa-content-page .knowledge-body {
        font-size: .96rem;
        line-height: 1.82;
    }

    .qamsa-content-page .knowledge-body p {
        margin-bottom: 1.2rem;
    }

    .qamsa-content-page .knowledge-body h2,
    .qamsa-content-page .knowledge-body h3,
    .qamsa-content-page .knowledge-body h4,
    .qamsa-content-page .knowledge-body h5 {
        margin-top: 1.8rem;
    }

    .qamsa-content-page .knowledge-body blockquote {
        padding: 1rem;
        margin: 1.4rem 0;
    }

    .qamsa-content-page .content-actions {
        margin: 1rem 0 .5rem;
        border-radius: 15px;
    }

    .qamsa-content-page .content-actions-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        padding: 10px !important;
    }

    .qamsa-content-page .content-action-btn {
        min-height: 64px;
        padding: 9px 6px;
        gap: 5px;
        border-radius: 12px;
    }

    .qamsa-content-page .content-action-btn i {
        font-size: 1.05rem;
    }

    .qamsa-content-page .content-action-btn small {
        font-size: .68rem;
    }

    .qamsa-content-page .content-more-menu {
        position: fixed !important;
        left: 12px !important;
        right: 12px !important;
        bottom: 76px !important;
        top: auto !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none;
        margin: 0 !important;
        z-index: 1060;
    }

    .qamsa-content-page .content-statistics {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        padding: 12px 0;
        margin: .75rem 0 1rem;
    }

    .qamsa-content-page .content-stat {
        justify-content: center;
        gap: 5px;
        padding: 7px 4px;
        font-size: .72rem;
        border-radius: 10px;
        background: rgba(13,110,253,.025);
    }

    .qamsa-content-page .content-stat strong {
        font-size: .78rem;
    }

    .qamsa-content-page .content-stat span {
        font-size: .66rem;
    }

    .qamsa-content-page #discussionSection,
    .qamsa-content-page #discussionComposer {
        padding: 14px !important;
        border-radius: 17px;
    }

    .qamsa-content-page #discussionSection > h3 {
        font-size: .95rem;
        margin-bottom: 14px !important;
        padding-bottom: 10px !important;
    }

    .qamsa-content-page .discussion-summary {
        padding: 10px !important;
        border-radius: 14px;
    }

    .qamsa-content-page .summary-item strong {
        display: block;
        font-size: .9rem;
    }

    .qamsa-content-page .summary-item small {
        display: block;
        font-size: .62rem;
    }

    .qamsa-content-page .contribution-children {
        margin-left: 10px;
        padding-left: 10px;
    }

    .qamsa-content-page .contribution-header {
        gap: 8px;
    }

    .qamsa-content-page .contributor-avatar {
        width: 40px;
        height: 40px;
        margin-right: 8px !important;
    }

    .qamsa-content-page .contribution-actions {
        justify-content: flex-start;
    }

    .qamsa-content-page .contribution-action-btn {
        min-height: 42px;
        padding: 8px 11px;
        font-size: .74rem;
    }

    .qamsa-content-page .reply-composer {
        align-items: stretch;
        flex-direction: column;
    }

    .qamsa-content-page .reply-tools {
        width: 100%;
    }

    .qamsa-content-page .reply-tool {
        width: 40px;
        height: 40px;
    }

    .qamsa-content-page .content-discovery {
        margin-top: 2.2rem;
    }

    .qamsa-content-page .discovery-title {
        font-size: 1.2rem;
    }

    .qamsa-content-page .discovery-subtitle {
        font-size: .78rem;
        line-height: 1.5;
    }

    .qamsa-content-page .discovery-card {
        flex-basis: 78vw;
        min-width: 78vw;
        max-width: 78vw;
    }

    .qamsa-content-page .discovery-image {
        height: 150px;
    }

    .qamsa-content-page .col-lg-4 > .glass-panel {
        margin-bottom: 12px !important;
    }

    .qamsa-content-page #floatingActionDock {
        left: 12px;
        right: 12px;
        width: auto;
        max-width: none;
        bottom: 10px;
        gap: 3px;
        padding: 6px;
        border-radius: 18px;
    }

    .qamsa-content-page #floatingActionDock.show {
        transform: translateY(0);
    }

    .qamsa-content-page .floating-action {
        flex: 1 1 0;
        justify-content: center;
        min-height: 44px;
        padding: 8px 5px;
        border-radius: 13px;
    }

    .qamsa-content-page .floating-action span {
        display: none;
    }

}

/* ================================================================
   SECTION: SMALL TABLETS — 576px–767px
   ================================================================ */

@media (min-width: 576px) and (max-width: 767.98px) {

    .qamsa-content-page main.container-xl {
        padding-left: 14px;
        padding-right: 14px;
    }

    .qamsa-content-page article.p-4 {
        padding: 18px !important;
    }

    .qamsa-content-page .content-actions-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .qamsa-content-page .knowledge-body {
        font-size: 1rem;
    }

    .qamsa-content-page .contribution-children {
        margin-left: 16px;
        padding-left: 12px;
    }

}

/* ================================================================
   SECTION: TABLETS — 768px–991px
   ================================================================ */

@media (min-width: 768px) and (max-width: 991.98px) {

    .qamsa-content-page main.container-xl {
        padding-left: 18px;
        padding-right: 18px;
    }

    .qamsa-content-page .content-actions-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

}

/* ================================================================
   SECTION: ACCESSIBILITY / MOTION
   ================================================================ */

@media (prefers-reduced-motion: reduce) {
    .qamsa-content-page *,
    .qamsa-content-page *::before,
    .qamsa-content-page *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}