/* STYLES SPÉCIFIQUES À LA PAGE D'AVIS */
.page-hero { 
    padding: 80px 0; 
    text-align: center; 
    background-color: var(--color-primary-dark); 
    color: white; 
    position: relative; 
    overflow: hidden; 
    background-image: url('https://images.unsplash.com/photo-1541339907198-e08756dedf3f?q=80&w=2070&auto=format&fit=crop'); 
    background-size: cover; 
    background-position: center; 
}
.page-hero::before { 
    content: ''; 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background: rgba(13, 33, 73, 0.7); 
    z-index: 1; 
}
.page-hero .container { position: relative; z-index: 2; }
.page-hero h1 { 
    font-size: 3.5rem; 
    margin: 0; 
    color: white; 
    text-shadow: 0 3px 10px rgba(0,0,0,0.5); 
}
.page-hero p { 
    color: rgba(255, 255, 255, 0.9); 
    margin-top: 10px; 
    font-size: 1.2rem; 
    text-shadow: 0 1px 5px rgba(0,0,0,0.3); 
}
.announcements-section { padding: var(--spacing-xxl) 0; }
.filters-container { 
    background-color: var(--color-background); 
    padding: var(--spacing-l); 
    border-radius: var(--radius); 
    box-shadow: var(--shadow); 
    margin: 0 auto var(--spacing-xl) auto; 
    max-width: 900px; 
    display: flex; 
    flex-wrap: wrap; 
    justify-content: center; 
    gap: var(--spacing-l); 
}
.filter-group { flex: 1; min-width: 200px; max-width: 40%; }
.filter-group label { 
    font-weight: 700; 
    color: var(--color-primary-dark); 
    font-size: 1.1rem; 
    text-align: center; 
    display: block; 
    margin-bottom: var(--spacing-s); 
}
.filter-select { 
    width: 100%; 
    padding: 10px 15px; 
    border: 1px solid #ddd; 
    border-radius: var(--radius); 
    background-color: var(--color-background-alt); 
    font-family: var(--font-body); 
    font-size: 1rem; 
    color: var(--color-text-dark); 
    appearance: none; 
    -webkit-appearance: none; 
    -moz-appearance: none; 
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23212529%22%20d%3D%22M287%2C114.7L159.2%2C242.5c-4.4%2C4.4-10.8%2C4.4-15.2%2C0L5.4%2C114.7c-4.4-4.4-4.4-10.8%2C0-15.2h13.2c4.4-4.4%2C10.8-4.4%2C15.2%2C0l115%2C115L258.6%2C99.5c4.4-4.4%2C10.8-4.4%2C15.2%2C0h13.2C291.4%2C103.9%2C291.4%2C110.3%2C287%2C114.7z%22%2F%3E%3C%2Fsvg%3E'); 
    background-repeat: no-repeat; 
    background-position: right 10px top 50%; 
    background-size: 12px auto; 
    cursor: pointer; 
    transition: all 0.3s ease; 
}
.filter-select:focus { 
    border-color: var(--color-primary-blue); 
    box-shadow: 0 0 0 3px rgba(0, 90, 158, 0.2); 
    outline: none; 
}
#loading-indicator, #no-results-message { 
    text-align: center; 
    font-size: 1.1rem; 
    font-weight: 500; 
    color: var(--color-text-light); 
    padding: 48px; 
}
#announcements-list { display: grid; gap: var(--spacing-l); }
.announcement-item { 
    display: flex; 
    gap: var(--spacing-l); 
    padding: var(--spacing-l); 
    background-color: var(--color-background); 
    border: 1px solid #e9ecef; 
    box-shadow: 0 4px 15px rgba(27, 38, 59, 0.06); 
    border-radius: var(--radius); 
    transition: var(--transition); 
    align-items: center; 
}
.announcement-item:hover { 
    transform: translateY(-4px); 
    box-shadow: 0 10px 25px rgba(27, 38, 59, 0.1); 
    border-color: var(--color-accent); 
}
.announcement-date-bubble { 
    flex-shrink: 0; 
    background-color: var(--color-accent); 
    color: white; 
    border-radius: var(--radius); 
    padding: 12px 16px; 
    text-align: center; 
    display: flex; 
    flex-direction: column; 
    justify-content: center; 
}
.announcement-date-bubble.error { background-color: #e74c3c; }
.date-day { font-size: 1.8rem; font-weight: 700; line-height: 1.1; }
.date-month { font-size: 0.8rem; font-weight: 500; text-transform: uppercase; }
.announcement-details { flex-grow: 1; min-width: 0; }
.announcement-details h3 { 
    font-size: 1.5rem; 
    font-weight: 700; 
    color: var(--color-primary-dark); 
    margin: 0 0 var(--spacing-m) 0; 
    padding-bottom: var(--spacing-s); 
    border-bottom: 2px solid var(--color-primary-blue); 
    display: inline-block; 
    max-width: 100%; 
}
.announcement-content p { 
    color: var(--color-text-dark); 
    margin: 0; 
    line-height: 1.7; 
}
.announcement-tags { 
    margin-top: var(--spacing-l); 
    display: flex; 
    flex-wrap: wrap; 
    gap: var(--spacing-s); 
}
.tag { 
    font-size: 0.75rem; 
    font-weight: 600; 
    padding: 4px 12px; 
    border-radius: 50px; 
    text-transform: uppercase; 
}
.tag-filiere { background-color: #e0f2fe; color: #0c5469; }
.tag-semestre { background-color: #dcfce7; color: #15803d; }
.announcement-details.text-rtl { text-align: right; }
.announcement-details.text-rtl .announcement-tags { justify-content: flex-end; }