@font-face{
            font-family: 'B Yekan';
            src: url('BYEKAN.TTF') format('truetype');
        }
        html{
            scroll-behavior: smooth;
        }
        body {
            font-family: Arial, sans-serif;
            direction: rtl;
            background: linear-gradient(135deg , #e4e4ff , #d4d4ff);
            margin: 0;
            padding: 0;
            font-family: Arial, Helvetica, sans-serif;
        }
        #link{
            color: #000000;
            text-decoration: none;
        }
        #link:hover{
            animation: change-font-color 5s infinite;
        }
        .box {
            background-color: #ffa4a4;
            border: 1px solid #ccc;
            border-radius: 10px;
            padding: 20px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            text-align: center;
            animation: change_color 5s infinite;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            transform: translateZ(0);
            font-family: 'B Yekan', Arial, sans-serif;
        }
        
        .box:hover {
            transform: translateY(-10px) scale(1.03);
            box-shadow: 0 15px 20px rgba(0, 0, 0, 0.2);
        }
        .box h2 {
            margin: 0;
        }
        .box p {
            margin: 5px 0;
        }
        .box .button {
            display: inline-block;
            margin-top: 10px;
            padding: 10px 20px;
            font-size: 16px;
            color: white;
            background: linear-gradient(to right, #007bff, #a3cfff);
            border: none;
            border-radius: 5px;
            text-decoration: none;
            cursor: pointer;
            transition: all 0.3s ease;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            font-family: 'B Yekan', Arial, sans-serif;
        }
        
        .box .button:hover {
            background: linear-gradient(to right, #0080ff, #007bff);
            transform: translateY(-3px);
            box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);
        }
        
        .box .button:active {
            transform: translateY(0);
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        
        }
        header {
            background-color: #a0cdfe;
            color: rgb(0, 30, 255);
            padding: 10px 20px;
            text-align: right;
        }
        header p {
            margin: 0;
            font-size: 30px;
        }
        .divider {
            width: 100%;
            height: 7px;
            background: linear-gradient(to right, #4502ff, #ff0000);
            margin: 10px 0;
        }
        .menu{
          background-color: rgb(255, 255, 124);
          font-family: 'B Yekan';
          font-size: 1.6vw;
          font-weight: bold;
          display: flex;
        }
        .menu ul li a{
          text-decoration: none;
          color: black;
        }
        .menu .bama{
          margin-right: 7vw;
        }
        .menu ul{
          list-style: none;
          padding: 1vw;
          display: flex;
          height: 5vh;
        }
        .menu ul li{
          margin-left: 4vw;
          display: flex;
          align-items: center;
        }
        .menu ul li a:hover{
         color: blue;
        }
        .container {
            display: flex;
            flex-direction: column;
            gap: 20px;
            max-width: 1200px;
            margin: 20px auto;
            padding: 0 10px;
        }
        .box {
            background-color: #ffa4a4;
            border: 1px solid #ccc;
            border-radius: 10px;
            padding: 20px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            text-align: center;
            animation: change_color 5s infinite;
        }
        .box h2 {
            font-size: 18px;
            margin-bottom: 10px;
        }
        .animation-container {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 150px;
            margin: 20px 0;
            position: relative;
            overflow: hidden;
        }
        .animation-box {
            color: #007bff;
            width: 240px;
            height: 140px;
            background-color: #ffc6c6;
            border: 3px solid #000000;
            border-radius: 10px;
            position: relative;
            animation-name: move_right_left;
            animation-duration: 8s;
            animation-timing-function: ease-in-out;
            animation-iteration-count: infinite;
            left: -40%;
            text-align: center;
        }
        #disabled{
            display: inline-block;
            margin-top: 10px;
            padding: 10px 20px;
            font-size: 16px;
            color: white;
            border: none;
            border-radius: 5px;
            text-decoration: none;
            cursor: pointer;
            transition: all 0.3s ease;
            background-color: #6f00ff;
            color: #000000;
            font-family: 'B Yekan', Arial, sans-serif;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            }
        .change-font-color{
            animation: change-font-color 5s infinite;
            text-shadow: #000000 0 0 10px;
        }
        @keyframes move_right_left {
            0% {
                left: -40%;
            }
            50% {
                left: 40%;
            }
            100% {
                left: -40%;
            }
        }
        @keyframes change-font-color {
            0% {
                color: #fff700;
            }
            20% {
                color: #ff0000;
            }
            40% {
                color: #9000ff;
            }
            60% {
                color: #0d00ff;
            }
            80% {
                color: #00ff66;
            }
            100% {
                color: #fff700;
            }
        }
        @keyframes change_color {
            0% {
                background-color: #fff700;
            }
            20% {
                background-color: #ff0000;
            }
            40% {
                background-color: #9000ff;
            }
            60% {
                background-color: #0d00ff;
            }
            80% {
                background-color: #00ff66;
            }
            100% {
                background-color: #fff700;
            }
            }
            @keyframes shake {
                0% { transform: translate(1px, 1px) rotate(0deg); }
                10% { transform: translate(-1px, -2px) rotate(-1deg); }
                20% { transform: translate(-3px, 0px) rotate(1deg); }
                30% { transform: translate(3px, 2px) rotate(0deg); }
                40% { transform: translate(1px, -1px) rotate(1deg); }
                50% { transform: translate(-1px, 2px) rotate(-1deg); }
                60% { transform: translate(-3px, 1px) rotate(0deg); }
                70% { transform: translate(3px, 1px) rotate(-1deg); }
                80% { transform: translate(-1px, -1px) rotate(1deg); }
                90% { transform: translate(1px, 2px) rotate(0deg); }
                100% { transform: translate(1px, -2px) rotate(-1deg); }
            }
            @keyframes pulse {
                0% {
                    transform: scale(1);
                }
                50% {
                    transform: scale(1.05);
                }
                100% {
                    transform: scale(1);
                }
            }
            #bale img, #gmail img, #eitaa img, #SMS img {
                transition: transform 0.3s ease, box-shadow 0.3s ease;
                transform: translateZ(0);
                border-radius: 155px;
                width: 20vw;
                height: 20vw;
                margin-left: 1vw;
            }
            
        .blog {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 20px;
        }
        @media (max-width: 1251px) {
                .blog-box {
            width: 98%;
            background: #fc6d6d43;
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
            transition: 0.3s;
            font-family: 'B Yekan';
        }
        }
        @media (min-width: 1252px) {
            .blog-box {
            width: 46.5%;
            background: #fc6d6d43;
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
            transition: 0.3s;
            font-family: 'B Yekan';
        }
        }

        .blog-box:hover {
            transform: translateY(-8px);
        }
        .blog h2 {
            color: purple;
            text-align: center;
        }
        .blog p {
            text-align: center;
            line-height: 1.8;
            font-family: 'B Yekan';
            font-size: 20px;
            color: rgb(51, 85, 255);
        }
            ::selection{
              color: rgb(0, 0, 0);
              background-color: rgba(255, 204, 0, 0.544);
            }
            #aparat img{
                margin-right: 11vw;
                transition: transform 0.3s ease, box-shadow 0.3s ease;
                transform: translateZ(0);
                border-radius: 155px;
                width: 20vw;
                height: 20vw;
                margin-left: 1vw;
            }
            #aparat img:hover, #bale img:hover, #gmail img:hover, #eitaa img:hover, #SMS img:hover {
                transform: translateY(-10px);
                box-shadow: 0 10px 15px rgba(0, 0, 0, 0.2);
                animation: shake 0.5s infinite;
                border-radius: 155px;
            }
        #bama{
            margin-left: 30px;
        }
        .android-link img {
            width: 100px;
            height: 100px;
            position: relative;
            right: 100px;
            top: 90px;
          }
          .android-info{
            text-align: center;
            position: relative;
            top: -100px;
            color: #0056b3;
          }
          .click-konid{
            position: relative;
            top: -40px;
            text-align: center;
            color: #ff0000;
          }
          #fallow{
            color: #ff0000;
            text-align: center;
            font-family: 'B Yekan','Courier New', Courier, monospace;
          }
          .trust{
            transition: transform 0.3s ease;
          }
          .trust:hover{
            transform:  scale(1.05);
          }
        /* ---------------------------------------------------------------------------------*/
/* استایل بخش نظرات - بهینه شده */
.comments-section {
max-width: 800px;
margin: 30px auto;
padding: 20px;
background-color: #4afac2;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
direction: rtl;
text-align: right;
}

.comments-title {
color: #4502ff;
text-align: center;
font-family: 'B Yekan','Courier New', Courier, monospace;
margin-bottom: 20px;
}

.comment-form {
margin-bottom: 30px;
text-align: right;
}

.form-group {
margin-bottom: 15px;
text-align: right;
}

.form-group label {
display: block;
margin-bottom: 5px;
font-weight: bold;
color: #4502ff;
font-family: 'B Yekan', Arial, sans-serif;
text-align: right;
}

.form-control {
width: 95%;
padding: 8px;
border: 1px solid #a0cdfe;
border-radius: 5px;
font-family: 'B Yekan', Arial, sans-serif;
background-color: #fff;
max-width: 95%;
box-sizing: border-box;
direction: rtl;
text-align: right;
}

textarea.form-control {
resize: vertical;
max-height: 150px;
min-height: 80px;
direction: rtl;
text-align: right;
}

.comment {
background-color: #ffeaea;
border-right: 4px solid #ff0000;
padding: 15px;
margin-bottom: 15px;
border-radius: 5px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
animation: fadeIn 0.5s ease-in-out;
font-family: 'B Yekan', Arial, sans-serif;
direction: rtl;
text-align: right;
}

.comment-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 10px;
direction: rtl;
}

.comment-author {
font-weight: bold;
color: #ff0000;
font-family: 'B Yekan', Arial, sans-serif;
order: 1;
}

.comment-date {
color: #555;
font-size: 14px;
font-family: 'B Yekan', Arial, sans-serif;
order: 3;
}

.comment-body {
color: #333;
line-height: 1.6;
font-family: 'B Yekan', Arial, sans-serif;
text-align: right;
direction: rtl;
}

.delete-button, .reply-button, .delete-reply-button {
order: 2;
margin: 0 5px;
background-color: #f44336;
color: white;
border: none;
padding: 5px 10px;
border-radius: 4px;
cursor: pointer;
font-family: 'B Yekan', Arial, sans-serif;
}

.reply-button {
background-color: #4CAF50;
}

.replies-container {
margin-top: 10px;
margin-right: 20px;
border-right: 3px solid #4CAF50;
padding-right: 10px;
direction: rtl;
}

.reply {
background-color: #e8f5e9;
padding: 10px;
margin-bottom: 8px;
border-radius: 5px;
direction: rtl;
text-align: right;
}

.reply-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 5px;
direction: rtl;
}

.admin-name {
color: #4CAF50;
font-family: 'B Yekan', Arial, sans-serif;
order: 1;
}

.reply-date {
color: #666;
font-size: 12px;
font-family: 'B Yekan', Arial, sans-serif;
order: 3;
}

.reply-text {
margin: 5px 0 0 0;
font-family: 'B Yekan', Arial, sans-serif;
text-align: right;
direction: rtl;
}

.reply-form-container {
margin-top: 10px;
padding: 10px;
background-color: #f9f9f9;
border-radius: 5px;
border: 1px solid #ddd;
direction: rtl;
text-align: right;
}

.reply-textarea {
width: 100%;
resize: vertical;
font-family: 'B Yekan', Arial, sans-serif;
direction: rtl;
text-align: right;
}

/* استایل‌های پنل مدیریت */
.admin-panel {
background-color: #bdf7ff;
padding: 15px;
margin: 20px 0;
border-radius: 8px;
border: 1px solid #ddd;
direction: rtl;
text-align: right;
}
.submit-btn {
background: linear-gradient(to right, #4502ff, #ff0000);
color: white;
border: none;
padding: 10px 20px;
border-radius: 5px;
cursor: pointer;
font-family: 'B Yekan', Arial, sans-serif;
font-size: 16px;
transition: all 0.3s ease;
display: block;
margin: 0 auto;
width: 50%;
}

.submit-btn:hover {
transform: translateY(-3px);
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.form-control:focus {
border-color: #4502ff;
outline: none;
box-shadow: 0 0 5px rgba(69, 2, 255, 0.3);
}

.comments-container {
margin-top: 30px;
}

.comment:hover {
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

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

.admin-mode .delete-button {
display: inline-block; /* نمایش دکمه‌های حذف در حالت مدیر */
}

.nazar-status {
font-weight: bold;
color: #4c00ff;
font-family: 'B Yekan', Arial, sans-serif;
text-align: center;
}

.a{
font-family: 'B Yekan', Arial, sans-serif;
color: #3700ff;
text-align: center;
}

.delete-btn.visible {
display: inline-block;
}

.delete-btn:hover {
background-color: #cc0000;
}

.comment-actions {
display: flex;
justify-content: flex-end;
margin-top: 10px;
}

.admin-panel button {
background-color: #4502ff;
color: white;
border: none;
border-radius: 3px;
padding: 5px 10px;
cursor: pointer;
font-family: 'B Yekan', Arial, sans-serif;
}

.admin-login button {
background-color: #007bff;
color: white;
border: none;
padding: 8px 15px;
border-radius: 4px;
cursor: pointer;
}

.reply-buttons-container {
display: flex;
justify-content: space-between;
margin-top: 10px;
}

.reply-submit-btn {
width: auto;
padding: 5px 15px;
background: linear-gradient(to right, #4CAF50, #45a049);
}

.cancel-btn {
background-color: #f44336;
color: white;
border: none;
padding: 5px 15px;
border-radius: 5px;
cursor: pointer;
font-family: 'B Yekan', Arial, sans-serif;
}

.cancel-btn:hover {
background-color: #d32f2f;
}

.delete-button:hover, .reply-button:hover, .delete-reply-button:hover {
background-color: #d32f2f;
}

.reply-button:hover {
background-color: #45a049;
}

/* واکنش‌گرایی */
@media (max-width: 768px) {
.comments-section {
padding: 15px;
margin: 20px 10px;
}

.submit-btn {
width: 80%;
}

.form-control {
width: 100%;
max-width: 100%;
}
}


.admin-login {
display: flex;
gap: 10px;
margin-bottom: 10px;
direction: rtl;
}

.admin-login input {
flex: 1;
padding: 8px;
border: 1px solid #ddd;
border-radius: 4px;
color: rgb(25, 0, 255);
font-family: 'B Yekan';
direction: rtl;
text-align: right;
}

#admin-status {
margin-top: 10px;
font-weight: bold;
font-family: 'B Yekan', Arial, sans-serif;
color: #ff0000;
text-align: center;
}