/* ============================================
   Travaux en cours — Design harmonisé
   Palette : cohérente avec theme-v2 / agenda-modern
   ============================================ */
:root {
    --tw-primary:       #1E3A5F;
    --tw-primary-dark:  #162d4a;
    --tw-primary-light: #2D5282;
    --tw-accent:        #7FA86E;
    --tw-warning:       #d97706;
    --tw-info:          #0284c7;
    --tw-secondary:     #6B6860;
    --tw-white:         #F8F6F0;
    --tw-gray-100:      #F3F1EB;
    --tw-gray-200:      #E8E4D8;
    --tw-gray-400:      #8A8780;
    --tw-gray-500:      #6B6860;
    --tw-gray-700:      #2A2A2A;
    --tw-shadow-sm:     0 2px 8px rgba(30,58,95,.06);
    --tw-shadow:        0 4px 16px rgba(30,58,95,.10);
    --tw-shadow-md:     0 6px 24px rgba(30,58,95,.13);
    --tw-radius:        10px;
    --tw-radius-sm:     6px;
    --tw-transition:    all .2s ease;
}

/* ============================================
   LISTE
   ============================================ */
.travaux-liste {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

@media (min-width: 768px) {
    .travaux-liste { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1100px) {
    .travaux-liste { grid-template-columns: repeat(3, 1fr); }
}

.travaux-card {
    background: var(--tw-white);
    border: 1px solid var(--tw-gray-200);
    border-radius: var(--tw-radius);
    overflow: hidden;
    box-shadow: var(--tw-shadow-sm);
    transition: var(--tw-transition);
    display: flex;
    flex-direction: column;
}

.travaux-card:hover {
    box-shadow: var(--tw-shadow-md);
    transform: translateY(-3px);
}

.travaux-card-img {
    height: 180px;
    overflow: hidden;
}

.travaux-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .35s ease;
}

.travaux-card:hover .travaux-card-img img {
    transform: scale(1.04);
}

.travaux-card-body {
    padding: 1.1rem 1.2rem 1.2rem;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.travaux-card-header {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .55rem;
}

.travaux-avanc {
    font-size: .78rem;
    font-weight: 600;
    color: var(--tw-gray-500);
    margin-left: auto;
}

.travaux-card-title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--tw-primary);
    margin: 0 0 .5rem;
    line-height: 1.35;
}

.travaux-card-title a {
    color: inherit;
    text-decoration: none;
}

.travaux-card-title a:hover {
    color: var(--tw-primary-light);
    text-decoration: underline;
}

.travaux-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem .9rem;
    font-size: .82rem;
    color: var(--tw-gray-500);
    margin-bottom: .7rem;
}

.travaux-card-meta i {
    color: var(--tw-primary-light);
    margin-right: 3px;
}

.travaux-progress {
    margin-bottom: .75rem;
    border-radius: 99px;
    overflow: hidden;
    background: var(--tw-gray-200);
}

.travaux-progress .progress-bar {
    border-radius: 99px;
    transition: width .5s ease;
}

.travaux-btn {
    margin-top: auto;
    align-self: flex-start;
    font-size: .82rem;
}

.travaux-empty {
    color: var(--tw-gray-400);
    font-style: italic;
    padding: 1.5rem 0;
}

/* ============================================
   DÉTAIL
   ============================================ */
.travaux-detail {
    max-width: 900px;
}

.travaux-image-wrap {
    margin-bottom: 1.5rem;
    border-radius: var(--tw-radius);
    overflow: hidden;
    box-shadow: var(--tw-shadow);
}

.travaux-img {
    width: 100%;
    max-height: 380px;
    object-fit: cover;
    display: block;
}

/* Grille de méta-infos */
.travaux-meta-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: .85rem;
    margin-bottom: 1.5rem;
}

.meta-card {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    background: var(--tw-gray-100);
    border: 1px solid var(--tw-gray-200);
    border-radius: var(--tw-radius-sm);
    padding: .75rem 1rem;
}

.meta-icon {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    background: var(--tw-primary);
    color: #fff;
    border-radius: var(--tw-radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .95rem;
}

.meta-content {
    min-width: 0;
}

.meta-content label {
    display: block;
    font-size: .72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--tw-gray-400);
    margin-bottom: .15rem;
}

.meta-content span {
    font-size: .92rem;
    font-weight: 600;
    color: var(--tw-gray-700);
    word-break: break-word;
}

/* Barre d'avancement */
.travaux-avancement {
    margin-bottom: 1.5rem;
    padding: 1rem 1.2rem;
    background: var(--tw-gray-100);
    border: 1px solid var(--tw-gray-200);
    border-radius: var(--tw-radius-sm);
}

.avanc-label {
    display: block;
    font-size: .88rem;
    color: var(--tw-gray-500);
    margin-bottom: .5rem;
}

.avanc-label strong {
    color: var(--tw-primary);
    font-size: 1rem;
}

.travaux-avancement .progress {
    border-radius: 99px;
    background: var(--tw-gray-200);
    overflow: hidden;
}

.travaux-avancement .progress-bar {
    border-radius: 99px;
    transition: width .6s ease;
}

/* Description */
.travaux-description {
    margin-bottom: 1.5rem;
    line-height: 1.7;
    color: var(--tw-gray-700);
}

/* Carte Leaflet */
.travaux-map-wrap {
    margin-top: 1.5rem;
    border-radius: var(--tw-radius);
    overflow: hidden;
    border: 1px solid var(--tw-gray-200);
    box-shadow: var(--tw-shadow-sm);
}