.row {
	margin-left: -8px;
	margin-right: -8px
}

.container,
[class*=col-] {
	padding-left: 8px;
	padding-right: 8px
}

.row-small {
	margin-left: -4px;
	margin-right: -4px
}

.col-small {
	padding-left: 4px;
	padding-right: 4px
}

@media(max-width:767px) {
	#wpadminbar {
		position: fixed !important
	}
}

@media(min-width:1200px) {
	.container {
		max-width: 1100px
	}
}

body {
	font-size: .9375rem
}

* {
	outline: none !important
}
/* ============================================
   Header
   ============================================ */
.site-header{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:1000;
    background:#fff;
    border-bottom:1px solid rgba(0,0,0,.06)
}
.header-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    height:60px
}
.site-logo{margin:0}
.site-logo a{display:flex}
.site-logo img{display:block}

.header-actions{
    display:flex;
    align-items:center;
    gap:.5rem
}

/* Header Buttons - زي المثال */
.header-btn{
    width: 2.25rem;
    height: 2.25rem;
    display:flex;
    align-items:center;
    justify-content:center;
    background-color: #f3f4f6;
    border:none;
    border-radius:50%;
    color:#6b7280;
    cursor:pointer;
    transition:all .2s
}
	.header-btn svg{
		width: 1rem;
    height: 1rem;
	}
.header-btn:hover{
    background:rgba(0,0,0,.05);
    color:#111827
}

/* Language Button - زي المثال */
.header-lang{
    position:relative
}
.header-lang-btn{
    display:flex;
    align-items:center;
    gap:.375rem;
    padding:.375rem .75rem;
    background:#f3f4f6;
    border:none;
    border-radius:24px;
    color:#374151;
    font-size:.75rem;
    font-weight:600;
    cursor:pointer;
    transition:all .2s
}
.header-lang-btn:hover{
    background:#e5e7eb
}
.header-lang-btn svg:first-child{
    width: 1rem;
    height: 1rem;
}
.header-lang-code{
    display:none
}
@media(min-width:576px){
    .header-lang-code{display:inline}
}
.header-lang-arrow{
    width:12px;
    height:12px;
    transition:transform .2s
}
.header-lang.open .header-lang-arrow{
    transform:rotate(180deg)
}

/* Language Dropdown */
.header-lang-dropdown{
    position:absolute;
    top:calc(100% + 8px);
    right:0;
    width:180px;
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:12px;
    box-shadow:0 10px 40px rgba(0,0,0,.12);
    overflow:hidden;
    opacity:0;
    visibility:hidden;
    transform:translateY(-8px);
    transition:all .2s
}
.header-lang-dropdown.active{
    opacity:1;
    visibility:visible;
    transform:translateY(0)
}

/* Polylang outputs: ul > li > a OR direct a.header-lang-item */
.header-lang-dropdown ul{
    list-style:none;
    margin:0;
    padding:0
}
.header-lang-dropdown li a,
.header-lang-item{
    display:flex;
    align-items:center;
    gap:.75rem;
    width:100%;
    padding:.625rem 1rem;
    color:#374151;
    text-decoration:none;
    font-size:.875rem;
    font-weight:500;
    transition:all .15s
}
.header-lang-dropdown li a:hover,
.header-lang-item:hover{
    background:#f9fafb
}
.header-lang-dropdown li.current-lang a,
.header-lang-item.current-lang{
    background:#ecfdf5;
    color:#059669
}
.header-lang-dropdown li a img,
.header-lang-item img{
    width:20px;
    height:auto !important;
    border-radius:2px;
    flex-shrink:0
}
.header-lang-dropdown li a span,
.header-lang-item span{
    margin:0 !important
}

/* Dark Mode Icon Toggle */
.icon-moon{display:none}
[data-theme="dark"] .icon-sun{display:none}
[data-theme="dark"] .icon-moon{display:block}



/* ============================================
   Search Overlay
   ============================================ */
.search-overlay{
    position:fixed;
    inset:0;
    z-index:9999;
    opacity:0;
    visibility:hidden;
    transition:all .2s
}
.search-overlay.active{
    opacity:1;
    visibility:visible
}

.search-overlay-bg{
    position:absolute;
    inset:0;
    background:#fff
}

.search-overlay-inner{
    position:relative;
    height:100%;
    overflow-y:auto
}

.search-container{
    max-width:1110px;
    margin:0 auto;
    padding:1rem
}

/* Search Header */
.search-header{
    display:flex;
    align-items:center;
    gap:.75rem;
    margin-bottom:2rem
}

.search-input-wrap{
    flex:1;
    display:flex;
    align-items:center;
    background:#f3f4f6;
    border-radius:16px;
    height:56px;
    padding:0 1rem;
    transition:all .2s
}
.search-input-wrap:focus-within{
    background:#fff;
    box-shadow:0 0 0 2px #10b981
}

.search-icon{
    color:#9ca3af;
    flex-shrink:0
}

.search-form{
    flex:1;
    display:flex;
    margin:0 .75rem
}

#searchInput{
    flex:1;
    border:none;
    outline:none;
    background:transparent;
    font-size:1.125rem;
    color:#111827
}
#searchInput::placeholder{
    color:#9ca3af
}

/* ESC Badge */
.search-esc{
    padding:.25rem .5rem;
    background:#e5e7eb;
    border-radius:6px;
    font-size:.6875rem;
    font-weight:600;
    font-family:inherit;
    color:#6b7280;
    flex-shrink:0
}

.search-close-btn{
    width:48px;
    height:48px;
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f3f4f6;
    border:none;
    border-radius:16px;
    color:#6b7280;
    cursor:pointer;
    transition:all .2s
}
.search-close-btn:hover{
    background:#e5e7eb;
    color:#111827
}

/* Search Sections */
.search-section{
    margin-bottom:2rem
}

.search-section-title{
    font-size:.75rem;
    font-weight:700;
    color:#9ca3af;
    text-transform:uppercase;
    letter-spacing:.1em;
    margin:0 0 1rem
}

/* Search Tags */
.search-tags{
    display:flex;
    flex-wrap:wrap;
    gap:.5rem
}

.search-tag{
    padding:.625rem 1rem;
    background:#f3f4f6;
    border-radius:24px;
    font-size:.875rem;
    font-weight:500;
    color:#374151;
    text-decoration:none;
    transition:all .2s
}
.search-tag:hover{
    background:#ecfdf5;
    color:#059669
}

/* Search Categories - بدون أيقونات */
.search-categories{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:.75rem
}
@media(min-width:576px){
    .search-categories{
        grid-template-columns:repeat(3,1fr)
    }
}

.search-cat-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:1rem;
    background:#f9fafb;
    border:1px solid transparent;
    border-radius:16px;
    text-decoration:none;
    transition:all .2s
}
.search-cat-item:hover{
    background:#fff;
    border-color:#d1fae5
}

.search-cat-name{
    font-size:.875rem;
    font-weight:600;
    color:#374151
}
.search-cat-item:hover .search-cat-name{
    color:#111827
}

.search-cat-count{
    font-size:.75rem;
    font-weight:600;
    color:#9ca3af;
    background:#e5e7eb;
    padding:.25rem .625rem;
    border-radius:20px
}
@media (max-width: 480px) {
    .search-overlay-inner {
        padding: 0;
        width: 100%;
    }
    
    .search-container {
        width: 100%;
        max-width: 100%;
        padding: 0 0.5rem;
    }
    
    .search-header {
        width: 100%;
        padding: 0.75rem 0;
        gap: 0.5rem;
        flex-wrap: nowrap;
    }
    
    .search-input-wrap {
        flex: 1;
        min-width: 0; /* مهم جداً */
        padding: 0 0.5rem;
    }
    
    #searchInput {
        min-width: 0;
        width: 100%;
		font-size: 100%;
    }
	.search-esc{
		display:none
	}
}
/* ============================================
   Sidebar
   ============================================ */
.sidebar-overlay{
    position:fixed;
    inset:0;
    z-index:9999;
    opacity:0;
    visibility:hidden;
    transition:all .3s
}
.sidebar-overlay.active{
    opacity:1;
    visibility:visible
}

.sidebar-backdrop{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.5);
    backdrop-filter:blur(4px)
}

.sidebar-panel{
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    width:320px;
    max-width:85vw;
    background:#fff;
    border-left:1px solid rgba(0,0,0,.06);
    display:flex;
    flex-direction:column;
    transform:translateX(100%);
    transition:transform .3s ease
}
.sidebar-overlay.active .sidebar-panel{
    transform:translateX(0)
}

/* RTL */
.rtl .sidebar-panel{
    right:auto;
    left:0;
    border-left:none;
    border-right:1px solid rgba(0,0,0,.06);
    transform:translateX(-100%)
}
.rtl .sidebar-overlay.active .sidebar-panel{
    transform:translateX(0)
}

/* Sidebar Header - Logo */
.sidebar-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:1rem;
    border-bottom:1px solid rgba(0,0,0,.06)
}

.sidebar-logo{
    display:flex
}
.sidebar-logo img{
    display:block
}

.sidebar-close-btn{
    width:36px;
    height:36px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f3f4f6;
    border:none;
    border-radius:50%;
    color:#6b7280;
    cursor:pointer;
    transition:all .2s
}
.sidebar-close-btn:hover{
    background:#e5e7eb;
    color:#111827
}

/* Sidebar Content */
.sidebar-content{
    flex:1;
    overflow-y:auto;
    padding:1rem
}

.sidebar-menu{
    list-style:none;
    margin:0;
    padding:0 !important
}
.sidebar-menu li{
    margin-bottom:.25rem
}
.sidebar-menu > li > a{
    display:flex;
    align-items:center;
    gap:.75rem;
    padding:.75rem 1rem;
    color:#374151;
    text-decoration:none;
    border-radius:12px;
    font-weight:500;
    transition:all .2s
}
.sidebar-menu > li > a:hover,
.sidebar-menu > li.current-menu-item > a{
    background:#f3f4f6;
    color:#111827
}
.sidebar-menu > li > a svg{
    width:20px;
    height:20px;
    color:#9ca3af
}

/* Submenu */
.sidebar-menu .sub-menu{
    list-style:none;
    margin:.25rem 0 0;
    padding:0 0 0 2.5rem;
    max-height:0;
    overflow:hidden;
    transition:max-height .3s
}
.sidebar-menu li.open > .sub-menu{
    max-height:500px
}
.sidebar-menu .sub-menu a{
    display:block;
    padding:.5rem 1rem;
    font-size:.875rem;
    color:#6b7280;
    text-decoration:none;
    border-radius:8px
}
.sidebar-menu .sub-menu a:hover{
    background:#f3f4f6;
    color:#111827
}

.sidebar-divider{
    height:1px;
    background:rgba(0,0,0,.06);
    margin:1rem 0
}

/* Language Section */
.sidebar-lang-section{
    margin-bottom:1rem
}

.sidebar-lang-toggle{
    width:100%;
    display:flex;
    align-items:center;
    gap:.75rem;
    padding:.75rem 1rem;
    background:transparent;
    border:none;
    border-radius:12px;
    color:#374151;
    font-size:.9375rem;
    font-weight:500;
    cursor:pointer;
    transition:all .2s;
    text-align:left
}
	.rtl .sidebar-lang-toggle{
		text-align:right
	}
.sidebar-lang-toggle:hover{
    background:#f3f4f6
}
.sidebar-lang-toggle svg:first-child{
    color:#9ca3af
}
.sidebar-lang-label{
    flex:1
}
.sidebar-lang-current{
    padding:.25rem .5rem;
    background:#f3f4f6;
    border-radius:6px;
    font-size:.75rem;
    font-weight:600;
    color:#6b7280
}
.sidebar-lang-chevron{
    color:#9ca3af;
    transition:transform .2s
}
.sidebar-lang-section.open .sidebar-lang-chevron{
    transform:rotate(180deg)
}

.sidebar-lang-dropdown{
    max-height:0;
    overflow:hidden;
    transition:max-height .3s
}
.sidebar-lang-section.open .sidebar-lang-dropdown{
    max-height:400px
}
	.rtl .sidebar-lang-dropdown ul{
		padding:.5rem 2.5rem 0 0
	}
.sidebar-lang-dropdown ul{
    list-style:none;
    margin:0;
    padding:.5rem 0 0 2.5rem
}
.sidebar-lang-dropdown li{
    margin-bottom:.25rem
}
.sidebar-lang-dropdown li a{
    display:flex;
    align-items:center;
    gap:.5rem;
    padding:.5rem .75rem;
    font-size:.875rem;
    color:#374151;
    text-decoration:none;
    border-radius:8px;
    transition:all .2s
}
.sidebar-lang-dropdown li a:hover{
    background:#f3f4f6
}
.sidebar-lang-dropdown li.current-lang a{
    background:#ecfdf5;
    color:#059669
}
.sidebar-lang-dropdown li a img{
    width:22px;
    height:auto !important;
    border-radius:3px
}
.sidebar-lang-dropdown li a span{
    margin:0 !important
}

/* Sidebar Footer */
.sidebar-footer{
    padding:1rem;
    border-top:1px solid rgba(0,0,0,.06)
}

.sidebar-telegram{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.5rem;
    width:100%;
    padding:.875rem;
    background:linear-gradient(135deg,#3b82f6,#2563eb);
    color:#fff;
    font-size:.875rem;
    font-weight:600;
    text-decoration:none;
    border-radius:.5rem;
    transition:all .2s
}
.sidebar-telegram:hover{
    background:linear-gradient(135deg,#2563eb,#1d4ed8);
    color:#fff
}

/* App Header Container - مع subtle background */
.app-header{
    display:flex;
    align-items:flex-start;
    gap:1.25rem;
    border-radius:.875rem
}

/* App Icon */
.app-icon-wrap{
    position:relative;
    flex-shrink:0
}

.app-icon{
    width:96px;
    height:96px;
    border-radius:22px;
    object-fit:cover
}

/* Verified Badge - محسن مع shadow */
.app-verified-badge{
    position:absolute;
    bottom:-4px;
    right:-4px;
    width:26px;
    height:26px;
    background:linear-gradient(135deg,#10b981 0%,#059669 100%);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    border:2.5px solid #fff;
}
.app-verified-badge svg{
    width:14px;
    height:14px;
    color:#fff
}

/* App Info */
.app-info{
    flex:1;
    min-width:0;
    padding-top:2px
}

.app-title-row{
    display:flex;
    align-items:center;
    gap:.5rem;
    margin-bottom:.375rem;
    flex-wrap:wrap
}

.app-title{
    font-size:1.5rem;
    font-weight:500;
    line-height:1.25;
    margin:0;
    color:#111827
}

/* رابط صفحة التطبيق حول عنوان صفحة التحميل — بلا تغيّر لون عند hover.
   الرابط أصبح الأصل (لا الابن) لـ h1.app-title، فالتنسيق هنا لا على
   .app-title نفسها (تحتفظ بلونها من القاعدة أعلاه) بل على الرابط المحيط. */
a.app-title-link,
a.app-title-link:hover,
a.app-title-link:focus,
a.app-title-link:active{
    color:inherit;
    text-decoration:none;
    display:block
}

/* Publisher - بدل Version */
.app-publisher{
    font-size:.875rem;
    color:#6b7280;
    margin:0 0 .75rem;
    line-height:1.2
}

/* Stats Row */
.app-meta{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:.875rem
}

.app-stat{
    display:flex;
    align-items:center;
    gap:.25rem
}

.app-stat svg{
    width:15px;
    height:15px;
    color:#9ca3af
}

.stat-votes{
    font-size:.75rem;
    color:#9ca3af
}

/* =============================================
   Responsive
   ============================================= */
@media(max-width:575px){
    .app-header{
        gap:1rem;
    }
    
    .app-icon{
        width:80px;
        height:80px;
        border-radius:18px
    }
    
    .app-verified-badge{
        width:22px;
        height:22px
    }
    .app-verified-badge svg{
        width:12px;
        height:12px
    }
    
    .app-title{
        font-size:1.25rem
    }
    
    .app-publisher{
        font-size:.8125rem;
        margin-bottom:.625rem
    }
    
    .app-meta{
        gap:.625rem
    }
    
    .app-stat svg{
        width:14px;
        height:14px
    }
    
    .stat_value{
        font-size:.8125rem
    }
}
.dlh-mini{
    text-align:center;
    padding:1rem
}

.dlh-mini-icon{
    width:68px;
    height:68px;
    border-radius:.875rem;
    border:1px solid #e5e7eb;
    margin-bottom:.75rem
}

.dlh-mini-name{
    font-size:1.125rem;
    font-weight:700;
    color:#111827;
    margin:0 0 .75rem;
    line-height:1.3
}

.dlh-mini-chips{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:.5rem
}

.dlh-chip{
    background:#fff;
	display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .25rem .625rem;
    border: 1px solid #e5e7eb;
    border-radius: 2rem;
    font-size: .6875rem;
    font-weight: 500;
    color: #4b5563;
}

.dlh-chip svg{
    color:#9ca3af
}

.dlh-chip-verified{
    background:#ecfdf5;
    border-color:#a7f3d0;
    color:#047857
}

.dlh-chip-verified svg{
    color:#10b981
}


/* Download Wrapper */
.download-wrapper{text-align:center}

/* Loading State */
.download-loading-box{display:block}
.download-loading-text{color:#6b7280;font-size:.875rem;margin-bottom:.75rem}

/* Download Block */

/* Main Download Button */
.download-btn-main{
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:100%;
    padding:1.25rem 1rem;
    color:#fff;
    font-weight:700;
    font-size:1.125rem;
    border-radius:.5rem;
    text-decoration:none;
    transition:all .2s ease;
    position:relative;
    overflow:hidden
}
.download-btn-main:hover{
    background:linear-gradient(135deg,#2ecc71 0%,#2ecc71 100%);
    color:#fff !important
}
	.btn-primary:focus{box-shadow:none}
/* Shine Effect */
.download-btn-main::before{
    content:'';
    position:absolute;
    top:0;
    left:-100%;
    width:100%;
    height:100%;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);
    transition:left .5s
}
.download-btn-main:hover::before{left:100%}

/* Button Icon (Left side) */
.btn-icon{
    display:flex;
    align-items:center;
    flex-shrink:0
}

/* Button Content (Right side) - Text + Size */
.btn-content{
    display:flex;
    align-items:center;
    gap:.625rem
}

/* Download Icons */
.download-icon{width:24px;height:24px}
.download-spinner{width:24px;height:24px;display:none;animation:spin 1s linear infinite}
.download-btn-main.downloading .download-icon{display:none}
.download-btn-main.downloading .download-spinner{display:block}

/* Hide size when downloading */
.download-btn-main.downloading .download-size{display:none}

/* Download Size Badge */
.download-size{
    background:rgba(255,255,255,.2);
    padding:.25rem .75rem;
    border-radius:2rem;
    font-size:.875rem;
    font-weight:600
}

/* Telegram Button */
.telegram-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.5rem;
    width:100%;
    padding:.75rem 1rem;
    background:#e2f4fc;
    color:#0088CC;
    font-weight:600;
    font-size:.875rem;
    border-radius:.45rem;
    border:1px solid #bfe7fa;
    text-decoration:none;
    margin-top:.75rem;
    transition:all .2s
}
.telegram-btn:hover{background:#ceecfb;color:#0088CC !important}
.telegram-icon{width:20px;height:20px}

/* Trust Indicators */
.trust-indicators{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:1rem;
    margin-top:1rem;
    font-size:.75rem;
    color:#6b7280
}
.trust-item{display:flex;align-items:center;gap:.375rem}
.trust-item svg{color:#10b981}
.trust-dot{width:4px;height:4px;background:#d1d5db;border-radius:50%}

/* Animation */
@keyframes spin{to{transform:rotate(360deg)}}

/* Responsive */
@media(max-width:420px){
    .download-btn-main{
        font-size:1rem;
    }
    .download-size{
        font-size:.75rem;
        padding:.1875rem .5rem
    }
    .download-icon,
    .download-spinner{
        width:20px;
        height:20px
    }
}

/* =============================================
   Download Links Box - التصميم الجديد
   ضيف ده في style.min.css
   ============================================= */
.cant-install-link { color: #6c757d; font-size: 13px; text-decoration: underline; }
.cant-install-link:hover { color: #0d6efd; }
/* Main Box */
.dl-box{border:1px solid #dee2e6;border-radius:.5rem;overflow:hidden}
.dl-box-header{background-color:#f8f9fa;padding:.75rem 1rem;border-bottom:1px solid #dee2e6}
.dl-box-header h3{font-weight:700;font-size:.875rem;margin:0;display:flex;align-items:center;gap:8px;color:#212529}
.dl-box-header svg{color:#9ca3af}

/* Architecture Section */
.dl-box .dl-arch-section{border-bottom:1px solid #f0f0f0}
.dl-box .dl-arch-section:last-child{border-bottom:0}
.dl-box .dl-arch-header{background-color:#fafafa;padding:.75rem 1rem}
.dl-box .dl-arch-icon{width:16px;height:16px;margin-right:8px}
.dl-box .dl-arch-icon-blue{color:#3b82f6}
.dl-box .dl-arch-icon-purple{color:#8b5cf6}
.dl-box .dl-arch-icon-indigo{color:#6366f1}
.dl-box .dl-arch-icon-teal{color:#14b8a6}
.dl-box .dl-arch-icon-gray{color:#6b7280}
.dl-box .dl-arch-name{font-weight:700;font-size:.875rem;margin-right:8px}
.dl-box .dl-arch-desc{font-size:.75rem;color:#6b7280;margin:4px 0 0 0}

/* Badges */
.dl-box .dl-badge{font-size:10px;font-weight:700;padding:2px 8px;border-radius:4px;margin-left:4px}
.dl-box .dl-badge-blue{background-color:#dbeafe;color:#1d4ed8}
.dl-box .dl-badge-purple{background-color:#ede9fe;color:#6d28d9}
.dl-box .dl-badge-indigo{background-color:#e0e7ff;color:#4338ca}
.dl-box .dl-badge-emerald{background-color:#d1fae5;color:#047857}
.dl-box .dl-badge-amber{background-color:#fef3c7;color:#b45309}
.dl-box .dl-badge-teal{background-color:#ccfbf1;color:#0f766e}
.dl-box .dl-badge-gray{background-color:#f3f4f6;color:#4b5563}

/* Files List */
.dl-box .dl-files-list{divide-y divide-gray-100}
.dl-box .dl-file-item{padding:1rem;border-top:1px solid #f0f0f0;transition:background-color .2s}
.dl-box .dl-file-item:hover{background-color:#fafafa}

/* File Icon */
.dl-box .dl-file-icon{width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-right:12px}
.dl-box .dl-file-icon-emerald{background-color:#ecfdf5;color:#059669}
.dl-box .dl-file-icon-amber{background-color:#fffbeb;color:#d97706}
.dl-box .dl-file-icon-indigo{background-color:#eef2ff;color:#4f46e5}

/* File Info */
.dl-box .dl-file-info{flex:1;min-width:0}
.dl-box .dl-file-type{font-weight:700;font-size:.875rem;margin-right:8px}
.dl-box .dl-file-meta{font-size:11px;color:#6b7280;display:flex;flex-wrap:wrap;align-items:center;gap:4px}
.dl-box .dl-meta-sep{color:#d1d5db}

/* Download Buttons */
.dl-box .dl-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:.4rem;font-size:.75rem;font-weight:600;text-decoration:none;transition:all .2s;flex-shrink:0}
.btn-primary svg{fill:none !important}
.dl-box .dl-btn-secondary{background-color:#f3f4f6;color:#374151}
.dl-box .dl-btn-secondary:hover{background-color:#e5e7eb;color:#1f2937 !important}

/* XAPK Notice */
.xapk-notice{background-color:#fffbeb;border-left:4px solid #f59e0b;border-radius:0 .4rem .4rem 0}
.xapk-notice .xapk-notice-icon{width:20px;height:20px;color:#d97706;flex-shrink:0;margin-top:2px}
.xapk-notice .xapk-notice-title{font-size:.875rem;font-weight:700;color:#78350f;margin-bottom:0}
.xapk-notice .xapk-notice-text{font-size:.75rem;color:rgba(120,53,15,.8);line-height:1.6;margin-bottom:0;margin-top:4px}
.xapk-notice .xapk-notice-text a{font-weight:700;text-decoration:underline;color:inherit}
.xapk-notice .xapk-notice-text a:hover{color:#d97706}

/* Help Box */
.help-box{background-color:#eff6ff;border:1px solid #dbeafe;border-radius:.4rem}
.help-box-icon-wrap{width:40px;height:40px;background-color:#dbeafe;border-radius:8px;flex-shrink:0}
.help-box-icon{width:20px;height:20px;color:#2563eb}
.help-box-title{font-weight:700;font-size:.875rem;color:#1e3a8a;margin-bottom:4px}
.help-box-list{font-size:.75rem;color:#1d4ed8;padding:0}
.help-box-list li{line-height:1.5}
.help-check-icon{width:14px;height:14px;color:#3b82f6;flex-shrink:0;margin-top:3px}
.help-alert-icon{width:14px;height:14px;color:#f59e0b;flex-shrink:0;margin-top:3px}
.help-box-list a{text-decoration:underline}
.help-box-list a:hover{color:#1d4ed8}

/* Responsive */
@media(max-width:575px){
    .dl-file-item .d-flex{flex-wrap:wrap}
    .dl-btn{width:100%;justify-content:center;margin-top:12px}
    .dl-file-meta{font-size:10px}
}

/* App Info Section */
.app-info-section{
    background:#fff;
    border:1px solid #dee2e6;
    border-radius:.5rem;
    padding:1rem;
    box-shadow:0 1px 3px rgba(0,0,0,.05)
}

/* Header */
.info-header{
    font-size:1.125rem;
    font-weight:700;
    margin-bottom:1rem;
    display:flex;
    align-items:center;
    gap:.5rem
}
.info-header svg{color:#9ca3af}

/* Info Grid */
.info-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:1rem
}

/* Info Item */
.info-item{
    background:#f9fafb;
    padding:.75rem;
    border-radius:.4rem
}

.info-item-full{
    grid-column:span 1
}

.info-label{
    font-size:10px;
    font-weight:700;
    color:#6b7280;
    text-transform:uppercase;
    margin:0 0 .25rem
}

.info-value{
    font-size:.875rem;
    font-weight:600;
    color:#111827;
    margin:0;
    word-break:break-word
}

.info-link a{
    color:#2563eb;
    text-decoration:none
}
.info-link a:hover{
    text-decoration:underline
}

.info-mono{
    font-family:monospace;
    font-weight:400;
    color:#4b5563
}

/* Responsive */
@media(max-width:575px){
    .info-item-full{grid-column:span 2}
}
/* Quick Stats Grid */
.quick-stats{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:.75rem
}

.stat-card{
    text-align:center;
    padding:1rem .5rem;
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:.4rem
}

.stat-card svg{
    margin:0 auto .5rem;
    color:#9ca3af
}

.stat-value{
    font-size:.875rem;
    font-weight:700;
    color:#111827;
    margin:0
}

.stat-label{
    font-size:10px;
    color:#6b7280;
    margin:.25rem 0 0;
    text-transform:uppercase
}
@media(max-width:575px){
	.stat-value{
		font-size:.7rem;
	}
}
/* Description Section */
.desc-section{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:.5rem;
    padding:1rem
}

.desc-header{
    font-size:1.125rem;
    font-weight:700;
    color:#111827;
    margin:0 0 .75rem
}
.desc-header svg{
    color:#9ca3af;
    vertical-align:middle;
    margin-right:.5rem
}

.desc-content{position:relative}

.desc-text{
    line-height:1.7;
    color:#4b5563
}

.desc-text p{margin:0 0 .75rem}
.desc-text p:last-child{margin-bottom:0}


.desc-text ul,
.desc-text ol{
    margin:.75rem 0;
    padding-left:1.25rem
}

.desc-text li{margin-bottom:.375rem}

.desc-full{display:none}
.desc-full.show{display:block}
#descShort.hide{display:none}

.desc-toggle{
    display:inline-flex;
    align-items:center;
    gap:.25rem;
    margin-top:.75rem;
    padding:0;
    background:none;
    border:none;
    color:#10b981;
    font-size:.875rem;
    font-weight:600;
    cursor:pointer;
    transition:color .2s
}
.desc-toggle:hover{color:#059669}

.toggle-icon{transition:transform .3s ease}
.desc-toggle.expanded .toggle-icon{transform:rotate(180deg)}


/* Screenshots Section */
.screenshots-section{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:.5rem;
    padding:1rem
}

.screenshots-header{
    font-size:1.125rem;
    font-weight:700;
    color:#111827;
    margin:0 0 .75rem
}
.screenshots-header svg{
    color:#9ca3af;
    vertical-align:middle;
    margin-right:.5rem
}

.screenshots-scroll{
    overflow-x:auto;
    margin:0 -1rem;
    padding:0 1rem;
    scrollbar-width:none;
    -ms-overflow-style:none
}
.screenshots-scroll::-webkit-scrollbar{display:none}

.screenshots-list{
    display:flex;
    gap:.4rem
}

.screenshot-item{
    flex-shrink:0;
    cursor:pointer;
    border-radius:.5rem;
    overflow:hidden;
    transition:transform .2s
}
.screenshot-item img{
    height:280px;
    width:auto;
    object-fit:contain;
    border-radius:.4rem
}
/* Screenshots Scrollbar - Desktop Only */
.screenshots-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* إظهار Scrollbar على الكمبيوتر فقط */
@media (min-width: 769px) {
    .screenshots-scroll {
        padding-bottom: 12px;
    }
    
    .screenshots-scroll::-webkit-scrollbar {
        height: 8px;
    }
    
    .screenshots-scroll::-webkit-scrollbar-track {
        background: var(--bg-secondary, #f1f5f9);
        border-radius: 10px;
    }
    
    .screenshots-scroll::-webkit-scrollbar-thumb {
        background: var(--text-muted, #94a3b8);
        border-radius: 10px;
    }
    
    .screenshots-scroll::-webkit-scrollbar-thumb:hover {
        background: var(--text-secondary, #64748b);
    }
    
    /* Firefox */
    .screenshots-scroll {
        scrollbar-width: thin;
        scrollbar-color: var(--text-muted, #94a3b8) var(--bg-secondary, #f1f5f9);
    }
}

/* إخفاء Scrollbar على الموبايل */
@media (max-width: 768px) {
    .screenshots-scroll::-webkit-scrollbar {
        display: none;
    }
    
    .screenshots-scroll {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
}
/* ========================================
   Lightbox - خفيف جداً
   ======================================== */
.ss-lightbox{
    position:fixed;
    inset:0;
    z-index:9999;
    background:rgba(0,0,0,.95);
    display:none;
    align-items:center;
    justify-content:center
}
.ss-lightbox.active{display:flex}

/* Close Button */
.ss-lightbox-close{
    position:absolute;
    top:1rem;
    right:1rem;
    z-index:10;
    background:rgba(255,255,255,.1);
    border:none;
    border-radius:50%;
    width:44px;
    height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:background .2s
}
.ss-lightbox-close:hover{background:rgba(255,255,255,.2)}
.ss-lightbox-close svg{color:#fff}

/* Navigation Buttons */
.ss-lightbox-nav{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:10;
    background:rgba(255,255,255,.1);
    border:none;
    border-radius:50%;
    width:48px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:background .2s
}
.ss-lightbox-nav:hover{background:rgba(255,255,255,.2)}
.ss-lightbox-nav svg{color:#fff}
.ss-lightbox-prev{left:1rem}
.ss-lightbox-next{right:1rem}

/* Image Container */
.ss-lightbox-content{
    max-width:90vw;
    max-height:85vh;
    display:flex;
    align-items:center;
    justify-content:center
}
.ss-lightbox-content img{
    max-width:100%;
    max-height:85vh;
    object-fit:contain;
    border-radius:.5rem
}

/* Counter */
.ss-lightbox-counter{
    position:absolute;
    bottom:1rem;
    left:50%;
    transform:translateX(-50%);
    color:rgba(255,255,255,.7);
    font-size:.875rem;
    background:rgba(0,0,0,.5);
    padding:.375rem .75rem;
    border-radius:2rem
}


/* Responsive */
@media(max-width:768px){
    .screenshot-item img{height:180px}
    
    .ss-lightbox-nav{
        width:40px;
        height:40px
    }
    .ss-lightbox-nav svg{
        width:24px;
        height:24px
    }
    .ss-lightbox-prev{left:.5rem}
    .ss-lightbox-next{right:.5rem}
 }
/* FAQ Section */
.faq-section{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:.5rem;
    padding:1rem
}

.faq-header{
    font-size:1.125rem;
    font-weight:700;
    color:#111827;
    margin:0 0 .75rem
}
.faq-header svg{
    color:#9ca3af;
    vertical-align:middle;
    margin-right:.5rem
}

.faq-list{
    overflow:hidden
}

.faq-item{border-bottom:1px solid #e5e7eb}
.faq-question{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.75rem;
    padding:1rem;
    background:#fff;
    border:none;
    text-align:left;
    font-size:.875rem;
    font-weight:600;
    color:#111827;
    cursor:pointer;
    transition:background .2s
}
.faq-question:hover{background:#f9fafb}

.faq-chevron{
    flex-shrink:0;
    color:#9ca3af;
    transition:transform .3s ease
}

.faq-item.active .faq-chevron{transform:rotate(180deg)}

.faq-answer{
    max-height:0;
    overflow:hidden;
    transition:max-height .4s cubic-bezier(0.4,0,0.2,1)
}

.faq-item.active .faq-answer{max-height:500px}

.faq-answer-inner{
    padding:0 1rem 1rem;
    font-size:.875rem;
    line-height:1.7;
    color:#4b5563
}



/* FAQ Section */
.faq-section{
    background:#fff;
    border:1px solid #dee2e6;
    border-radius:.5rem;
    padding:1rem;
    box-shadow:0 1px 3px rgba(0,0,0,.05)
}

/* Header */
.faq-header{
    font-size:1.125rem;
    font-weight:700;
    margin-bottom:1rem;
    display:flex;
    align-items:center;
    gap:.5rem
}
.faq-header svg{color:#9ca3af}

/* FAQ List */
.faq-list{display:flex;flex-direction:column;gap:.5rem}

/* FAQ Item */
.faq-item{
    border:1px solid #e5e7eb;
    border-radius:.4rem;
    overflow:hidden;
    transition:border-color .2s
}
.faq-item:hover{border-color:#d1d5db}

/* Question Button */
.faq-question{
    width:100%;
    padding:1rem;
    display:flex;
    align-items:center;
    justify-content:space-between;
    background:transparent;
    border:none;
    font-weight:600;
    font-size:.875rem;
    text-align:left;
    cursor:pointer;
    transition:background-color .2s
}
.faq-question:hover{background-color:#f9fafb}
.faq-question span{flex:1}

/* Chevron Icon */
.faq-chevron{
    color:#9ca3af;
    transition:transform .3s ease;
    flex-shrink:0
}
.faq-item.active .faq-chevron{transform:rotate(180deg)}

/* Answer */
.faq-answer{
    max-height:0;
    overflow:hidden;
    transition:max-height .4s cubic-bezier(0.4,0,0.2,1)
}
.faq-item.active .faq-answer{max-height:500px}

.faq-answer p{
    padding:.5rem 1rem 1rem;
    font-size:.875rem;
    color:#4b5563;
    line-height:1.6;
    margin:0
}
.faq-answer a{color:#2563eb;text-decoration:underline}
.faq-answer a:hover{color:#1d4ed8}

/* Install Guide Section */
.install-guide-section{
    background:#fff;
    border:1px solid #dee2e6;
    border-radius:.5rem;
    padding:1rem;
    box-shadow:0 1px 3px rgba(0,0,0,.05)
}

/* Header */
.install-header{
    font-size:1.125rem;
    font-weight:700;
    margin-bottom:1rem;
    display:flex;
    align-items:center;
    gap:.5rem
}
.install-header svg{color:#9ca3af}

/* Tabs Container */
.install-tabs-container{
    border:1px solid #e5e7eb;
    border-radius:.45rem;
    overflow:hidden
}

/* Tab Buttons */
.install-tabs{
    display:flex;
    background:#f9fafb
}

.install-tab{
    flex:1;
    padding:.75rem;
    font-size:.875rem;
    font-weight:700;
    border:none;
    background:transparent;
    color:#9ca3af;
    cursor:pointer;
    border-bottom:2px solid transparent;
    transition:all .2s
}

.install-tab:hover{color:#6b7280}

.install-tab.active[data-tab="apk"]{
    background:#fff;
    color:#10b981;
    border-bottom-color:#10b981
}

.install-tab.active[data-tab="xapk"]{
    background:#fff;
    color:#3b82f6;
    border-bottom-color:#3b82f6
}

/* Tab Content */
.install-content{padding:1.25rem}

.install-panel{display:none}
.install-panel.active{display:block}

/* Steps */
.install-step{
    display:flex;
    align-items:flex-start;
    gap:1rem;
    margin-bottom:1rem
}
.install-step:last-child{margin-bottom:0}

.step-number{
    width:40px;
    height:40px;
    border-radius:.75rem;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
    flex-shrink:0
}

.step-emerald{
    background:#d1fae5;
    color:#059669
}

.step-blue{
    background:#dbeafe;
    color:#2563eb
}

.step-info{flex:1}

.step-title{
    font-size:.875rem;
    font-weight:600;
    color:#111827;
    margin:0 0 2px
}

.step-desc{
    font-size:.75rem;
    color:#6b7280;
    margin:0
}

.step-desc a{
    color:#2563eb;
    text-decoration:underline
}
.step-desc a:hover{color:#1d4ed8}


/* Security Section */
.security-section{
    background:#fff;
    border:1px solid #dee2e6;
    border-radius:.5rem;
    padding:1.25rem;
    box-shadow:0 1px 3px rgba(0,0,0,.05)
}

/* Header */
.security-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:1rem
}

.security-icon-wrap{
    width:40px;
    height:40px;
    background:#ecfdf5;
    border-radius:.75rem;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-right:.75rem
}
.security-icon-wrap svg{color:#059669}

.security-title-wrap{flex:1}

.security-title{
    font-size:.875rem;
    font-weight:700;
    margin:0;
    color:#111827
}

.security-date{
    font-size:11px;
    color:#6b7280;
    margin:2px 0 0
}

.security-badge{
    background:#10b981;
    color:#fff;
    font-size:10px;
    font-weight:700;
    padding:.25rem .625rem;
    border-radius:2rem;
    text-transform:uppercase
}

/* Scan Info */
.security-scan-info{margin-bottom:1rem}

.scan-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:.5rem
}

.scan-label{
    font-size:.75rem;
    color:#6b7280
}

.scan-result{
    font-size:.75rem;
    font-weight:700;
    color:#059669
}

.scan-progress{
    height:8px;
    background:#f3f4f6;
    border-radius:2rem;
    overflow:hidden
}

.scan-progress-bar{
    height:100%;
    width:100%;
    background:#10b981;
    border-radius:2rem;
    animation:scanPulse 2s ease-in-out infinite
}

@keyframes scanPulse{
    0%,100%{opacity:1}
    50%{opacity:.7}
}

/* Security Checks */
.security-checks{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:.5rem;
    margin-bottom:1rem
}

.security-check{
    display:flex;
    align-items:center;
    gap:.375rem;
    font-size:11px;
    color:#4b5563
}
.security-check svg{color:#10b981;flex-shrink:0}

/* VirusTotal Link */
.virustotal-link{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.5rem;
    width:100%;
    padding:.625rem;
    background:#f0fdf4;
    color:#059669;
    font-size:.75rem;
    font-weight:600;
    border-radius:.4rem;
    text-decoration:none;
    border:1px solid #bbf7d0;
    transition:all .2s
}
.virustotal-link:hover{
    background:#dcfce7;
    color:#047857
}
.virustotal-link svg{flex-shrink:0}


/* Share Section */
.share-section{margin-bottom:1rem}

.share-buttons{
    display:flex;
    gap:.75rem
}

/* Share Button & Dropdown Wrapper */
.share-dropdown-wrapper{
    position:relative;
    flex:1
}

/* Main Share Button */
.share-btn-main{
    width:100%;
    padding:.875rem 1rem;
    background:#fff;
    border:2px solid #e5e7eb;
    border-radius:.4rem;
    font-size:.875rem;
    font-weight:600;
    color:#374151;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.5rem;
    transition:all .2s
}
.share-btn-main:hover{
    background:#f9fafb;
    border-color:#d1d5db
}

/* Dropdown */
.share-dropdown{
    position:absolute;
    bottom:100%;
    left:0;
    right:0;
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:.4rem;
    padding:1rem;
    margin-bottom:.5rem;
    box-shadow:0 10px 25px rgba(0,0,0,.1);
    opacity:0;
    visibility:hidden;
    transform:translateY(10px);
    transition:all .2s ease;
    z-index:100
}
.share-dropdown.active{
    opacity:1;
    visibility:visible;
    transform:translateY(0)
}

/* Social Grid */
.share-social-grid{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:.5rem
}

.share-social-btn{
    width:40px;
    height:40px;
    border-radius:.5rem;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    transition:transform .2s,opacity .2s
}
.share-social-btn:hover{
    transform:scale(1.1);
	color:#fff !important;
    opacity:.9
}

.share-facebook{background:#1877f2}
.share-twitter{background:#000}
.share-whatsapp{background:#25d366}
.share-telegram-share{background:#0088cc}
.share-linkedin{background:#0a66c2}
.share-email{background:#6b7280;color:#fff}

/* Divider */
.share-divider{
    height:1px;
    background:#e5e7eb;
    margin:.75rem 0
}

/* Copy Link Button */
.share-copy-btn{
    width:100%;
    padding:.625rem;
    background:#f3f4f6;
    border:none;
    border-radius:.5rem;
    font-size:.75rem;
    font-weight:600;
    color:#374151;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.5rem;
    transition:all .2s;
    margin-bottom:.5rem
}
.share-copy-btn:hover{background:#e5e7eb}
.share-copy-btn.copied{
    background:#d1fae5;
    color:#059669
}

/* QR Button */
.share-qr-btn{
    width:100%;
    padding:.625rem;
    background:transparent;
    border:1px dashed #d1d5db;
    border-radius:.5rem;
    font-size:.75rem;
    font-weight:600;
    color:#6b7280;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.5rem;
    transition:all .2s
}
.share-qr-btn:hover{
    background:#f9fafb;
    border-color:#9ca3af
}

/* Telegram Channel Button */
.telegram-channel-btn{
    flex:1;
    background: linear-gradient(135deg, #0088CC 0%, #0097e2 100%);
    color:#fff;
    border-radius:.4rem;
    font-size:.875rem;
    font-weight:600;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.5rem;
    transition:all .2s;
}
.telegram-channel-btn:hover{
    background:linear-gradient(135deg, #0088CC 0%, #007ab7 100%);
    color:#fff !important;
    transform:translateY(-1px)
}

/* QR Modal */
.qr-modal{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background:rgba(0,0,0,.5);
    display:flex;
    align-items:center;
    justify-content:center;
    opacity:0;
    visibility:hidden;
    transition:all .3s;
    z-index:9999
}
.qr-modal.active{
    opacity:1;
    visibility:visible
}

.qr-modal-content{
    background:#fff;
    border-radius:1rem;
    padding:1.5rem;
    max-width:280px;
    width:90%;
    position:relative;
    transform:scale(.9);
    transition:transform .3s
}
.qr-modal.active .qr-modal-content{transform:scale(1)}

.qr-modal-close{
    position:absolute;
    top:.75rem;
    right:.75rem;
    background:transparent;
    border:none;
    color:#9ca3af;
    cursor:pointer;
    padding:.25rem
}
.qr-modal-close:hover{color:#374151}

.qr-modal-body{text-align:center}

.qr-code-img{
    width:200px;
    height:200px;
    border-radius:.5rem;
    margin-bottom:1rem
}

.qr-modal-title{
    font-size:.875rem;
    font-weight:700;
    color:#111827;
    margin:0 0 .25rem
}

.qr-modal-subtitle{
    font-size:.75rem;
    color:#6b7280;
    margin:0
}


/* Badge Styles - Custom colors (not in Bootstrap) */
.badge-type {
    padding: 0 6px;
    border-radius: 4px;
    font-size: 10px;
    border: 1px solid;
}
.badge-xapk { color: var(--blue); border-color: var(--blue); }
.badge-apks { color: var(--orange); border-color: var(--orange); }
.badge-apk { color: var(--success); border-color: var(--success); }

/* Show More - Custom animation */
.variants-content.show-more {
    --height: 180px;
    max-height: var(--height);
    overflow: hidden;
    position: relative;
}
.variants-content.show-more[data-expanded="true"] {
    max-height: var(--max-height);
    padding-bottom: 30px;
}
.show-more-mask {
    position: absolute;
    bottom: 0;
    width: 100%;
    padding-top: 20px;
    background: linear-gradient(180deg, rgba(255,255,255,0), #fff 60%);
}
.show-more-button { cursor: pointer; font-size: 14px; }
.show-more[data-expanded="true"] .show-more-button svg { transform: rotate(180deg); }

/* Responsive */
@media(max-width:575px){
    .share-social-grid{grid-template-columns:repeat(3,1fr)}
}

/* Sticky Bottom Bar */
.sticky-bottom-bar{
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    background:rgba(255,255,255,.95);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    border-top:1px solid #e5e7eb;
    padding:.75rem;
    transform:translateY(100%);
    transition:transform .3s ease;
    z-index:9990;
    display:none
}

.sticky-bottom-bar.visible{
    transform:translateY(0)
}

/* Content */
.sticky-bar-content{
    max-width:768px;
    margin:0 auto;
    display:flex;
    align-items:center;
    gap:.75rem
}

/* App Icon */
.sticky-app-icon{
    width:48px;
    height:48px;
    border-radius:.5rem;
    border:1px solid #e5e7eb;
    object-fit:cover;
    flex-shrink:0
}

.sticky-app-icon-placeholder{
    width:48px;
    height:48px;
    border-radius:.5rem;
    border:1px solid #e5e7eb;
    background:#f3f4f6;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    color:#9ca3af
}

/* App Info */
.sticky-app-info{
    flex:1;
    min-width:0
}

.sticky-app-title{
    font-size:.875rem;
    font-weight:700;
    color:#111827;
    margin:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis
}

.sticky-app-meta{
    font-size:10px;
    color:#6b7280;
    margin:2px 0 0;
    display:flex;
    align-items:center;
    gap:4px
}

.sticky-meta-sep{color:#d1d5db}

/* Download Button */
.sticky-download-btn{
    display:flex;
    align-items:center;
    gap:.5rem;
    padding:.75rem 1.25rem;
    color:#fff;
    font-size:.875rem;
    font-weight:700;
    border-radius:.4rem;
    text-decoration:none;
    transition:all .15s;
    flex-shrink:0
}

.sticky-download-btn:hover{
    color:#fff;
    transform:scale(1.02)
}

.sticky-download-btn:active{
    transform:scale(.98)
}

/* Show only on mobile/tablet */
@media(max-width:991px){
    .sticky-bottom-bar{display:block}
}

/* Extra small screens */
@media(max-width:400px){
    .sticky-download-btn{
        padding:.625rem 1rem;
        font-size:.75rem
    }
    .sticky-download-btn svg{display:none}
    .sticky-app-icon{
        width:40px;
        height:40px
    }
}

img {
	max-width: 100%;
	height: auto
}

iframe {
	display: block;
	max-width: 100%;
	margin: 0 auto
}

a {
	-webkit-transition: all .3s ease 0;
	-moz-transition: all .3s ease 0;
	transition: all .3s ease 0
}

ul,
ol {
	padding-left: 20px
}

button {
	cursor: pointer;
	-webkit-transition: all .3s ease 0;
	-moz-transition: all .3s ease 0;
	transition: all .3s ease 0
}

small,
.small {
	font-size: 90%
}

.font-size-body {
	font-size: .9375rem !important
}

.lead {
	font-size: 1.125rem
}

.font-weight-semibold {
	font-weight: 600 !important
}

a.text-muted:hover,
a.text-muted:focus {
	color: #212529 !important
}

.bg-primary {
	background-color: #eb144c !important
}

.bg-secondary {
	background-color: #fe8401 !important
}

.bg-light {
	background-color: #f0f2f5 !important
}

.border-primary {
	border-color: #eb144c !important
}

.bg-cover {
	background-color: #cfd4db;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover
}

.border-secondary {
	border-color: #fe8401 !important
}

.border-bottom-2 {
	border-bottom: 2px solid #dee2e6
}

.rounded-lg {
	border-radius: .5rem !important
}

.svg-4 {
	width: 1.5rem;
	height: 1.5rem
}

.svg-5 {
	width: 1.25rem;
	height: 1.25rem
}

.svg-6 {
	width: 1rem;
	height: 1rem
}

.svg-muted {
	fill: #999
}

@media(max-width:767px) {

	h1,
	.h1 {
		font-size: 1.625rem
	}

	h2,
	.h2 {
		font-size: 1.5rem
	}

	h3,
	.h3 {
		font-size: 1.375rem
	}

	h4,
	.h4 {
		font-size: 1.25rem
	}

	h5,
	.h5 {
		font-size: 1.125rem
	}

	.display-4 {
		font-size: 2rem
	}
}

.form-control::-webkit-input-placeholder {
	color: #898989
}

.form-control::-moz-placeholder {
	color: #898989
}

.form-control:-ms-input-placeholder {
	color: #898989
}

.form-control:-moz-placeholder {
	color: #898989
}

.required {
	color: #f15a29
}

.form-control,
.custom-select,
.btn {
	border-radius: .375rem;
	-webkit-transition: all .3s ease 0;
	-moz-transition: all .3s ease 0;
	transition: all .3s ease 0
}

.form-control,
.custom-select {
	background-color: #f0f2f5;
	border-color: #f0f2f5
}

.form-control:focus,
.custom-select:focus,
.form-control:focus+.input-group-append .btn {
	background-color: #fff;
	border-color: #dee2e6;
	box-shadow: 0 .125rem .5rem rgba(0, 0, 0, .15)
}

.btn {
	font-weight: 600
}

.btn-dw {
	margin: 0 auto;
	justify-content: space-between;
	padding: .75rem
}

.btn-sm {
	font-size: .75rem
}

.btn-dw svg {
	margin-top: 2px
}

@media screen and (min-width:720px) {
	.download.btn-dw {
		align-self: center;
		width: 360px
	}
}

.btn-primary svg,
.btn-primary:not(:disabled):not(.disabled):active:focus svg {
	fill: #fff
}

.btn-secondary,
.btn-secondary:not(:disabled):not(.disabled):active:focus {
	color: #fff;
	background-color: #fe8401;
	border-color: #fe8401
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:not(:disabled):not(.disabled):active {
	color: #fff;
	background-color: #ea7900;
	border-color: #ea7900
}

.btn-secondary svg,
.btn-secondary:not(:disabled):not(.disabled):active:focus svg {
	fill: #fff
}

.btn-outline-primary,
.btn-outline-primary:not(:disabled):not(.disabled):active:focus {
	color: #eb144c;
	background-color: transparent;
	border-color: #eb144c
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:not(:disabled):not(.disabled):active {
	color: #fff;
	background-color: #eb144c;
	border-color: #eb144c
}

.btn-light,
.btn-light:not(:disabled):not(.disabled):active:focus {
	color: #212529;
	background-color: #f0f2f5;
	border-color: #f0f2f5
}

.btn-light:not(:disabled):not(.disabled).active {
	color: #fff;
	background-color: #eb144c;
	border-color: #eb144c
}

.table th,
.table td {
	padding: .625rem
}

.table th {
	font-size: 1rem;
	font-weight: 600
}

.table td {
	word-break: break-all
}

.tab-nav {
	border-bottom: 1px solid #dee2e6;
	display: flex;
	margin-bottom: 1rem
}

.tab-nav a {
	font-size: 1rem;
	font-weight: 600;
	color: #212529;
	border-bottom: 2px solid transparent;
	display: block;
	padding: .5rem 1.5rem
}

.tab-nav a:hover {
	background-color: #f0f2f5
}

.tab-nav a.active {
	color: #eb144c;
	border-bottom-color: #eb144c
}

.breadcrumb {
	background: 0%;
	border: 0;
	font-size: .8rem;
	border-radius: 0;
	padding: 0;
	margin: 0
}

.breadcrumb-item+.breadcrumb-item::before {
	content: ' ';
	border-top: 1px solid #6c757d;
	border-right: 1px solid #6c757d;
	display: inline-block;
	vertical-align: middle;
	width: .3rem;
	height: .3rem;
	padding-right: 0;
	margin-top: -.15rem;
	margin-right: .3rem;
	transform: rotate(45deg)
}

@media(max-width:767px) {
	.single .breadcrumb-item.active {
		display: none
	}
}

.pagination {
	justify-content: center;
	margin-bottom: 1.5rem
}

.pagination .page-link {
	font-size: 1rem;
	font-weight: 600;
	color: #212529;
	background: #f0f2f5;
	border-color: #f0f2f5;
	border-radius: .5rem !important;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	text-align: center;
	padding: 0;
	margin-left: .25rem;
	margin-right: .25rem
}

.pagination .page-link:hover,
.pagination .page-link:focus {
	color: #212529;
	background-color: #e2e6ea;
	border-color: #e2e6ea
}

.pagination .page-item.active .page-link {
	color: #fff;
	background-color: #eb144c;
	border-color: #eb144c
}

.modal-dialog {
	min-height: calc(100vh - 3.75rem);
	display: flex;
	flex-direction: column;
	justify-content: center;
	overflow: auto;
	margin-top: 2.5rem;
	margin-bottom: 2.5rem
}

.modal.fade .modal-dialog {
	-webkit-transform: translate(0, 0);
	-moz-transform: translate(0, 0);
	transform: translate(0, 0)
}

.modal-header {
	background: #f7f7f7
}

.modal-title {
	text-transform: uppercase;
	line-height: 1.2
}

.modal-body {
	padding: 1.5rem
}

.modal-backdrop.show {
	opacity: .7
}

.spin {
	-webkit-animation: spin 1.2s infinite linear;
	-moz-animation: spin 1.2s infinite linear;
	-ms-animation: spin 1.2s infinite linear;
	-o-animation: spin 1.2s infinite linear;
	animation: spin 1.2s infinite linear
}

@keyframes "spin" {
	from {
		-webkit-transform: rotate(0);
		-moz-transform: rotate(0);
		-o-transform: rotate(0);
		-ms-transform: rotate(0);
		transform: rotate(0)
	}

	to {
		-webkit-transform: rotate(359deg);
		-moz-transform: rotate(359deg);
		-o-transform: rotate(359deg);
		-ms-transform: rotate(359deg);
		transform: rotate(359deg)
	}
}

@-moz-keyframes spin {
	from {
		-moz-transform: rotate(0);
		transform: rotate(0)
	}

	to {
		-moz-transform: rotate(359deg);
		transform: rotate(359deg)
	}
}

@-webkit-keyframes "spin" {
	from {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}

	to {
		-webkit-transform: rotate(359deg);
		transform: rotate(359deg)
	}
}

@-ms-keyframes "spin" {
	from {
		-ms-transform: rotate(0);
		transform: rotate(0)
	}

	to {
		-ms-transform: rotate(359deg);
		transform: rotate(359deg)
	}
}

@-o-keyframes "spin" {
	from {
		-o-transform: rotate(0);
		transform: rotate(0)
	}

	to {
		-o-transform: rotate(359deg);
		transform: rotate(359deg)
	}
}

.progress-bar-animated {
	-webkit-animation: progress-bar-stripes .6s linear infinite;
	animation: progress-bar-stripes .6s linear infinite
}

.accordion .toggler:after {
	content: '-';
	font-size: 1.25rem;
	font-weight: 700;
	cursor: pointer;
	display: inline-block;
	line-height: 1;
	margin-left: auto;
	transition: all .3s ease 0
}

.accordion .toggler.collapsed:after {
	content: '+'
}

.accordion-more-info .toggler {
	color: #007bff;
	background-color: #f0f2f5
}

.site {
	padding-top: 60px
}

.admin-bar .site-header {
	top: 46px
}

@media(min-width:768px) {
	.admin-bar .site-header {
		top: 32px
	}
}

.site-nav ul {
	list-style: none;
	padding: 0;
	margin: 0
}

.site-nav .menu {
	display: flex
}

.site-nav .menu>li {
	position: relative
}

.site-nav .menu>li>a {
	font-size: 1rem;
	font-weight: 600;
	color: inherit;
	border-top: 2px solid transparent;
	border-bottom: 2px solid transparent;
	display: block;
	padding: .5rem 1.25rem
}

.site-nav .menu>li:hover>a {
	color: inherit;
	background: #f2f2f2
}

.site-nav .sub-menu {
	white-space: nowrap;
	background-color: #fff;
	box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
	display: none;
	padding: .5rem 0;
	position: absolute;
	z-index: 12;
	top: 100%;
	left: 0;
	min-width: 15rem
}

.site-nav li:hover>.sub-menu {
	display: block
}

.site-nav .sub-menu>li {
	position: relative
}

.site-nav .sub-menu>li>a {
	color: inherit;
	display: block;
	padding: .5rem 1rem
}

.site-nav .sub-menu>li:hover>a {
	color: #eb144c
}

.site-nav .sub-menu>li>.sub-menu {
	top: 0;
	left: 100%
}

@media(max-width:1199px) {
	.site-nav .menu>li>a {
		padding-left: .75rem;
		padding-right: .75rem
	}
}

@media(max-width:991px) {
	.site-nav {
		background-color: #fff;
		overflow-y: auto;
		width: 17.5rem;
		position: fixed;
		left: -17.5rem;
		top: 0;
		bottom: 0;
		transition: all .3s ease 0;
		z-index: 1002
	}

	body.open-site-nav .site-nav {
		left: 0
	}

	.site-overlay {
		background: rgba(0, 0, 0, .5);
		width: 100%;
		height: 100%;
		position: fixed;
		z-index: 1001;
		top: 0;
		left: 0
	}

	.site-nav .menu {
		display: block
	}

	.site-nav .menu>li {
		border-bottom: 1px solid #dee2e6;
		padding: .75rem 2.5rem .75rem .75rem;
		margin-left: 0
	}

	.site-nav .menu>li+li {
		margin-left: 0
	}

	.site-nav .menu>li>a {
		display: inline;
		padding: 0
	}

	.site-nav .menu>li.menu-item-has-children:before {
		content: ' ';
		border-top: 2px solid #212121;
		border-left: 2px solid #212121;
		cursor: pointer;
		float: right;
		width: .5rem;
		height: .5rem;
		position: absolute;
		top: 1.25rem;
		right: 1rem;
		transform: rotateZ(-135deg);
		transition: all .3s ease 0
	}

	.site-nav .menu>li.menu-item-has-children:hover:before {
		border-top-color: #eb144c;
		border-left-color: #eb144c
	}

	.site-nav .menu>li.menu-item-has-children.active:before {
		transform: rotateZ(45deg)
	}

	.site-nav .menu>li>.sub-menu {
		background-color: transparent;
		border: 0;
		box-shadow: none;
		clear: both;
		display: none;
		padding: 0;
		position: relative;
		top: 0;
		left: 0;
		margin: .5rem 0
	}

	.site-nav .menu>li:hover>.sub-menu {
		display: none
	}
}

.site-logo img {
	display: block
}

.row.top .col-xl-6 .mr-2 {
	width: 5rem !important
}

.row.top .lead {
	font-size: 1rem
}

@media(max-width:360px) {
	.row.top .col-xl-6 .mr-2 {
		width: 3.75rem !important
	}

	.row.top .h4 {
		font-size: 1rem
	}

	.row.top .lead {
		font-size: .8rem
	}

	.row.top .small {
		font-size: 80%
	}
}

.at1 {
	height: 360px !important;
	contain: layout style paint;
	content-visibility: auto;
	width: 100%;
	display: block
}

.at3 {
	height: 320px !important;
	contain: layout style paint;
	content-visibility: auto;
	width: 100%;
	display: block
}

.ads .at3 {
	height: 280px !important
}
}

video {
	max-width: 100%
}

.archive-post:hover,
.aside-cat:hover {
	border-color: #eb144c !important
}

.aside-cat:hover:before {
	display: block
}

.aside-cat:before {
	content: ' ';
	border-radius: .5rem;
	display: none;
	position: absolute;
	z-index: 1;
	top: -0.5rem;
	bottom: -0.5rem;
	left: -0.5rem;
	right: -0.5rem
}

.adsbygoogle,
.adsbygoogle ins,
.adsbygoogle iframe {
	width: 100% !important
}

.adsbygoogle {
	margin-left: 0 !important
}

.cloud-tags {
	display: flex;
	flex-wrap: wrap;
	justify-content: center
}

.cloud-tags a {
	color: inherit;
	background-color: #e4e4e4;
	border-radius: 50rem;
	display: block;
	padding: .5rem 1rem;
	margin: 0 1rem 1.5rem
}

.cloud-tags a:hover,
.cloud-tags a:focus {
	color: inherit;
	background-color: #c4c4c4
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6,
.term-description h1,
.term-description h2,
.term-description h3,
.term-description h4,
.term-description h5,
.term-description h6 {
	font-size: 1.2rem;
	margin-bottom: 1rem
}

.entry-content table {
	background-color: transparent;
	border-collapse: collapse;
	border-spacing: 0;
	margin-bottom: 1rem;
	width: 100%;
	max-width: 100%
}

.entry-content table th,
.entry-content table td {
	border-top: 1px solid #dee2e6;
	padding: .75rem
}

.entry-content table th {
	font-weight: 600;
	text-transform: uppercase
}

.entry-content table thead th {
	border-bottom: 2px solid #dee2e6;
	padding: .75rem
}

.entry-content img.centered,
.entry-content .aligncenter,
.term-description img.centered,
.term-description .aligncenter {
	display: table;
	margin: 0 auto 1em
}

.entry-content .wp-caption,
.term-description .wp-caption {
	max-width: 100%
}

.entry-content .wp-caption-text,
.term-description .wp-caption-text {
	font-weight: 400;
	text-align: center;
	background: #eee;
	padding: .5rem
}

.entry-content blockquote {
	box-shadow: inset 0 0 0 0 #e2e4e7;
	border-left: .25rem solid #000;
	padding-left: 1rem
}

.entry-content .wp-block-image {
	text-align: center;
	margin-left: auto;
	margin-right: auto
}

.entry-content .su-spoiler {
	display: none
}

.list-shares a {
	color: #fff;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 2.25rem;
	height: 2.25rem
}

.list-shares a:hover {
	opacity: .8
}

.list-shares a.facebook {
	background-color: #455fa1
}

.list-shares a.twitter {
	background-color: #58abf4
}

.list-shares a.pinterest {
	background-color: #cc1d1e
}

.list-shares a.linkedin {
	background-color: #007bb5
}

.list-shares a.email {
	background-color: #1980be
}

.schema-faq-section {
	border: 1px solid #dee2e6;
	padding: 1rem;
	margin-top: -1px
}

.schema-faq-question {
	font-weight: 400;
	cursor: pointer
}

.schema-faq-answer {
	padding-top: 1rem;
	padding-left: 1rem
}

.site-footer .menu li a {
	color: inherit
}

.site-footer .menu li a:hover {
	color: #eb144c
}

.site-footer .socials a {
	color: inherit;
	background-color: #f0f2f5;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem
}

.site-footer .socials a:hover {
	background-color: #e2e6ea
}

.site-footer .socials a svg {
	fill: #212529;
	transition: all .3s ease 0
}

.site-footer .socials a:hover svg {
	fill: #212529
}

.site-footer .socials a+a {
	margin-left: .5rem
}

.comment-navigation {
	margin: 25px 0
}

.comment-navigation .page-numbers,
.comment-navigation a {
	margin: 0 5px;
	padding: 5px 10px;
	text-decoration: none;
	border: 1px solid #e5e8ec;
	border-radius: 5px;
	color: #333;
	background-color: #f8f9fa
}

.comment-navigation .page-numbers:hover,
.comment-navigation a:hover {
	background-color: #f0f2f5;
	color: #000
}

.comment-navigation .dots {
	color: #777
}

.comment-navigation .current {
	background-color: #689f38;
	border-color: #619535;
	color: #fff
}

/* gallery image border fix and popular game css */
.entry-content table td {
	border: 0
}

.detail-hot-game-info {
	border-radius: 15px;
	overflow: hidden;
	display: block;
	margin-bottom: 10px
}

.hot-game-bg {
	width: 100%;
	background-color: #f2f2f2
}

.hot-game-bg img {
	width: 100%
}

.hot-game {
	width: 100%;
	box-shadow: 0 2px 12px 0 rgb(0 0 0 / 6%);
	background-color: #f2f2f2;
	height: 85px;
	display: flex;
	align-items: center;
	padding: 0 14px
}

.hot-name-icon {
	width: 56px;
	height: 56px;
	border-radius: 18px;
	border: solid 3px #dedede;
	max-width: none;
	overflow: hidden;
	margin-right: 10px
}

.hot-name-icon img {
	width: 100%;
	height: 100%
}

.hot-game-title {
	font-weight: 600;
	font-size: 15px;
	color: #000
}

.hot-game-version {
	font-size: 12px;
	color: #6c757d;
	margin-top: 2px
}

.hot-game-tag {
	font-size: 12px;
	height: 20px;
	text-align: center;
	border-radius: 11px;
	margin: 3px 0;
	padding: 1px 10px;
	color: #fff
}

@media(max-width:991px) {
	.detail-hot-game-info {
		border-radius: 1rem;
		display: block;
		margin: 10px
	}

	.detail-hot-game-info img {
		width: 100%
	}

	.detail-hot-game-divider {
		margin-top: 24px;
		margin-bottom: 24px;
		width: 100%;
		height: 1px;
		background-color: #21242f
	}
}