@font-face {
    font-family: vazir-regular;
    src: url(../assets/fonts/Vazir-Regular-FD.ttf);
}
@font-face {
    font-family: timesnewromanpsmt;
    src: url(../assets/fonts/timesnewromanpsmt.ttf);
}
@font-face {
    font-family: Calibril;
    src: url(../assets/fonts/Calibril.ttf);
}
html, body {
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.container-box {
    width: 100%;
    height: 100%;
    margin-left: 0px;
}

.mainImageView{
    position:relative;
    overflow:hidden;
    height:100vh;
}

.mainImage {
    position: absolute;
    bottom: 0;
    right: 0;
    max-height: 100%;
    max-width: 100%;
    object-fit: cover;
}
@media (max-width: 992px) {  /* تبلت و موبایل */
    .mainImageView {
        display: none !important;   /* تصویر کاملاً پنهان شود */
        width: 0 !important;        /* عرض صفر */
        height: 0 !important;       /* ارتفاع صفر */
        margin: 0 !important;       /* هیچ فاصله‌ای ایجاد نکند */
        padding: 0 !important;      /* هیچ فضای داخلی نداشته باشد */
    }
}

    
.mainView {
    margin-bottom: 50px; /* فاصله همیشه 200px */
    margin-top: 20px;
}


.mainContainer {
    direction: rtl;
    padding-right: 30%;
    padding-left: 30%;
}


  
  
/* حالت ریسپانسیو برای موبایل و تبلت */
@media (max-width: 1300px) {
    .mainContainer {
        padding-right: 15%;
        padding-left: 15%;
        padding-top: 0vh;
        margin-bottom: 20%;
        
    }
}
.bottomBarView {
    position: fixed;
    bottom: 0;              /* همیشه به پایین بچسبد */
    left: 0;
    right: 0;
    height: 40px;           /* ارتفاع ثابت */
    background-color: #000000;
    display: flex;
    justify-content: center; /* متن در وسط */
    align-items: center;
    z-index: 1000;
}


.text-container {
    display: flex;
    justify-content: center;   /* افقی در وسط */
    align-items: center;       /* عمودی در وسط */
    height: 100vh;             /* ارتفاع کل صفحه */
    width: 100%;               /* عرض کل صفحه */
    background-color: #434546; /* اختیاری: برای تست */
}

.vertical-center {
    font-family: 'Times New Roman', Times, serif;
    font-size: 15px;
    color: white;
    text-align: center;
}



.nameLabel {
    font-family: timesnewsromanpsmt;
    text-align: left;
    margin-bottom: 32px;
    margin-left: 0px;
    color: #0d2a4a;
    
    
}
@media (max-width: 992px) {
    .nameLabel {
        font-size: 22px;
    }
}

/* ریسپانسیو برای موبایل */
@media (max-width: 576px) {
    .nameLabel {
        font-size: 22px;
    }
}


.bio {
    font-family: timesnewromanpsmt;
    text-align: justify; text-align-last: left;
    margin-left: 0px;
    margin-bottom: 32px;
    color: #0d2a4a;
    font-size: 16px;
}

@media (max-width: 1300px) {
    .mainView {
        display: flex;
        justify-content: center;   /* افقی وسط */
        align-items: center;       /* عمودی وسط */
        min-height: 20vh;         /* کل ارتفاع صفحه */
        padding: 20px;
        box-sizing: border-box;
        text-align: left;          /* متن چپ‌چین بماند */
    }

    .bio {
        font-size: 12px;
    }
}

/* موبایل */
@media (max-width: 900px) {
    .mainView {
        display: flex;
        justify-content: center;   /* افقی وسط */
        align-items: center;       /* عمودی وسط */
        min-height: 20vh;         /* کل ارتفاع صفحه */
        padding: 20px;
        box-sizing: border-box;
        text-align: left; 
    }

    .bio {
        font-size: 11px;
    }
}

.bio strong {
    font-family: timesnewromanpsmt;
    margin-left: 0px;
}

.resumeButton {
  display: block;
  margin: auto;
  font-family: timesnewromanpsmt;
  font-size: 15px;
  border: none;
  color: #0d2a4a;
  background-color: transparent;
  margin-bottom: 12px;
}



@media (max-width: 992px) {
  .resumeButton {
    font-size: 11px;
  }
}

/* برای موبایل */
@media (max-width: 576px) {
  .resumeButton {
    font-size: 11px;
  }
}

.socialButton {
    width: 20px;
    height: 20px;
}

.social-row {
    position: fixed;       
    bottom: 2px;           
    width: 100%;           
    text-align: center;    
    z-index: 1000;
}

.social-links {
  margin: 30px 0;
}

.social-links h2 {
  font-size: 1.3rem;
  margin-bottom: 15px;
}

.social-links .icons {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}

.social-links .icons a img {
  width: 35px;
  height: 35px;
  transition: transform 0.3s;
}

.social-links .icons a img:hover {
  transform: scale(1.2);
}
.social-icons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
}



