.admin-wrapper {
    min-height: 80vh;
    background: linear-gradient(160deg, #f0f4ff 0%, #fefefe 60%, #fffbea 100%);
    padding: 2rem 0 3rem;
}

/* ===== PROFILE CARD ===== */
.profile-card {
    background: white;
    border-radius: 24px;
    box-shadow: 0 10px 50px rgba(26, 86, 219, 0.1);
    border: 1px solid rgba(26, 86, 219, 0.06);
    overflow: hidden;
}

.profile-card-header {
    background: linear-gradient(135deg, #0f3460 0%, #1a56db 100%);
    padding: 2.5rem 2rem 4rem;
    position: relative;
    text-align: center;
    overflow: hidden;
}

.profile-card-header::before {
    content: '';
    position: absolute;
    width: 300px; height: 300px;
    background: rgba(245, 197, 24, 0.1);
    border-radius: 50%;
    top: -100px; right: -80px;
}

.profile-card-header::after {
    content: '';
    position: absolute;
    width: 200px; height: 200px;
    background: rgba(255,255,255,0.05);
    border-radius: 50%;
    bottom: -60px; left: -40px;
}

.profile-avatar {
    width: 90px; height: 90px;
    background: linear-gradient(135deg, #f5c518, #d4a800);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 1rem;
    box-shadow: 0 8px 30px rgba(245, 197, 24, 0.5);
    position: relative;
    z-index: 1;
}

.profile-avatar i { font-size: 2.2rem; color: #0f3460; }

.profile-avatar::after {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: 50%;
    border: 2px dashed rgba(245, 197, 24, 0.6);
    animation: spin 10s linear infinite;
}

@keyframes spin { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }

.profile-name {
    font-size: 1.5rem;
    font-weight: 900;
    color: white;
    position: relative; z-index: 1;
    margin-bottom: 1rem;
}

.profile-name span { color: #f5c518; }

.profile-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem;
    position: relative; z-index: 1;
}

.p-badge {
    padding: 0.35rem 0.85rem;
    border-radius: 50px;
    font-size: 0.78rem;
    font-weight: 700;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.2);
}

.p-badge-mobile  { background: rgba(255,255,255,0.15); color: white; }
.p-badge-blood   { background: rgba(239,68,68,0.3); color: #fca5a5; border-color: rgba(239,68,68,0.4); }
.p-badge-province{ background: rgba(245,197,24,0.25); color: #fde68a; border-color: rgba(245,197,24,0.4); }
.p-badge-type    { background: rgba(52,211,153,0.25); color: #6ee7b7; border-color: rgba(52,211,153,0.4); }
.p-badge-buyer   { background: rgba(96,165,250,0.25); color: #93c5fd; border-color: rgba(96,165,250,0.4); }

/* vip badge در هدر */
.vip-crown {
    display: inline-flex; align-items: center; gap: 0.4rem;
    padding: 0.4rem 1.2rem;
    border-radius: 50px;
    font-size: 0.82rem; font-weight: 700;
    position: relative; z-index: 1;
    margin-top: 0.8rem;
}

.vip-crown-gold   { background: rgba(245,197,24,0.2); border: 1px solid rgba(245,197,24,0.5); color: #f5c518; }
.vip-crown-info   { background: rgba(96,165,250,0.2); border: 1px solid rgba(96,165,250,0.5); color: #93c5fd; }
.vip-crown-purple { background: rgba(167,139,250,0.2); border: 1px solid rgba(167,139,250,0.5); color: #c4b5fd; }
.vip-crown-gray   { background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.2); color: rgba(255,255,255,0.7); }

/* ===== WAVE DIVIDER ===== */
.wave-divider {
    margin-top: -2px;
    line-height: 0;
}

/* ===== ACTION BUTTONS ===== */
.profile-card-body {
    padding: 2rem;
}

.action-btn-group {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem;
    margin-bottom: 2rem;
}

.btn-action {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.6rem 1.4rem;
    border-radius: 50px;
    font-size: 0.88rem;
    font-weight: 700;
    border: 2px solid transparent;
    transition: all 0.3s ease;
    cursor: pointer;
    text-decoration: none;
}

.btn-action-admin {
    background: linear-gradient(135deg, #ef4444, #dc2626);
    color: white;
    box-shadow: 0 4px 15px rgba(239,68,68,0.35);
}
.btn-action-admin:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(239,68,68,0.5);
    color: white;
}

.btn-action-edit {
    background: linear-gradient(135deg, #10b981, #059669);
    color: white;
    box-shadow: 0 4px 15px rgba(16,185,129,0.35);
}
.btn-action-edit:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(16,185,129,0.5);
    color: white;
}

.btn-action-telegram {
    background: linear-gradient(135deg, #0ea5e9, #0284c7);
    color: white;
    box-shadow: 0 4px 15px rgba(14,165,233,0.35);
}
.btn-action-telegram:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(14,165,233,0.5);
    color: white;
}

.btn-action-logout {
    background: transparent;
    color: #ef4444;
    border-color: #ef4444;
}
.btn-action-logout:hover {
    background: #ef4444;
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(239,68,68,0.3);
}

/* ===== SECTION DIVIDER ===== */
.section-divider {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 1.5rem 0;
    color: #9ca3af;
    font-size: 0.82rem;
    font-weight: 600;
}
.section-divider::before,
.section-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, #e5e7eb, transparent);
}

/* ===== MENU CARDS ===== */
.menu-card {
    background: white;
    border-radius: 18px;
    padding: 1.5rem 1rem;
    text-align: center;
    text-decoration: none;
    display: block;
    border: 2px solid transparent;
    box-shadow: 0 4px 20px rgba(26,86,219,0.08);
    transition: all 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    height: 100%;
    position: relative;
    overflow: hidden;
}

.menu-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    border-radius: 3px 3px 0 0;
    transition: height 0.3s;
}

.menu-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 15px 40px rgba(26,86,219,0.15);
    text-decoration: none;
}

.menu-card:hover::before { height: 5px; }

.menu-card.blue::before   { background: linear-gradient(90deg, #1a56db, #0f3460); }
.menu-card.green::before  { background: linear-gradient(90deg, #10b981, #059669); }
.menu-card.yellow::before { background: linear-gradient(90deg, #f5c518, #d4a800); }
.menu-card.red::before    { background: linear-gradient(90deg, #ef4444, #dc2626); }
.menu-card.purple::before { background: linear-gradient(90deg, #8b5cf6, #6d28d9); }
.menu-card.sky::before    { background: linear-gradient(90deg, #0ea5e9, #0284c7); }

.menu-card:hover.blue   { border-color: rgba(26,86,219,0.15); }
.menu-card:hover.green  { border-color: rgba(16,185,129,0.15); }
.menu-card:hover.yellow { border-color: rgba(245,197,24,0.25); }
.menu-card:hover.red    { border-color: rgba(239,68,68,0.15); }
.menu-card:hover.purple { border-color: rgba(139,92,246,0.15); }
.menu-card:hover.sky    { border-color: rgba(14,165,233,0.15); }

.menu-icon {
    width: 60px; height: 60px;
    border-radius: 16px;
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 0.9rem;
    font-size: 1.5rem;
    transition: transform 0.3s;
}

.menu-card:hover .menu-icon { transform: scale(1.1) rotate(-5deg); }

.icon-blue   { background: #eff6ff; color: #1a56db; }
.icon-green  { background: #ecfdf5; color: #059669; }
.icon-yellow { background: #fffbea; color: #d4a800; }
.icon-red    { background: #fef2f2; color: #dc2626; }
.icon-purple { background: #f5f3ff; color: #6d28d9; }
.icon-sky    { background: #f0f9ff; color: #0284c7; }

.menu-card-title {
    font-size: 0.92rem;
    font-weight: 800;
    margin-bottom: 0.3rem;
}

.blue .menu-card-title   { color: #1a56db; }
.green .menu-card-title  { color: #059669; }
.yellow .menu-card-title { color: #b45309; }
.red .menu-card-title    { color: #dc2626; }
.purple .menu-card-title { color: #6d28d9; }
.sky .menu-card-title    { color: #0284c7; }

.menu-card-sub {
    font-size: 0.76rem;
    color: #9ca3af;
    line-height: 1.5;
}

/* ===== AD STATUS CARD ===== */
.ad-status-card {
    border-radius: 18px;
    overflow: hidden;
    border: none;
    box-shadow: 0 4px 25px rgba(26,86,219,0.08);
}

.ad-status-header {
    padding: 1rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-weight: 800;
    font-size: 0.95rem;
}

.ad-status-header.active   { background: linear-gradient(135deg, #059669, #10b981); color: white; }
.ad-status-header.inactive { background: linear-gradient(135deg, #6b7280, #9ca3af); color: white; }

.ad-status-body { background: white; padding: 1.5rem; }

.ad-live-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    color: #059669;
    padding: 0.3rem 0.9rem;
    border-radius: 50px;
    font-size: 0.78rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.ad-live-dot {
    width: 7px; height: 7px;
    background: #10b981;
    border-radius: 50%;
    animation: blink 1.5s infinite;
}

@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.3} }

.ad-text-box {
    background: #f8faff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1rem;
    font-size: 0.88rem;
    color: #374151;
    line-height: 1.8;
    margin-bottom: 1rem;
}

.ad-time {
    font-size: 0.78rem;
    color: #9ca3af;
    margin-bottom: 1.2rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.ad-action-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.btn-ad {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 1.1rem;
    border-radius: 50px;
    font-size: 0.82rem;
    font-weight: 700;
    border: 2px solid transparent;
    transition: all 0.3s;
    cursor: pointer;
    text-decoration: none;
}

.btn-ad-delete  { background: transparent; color: #ef4444; border-color: #ef4444; }
.btn-ad-delete:hover  { background: #ef4444; color: white; transform: translateY(-2px); }

.btn-ad-edit    { background: transparent; color: #1a56db; border-color: #1a56db; }
.btn-ad-edit:hover    { background: #1a56db; color: white; transform: translateY(-2px); }

.btn-ad-ladder  { background: transparent; color: #f59e0b; border-color: #f59e0b; }
.btn-ad-ladder:hover  { background: #f59e0b; color: white; transform: translateY(-2px); }

/* ===== EMPTY AD ===== */
.empty-ad-box {
    text-align: center;
    padding: 2rem 1rem;
}

.empty-ad-icon {
    width: 80px; height: 80px;
    background: #f3f4f6;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 1rem;
    font-size: 2rem;
    color: #d1d5db;
}

.btn-new-ad {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.8rem 2rem;
    background: linear-gradient(135deg, #10b981, #059669);
    color: white;
    border-radius: 50px;
    font-weight: 800;
    font-size: 0.95rem;
    text-decoration: none;
    border: none;
    box-shadow: 0 5px 20px rgba(16,185,129,0.4);
    transition: all 0.3s;
    cursor: pointer;
}

.btn-new-ad:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(16,185,129,0.5);
    color: white;
    text-decoration: none;
}

/* ===== INFO BOX (typing section) ===== */
.info-box {
    background: linear-gradient(135deg, #f0f4ff, #fffbea);
    border: 1px solid rgba(26,86,219,0.1);
    border-radius: 16px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
    color: #374151;
    line-height: 1.9;
}

.info-box strong { color: #1a56db; }

/* ===== UPGRADE BOX ===== */
.upgrade-box {
    background: linear-gradient(135deg, #0f3460, #1a56db);
    border-radius: 18px;
    padding: 1.5rem;
    color: white;
    text-align: center;
    margin-top: 1.5rem;
    box-shadow: 0 8px 30px rgba(26,86,219,0.3);
}

.upgrade-box h6 { font-weight: 800; font-size: 1rem; margin-bottom: 0.5rem; }
.upgrade-box p  { font-size: 0.82rem; opacity: 0.85; margin-bottom: 1rem; }

.btn-upgrade {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1.8rem;
    background: linear-gradient(135deg, #f5c518, #d4a800);
    color: #0f3460;
    border-radius: 50px;
    font-weight: 800;
    font-size: 0.88rem;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 20px rgba(245,197,24,0.4);
    transition: all 0.3s;
    cursor: pointer;
}

.btn-upgrade:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(245,197,24,0.6);
    color: #0f3460;
    text-decoration: none;
}

/* ===== VIP REVEAL BOXES ===== */
.reveal-box {
    border-radius: 16px;
    padding: 1.5rem;
    margin-top: 1rem;
    display: none;
    animation: fadeSlideIn 0.4s ease;
}

@keyframes fadeSlideIn {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

.reveal-box.green-box {
    background: linear-gradient(135deg, #ecfdf5, #d1fae5);
    border: 1px solid #a7f3d0;
}

.reveal-box.yellow-box {
    background: linear-gradient(135deg, #fffbea, #fef3c7);
    border: 1px solid #fde68a;
}

.reveal-box h6 { font-weight: 800; margin-bottom: 0.5rem; font-size: 0.95rem; }
.reveal-box p  { font-size: 0.85rem; line-height: 1.7; margin-bottom: 1rem; }

.green-box h6 { color: #059669; }
.yellow-box h6 { color: #b45309; }

.price-tag {
    display: inline-block;
    background: white;
    padding: 0.3rem 1rem;
    border-radius: 50px;
    font-weight: 900;
    font-size: 1rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
}

.green-box .price-tag { color: #059669; }
.yellow-box .price-tag { color: #b45309; }

.btn-pay {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.6rem 1.5rem;
    border-radius: 50px;
    font-weight: 800;
    font-size: 0.88rem;
    text-decoration: none;
    transition: all 0.3s;
    margin-left: 0.5rem;
}

.btn-pay:hover { transform: translateY(-2px); text-decoration: none; }

.btn-pay-green  { background: linear-gradient(135deg, #10b981, #059669); color: white; box-shadow: 0 4px 15px rgba(16,185,129,0.35); }
.btn-pay-green:hover  { box-shadow: 0 8px 25px rgba(16,185,129,0.5); color: white; }

.btn-pay-yellow { background: linear-gradient(135deg, #f5c518, #d4a800); color: #0f3460; box-shadow: 0 4px 15px rgba(245,197,24,0.35); }
.btn-pay-yellow:hover { box-shadow: 0 8px 25px rgba(245,197,24,0.5); color: #0f3460; }

.btn-back {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.6rem 1.2rem;
    border-radius: 50px;
    font-size: 0.85rem;
    font-weight: 600;
    background: transparent;
    border: 1px solid #d1d5db;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.3s;
}

.btn-back:hover { background: #f3f4f6; color: #374151; }

/* ===== TYPING CURSOR ===== */
.typing-cursor {
    display: inline-block;
    width: 2px; height: 1em;
    background: #1a56db;
    margin-right: 2px;
    vertical-align: text-bottom;
    animation: cursorBlink 0.8s infinite;
}

@keyframes cursorBlink { 0%,100%{opacity:1} 50%{opacity:0} }

/* ===== SCROLL TOP ===== */
#scrollTopBtn {
    position: fixed; bottom: 2rem; left: 2rem;
    width: 45px; height: 45px;
    background: linear-gradient(135deg, #1a56db, #0f3460);
    color: white; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    box-shadow: 0 5px 20px rgba(26,86,219,0.4);
    opacity: 0; transform: translateY(20px);
    transition: all 0.3s; z-index: 999; border: none;
}

#scrollTopBtn.visible { opacity: 1; transform: translateY(0); }