*{box-sizing:border-box; margin:0; padding:0; font-family:Arial, sans-serif;}
body{background:#f4f6f8; color:#333;}
header{background:#1e3a8a; color:white; padding:15px 20px; display:flex; justify-content:space-between; align-items:center;}
header h1{font-size:20px;}
.btn{background:#16a34a; color:white; padding:8px 14px; text-decoration:none; border-radius:5px; border:none; cursor:pointer;}
.btn-admin{background:#f59e0b;}
.btn-danger{background:#dc2626;}
.container{max-width:1000px; margin:20px auto; padding:15px;}
.filters{display:flex; gap:10px; margin-bottom:20px;}
.filters input, .filters select{flex:1; padding:10px; border:1px solid #ccc; border-radius:5px;}
.annonce-card{background:white; padding:15px; margin-bottom:15px; display:flex; gap:15px; border-radius:8px; box-shadow:0 2px 5px rgba(0,0,0,0.1);}
.annonce-card img{width:180px; height:120px; object-fit:cover; border-radius:5px;}
.cat{background:#2563eb; color:white; padding:4px 10px; font-size:12px; border-radius:20px;}
.big-img{width:100%; object-fit:cover; border-radius:8px; margin:15px 0;}
.comment{background:white; padding:12px; margin:10px 0; border-left:4px solid #2563eb; border-radius:4px;}
.comment.admin{border-left-color:#f59e0b;}
.form-container{background:white; padding:25px; border-radius:8px; max-width:700px; margin:20px auto;}
input,textarea,select{width:100%; padding:10px; margin:8px 0; border:1px solid #ccc; border-radius:5px;}
.success{color:green;} .error{color:red;}
.pagination{display:flex; gap:5px; justify-content:center; margin-top:20px;}
.pagination a{padding:8px 12px; background:white; text-decoration:none; border-radius:5px;}
.pagination a.active{background:#2563eb; color:white;}
.admin-table{width:100%; background:white; border-collapse:collapse; margin-top:15px;}
.admin-table td, .admin-table th{padding:10px; border:1px solid #ddd; text-align:left;}
.admin-annonce{display:flex; justify-content:space-between; background:white; padding:12px; margin:8px 0; border-radius:5px;}
/* GRILLE 2 COLONNES RESPONSIVE */
.grid-declarations {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* 2 colonnes sur PC */
    gap: 25px;
    margin-top: 20px;
}

.card {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    overflow: hidden;
    transition: transform 0.2s;
}

.card:hover {
    transform: translateY(-5px);
}

.card img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.card-content {
    padding: 15px;
}

.categorie {
    background: #007BFF;
    color: #fff;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 12px;
}

.date {
    color: #888;
    font-size: 12px;
    margin: 5px 0;
}

.btn-lire {
    display: inline-block;
    margin-top: 10px;
    background: #28a745;
}

/* RESPONSIVE: 1 colonne sur mobile */
@media (max-width: 768px) {
    .grid-declarations {
        grid-template-columns: 1fr; /* Passe à 1 colonne */
    }
    header .container {
        flex-direction: column;
        gap: 10px;
    }
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

header {
    background: #333;
    color: #fff;
    padding: 15px 0;
}
header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}