/* استایل‌های اصلی */
.art-school-container {
    max-width: 400px;
    margin: 0 auto;
    padding: 20px;
    direction: rtl;
    text-align: right;
    line-height: 1.6;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
#tracking-code-form,
#recover-tracking-form{
    max-width: 343px;
}
li{
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    font-size: 17px;
}


.art-school-tracking-container {
    max-width: 400px;
    margin: 0 auto;
    padding: 20px;
    background: #f9f9f9;
    border-radius: 15px;
    border: 2px solid black;

}
#start-registration{
    background-color: #0098FF;
    border: 1px solid white;
}
h1,h2,h3,h4,h5,p{
    cursor: pointer;
}
.art-school-title {
    color: black;
    text-align: center;
    font-weight: 700;
    margin-bottom: 30px;
    font-size: 28px;
}
#next-step{
    background-color:#0098FF ;
}
.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 10px;
    border: 2px solid black;
    border-radius: 4px;
    box-sizing: border-box;
    font-family: inherit;
}
#step-1 ,#step-2 ,#step-3{
   border-radius: 15px;
   border: 2px solid black;
   background-color: #fff;
}
label{
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}

#step-1 h2,
#step-2 h2,
#step-3 h2,
#recover-tracking-form h2,
#tracking-code-form h2{
    font-size: 22px;
    font-weight: 700;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
.tracking-code-bug-fixed{
    display: flex;
    justify-content: end;
    flex-direction: column;
    padding-top: 8px;
}
.art-school-welcome {
    background-color: #fff;
    padding: 20px;
    border-radius: 15px;
    margin-bottom: 20px;
    border: 2px solid black;
}

.art-school-documents {
    background-color: #fff;
    padding: 20px;
    border-radius: 15px;
    margin-bottom: 20px;
    border: 2px solid black;
}

.art-school-documents h3 {
    margin-top: 0;
    color: #2c3e50;
}

.art-school-documents ul {
    padding-right: 20px;
    margin-bottom: 0;
}

.art-school-buttons {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-bottom: 30px;
}

.art-school-btn {
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    transition: all 0.3s;
}

.art-school-btn-primary {
    background-color: #3498db;
    color: white;
}

.art-school-btn-primary:hover {
    background-color: #2980b9;
}

.art-school-btn-secondary {
    background-color: #95a5a6;
    color: white;
}

.art-school-btn-secondary:hover {
    background-color: #7f8c8d;
}

.art-school-form-container {
    background-color: #f8f9fa;
    padding: 20px;
    border-radius: 5px;
    margin-top: 20px;
}

/* استایل‌های فرم */
.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}


.form-group input:focus,
.form-group select:focus {
    outline: none;
    border-color: #3498db;
    box-shadow: 0 0 0 2px rgba(52, 152, 219, 0.2);
}

.form-group .hint {
    display: block;
    margin-top: 5px;
    font-size: 12px;
    color: #7f8c8d;
}

.required {
    color: #e74c3c;
}

.validation-status {
    display: block;
    margin-top: 5px;
    font-size: 13px;
}

.validation-status .valid {
    color: #27ae60;
}

.validation-status .invalid {
    color: #e74c3c;
}

input.invalid {
    border-color: #e74c3c;
}

input.valid {
    border-color: green;
}

/* استایل تاریخ تولد */
.birth-date-fields {
    display: flex;
    gap: 10px;
}

.birth-date-fields select {
    flex: 1;
}

/* استایل آپلود فایل */
.file-upload-wrapper {
    position: relative;
    margin-top: 10px;
}

.file-upload-label {
    display: block;
    padding: 15px;
    border: 2px dashed #ddd;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s;
}

.file-upload-label:hover {
    border-color: #3498db;
    background-color: #f8f9fa;
}

.file-upload-label i {
    font-size: 24px;
    color: #3498db;
    display: block;
    margin-bottom: 10px;
}

.file-name {
    display: block;
    margin-top: 5px;
    font-size: 12px;
    color: #555;
}

/* استایل پیش‌نمایش تصویر */
.file-preview {
    margin-top: 15px;
    text-align: center;
    padding: 10px;
    border: 1px solid #eee;
    border-radius: 5px;
}

.file-preview img {
    max-width: 100%;
    max-height: 200px;
    display: block;
    margin: 0 auto 10px;
}

.remove-image {
    background-color: #e74c3c;
    color: white;
    border: none;
    padding: 5px 10px;
    border-radius: 3px;
    cursor: pointer;
}

.remove-image:hover {
    background-color: #c0392b;
}

/* استایل پیام‌ها */
.form-message {
    padding: 10px 15px;
    margin-bottom: 20px;
    border-radius: 4px;
}

.form-message.error {
    background-color: #fdecea;
    color: #d32f2f;
    border: 1px solid #ef9a9a;
}

/* رسپانسیو */
@media (max-width: 600px) {
    .art-school-buttons {
        flex-direction: column;
    }
    
    .birth-date-fields {
        flex-direction: column;
    }
    
    .file-upload-label {
        padding: 10px;
    }
}

.validation-message {
    font-size: 12px;
    margin-top: 5px;
    padding: 3px;
    border-radius: 3px;
}

.validation-success {
    color: #28a745;
}

.validation-error {
    color: #dc3545;
}

.validation-warning {
    color: #ffc107;
}

/* استایل فیلدهای تاریخ تولد */
.birthdate-fields {
    display: flex;
    gap: 10px;
    align-items: center;
}

.birthdate-fields input,
.birthdate-fields select {
    flex: 1;
    min-width: 0;
}

.birthdate-fields input {
    text-align: center;
}

.birthdate-fields select {
    padding: 8px;
}



.birthdate-fields select.valid {
    border-color: #4CAF50 !important;
}

.birthdate-fields select.invalid {
    border-color: #f44336 !important;
}

.birthdate-fields {
    display: flex;
    gap: 10px;
}

.birthdate-fields select {
    flex: 1;
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
}


input.valid, textarea.valid, input[type="file"].valid { 
    border-color: green; 
}
input.invalid, textarea.invalid, input[type="file"].invalid { 
    border-color: red; 
}


/* استایل‌های وضعیت پیگیری */
.tracking-result-container {
    padding: 20px;
    border-radius: 5px;
    margin-top: 20px;
    border: 1px solid;
}
.tracking-result-detail{
   margin-top: 15px;
   display: flex;
   align-items: center;
}
strong , div{
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 17px;
}
.tracking-result-approved {
    background-color: rgb(190, 224, 190);
    border:2px solid rgb(136, 185, 130) ;
    border-radius: 5px;
    color: green;
}

.tracking-result-rejected {
    background-color: #ffebeb;
    border-color: #ffbdbd;
    color: #d32f2f;
}

.tracking-result-pending {
    background-color: #fff8e6;
    border-color: #ffe0a1;
    color: #b38a00;
}

.tracking-result-not-found {
    background-color: #ffebeb;
    border-color: #ffbdbd;
    color: #d32f2f;
}

.tracking-result-icon {
    font-size: 24px;
    margin-left: 10px;
    vertical-align: middle;
}

.tracking-result-approved .tracking-result-icon {
    color: black;
}

.tracking-result-rejected .tracking-result-icon,
.tracking-result-not-found .tracking-result-icon {
    color: #d32f2f;
}

.tracking-result-pending .tracking-result-icon {
    color: #b38a00;
}

.tracking-result-title {
    font-size: 18px;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
}

.tracking-result-details {
    margin-right: 30px;
}

.tracking-result-details p {
    margin: 8px 0;
}

.tracking-result-details strong {
    font-weight: 600;
}


/* استایل فرم بازیابی کد پیگیری */
.art-school-tracking-container {
    background: #f9f9f9;
    padding: 20px;
    border-radius: 15px;
    margin-bottom: 20px;
    border: 2px solid black;
    
}


.forgot-tracking-link {
    margin-top: 10px;
    text-align: center;
}

.forgot-tracking-link a {
    color: #0073aa;
    text-decoration: none;
}

.forgot-tracking-link a:hover {
    text-decoration: underline;
}

#recover-tracking-form .form-group {
    margin-bottom: 15px;
}

#recover-result {
    margin-top: 20px;
}

.art-school-copyright {
    margin-block: 30px ;
    padding: 15px;
    background-color: #fff;
    border-radius: 5px;
    text-align: center;
    font-size: 14px;
    color: #555;
    border-top: 1px solid #eee;
}

.art-school-copyright a {
    color: #0073aa;
    text-decoration: none;
    transition: color 0.3s;
}

.art-school-copyright a:hover {
    color: #00a0d2;
    text-decoration: underline;
}

.developer-name {
    font-weight: bold;
    margin: 0 5px;
}