@font-face {
  font-family: "skynet";
  src: url('Assets/BMitra.eot?#') format('eot'),
       url('Assets/BMitra.woff') format('woff'),
       url('Assets/BMitra.ttf') format('truetype');
}


        body {
            font-family: 'skynet';
            background-color: #00a0e0;
            direction: rtl;
            margin-top:0px;
        }
            a {

  color: black;
}
a {
    text-decoration: none; /* حذف خط زیر لینک */
    color: inherit; /* رنگ لینک را به رنگ پیش‌فرض متن تغییر می‌دهد */
}


   @keyframes blink-animation {
            to {
                visibility: hidden;
            }
        }

.title_report
{
    color:white;
    background:rgba(0,100,30,1);
    padding:15px;
    width:700px;
    box-shadow:  0px 0px 30px 10px rgba(255, 255, 255, 1.0);
    direction: rtl;
    font-size: 24px;
    border-radius: 9px;
    animation: blink-animation 0.7s steps(5, start) 5;


}
.gallery_report
{
    color:white;
    margin:3%;
    background:rgba(0,0,150,1);
    padding:15px;
    width:450px;
    box-shadow:  0px 0px 20px 5px rgba(0, 0, 0, 0.5);
    direction: rtl;
    font-size: 21px;
    border-radius: 11px;
    animation: blink-animation 1.9s steps(5, start) infinite;

}


        .container-login {
            height: 680px;
            direction: rtl;
            background:rgba(0,0,0,0.75);
            font-size: 10px;
            width: 360px;
            margin: 5% auto;
            padding: 30px;
            box-shadow: 0px 0px 90px 50px rgba(255, 255, 255, 0.5);
            border-radius: 0px 55px 0px 55px;
            text-align: center;
            font-family:skynet;



            .table-container {
            text-align:center;
            width: 100%;
            overflow-x: auto;
            text-decoration:rtl;
            font-family:skynet;


        }

        h1 {
            color: #333;
            font-size: 24px;
            font-family:skynet;
        }
        h2 {
            color: darkorange;
            font-size: 23px;
            font-family:skynet;
        }
        h3 {
            color: darkorange;
            font-size: 17px;
            font-family:skynet;
        }
        h4 {
            color: red;
            font-size: 13px;
            font-family:skynet;

        }
        h5 {
            color: silver;
            font-size: 13px;
            font-family:skynet;

        }
        a {
            color: silver;
            font-size: 13px;
            font-family:skynet;
        }
         }

        input[type="text"], input[type="password"] , input[type="number"] , input[type="tel"] {
            width: 95%;
            height:20px;
            padding: 10px;
            margin-bottom: 10px;
            border: 0px solid #000000;
            border-radius: 10px;
            font-size: 14px;
            text-align:center;
            background:rgba(0,150,200,0.3);
            font-family:skynet;
            outline: none;
            color:white;

        }
        input:focus[type="text"], input:focus[type="password"] , input:focus[type="number"] , input:focus[type="tel"] {
            width: 95%;
            height:20px;
            padding: 10px;
            margin-bottom: 10px;
            border: 0px solid #000000;
            border-radius: 10px;
            font-size: 14px;
            text-align:center;
            background:rgba(0,200,0,0.3);
            font-family:skynet;
            outline: none;
            color:white;


        }
        button {
            margin-top: 30px;
            width: 100%;
            padding: 10px;
            font-size: 19px;
            color: #fff;
            background-color: #007bff;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            transition: background-color 0.3s;
            font-family:skynet;
        }
        button:hover {
            background-color: #0056b3;
        }
        .error-message {
            text-align:center;;
            background:rgb(90,10,0);
            color: white;
            width:90%;
            padding: 15px;
            margin-top: 20px;
            margin-bottom: 10px;
            margin-right:3px;
            border-radius: 5px;
            font-size:15px;
            font-family:skynet;

        }








        table {
            border-collapse: collapse;
            width: 1100px;
            background:#0000aa;
            top:0px;
            margin-top:0px;
            border-radius:0px 0px 25px 25px;
            font-family:skynet;
            font-size:13px;
        table, th, td {
            padding: 15px;
            text-align:right;        }
            font-family:skynet;


        th, td {



        }

}





.tdleft{

    text-align:left;
            font-family:skynet;
}

       .headeruser {
            color:white;
            direction: rtl;
            font-size: 14px;
            font-family:skynet;
        }



        .header2{
            direction: rtl;
            font-size: 19px;
            color:yellow;
            font-family:skynet;
        }

        .logout{

            direction: rtl;
            font-size: 19px;
            color:red;
            font-family:skynet;
        }

        .reporttable {
        background:red;
        width:1200px;
        padding:15px;
        margin:10px;
        border-radius:25px 25px 25px 25px;
            font-family:skynet;


th {
    background:blue;
    color: yellow; /* تغییر رنگ به آبی (می‌توانید رنگ دلخواه خود را وارد کنید) */
            font-family:skynet;
}

/* اعمال رنگ‌های یکی در میان به سطرها */
tr:nth-child(odd) {
    background-color: #f0f2f2; /* رنگ سطرهای فرد */
            font-family:skynet;
}

tr:nth-child(even) {
    background-color: #ffffff; /* رنگ سطرهای زوج */
            font-family:skynet;
}

        }
        .pagination {
        color:red;
        font-size:13px;
        padding:5px;
        margin-top:90px;
        background:rgba(250,250,250,0.9);
        width:1000px;
        border-radius:25px 25px 25px 25px ;
            font-family:skynet;
    }





    .container-main {

            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            top:0px;
	        gap: 5px;
            width: 95%;
            max-width: 1000px;
            margin: 7% auto;
            position: relative;
            padding:15px;
            border-radius:0px;
            font-family:skynet;

                    h2 {
             color: #ffee00;
            font-family:skynet;
        }
    }
 .card {
            background: #000000;
            padding: 10px;
            border-radius: 8px;
            box-shadow: 0px 0px 5px 5px rgba(255, 255, 255, 0.9);
            text-align: center;
            color: #fff;
            transition: transform 0.3s, box-shadow 0.0s;
            font-family:skynet;
        }
        .card:hover {
            transform: translateY(-10px);
            box-shadow: 0px 0px 30px 20px rgba(0,0,0, 1.0);
            font-family:skynet;

        }
        .card a {
            text-decoration: none;
            color: white;
            font-size: 14px;
            display: block;
            margin-top: 5px;
            font-weight: bold;
            font-family:skynet;
        }

        .card a:hover {
            color: yellow;
            font-family:skynet;
        }
        .card-1 {
            background-color:#1789fc;
            color: white;
            height:300px;
            padding:0px;
            font-family:skynet;
        }
        .card-2 {
            background-color:#688e26;
            color: white;
            height:300px;
            padding:0px;
            font-family:skynet;

        }
        .card-3 {
            background-color: #5a2673;
            color: white;
            height:300px;
            padding:0px;
            font-family:skynet;
        }

        .card-4 {
            padding:0px;
            background-color: #e47708;
            color: white;
            height:300px;
            padding:0px;
            font-family:skynet;
        }
        .card-5 {
            background-color: #471ca8;
            color: white;
            height:300px;
            padding:0px;
            font-family:skynet;
        }
        .card-6 {
            background-color:  #a10702;
            color: white;
            height:300px;
            padding:0px;
            font-family:skynet;
        }












.container-sabt {
            font-family:skynet;
            width: 430px;
            margin: 50px auto;
            background-color: rgba(255,255,255,1.0);
            padding: 15px;
            box-shadow: 0px 0px 70px 30px rgba(0, 0, 0, 1.0);
            border-radius: 45px 0px 0px 0px;
            text-align:center;
            margin-top:70px;
            font-family:skynet;



      h2{
            color:green;
            font-size:23px;
            font-family:skynet;

        }
        h3{
            color:green;
            font-size:19px;
            font-family:skynet;

        }
        h4{
            color:green;
            font-size:17px;
            font-family:skynet;
        }
    form {
        max-width: auto;
        margin: 0 auto;
        text-align:center;
        font-family:skynet;


    }
    label {
        display: block;
        margin-bottom: 15px;
        color:rgb(0,100,255);
        font-family:skynet;
    }
    label:hover {
        display: block;
        margin-bottom: 15px;
        color:rgb(0,0,0);
            font-family:skynet;
    }



       input[type="text"], textarea , select , input[type="number"] ,input[type="time"] , input[type="tel"] , input[type="password"] , input[type="file"] {
        width: 100%;
        height:40px;
        padding: 5px;
        border-radius: 5px 0px 5px 0px;
        background:#caf0f8;
        text-align:center;
        color:black;
        font-size:14px;
        border:0px  ;
        font-family:skynet;
        font-weight:900;
    }
       input:hover[type="text"], textarea:hover , select:hover , input:hover[type="number"] ,input:hover[type="time"] , input:hover[type="tel"], input:hover[type="password"] ,input:hover[type="file"] {
        width: 100%;
        height:40px;
        padding: 5px;
        border-radius: 10px 0px 10px 0px;
        background:#90e0ef;
        text-align:center;
        color:black;
        font-size:14px;
        border:0px  ;
        font-family:skynet;
    }
       input:focus[type="text"], textarea:focus , select:focus , input:focus[type="number"] ,input:focus[type="time"] , input:focus[type="tel"], input:focus[type="password"], input:focus[type="file"]  {
        width: 100%;
        height:40px;
        padding: 5px;
        border-radius: 10px 0px 10px 0px;
        background:#f9c74f;
        text-align:center;
        color:black;
        font-size:14px;
        border:0px  ;
        font-family:skynet;
    }
      }
       input[type="file"]  {
        width: auto;
        height:auto;
        padding: 0px;
        border-radius: 5px;
        background:#eeeeee;
        text-align:center;
        color:red;
        font-size:14px;
        border:1px solid #000000 ;
        font-family:skynet;
    }


    button {
        display: block;
        width: 100%;
        padding: 10px;
        font-size: 14px;
        color: #fff;
        background-color: rgb(0,100,255);
        border: none;
        border-radius: 5px;
        cursor: pointer;
        transition: background-color 1.5s;
        font-family:skynet;
        margin:0px 0px 10px 0px ;
    }
    button:hover {
        background-color: green;
        font-family:skynet;
    }
    }
    .welcome {
        text-align: center;
        margin-bottom: 20px;
        font-family:skynet;
    }
    .logout-button {
        background-color: #dc3545;
        font-family:skynet;
    }
    .logout-button:hover {
        background-color: #c82333;
        font-family:skynet;
    }

    .message-container {

        color: rgb(255,255,255);
        text-align: center;
        width: 90%;
        padding:  15px ;
        font-size:17px;
        background:rgb(0,100,50);
        border-radius:10px;
        font-family:skynet;


    }
    .message.success {
        color: rgb(255,255,255);
        text-align: center;
        width: 90%;
        padding:15px ;
        font-size:17px;
        background:rgb(0,100,50);
        border-radius:10px;
        font-family:skynet;

    }
    .message.error {
        background-color: #f8d7da;
        color: #721c24;
        border: 1px solid #f5c6cb;
        text-align: center;
        font-family:skynet;
    }

.ellat{
    height:70px;
    text-align:center;
    color:blue;
        font-family:skynet;
}

.textarea{
    background:rgba(0,0,0,0.1);
    height:120px;
    color:blue;
    font-size:14px;
        font-family:skynet;


}

.sabbt-label{
    text-align:center;
        font-family:skynet;




}
.sabbt-label:hover{
    text-align:center;
    color:#000fff;
        font-family:skynet;

}


    .records-tb th, .records-tb td { border: 1px solid black; padding: 5px; text-align: center; }

    .pagination .active {
        background-color: #007BFF;
        color: white;
    }
    .modal-search { display: none; position: fixed; top: 0; right: 0; left: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.7); z-index: 1000; }
    .modal-content-search { background: white;top:200px;; padding: 20px; max-width: 400px; margin: 100px auto; border-radius: 10px; position: relative; }
.records-tb {
background:#00baff;
width:93%;
margin-top:50px;
border-radius: 5px 5px 20px  40px ;
box-shadow: 0px 0px 50px 20px rgba(255, 255, 255, 0.7);
font-family:skynet;
padding:5px;
 a:hover{
     color:yellow;
}
a {
    text-decoration: none; /* حذف خط زیر لینک */
    color: inherit; /* رنگ لینک را به رنگ پیش‌فرض متن تغییر می‌دهد */
}


th{
    background-color: #003f9f;;
    color:white;
    text-align: center;
    font-family:skynet;
}
td{
     text-align: center;
        font-family:skynet;
}
tr:nth-child(odd) {
    background-color: #c0dfdf; /* رنگ سطرهای فرد */
    color:black;
    font-family:skynet;
    font-weight:0;


}

tr:nth-child(even) {
    background-color: #fdfff0; /* رنگ سطرهای زوج */
    color:black;
    font-family:skynet;
    font-weight:0;

}
        tr:hover {
            background-color:#005fbf;
            color:white;
            font-weight:600;

}
}


.scheduleclass1 {
color:black;
font-weight:bold;
        font-family:skynet;
}

.scheduleclass2 {
color:blue;
font-weight:bold;
text-align:right;
        font-family:skynet;
}

.scheduleclass3 {
color:red;
font-weight:bold;
        font-family:skynet;
}






        .container403 {
            height: 350px;
            direction: rtl;
            background: #eeeeff;
            font-size: 10px;
            width: 550px;;
            margin: 9% auto;
            padding: 10px;
            box-shadow: 0px 0px 300px 110px rgba(255, 50, 10, 1.0);
            border-radius: 25px;
            text-align: center;
            margin: 15% auto;
        font-family:skynet;




        h1 {
            color: red;
            font-size: 27px;
        font-family:skynet;
        }
        h2 {
            color: red;
            font-size: 24px;
        font-family:skynet;
        }
        h3 {
            color: blue;
            font-size: 19px;
        font-family:skynet;
        }
        h4 {
            color: blue;
            font-size: 13px;
        font-family:skynet;
        }
        h5 {
            color: red;
            font-size: 15px;
        font-family:skynet;
        }
        p {
            color: red;
            font-size: 14px;
        font-family:skynet;

        }
        }
        .spinner403 {
            margin: 20px auto;
            width: 40px;
            height: 40px;
            border: 4px solid #f3f3f3;
            border-top: 4px solid #e74c3c;
            border-radius: 70%;
            animation: spin 1s linear infinite;
        font-family:skynet;
        }

        @keyframes spin {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }

        }


      .containersuccess {
            height: 350px;
            direction: rtl;
            background: #eeeeff;
            font-size: 10px;
            width: 550px;;
            margin: 9% auto;
            padding: 10px;
            box-shadow: 0px 0px 300px 110px rgba(0, 255, 10, 1.0);
            border-radius: 25px;
            text-align: center;
            margin: 15% auto;
        font-family:skynet;




        h1 {
            color: red;
            font-size: 27px;
        font-family:skynet;
        }
        h2 {
            color: red;
            font-size: 24px;
        font-family:skynet;
        }
        h3 {
            color: blue;
            font-size: 19px;
        font-family:skynet;
        }
        h4 {
            color: blue;
            font-size: 13px;
        font-family:skynet;
        }
        h5 {
            color: red;
            font-size: 15px;
        font-family:skynet;
        }
        p {
            color: red;
            font-size: 14px;
        font-family:skynet;

        }
        }
        .spinnersuccess {
            margin: 20px auto;
            width: 40px;
            height: 40px;
            border: 4px solid #f3f3f3;
            border-top: 4px solid #e74c3c;
            border-radius: 70%;
            animation: spin 1s linear infini    .container403 {
        font-family:skynet;

    }te;
        }

        @keyframes spin {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }








.container-sabt_new {
            font-family:skynet;
            width: 90%;
            margin: 10px auto;
            padding: 5px;
            text-align:center;
            margin-top:50px;
            font-family:skynet;


        h2{
            color:black;
            font-size:23px;
            font-family:skynet;

        }
        h3{
            color:green;
            font-size:19px;
            font-family:skynet;

        }




div {
    background-color:rgb(250,250,255); /* رنگ سطرهای زوج */
    color:black;
    font-family:skynet;
    padding:5px;
    margin:5px;
    width:95%;
    border-radius:10px;
    text-align:justify;

}

        h4{
            color:green;
            font-size:17px;
            font-family:skynet;
        }
         form {
            margin-top:0px;
            background: rgba(255,255,255,0.7); /* رنگ پس‌زمینه فرم */
            padding: 50px;
            border-radius: 8px; /* گوشه‌های گرد فرم */
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* سایه اطراف فرم */
            width: 95%; /* عرض فرم */
            text-align: center; /* تراز کردن متن به وسط */
        }


        button {
            width:250px;
            padding: 10px;
            margin-top: 10px; /* فاصله بالای دکمه */
            background-color: #990000; /* رنگ پس‌زمینه دکمه */
            color: white; /* رنگ متن دکمه */
            border: none;
            border-radius: 5px; /* گوشه‌های گرد دکمه */
            cursor: pointer; /* نشان‌گر موس تغییر می‌کند */
        }
        button:hover {
            background-color: #550000; /* رنگ دکمه هنگام هاور */
        }


       input[type="text"], textarea, select , input[type="number"] ,input[type="time"] , input[type="tel"] {
        padding: 0px;
        border-radius: 0px;
        background-color: transparent;
        text-align:center;
        color:#bb0000;
        font-size:14px;
        border:0px;
        outline: none;
        font-family:skynet;
        font-weight:999;

    }
       input:hover[type="text"], textarea, select , input[type="number"] ,input[type="time"] , input[type="tel"] {
        padding: 0px;
        border-radius: 0px;
        background-color: transparent;
        text-align:center;
        color:#bb0000;
        font-size:14px;
        border:0px;
        outline: none;
        font-family:skynet;
        font-weight:999;

    }
       input:focus[type="text"], textarea, select , input[type="number"] ,input[type="time"] , input[type="tel"]  {
        padding: 0px;
        border-radius: 0px;
        background-color:transparent;
        text-align:center;
        color:#bb0000;
        font-size:14px;
        border:0px;
        outline: none;
        font-family:skynet;
        font-weight:999;


    }

    }




    .container_tb2 {
        width: 90%;
        max-width: 100%;
        margin: 20px auto;
        background-color: #fff;
        padding: 20px;
        border-radius: 8px;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        position: relative;
        z-index: 1;
    }

    .search-btn {
        margin-bottom: 20px;
        text-align: right;
        width:100px;
    }

    .search-btn button {
        padding: 10px 20px;
        font-size: 16px;
        color: #fff;
        background-color: #007bff;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        transition: background-color 0.3s;
    }

    .search-btn button:hover {
        background-color: #0056b3;
    }

    .search-modal {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.5);
        justify-content: center;
        align-items: center;
        z-index: 1000;
    }

    .search-modal-content {
        background: #fff;
        padding: 20px;
        border-radius: 8px;
        width: 100%;
        max-width: 500px;
        position: relative;
    }

    .search-modal-content input[type="text"] {
        width: 100%;
        padding: 10px;
        border: 1px solid #ddd;
        border-radius: 4px;
        box-sizing: border-box;
        font-size: 16px;
        margin-right: 10px;
    }

    .search-modal-content button {
        padding: 10px 20px;
        font-size: 16px;
        color: #fff;
        background-color: #007bff;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        transition: background-color 0.3s;
    }

    .search-modal-content button:hover {
        background-color: #0056b3;
    }

    .search-modal-close {
        position: absolute;
        top: 10px;
        right: 10px;
        font-size: 24px;
        cursor: pointer;
        color: #007bff;
    }

    .search-modal-close:hover {
        color: #0056b3;
    }

    .reset-button {
        padding: 10px 20px;
        font-size: 16px;
        color: #fff;
        background-color: #dc3545;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        transition: background-color 0.3s;
        margin-left: 10px;
    }

    .reset-button:hover {
        background-color: #c82333;
    }


    .update-form {
        display: flex;
        align-items: center;
    }

    .update-form select {
        width: auto;
        padding: 8px;
        border: 1px solid #ddd;
        border-radius: 4px;
        margin-right: 10px;
    }

    .update-form button {
        padding: 8px 12px;
        font-size: 16px;
        color: #fff;
        background-color: #007bff;
        border: none;
        border-radius: 5px;
        cursor: pointer;
        transition: background-color 0.3s;
        margin-right: 5px;
    }

    .update-form button:hover {
        background-color: #0056b3;
    }

    .edit-button {
        background-color: #28a745;
        border: none;
        padding: 8px 12px;
        color: white;
        border-radius: 5px;
        cursor: pointer;
        transition: background-color 0.3s;
    }

    .edit-button:hover {
        background-color: #218838;
    }

    .hidden {
        display: none;
    }

    .pagination {
        margin-top: 20px;
        text-align: center;
    }

    .pagination a {
        padding: 8px 16px;
        margin: 0 4px;
        text-decoration: none;
        border: 1px solid #ddd;
        border-radius: 4px;
        color: #007bff;
        font-size: 16px;
    }

    .pagination a.active {
        background-color: #007bff;
        color: white;
        border: 1px solid #007bff;
    }

    .pagination a:hover {
        background-color: #0056b3;
        color: white;
    }


    .suggestion-list {
    list-style-type: none;
    margin: 0px;
    padding: 5px;
    border: 1px solid #ddd;
    max-height: 350px;
    overflow-y: auto;
    position: absolute;
    z-index: 100;
    background:#f9c74f;
    width:420px;
    color:black;
    font-size:13px;
    font-weight:900;
    border-radius:11px;
}

.suggestion-list li {
    cursor: pointer;
    padding:5px 0px 5px 0px;

}

.suggestion-list li:hover {
    color:black;
    border-radius:0px;
    padding:5px 0px 5px 0px;
    background-color: #fee;
    border-radius:5px;



}




.popup {
            display: none; /* پنهان کردن پاپ‌آپ به صورت پیش‌فرض */
            position: fixed;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            width: 650px;
            height:auto;
            padding: 25px;
            background-color: #003399;
            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
            z-index: 1000;
            color:white;
            border: 2px solid #fff ;
            border-radius:15px;
            text-align:justify;
        }

        .popup.open {
            display: block; /* نمایش پاپ‌آپ زمانی که کلاس open اضافه می‌شود */
        }

        .close-btn {
            position: absolute;
            right: 45%;
            cursor: pointer;
            font-weight:900;
            font-size:21px;
            color:yellow;


        }

        /* استایل برای پس‌زمینه تاریک */
        .overlay {
            display: none; /* پنهان کردن پس‌زمینه به صورت پیش‌فرض */
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 81, 0.9);
            z-index: 900;
        }

        .overlay.open {
            display: block; /* نمایش پس‌زمینه زمانی که کلاس open اضافه می‌شود */
        }
.h2popup  {

    color:white;
    font-weight:900;
    font-size:19px;


}
.p_popup {
    color:white;
    font-weight:100;
    font-size:15px;

}



.hamkaran {
    margin: 50px auto;
    background-color: rgba(255, 255, 255, 1.0);
    padding: 15px;
    box-shadow: 0px 0px 70px 30px rgba(0, 0, 0, 1.0);
    border-radius: 45px 0px 0px 0px;
    text-align: center;
    margin-top: 70px;
    width:1150px;


       input[type="text"], textarea , select , input[type="number"] ,input[type="time"] , input[type="tel"] , input[type="password"] , input[type="file"] {
        width: 100%;
        height:40px;
        padding: 5px;
        border-radius: 5px 0px 5px 0px;
        background:#caf0f8;
        text-align:center;
        color:black;
        font-size:14px;
        border:0px  ;
        font-family:skynet;
        font-weight:900;
    }
       input:hover[type="text"], textarea:hover , select:hover , input:hover[type="number"] ,input:hover[type="time"] , input:hover[type="tel"], input:hover[type="password"] ,input:hover[type="file"] {
        width: 100%;
        height:40px;
        padding: 5px;
        border-radius: 10px 0px 10px 0px;
        background:#90e0ef;
        text-align:center;
        color:black;
        font-size:14px;
        border:0px  ;
        font-family:skynet;
    }
       input:focus[type="text"], textarea:focus , select:focus , input:focus[type="number"] ,input:focus[type="time"] , input:focus[type="tel"], input:focus[type="password"], input:focus[type="file"]  {
        width: 100%;
        height:40px;
        padding: 5px;
        border-radius: 10px 0px 10px 0px;
        background:#f9c74f;
        text-align:center;
        color:black;
        font-size:14px;
        border:0px  ;
        font-family:skynet;
    }

button {
    width: 100%;
    padding: 10px;
    font-size: 14px;
    color: #fff;
    background-color: rgb(0, 100, 255);
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s;
}

button:hover {
    background-color: green;
}

/* استایل برای نمایش فیلدها در کنار هم */
.input-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

.input-row label {
    width: 31%; /* هر فیلد 48% از عرض را اشغال می‌کند */
}
}
   ::placeholder {
        color:rgba(155,0,0,0.7);
        font-size:13px;
}


.popup_kala {
            display: none; /* پنهان کردن پاپ‌آپ به صورت پیش‌فرض */
            position: fixed;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            width: 950px;
            height:auto;
            padding: 25px;
            background-color: #aa4400;
            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
            z-index: 1000;
            color:white;
            border: 2px solid #fff ;
            border-radius:15px;
            text-align:justify;
        }

    .gallery {
            margin:3%;
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
        }
        .gallery a {
            margin: 15px;
            cursor: pointer;
        }
        .gallery img {
            margin-top:0px;
            width: 160px;
            height: auto;
            border-radius: 11px ;
            transition: transform 0.3s;
            box-shadow: 1px 1px 10px 5px  rgba(250, 130, 0, 1);
        }
        .gallery img:hover {
            transform: scale(2);
        }
        .modal {
            display: none;
            position: fixed;
            z-index: 999;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            overflow: auto;
            background-color: rgba(0,0,0,0.81);

        }
        .modal-content {
            margin: 5% auto;
            display: block;
            max-width: 90%;
            max-height: 80%;
            border-radius:15px;
            box-shadow: 0px 0px 65px 35px  rgba(240, 130, 0, 1);

        }
        .close, .prev, .next {
            position: absolute;
            top: 50%;
            color: white;
            font-size: 35px;
            font-weight: bold;
            cursor: pointer;
            transform: translateY(-50%);
            user-select: none;
        }
        .close {
            right: 35px;
            top: 40px;
        }
        .prev {
            right: 5%;
        }
        .next {
            left: 5%;
        }
        .pagination {
            text-align: center;
            margin-top: 20px;
        }