/*
|--------------------------------------------------------------------------
| RealDeen Community V5 — Desktop Premium V2
|--------------------------------------------------------------------------
|
| Desktop readability / proportion refinement.
|
| IMPORTANT:
| - Desktop only.
| - Existing Community V5 functionality remains unchanged.
| - Existing mobile design remains unchanged.
| - Quran text/content is not stored or modified here.
|
|--------------------------------------------------------------------------
*/


@media (min-width: 1180px) {

    /* =========================================================
       PREMIUM TOKENS
       ========================================================= */

    .rv5 {
        --rv5-premium-shadow:
            0 14px 38px rgba(0, 0, 0, .15),
            inset 0 1px 0 rgba(255,255,255,.018);

        --rv5-premium-shadow-soft:
            0 7px 23px rgba(0, 0, 0, .10);

        --rv5-premium-radius:
            16px;

        --rv5-premium-radius-small:
            12px;

        font-size: 15px;
    }


    body[data-theme="light"] .rv5 {
        --rv5-premium-shadow:
            0 13px 34px rgba(30, 60, 66, .075),
            inset 0 1px 0 rgba(255,255,255,.80);

        --rv5-premium-shadow-soft:
            0 6px 20px rgba(36, 68, 74, .065);
    }


    /* =========================================================
       EXACT 3-COLUMN DESKTOP SYSTEM
       LEFT | CENTER | RIGHT

       Maximum composition:
       272 + 24 + 936 + 24 + 272 = 1528px
       ========================================================= */

    .rv5-top,
    .rv5-three {
        width:
            calc(100% - 48px);

        max-width:
            1528px;

        min-width:
            0;

        grid-template-columns:
            clamp(260px, 18vw, 272px)
            minmax(0, 936px)
            clamp(260px, 18vw, 272px);

        column-gap:
            24px;

        margin-inline:
            auto;
    }


    .rv5-left,
    .rv5-right {
        width:
            auto;

        gap:
            17px;
    }


    .rv5-center {
        width:
            100%;

        max-width:
            936px;

        gap:
            18px;
    }


    .rv5-three {
        padding:
            28px 0 80px;
    }


    /* =========================================================
       COMMUNITY PAGE HEADING
       ========================================================= */

    .rv5-top {
        min-height:
            154px;

        padding:
            33px 0 30px;

        align-items:
            center;
    }


    .rv5-top-left {
        width:
            auto;
    }


    .rv5-kicker,
    .rv5-label,
    .rv5-card-head > span,
    .rv5-section-head > div > span {
        font-size:
            11px;

        line-height:
            1.3;

        font-weight:
            800;

        letter-spacing:
            .12em;
    }


    .rv5-top-left h1 {
        margin:
            8px 0 7px;

        font-size:
            34px;

        line-height:
            1.08;

        font-weight:
            730;

        letter-spacing:
            -.034em;
    }


    .rv5-top-left p {
        font-size:
            14px;

        line-height:
            1.55;
    }


    /* =========================================================
       SEARCH
       ========================================================= */

    .rv5-search {
        min-height:
            58px;

        padding:
            6px 7px 6px 17px;

        border-radius:
            15px;

        box-shadow:
            var(--rv5-premium-shadow-soft);
    }


    .rv5-search svg {
        width:
            20px;

        height:
            20px;
    }


    .rv5-search input {
        padding:
            0 14px;

        font-size:
            15px;

        line-height:
            1.4;
    }


    .rv5-search button {
        min-width:
            92px;

        height:
            44px;

        border-radius:
            10px;

        font-size:
            13px;

        font-weight:
            750;
    }


    .rv5-auth-heading {
        min-height:
            58px;

        border-radius:
            15px;

        font-size:
            13px;

        box-shadow:
            var(--rv5-premium-shadow-soft);
    }


    /* =========================================================
       CORE CARDS
       ========================================================= */

    .rv5-card {
        padding:
            20px;

        border-radius:
            var(--rv5-premium-radius);

        box-shadow:
            var(--rv5-premium-shadow);

        transition:
            border-color .18s ease,
            box-shadow .18s ease,
            transform .18s ease;
    }


    .rv5-center > .rv5-card:hover {
        border-color:
            var(--line2);

        box-shadow:
            0 17px 45px rgba(0,0,0,.18),
            inset 0 1px 0 rgba(255,255,255,.024);
    }


    body[data-theme="light"]
    .rv5-center > .rv5-card:hover {
        box-shadow:
            0 16px 38px rgba(31,64,70,.10),
            inset 0 1px 0 rgba(255,255,255,.86);
    }


    .rv5-card-head {
        min-height:
            29px;

        margin-bottom:
            14px;
    }


    .rv5-card-head > a,
    .rv5-card-head > button {
        font-size:
            12px;

        font-weight:
            700;
    }


    /* =========================================================
       UNIVERSAL BUTTONS
       ========================================================= */

    .rv5-button {
        min-height:
            42px;

        padding:
            0 15px;

        border-radius:
            10px;

        font-size:
            12.5px;

        font-weight:
            720;
    }


    /* =========================================================
       LEFT NAVIGATION
       ========================================================= */

    .rv5-nav {
        display:
            grid;

        gap:
            3px;
    }


    .rv5-nav a {
        min-height:
            46px;

        gap:
            11px;

        padding:
            0 12px;

        border-radius:
            10px;

        font-size:
            14px;

        line-height:
            1.25;

        font-weight:
            650;
    }


    .rv5-nav-icon {
        width:
            21px;

        height:
            21px;
    }


    .rv5-nav-icon svg {
        width:
            20px;

        height:
            20px;
    }


    .rv5-nav-rule {
        margin:
            9px 9px;
    }


    /* =========================================================
       AVATARS
       ========================================================= */

    .rv5-avatar {
        width:
            42px;

        height:
            42px;

        font-size:
            13px;

        font-weight:
            820;
    }


    .rv5-avatar-large {
        width:
            64px;

        height:
            64px;

        font-size:
            19px;
    }


    /* =========================================================
       COMPOSER
       ========================================================= */

    .rv5-composer {
        padding:
            21px;
    }


    .rv5-userline {
        gap:
            11px;

        margin-bottom:
            14px;
    }


    .rv5-userline strong {
        font-size:
            14px;

        line-height:
            1.25;
    }


    .rv5-userline small {
        margin-top:
            3px;

        font-size:
            11.5px;

        line-height:
            1.35;
    }


    .rv5-composer textarea {
        min-height:
            132px;

        padding:
            16px;

        border-radius:
            12px;

        font-size:
            15px;

        line-height:
            1.65;
    }


    .rv5-composer-footer {
        margin-top:
            13px;

        gap:
            12px;
    }


    .rv5-tools {
        gap:
            7px;
    }


    .rv5-tools button,
    .rv5-tools a {
        min-height:
            37px;

        padding:
            0 12px;

        border-radius:
            9px;

        font-size:
            11.5px;
    }


    /* =========================================================
       FEED / SECTION HEADING
       ========================================================= */

    .rv5-section-head {
        min-height:
            62px;

        padding:
            15px 18px;
    }


    .rv5-section-head h2 {
        margin:
            5px 0 0;

        font-size:
            23px;

        line-height:
            1.15;

        font-weight:
            720;

        letter-spacing:
            -.02em;
    }


    .rv5-section-head nav {
        gap:
            5px;
    }


    .rv5-section-head nav a {
        padding:
            8px 11px;

        border-radius:
            8px;

        font-size:
            11.5px;

        font-weight:
            650;
    }


    /* =========================================================
       POST CARD
       ========================================================= */

    .rv5-post {
        border-radius:
            var(--rv5-premium-radius);
    }


    .rv5-post > header {
        gap:
            11px;

        padding:
            17px 20px 12px;
    }


    .rv5-post > header strong {
        font-size:
            14px;

        line-height:
            1.25;
    }


    .rv5-post > header small {
        margin-top:
            3px;

        font-size:
            11px;

        line-height:
            1.3;
    }


    .rv5-post-body {
        padding:
            8px 20px 20px;
    }


    /* =========================================================
       QURAN / AYAH ATTACHMENT
       Quran remains visually separate from user reflection.
       ========================================================= */

    .rv5-ayah {
        padding:
            18px;

        border-radius:
            13px;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.025);
    }


    .rv5-ayah-head span {
        font-size:
            10px;

        line-height:
            1.25;

        letter-spacing:
            .11em;
    }


    .rv5-ayah-head strong {
        margin-top:
            5px;

        font-size:
            13px;

        line-height:
            1.3;
    }


    .rv5-ayah-head > a {
        font-size:
            11.5px;

        font-weight:
            700;
    }


    .rv5-arabic {
        margin:
            21px 0 15px;

        font-size:
            32px;

        line-height:
            1.9;
    }


    .rv5-ayah > p {
        font-size:
            14px;

        line-height:
            1.7;
    }


    /* =========================================================
       USER REFLECTION
       Intentionally separated from Quran block above.
       ========================================================= */

    .rv5-copy {
        margin:
            17px 2px 0;

        font-size:
            15.5px;

        line-height:
            1.72;
    }


    /* =========================================================
       POST ACTIONS
       ========================================================= */

    .rv5-actions button {
        min-height:
            48px;

        font-size:
            12.5px;

        font-weight:
            650;
    }


    /* =========================================================
       RIGHT SIDEBAR LISTS
       ========================================================= */

    .rv5-list > a {
        min-height:
            45px;

        padding:
            4px 1px;
    }


    .rv5-list strong {
        font-size:
            12.5px;

        line-height:
            1.3;
    }


    .rv5-list small {
        font-size:
            10.5px;

        line-height:
            1.3;
    }


    /* =========================================================
       PEOPLE / FOLLOW SUGGESTIONS
       ========================================================= */

    .rv5-person {
        gap:
            10px;

        min-height:
            62px;
    }


    .rv5-person strong {
        font-size:
            12.5px;

        line-height:
            1.25;
    }


    .rv5-person small {
        font-size:
            10.5px;

        line-height:
            1.3;
    }


    .rv5-person button,
    .rv5-person-actions button {
        min-height:
            32px;

        padding:
            0 10px;

        border-radius:
            8px;

        font-size:
            10.5px;

        font-weight:
            700;
    }


    /* =========================================================
       COMMUNITY PRINCIPLE
       Major readability correction.
       ========================================================= */

    .rv5-principle {
        padding:
            21px;
    }


    .rv5-principle > span,
    .rv5-auth-benefits > span {
        font-size:
            10px;

        line-height:
            1.35;

        letter-spacing:
            .11em;
    }


    .rv5-principle strong,
    .rv5-auth-benefits strong {
        margin-top:
            9px;

        font-size:
            14px;

        line-height:
            1.35;
    }


    .rv5-principle p,
    .rv5-auth-benefits p {
        margin-top:
            8px;

        font-size:
            13px;

        line-height:
            1.65;
    }


    /* =========================================================
       PEOPLE DIRECTORY
       ========================================================= */

    .rv5-people-grid {
        gap:
            15px;
    }


    .rv5-person-card {
        gap:
            12px;
    }


    .rv5-person-card strong {
        font-size:
            14px;

        line-height:
            1.3;
    }


    .rv5-person-card small {
        margin-top:
            4px;

        font-size:
            11.5px;

        line-height:
            1.35;
    }


    .rv5-person-actions {
        margin-top:
            5px;
    }


    .rv5-person-actions a {
        font-size:
            11.5px;

        font-weight:
            650;
    }


    /* =========================================================
       PUBLIC PROFILE
       ========================================================= */

    .rv5-profile-hero {
        gap:
            17px;
    }


    .rv5-profile-hero > div:nth-child(2) > span {
        font-size:
            10px;

        letter-spacing:
            .08em;
    }


    .rv5-profile-hero h2 {
        margin:
            5px 0 4px;

        font-size:
            24px;

        line-height:
            1.15;

        letter-spacing:
            -.02em;
    }


    .rv5-profile-hero p {
        font-size:
            13px;

        line-height:
            1.55;
    }


    .rv5-profile-actions {
        gap:
            8px;
    }


    .rv5-profile-stats {
        padding:
            7px 0;
    }


    .rv5-profile-stats strong {
        font-size:
            22px;

        line-height:
            1.15;
    }


    .rv5-profile-stats span {
        font-size:
            10.5px;

        line-height:
            1.3;
    }


    /* =========================================================
       GENERAL TEXT SAFETY
       Prevent tiny text from returning inside standard cards.
       ========================================================= */

    .rv5-card input,
    .rv5-card select {
        font-size:
            14px;
    }


    .rv5-card label {
        font-size:
            12.5px;
    }


    /* =========================================================
       LARGE DESKTOP FINISH
       ========================================================= */

    @media (min-width: 1500px) {

        .rv5-top,
        .rv5-three {
            grid-template-columns:
                272px
                minmax(0,936px)
                272px;
        }
    }


    /* =========================================================
       REDUCED MOTION
       ========================================================= */

    @media (prefers-reduced-motion: reduce) {

        .rv5-card,
        .rv5-button,
        .rv5-nav a {
            transition:
                none !important;
        }
    }
}
