/* AfghanZone Investor Panel Visual Polish + Language Header Dock v1.0.1
   Exact-current-state additive mobile presentation layer.

   Scope:
   - investor header/nav visual refinement
   - compact attractive Investor Sales summary/list
   - top-header placement for the EXISTING canonical language selector

   Strictly no sales settlement, wallet, ledger, reinvestment, messaging,
   permissions, language switching, API, MySQL or desktop business logic here.
*/

@media screen and (max-width: 760px) {
    body {
        background:
            radial-gradient(circle at 88% -90px, rgba(255,126,35,.075), transparent 250px),
            linear-gradient(180deg,#f5f7fb 0%,#f8fafc 48%,#f3f6fa 100%) !important;
    }

    /* ================= Header / brand ================= */
    .portal-header {
        background:
            radial-gradient(circle at 92% -35%, rgba(255,126,35,.15), transparent 220px),
            linear-gradient(135deg,#071a2d 0%,#0a2a43 62%,#0b324c 100%) !important;
        border-bottom: 1px solid rgba(255,255,255,.07) !important;
        box-shadow: 0 12px 30px rgba(8,26,45,.18) !important;
    }

    .portal-header > div {
        padding-inline: 10px !important;
    }

    .portal-header > div > div:first-child {
        min-height: 0 !important;
        gap: 8px !important;
        padding-block: 8px !important;
    }

    .portal-header [data-company-logo] {
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        border-radius: 50% !important;
        border: 2px solid rgba(255,255,255,.18) !important;
        background: #fff !important;
        box-shadow: 0 8px 18px rgba(0,0,0,.16) !important;
    }

    .portal-header [data-company-name] {
        font-size: 16px !important;
        line-height: 1.12 !important;
        letter-spacing: -.15px !important;
    }

    .portal-header [data-company-name] + small {
        margin-top: 2px !important;
        color: #f9b36f !important;
        font-size: 9px !important;
        line-height: 1.25 !important;
    }

    #notification-button,
    .portal-header button[onclick="logoutInvestor()"] {
        width: 39px !important;
        min-width: 39px !important;
        height: 39px !important;
        min-height: 39px !important;
        padding: 0 !important;
        border-radius: 13px !important;
        border-color: rgba(255,255,255,.11) !important;
        background: rgba(255,255,255,.055) !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
    }

    .portal-header button[onclick="logoutInvestor()"] {
        border-color: rgba(244,63,94,.24) !important;
        background: rgba(244,63,94,.08) !important;
        color: #ff9eb0 !important;
    }

    /* ================= Top nav ================= */
    #portal-navigation {
        gap: 5px !important;
        padding: 1px 0 9px !important;
        scrollbar-width: none !important;
    }

    #portal-navigation::-webkit-scrollbar {
        display: none !important;
    }

    #portal-navigation .nav-button {
        min-height: 38px !important;
        padding: 7px 10px !important;
        border: 1px solid transparent !important;
        border-radius: 12px !important;
        background: transparent !important;
        color: #afbdcc !important;
        font-size: 9.5px !important;
        line-height: 1.2 !important;
    }

    #portal-navigation .nav-button.is-active {
        border-color: rgba(255,161,86,.26) !important;
        background: linear-gradient(135deg,#ff8a2a,#ff6b0b) !important;
        color: #fff !important;
        box-shadow: 0 8px 18px rgba(255,108,13,.22) !important;
    }

    /* ================= Language moved to header =================
       JS only re-parents #az-global-language.
       Canonical language-menu.js still owns open/close/select/persist.
    */
    body.az-investor-language-docked #az-global-language {
        position: static !important;
        inset: auto !important;
        z-index: auto !important;
        display: inline-flex !important;
        flex: 0 0 auto !important;
        direction: ltr !important;
    }

    body.az-investor-language-docked #az-global-language .az-lang-icon {
        width: 39px !important;
        min-width: 39px !important;
        height: 39px !important;
        min-height: 39px !important;
        padding: 0 !important;
        border: 1px solid rgba(255,255,255,.12) !important;
        border-radius: 13px !important;
        background: rgba(255,255,255,.055) !important;
        color: #fff !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
        backdrop-filter: none !important;
    }

    body.az-investor-language-docked #az-global-language .az-lang-icon:hover,
    body.az-investor-language-docked #az-global-language.open .az-lang-icon {
        transform: none !important;
        border-color: rgba(255,255,255,.18) !important;
        background: linear-gradient(135deg,#10a497,#0b8d83) !important;
        box-shadow: 0 8px 18px rgba(11,141,131,.22) !important;
    }

    body.az-investor-language-docked #az-global-language .az-lang-icon i.fa-globe {
        font-size: 14px !important;
    }

    body.az-investor-language-docked #az-global-language .az-lang-list {
        width: 170px !important;
        padding: 7px !important;
        border-radius: 15px !important;
        box-shadow: 0 18px 45px rgba(15,23,42,.24) !important;
    }

    body.az-investor-language-docked #az-global-language .az-lang-list button {
        min-height: 40px !important;
        border-radius: 10px !important;
        font-size: 11px !important;
    }

    /* ================= Overall content ================= */
    #dashboard-screen > main {
        padding: 9px !important;
    }

    #dashboard-screen .section-card {
        border-color: #e4e9ef !important;
        border-radius: 18px !important;
        box-shadow: 0 10px 28px rgba(15,23,42,.055) !important;
    }

    /* ================= Investor Sales overview ================= */
    #az-investor-sales-overview-v5 {
        position: relative !important;
        overflow: hidden !important;
        padding: 13px !important;
        border: 1px solid #e2e8ef !important;
        border-radius: 19px !important;
        background:
            radial-gradient(circle at 100% 0,rgba(255,125,32,.075),transparent 185px),
            #fff !important;
        box-shadow: 0 12px 30px rgba(15,23,42,.06) !important;
    }

    #az-investor-sales-overview-v5 > div:first-child {
        align-items: center !important;
        gap: 8px !important;
        margin-bottom: 10px !important;
    }

    #az-investor-sales-overview-v5 h2 {
        margin: 0 !important;
        color: #10263d !important;
        font-size: 20px !important;
        line-height: 1.2 !important;
    }

    #az-investor-sales-overview-v5 h2 + p {
        margin-top: 3px !important;
        color: #8995a4 !important;
        font-size: 9px !important;
        line-height: 1.55 !important;
    }

    #az-investor-sales-overview-v5 .status-pill {
        min-height: 28px !important;
        padding: 5px 9px !important;
        border: 1px solid #e4ddff !important;
        border-radius: 999px !important;
        background: #f5f1ff !important;
        color: #6c4fd9 !important;
        font-size: 8px !important;
    }

    #az-investor-sales-overview-v5 > .grid {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
        gap: 8px !important;
    }

    #az-investor-sales-overview-v5 > .grid > div {
        position: relative !important;
        min-width: 0 !important;
        min-height: 112px !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        overflow: hidden !important;
        padding: 10px 11px !important;
        border: 1px solid #e6ebf0 !important;
        border-radius: 16px !important;
        background: linear-gradient(145deg,#fff,#f7f9fb) !important;
        box-shadow: 0 6px 17px rgba(15,23,42,.035) !important;
    }

    #az-investor-sales-overview-v5 > .grid > div::after {
        content: "" !important;
        position: absolute !important;
        width: 60px !important;
        height: 60px !important;
        inset-inline-end: -22px !important;
        bottom: -24px !important;
        border-radius: 999px !important;
        background: #ff8a2b !important;
        opacity: .055 !important;
        pointer-events: none !important;
    }

    #az-investor-sales-overview-v5 > .grid > div:nth-child(3n+2)::after {
        background: #11a792 !important;
    }

    #az-investor-sales-overview-v5 > .grid > div:nth-child(3n)::after {
        background: #6957d8 !important;
    }

    #az-investor-sales-overview-v5 > .grid > div > span:first-child {
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
        margin: 0 0 7px !important;
        border: 1px solid #e8edf2 !important;
        border-radius: 11px !important;
        background: #fff !important;
        color: #42556a !important;
        box-shadow: 0 4px 12px rgba(15,23,42,.04) !important;
    }

    #az-investor-sales-overview-v5 > .grid > div > span:first-child i {
        font-size: 13px !important;
    }

    #az-investor-sales-overview-v5 > .grid > div > small {
        min-height: 25px !important;
        color: #8592a1 !important;
        font-size: 8.5px !important;
        font-weight: 800 !important;
        line-height: 1.45 !important;
    }

    #az-investor-sales-overview-v5 > .grid > div > b {
        margin-top: 2px !important;
        color: #14253a !important;
        font-size: 16px !important;
        line-height: 1.18 !important;
        overflow-wrap: anywhere !important;
    }

    #az-investor-sales-overview-v5 > .mt-3 {
        margin-top: 9px !important;
        padding: 9px 10px !important;
        border-color: #fee4b4 !important;
        border-radius: 13px !important;
        background: linear-gradient(135deg,#fffaf0,#fff7e7) !important;
        color: #985d18 !important;
        font-size: 8px !important;
        line-height: 1.6 !important;
    }

    /* ================= Sales search/list ================= */
    #tab-sales > .section-card:not(#az-investor-sales-overview-v5) {
        padding: 12px !important;
        background: #fff !important;
    }

    #tab-sales [data-v5-title] {
        color: #10263d !important;
        font-size: 18px !important;
    }

    #tab-sales [data-v5-sub] {
        color: #8995a4 !important;
        font-size: 8px !important;
        line-height: 1.55 !important;
    }

    #az-investor-sales-search-v5,
    #az-investor-sales-filter-v5 {
        min-height: 42px !important;
        border-color: #e1e7ed !important;
        border-radius: 13px !important;
        background: #f9fafb !important;
        font-size: 15px !important;
        box-shadow: none !important;
    }

    #az-investor-sales-list-v5 {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 9px !important;
    }

    #az-investor-sales-list-v5 > article {
        overflow: hidden !important;
        border-color: #e4e9ef !important;
        border-radius: 16px !important;
        box-shadow: 0 7px 18px rgba(15,23,42,.04) !important;
    }

    #az-investor-sales-list-v5 > article > div:first-child {
        gap: 10px !important;
        padding: 11px !important;
    }

    #az-investor-sales-list-v5 h3 {
        margin-top: 5px !important;
        color: #13273c !important;
        font-size: 12px !important;
        line-height: 1.5 !important;
    }

    #az-investor-sales-list-v5 article .status-pill {
        min-height: 24px !important;
        padding: 4px 7px !important;
        font-size: 7px !important;
    }

    #az-investor-sales-list-v5 article > div:last-child {
        padding: 8px 10px !important;
        border-top-color: #edf0f3 !important;
    }

    #az-investor-sales-list-v5 article > div:last-child button {
        min-height: 34px !important;
        padding: 6px 9px !important;
        border-radius: 10px !important;
        font-size: 8px !important;
    }
}

@media screen and (max-width: 390px) {
    #dashboard-screen > main {
        padding: 8px !important;
    }

    #az-investor-sales-overview-v5 {
        padding: 12px !important;
    }

    #az-investor-sales-overview-v5 > .grid {
        gap: 7px !important;
    }

    #az-investor-sales-overview-v5 > .grid > div {
        min-height: 104px !important;
        padding: 9px 10px !important;
    }

    #az-investor-sales-overview-v5 > .grid > div > span:first-child {
        width: 31px !important;
        min-width: 31px !important;
        height: 31px !important;
        min-height: 31px !important;
    }

    #az-investor-sales-overview-v5 > .grid > div > b {
        font-size: 15px !important;
    }

    body.az-investor-language-docked #az-global-language .az-lang-icon,
    #notification-button,
    .portal-header button[onclick="logoutInvestor()"] {
        width: 37px !important;
        min-width: 37px !important;
        height: 37px !important;
        min-height: 37px !important;
    }
}