/* style.css */
body {
    font-family: 'Tahoma', 'Helvetica Neue', Helvetica, Arial, sans-serif; /* فونت‌های بهتر */
    direction: rtl;
    margin: 0;    padding: 0; /* حذف پدینگ بدنه */
    background-color: #f0f2f5; /* رنگ پس‌زمینه کمی متفاوت */
    color: #333;
    font-size: 14px; /* اندازه فونت پایه */
}

.container {
    width: 95%; /* کمی عریض‌تر */
    max-width: 1400px; /* افزایش حداکثر عرض */
    margin: 20px auto; /* فاصله از بالا و پایین */
    background-color: #fff;
    padding: 25px; /* پدینگ بیشتر داخلی */
    box-shadow: 0 2px 15px rgba(0,0,0,0.08); /* سایه ملایم‌تر و مدرن‌تر */
    border-radius: 8px;
}

header {
    border-bottom: 1px solid #dee2e6; /* خط جداکننده ملایم‌تر */
    margin-bottom: 25px;
    padding-bottom: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

header h1 {
    color: #343a40; /* رنگ تیره‌تر برای عنوان */
    margin: 0;
    font-size: 1.8em; /* اندازه فونت عنوان */
}.user-info {
    font-size: 0.9em;
    color: #6c757d; /* رنگ ملایم‌تر برای اطلاعات کاربر */
}

.user-info a {
    color: #dc3545;
    text-decoration: none;
    font-weight: 500; /* کمی ضخیم‌تر */
}
.user-info a:hover {
    text-decoration: underline;
    color: #c82333;
}

table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    font-size: 0.95em; /* فونت کمی کوچکتر برای جدول */
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

th, td {
    border: 1px solid #e9ecef; /* رنگ خطوط جدول ملایم‌تر */
    padding: 12px 15px; /* پدینگ بیشتر برای خوانایی */
    text-align: right;
    vertical-align: middle;
}

th {
    background-color: #f8f9fa; /* پس‌زمینه روشن‌تر برای سربرگ */
    color: #495057; /* رنگ متن تیره‌تر برای سربرگ */
    font-weight: 600; /* فونت ضخیم‌تر برای سربرگ */
    text-transform: uppercase; /* حروف بزرگ (برای زبان انگلیسی، برای فارسی تاثیر ندارد) */
    font-size: 0.85em;
}

tr:nth-child(even) {
    background-color: #fcfcfc; /* رنگ بسیار ملایم برای سطرهای زوج */
}

tr:hover {
    background-color: #e9f5ff; /* رنگ هاور مشخص‌تر */
}

/* استایل دکمه‌ها و لینک‌های داخل جدول */
.play-button, .action-download {
    padding: 6px 12px;
    margin-right: 5px;
    text-decoration: none;
    border: 1px solid transparent; /* بدون بوردر اولیه */
    border-radius: 4px;
    cursor: pointer;    font-size: 0.9em;
    transition: all 0.2s ease-in-out;
}

.play-button {
    background-color: #28a745;
    color: white;
    border-color: #28a745;
}
.play-button:hover {
    background-color: #218838;
    border-color: #1e7e34;
    transform: translateY(-1px); /* افکت کوچک هاور */
}

.action-download {
    background-color: #007bff; /* تغییر رنگ دانلود به آبی */
    color: white;
    border-color: #007bff;
    display: inline-block;}
.action-download:hover {
    background-color: #0056b3;    border-color: #0056b3;
    transform: translateY(-1px);
}

/* استایل‌های مربوط به فرم لاگین (از فایل قبلی، با کمی بهبود) */
.login-container {
    width: 380px; /* کمی عریض‌تر */
    margin: 60px auto;
    padding: 30px;
    background-color: #fff;
    border: 1px solid #e0e0e0;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    border-radius: 8px;
}.login-container h2 {
    text-align: center;
    color: #343a40;
    margin-bottom: 25px;
    font-size: 1.6em;
}

.login-container div {
    margin-bottom: 18px;
}

.login-container label {
    display: block;
    margin-bottom: 6px;    font-weight: 500; /* کمی ملایم‌تر */
    color: #495057;
}

.login-container input[type="text"],
.login-container input[type="password"] {
    width: 100%; /* استفاده از box-sizing برای مدیریت پدینگ */    padding: 12px 15px;
    border: 1px solid #ced4da;    border-radius: 4px;
    box-sizing: border-box;
    font-size: 1em;
}
.login-container input[type="text"]:focus,
.login-container input[type="password"]:focus {
    border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}


.login-container button[type="submit"] {
    width: 100%;
    padding: 12px;
    background-color: #007bff;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 1.05em;
    font-weight: 500;
    transition: background-color 0.2s ease-in-out;
}

.login-container button[type="submit"]:hover {
    background-color: #0056b3;
}

.error-messages { /* برای خطاهای فرم لاگین یا پیام های خطا در صفحه اصلی */
    color: #721c24;
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    padding: 12px 15px;
    margin-bottom: 20px;
    border-radius: 4px;    font-size: 0.95em;
}

/* استایل‌های فرم فیلتر و پلیر (از index.php منتقل شده و بهبود یافته) */
.filter-form {
    background-color: #f8f9fa; /* رنگ پس‌زمینه ملایم */
    padding: 20px;
    border-radius: 6px;
    margin-bottom: 25px;
    display: flex;
    flex-wrap: wrap;
    gap: 20px; /* فاصله بیشتر بین آیتم‌ها */
    align-items: flex-end; /* هم‌ترازی بهتر دکمه */
    border: 1px solid #e9ecef;
}
.filter-form > div {    display: flex;
    flex-direction: column;
    flex-grow: 1; /* اجازه رشد به آیتم‌ها */
    min-width: 180px; /* حداقل عرض برای هر فیلتر */
}
.filter-form label {
    font-size: 0.85em; /* فونت کوچکتر برای لیبل */
    margin-bottom: 6px;
    color: #495057;
    font-weight: 500;
}
.filter-form select, .filter-form input[type="date"] {
    padding: 10px 12px;
    border-radius: 4px;
    border: 1px solid #ced4da;
    font-size: 0.95em;
    background-color: #fff;}
.filter-form select:focus, .filter-form input[type="date"]:focus {
     border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}

.filter-form button[type="submit"] { /* دکمه فیلتر */
    padding: 10px 20px;
    background-color: #007bff;
    color: white;
    cursor: pointer;
    border: none;
    border-radius: 4px;    font-size: 0.95em;
    font-weight: 500;    transition: background-color 0.2s;
    align-self: flex-end; /* برای هم‌ترازی با پایین‌ترین لبه */
}
.filter-form button[type="submit"]:hover {
    background-color: #0056b3;
}
.filter-form > div.submit-button-container { /* کانتینر برای دکمه برای کنترل بهتر */
    min-width: auto; /* اجازه ندهید دکمه بیش از حد رشد کند */
    flex-grow: 0;}


#global-audio-player-container {
    position: sticky; /* پلیر چسبان در بالا */    top: 0;
    background-color: #ffffff;
    padding: 15px 20px;
    border-bottom: 1px solid #e0e0e0;
    z-index: 1020; /* بالاتر از سایر محتوا */
    box-shadow: 0 2px 5px rgba(0,0,0,0.07);
    margin-bottom: 20px; /* فاصله از فیلترها */
}
#global-audio-player-container h3 {    margin-top: 0;
    margin-bottom: 8px;
    font-size: 1em;
    color: #333;
    font-weight: 500;
}#global-audio-player {
    width: 100%;
    margin-bottom: 5px;
}
#player-controls {
    text-align: center;
    margin-top: 8px;
}
#player-controls button {
    padding: 6px 15px;
    font-size: 0.9em;
    margin: 0 5px;
    background-color: #6c757d;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}
#player-controls button:disabled {
    background-color: #adb5bd;
    cursor: not-allowed;
}
#player-controls button:hover:not(:disabled) {
    background-color: #5a6268;
}/* استایل‌های صفحه‌بندی */
.pagination {
    margin: 25px 0;
    text-align: center;
}
.pagination a, .pagination span {
    display: inline-block;
    padding: 8px 14px; /* پدینگ کمی بیشتر */
    margin: 0 4px; /* فاصله بیشتر */
    border: 1px solid #dee2e6;
    background-color: #fff;
    color: #007bff;
    text-decoration: none;
    border-radius: 4px;
    font-size: 0.9em;
    transition: all 0.2s ease-in-out;
}
.pagination a:hover {
    background-color: #e9ecef;
    border-color: #adb5bd;
}
.pagination .current-page {
    background-color: #007bff;
    color: white;
    border-color: #007bff;
    font-weight: 600;
}
.pagination .disabled {
    color: #6c757d;
    pointer-events: none;
    background-color: #e9ecef;
    border-color: #dee2e6;
}