@font-face {
    font-family: "vazir";
    src: url("/fonts/Vazir.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

.vazir {
    font-family: "vazir", sans-serif;
}

@font-face {
    font-family: "amiri";
    src: url("/fonts/amiri-regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}
 .amiri {
    font-family: "amiri", sans-serif;
}

@font-face {
    font-family: "Nazanin";
    src: url("/fonts/Nazanin.TTF") format("truetype");
    font-weight: normal;
    font-style: normal;
}
 .Nazanin{
    font-family: "Nazanin", sans-serif;
}





@font-face {
    font-family: "sh";
    src: url("/fonts/Shabnam-Medium.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}
 .shadow {
    font-family: "sh", sans-serif;
}




@font-face {
    font-family: "yekan";
    src: url("/fonts/amiri.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

.yekan {
    font-family: "yekan", sans-serif;
}

/* ===== انیمیشن چرخش آیکون ===== */
#theme-icon {
    transition: transform 0.6s ease-in-out;
    display: inline-block;
}
#theme-icon.rotated {
    transform: rotate(360deg);
}

/* ===== انیمیشن تغییر رنگ ===== */
* {
    transition:
        background-color 0.4s ease,
        color 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}

/* ========================================================= */
/* ===== دارک مود ===== */
/* ========================================================= */
html.dark body {
    background-color: #1a202c;
    color: #e2e8f0;
}
html.dark .bg-white {
    background-color: #1a202c !important;
}
html.dark .bg-gray-100 {
    background-color: #2d3748 !important;
}
html.dark .bg-gray-50 {
    background-color: #2d3748 !important;
}
html.dark .bg-blue-50 {
    background-color: #2a4365 !important;
}
html.dark .text-gray-700 {
    color: #cbd5e0 !important;
}
html.dark .text-gray-800 {
    color: #edf2f7 !important;
}
html.dark .text-gray-600 {
    color: #a0aec0 !important;
}
html.dark .border-gray-200 {
    border-color: #4a5568 !important;
}
html.dark .border-gray-300 {
    border-color: #4a5568 !important;
}
html.dark .border-gray-100 {
    border-color: #4a5568 !important;
}
html.dark .bg-blue-700 {
    background-color: #2b6cb0 !important;
}
html.dark .hover\:bg-blue-800:hover {
    background-color: #2c5282 !important;
}
html.dark .border-blue-700 {
    border-color: #63b3ed !important;
}
html.dark .text-blue-700 {
    color: #63b3ed !important;
}
html.dark .hover\:text-blue-700:hover {
    color: #63b3ed !important;
}
html.dark .hover\:bg-blue-700:hover {
    background-color: #2b6cb0 !important;
}
html.dark .shadow-sm {
    box-shadow: 0 1px 2px 0 rgba(255, 255, 255, 0.05) !important;
}
html.dark .shadow-md {
    box-shadow: 0 4px 6px -1px rgba(255, 255, 255, 0.1) !important;
}
html.dark .shadow-lg {
    box-shadow: 0 10px 15px -3px rgba(255, 255, 255, 0.1) !important;
}

/* ===== Select در دارک مود ===== */
html.dark #language-dropdown {
    background-color: #2d3748 !important;
    border-color: #4a5568 !important;
    color: #e2e8f0 !important;
}
html.dark #language-dropdown option {
    background-color: #2d3748 !important;
    color: #e2e8f0 !important;
}
html.dark #language-dropdown:hover {
    border-color: #63b3ed !important;
}

/* ===== دکمه theme-toggle در دارک مود ===== */
html.dark #theme-toggle {
    background-color: #2d3748 !important;
    border-color: #4a5568 !important;
}
html.dark #theme-toggle:hover {
    background-color: #4a5568 !important;
}
html.dark #theme-icon {
    color: #e2e8f0 !important;
}

/* ===== استایل dropdown (فلش سفارشی) ===== */
#language-dropdown {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%234a5568' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: left 10px center;
    padding-right: 28px;
    padding-left: 10px;
    cursor: pointer;
}
html.dark #language-dropdown {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23cbd5e0' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
}
#language-dropdown:focus {
    outline: none;
    border-color: #3b82f6;
    ring: 2px solid #3b82f6;
}

/* ===== پس‌زمینه سفید برای select و دکمه در حالت لایت ===== */
#language-dropdown {
    background-color: #ffffff !important;
    border-color: #d1d5db !important;
}
#theme-toggle {
    background-color: #ffffff !important;
    border-color: #d1d5db !important;
}
#theme-toggle:hover {
    background-color: #f3f4f6 !important;
}
#theme-icon {
    color: #4a5568 !important;
}

/* ===== Responsive fix ===== */
@media (max-width: 768px) {
    .menu-desktop {
        display: none;
    }
}