/* تنظیمات اولیه برای حذف حاشیه اضافی */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box; /* باعث میشه padding و border در محاسبه عرض و ارتفاع لحاظ بشن */
}

/* تنظیمات کلی برای صفحه */
html, body {
    width: 100%;
    height: 100%;
    overflow: hidden; /* جلوگیری از اسکرول صفحه */
}

body {
    direction: rtl; /* راست به چپ */
    background: #205791; /* رنگ پس‌زمینه اگر عکس لود نشد یا کامل فضا رو نگرفت */
}

/* کانتینر عکس */
.message {
    position: fixed; /* ثابت در صفحه */
    top: 0;
    left: 0;
    width: 100vw; /* عرض 100 درصد viewport (فضای قابل مشاهده صفحه) */
    height: 100vh; /* ارتفاع 100 درصد viewport */
    overflow: hidden; /* اگر عکس بزرگتر از این بود، اضافه آن بریده شود */
    z-index: -1; /* عکس در پس‌زمینه قرار می‌گیرد */
}

/* خود عکس */
.message img {
    display: block; /* حذف فضای خالی زیر عکس */
    width: 100%; /* عکس عرض کانتینر را پر کند */
    height: 100%; /* عکس ارتفاع کانتینر را پر کند */
    object-fit: cover; /* عکس را طوری تنظیم می‌کند که کل فضا را بپوشاند، کیفیت حفظ شود، ممکن است کمی از عکس بریده شود */
    object-position: center; /* مرکز عکس نمایش داده شود */