/* ================================================
   Liste des associations — Ville de Deshaies
   Fichier : associations-deshaies.css
   Cible   : /templates/jl_tranship_free/custom/css/
   Usage   : com_contact view-category (liste des associations)
   Structure HTML Joomla :
     li.row-fluid.cat-list-row0/1
       div.list-title.span9.col-md-9
         a (nom)
         texte brut (catégorie)
         br
       div.span3.col-md-3
         texte (téléphone)
   ================================================ */

/* --- Titre de section --- */
.contact-category h2 {
  font-size: 22px;
  font-weight: 500;
  margin-bottom: 1.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid #1a7a4a;
}

/* --- Liste : suppression du fond rayé Joomla --- */
.contact-category .category.row-striped {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* --- Ligne : neutralisation du row-fluid Bootstrap
       et remplacement par une carte arrondie         --- */
.contact-category .cat-list-row0,
.contact-category .cat-list-row1 {
  display: flex !important;
  flex-wrap: nowrap;
  align-items: center;
  background-color: #fff !important;
  border: 0.5px solid rgba(0, 0, 0, 0.1);
  border-radius: 10px;
  padding: 14px 18px !important;
  margin-bottom: 10px;
  margin-left: 0 !important;
  margin-right: 0 !important;
  transition:
    box-shadow 0.18s,
    border-color 0.18s;
}

.contact-category .cat-list-row0:hover,
.contact-category .cat-list-row1:hover {
  box-shadow: 0 2px 12px rgba(26, 122, 74, 0.13);
  border-color: #1a7a4a;
}

/* --- Bloc titre : neutralisation span9/col-md-9 Bootstrap --- */
.contact-category .cat-list-row0 .list-title,
.contact-category .cat-list-row1 .list-title {
  flex: 1 1 auto !important;
  width: auto !important;
  float: none !important;
  margin-left: 0 !important;
  line-height: 1.5;
  min-width: 0;
}

/* --- Lien nom de l'association --- */
.contact-category .list-title a {
  display: block;
  font-size: 15px;
  font-weight: 500;
  color: #1a1a1a;
  text-decoration: none;
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.contact-category .list-title a:hover {
  color: #1a7a4a;
}

/* --- Texte de catégorie (nœud texte brut après le <a>) ---
       On cible le contenu via font-size sur le parent        --- */
.contact-category .list-title {
  font-size: 12px;
  color: #888;
}

/* --- Bloc téléphone : neutralisation span3/col-md-3 Bootstrap --- */
.contact-category .cat-list-row0 .span3,
.contact-category .cat-list-row1 .span3 {
  flex: 0 0 auto !important;
  width: auto !important;
  float: none !important;
  margin-left: 16px !important;
  font-size: 13px;
  color: #555;
  white-space: nowrap;
}

/* --- Barre de filtres --- */
.contact-category .filters.btn-toolbar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-bottom: 1rem;
  gap: 8px;
  font-size: 13px;
  color: #555;
}

.contact-category .filters select {
  font-size: 13px;
  padding: 5px 10px;
  border-radius: 6px;
  border: 0.5px solid rgba(0, 0, 0, 0.2);
  background: #fff;
}

/* --- Pagination --- */
.contact-category .pagination {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  margin-top: 1.5rem;
  flex-wrap: wrap;
  gap: 8px;
  border-top: none !important;
}

.contact-category .pagination p.counter {
  font-size: 13px;
  color: #888;
  margin: 0;
}

.contact-category .pagination ul {
  display: flex;
  list-style: none;
  padding: 0;
  gap: 4px;
  margin: 0;
}

.contact-category .pagination ul li a,
.contact-category .pagination ul li span {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 6px;
  border: 0.5px solid rgba(0, 0, 0, 0.15);
  font-size: 13px;
  color: #444;
  text-decoration: none;
  background: #fff;
  transition:
    background 0.15s,
    color 0.15s;
}

.contact-category .pagination ul li.active a,
.contact-category .pagination ul li a:hover {
  background: #1a7a4a;
  color: #fff !important;
  border-color: #1a7a4a;
}

/* --- Responsive mobile --- */
@media (max-width: 600px) {
  .contact-category .cat-list-row0 .span3,
  .contact-category .cat-list-row1 .span3 {
    display: none;
  }
  .contact-category .cat-list-row0,
  .contact-category .cat-list-row1 {
    padding: 12px 14px !important;
  }
  .contact-category .list-title a {
    white-space: normal;
  }
}