*{
    box-sizing:border-box;
}

body{
    margin:0;
    font-family:'Vazirmatn', sans-serif;
    background:#f3f3f3;
}

.app{
    max-width:420px;
    margin:0 auto;
    padding-bottom:95px;
}

a{
    text-decoration:none;
    color:inherit;
}

/* ===== هدر ===== */
.topbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:18px 18px 10px 18px;
    font-weight:700;
    font-size:16px;
}

/* ===== باکس قیمت ===== */
.live-price{
    background:#e9e2d8;
    margin:0 15px 18px 15px;
    padding:16px;
    border-radius:18px;
    font-size:14px;
}

.live-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:8px;
}

.live-row:last-child{
    margin-bottom:0;
}

.price-value{
    display:flex;
    align-items:center;
    gap:6px;
    font-weight:700;
}

.up{color:#1fae4b;}
.down{color:#e53935;}

/* ===== کارت اصلی ===== */
.main-card{
    background:white;
    margin:0 15px 18px 15px;
    padding:22px;
    border-radius:24px;
    box-shadow:0 4px 12px rgba(0,0,0,0.05);
}

.gold-amount{
    font-size:26px;
    font-weight:700;
}

.wallet-row{
    display:flex;
    justify-content:space-between;
    font-size:14px;
    margin:12px 0;
}

hr{
    border:none;
    border-top:1px dashed #ddd;
    margin:18px 0;
}

/* ===== دکمه‌ها ===== */
.action-buttons{
    display:flex;
    gap:10px;
    margin-top:15px;
}

.btn{
    flex:1;
    padding:14px;
    border-radius:16px;
    text-align:center;
    font-size:15px;
    font-weight:500;
    background:#5f8f7b;
    color:white;
    transition:0.2s ease;
}

.btn:hover{
    background:#4a7664;
}

.btn.silver{
    background:#888;
}

.btn.silver:hover{
    background:#6f6f6f;
}

/* ===== منوی خدمات ===== */
.menu-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
    padding:0 15px 20px 15px;
}

.menu-item{
    background:white;
    padding:18px 10px;
    border-radius:20px;
    text-align:center;
    position:relative;
    transition:0.2s ease;
    box-shadow:0 3px 10px rgba(0,0,0,0.04);
}

.menu-item:hover{
    transform:translateY(-3px);
}

.icon-box{
    font-size:24px;
    margin-bottom:8px;
}

.menu-item p{
    font-size:13px;
    margin:0;
}

.badge{
    position:absolute;
    top:8px;
    right:8px;
    background:#ff6b6b;
    color:white;
    font-size:10px;
    padding:3px 6px;
    border-radius:10px;
}

.badge.red{
    background:#ff3b3b;
}

/* ===== بنر ===== */
.banner{
    background:linear-gradient(45deg,#1e7d57,#0f5c40);
    color:white;
    margin:0 15px 25px 15px;
    padding:22px;
    border-radius:22px;
    text-align:center;
    font-size:14px;
}

.banner-btn{
    display:inline-block;
    background:white;
    color:#0f5c40;
    padding:8px 18px;
    border-radius:20px;
    margin-top:12px;
    font-size:14px;
    font-weight:600;
}

/* ===== منوی پایین ===== */
.bottom-nav{
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    margin:auto;
    width:100%;
    max-width:420px;
    background:white;
    display:flex;
    justify-content:space-around;
    padding:14px 0;
    border-top:1px solid #eee;
    box-shadow:0 -3px 10px rgba(0,0,0,0.04);
}

.bottom-nav a{
    font-size:13px;
    color:#666;
}

.bottom-nav .active{
    color:#1e7d57;
    font-weight:700;
}

.actions{display:flex}
.btn{width:100%}

/* ====== APP FIX: جلوگیری از اسکرول پرت/بونس iOS ====== */
:root{
--topbar-h: 64px; /* ارتفاع تقریبی هدر */
--bottomnav-h: 56px; /* ارتفاع منوی پایین */
}

/* کل صفحه قفل: اسکرول فقط داخل ویوها */
html, body{
height: 100%;
overflow: hidden;
overscroll-behavior: none;
}

body{
position: fixed; /* مهم‌ترین بخش برای iOS */
inset: 0;
width: 100%;
}

/* کانتینر اصلی دیگه padding-bottom نمی‌خواد چون خود ویوها ارتفاع دقیق دارن */
.app{
max-width: 420px;
margin: 0 auto;
height: 100dvh; /* iOS جدید */
height: 100vh; /* fallback */
padding-bottom: 0 !important;
}

/* HomeView فقط خودش اسکرول بخوره */
#homeView{
height: calc(100dvh - var(--topbar-h) - var(--bottomnav-h) - env(safe-area-inset-bottom, 0px));
overflow-y: auto;
overflow-x: hidden;
-webkit-overflow-scrolling: touch;
overscroll-behavior: contain;
padding-bottom: 16px; /* یه فاصله کوچیک برای انتهای لیست */
}

/* FrameView هم همین */
#frameWrap{
height: calc(100dvh - var(--topbar-h) - var(--bottomnav-h) - env(safe-area-inset-bottom, 0px));
overflow: hidden;
}

/* منوی پایین روی safe-area آیفون خوب بشینه */
.bottom-nav{
padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
}

/* مخفی کردن اسکرول‌بار (اختیاری) */
#homeView::-webkit-scrollbar{ width: 0; height: 0; }



/* ===== V2 additions ===== */
.auth-links{display:flex;gap:8px;align-items:center;justify-content:flex-end}
.small-chip{background:#fff;padding:7px 10px;border-radius:999px;font-size:12px;font-weight:800;box-shadow:0 1px 0 rgba(0,0,0,.05)}
.page-wrap{max-width:420px;margin:0 auto;padding:16px 15px 95px}
.panel-card,.form-card,.table-card,.notice{background:#fff;border-radius:22px;padding:16px;box-shadow:0 1px 0 rgba(0,0,0,.04);margin-bottom:14px}
.panel-title{font-size:18px;font-weight:900;margin:0 0 12px}
.muted{color:#777;font-size:12px}
.kpi-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kpi{background:#f8f8f8;border-radius:16px;padding:12px}
.kpi .label{font-size:12px;color:#777}
.kpi .value{font-size:18px;font-weight:900;margin-top:6px}
.form-card label{display:block;font-size:13px;font-weight:800;margin-bottom:6px}
.form-card input,.form-card select,.form-card textarea{width:100%;padding:12px;border:1px solid #e7e7e7;border-radius:14px;font-family:'Vazirmatn',sans-serif;margin-bottom:12px;background:#fff}
.form-card textarea{min-height:90px;resize:vertical}
.btn2{display:inline-block;border:none;cursor:pointer;padding:12px 16px;border-radius:14px;font-family:'Vazirmatn',sans-serif;font-weight:900}
.btn2.green{background:#5f8f7b;color:#fff}
.btn2.gray{background:#888;color:#fff}
.btn2.red{background:#d9534f;color:#fff}
.btn2.white{background:#fff;color:#333;border:1px solid #e8e8e8}
.btn-row{display:flex;gap:10px;flex-wrap:wrap}
.notice.success{background:#edf8f2;color:#165b3d}
.notice.error{background:#fff0f0;color:#a33}
.table-card table{width:100%;border-collapse:collapse;font-size:12px}
.table-card th,.table-card td{padding:10px 6px;border-bottom:1px solid #f0f0f0;text-align:right;vertical-align:top}
.status{display:inline-block;padding:4px 8px;border-radius:999px;font-size:11px;font-weight:900}
.status.pending{background:#fff6d8;color:#8a6a00}
.status.approved{background:#e8f7ed;color:#1b6e44}
.status.rejected{background:#fdeaea;color:#a53333}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.tabs a{background:#fff;padding:8px 12px;border-radius:999px;font-size:12px;font-weight:800;border:1px solid #ebebeb}
.tabs a.active{background:#1e7d57;color:#fff;border-color:#1e7d57}
.inline-stats{display:flex;justify-content:space-between;gap:10px;margin-top:10px;font-size:13px}
.inline-stats strong{display:block;font-size:15px}
.help{font-size:11px;color:#888;margin-top:-6px;margin-bottom:12px}