/* ─── DÉCÈS INSEE — Styles ─────────────────────────────────────── */
/* Palette parchemin : fond #F5F0E8, accent or #C7901E, vert #1B4332 */

.insee-layout {
  padding: var(--space-8) var(--space-4);
  max-width: 1100px;
}

/* ─── Formulaire ─────────────────────────────────────────────────── */

.search-form {
  background: #FAF7F2;
  border: 1px solid #d4c9b5;
  border-radius: var(--radius-lg);
  padding: var(--space-6);
  margin-bottom: var(--space-8);
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

[data-theme="dark"] .search-form {
  background: #161b27;
  border-color: #2a3040;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

.search-form__main {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--space-4);
  margin-bottom: var(--space-5);
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.form-group label {
  font-size: var(--font-sm);
  font-weight: 600;
  color: var(--clr-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.form-group input,
.form-group select {
  padding: var(--space-3) var(--space-4);
  border: 1px solid #c4b89e;
  border-radius: var(--radius-base);
  background: #FFFFFF;
  color: var(--clr-text);
  font-size: var(--font-base);
  transition: border-color var(--ease-base), box-shadow var(--ease-base);
}

[data-theme="dark"] .form-group input,
[data-theme="dark"] .form-group select {
  background: #0e1520;
  border-color: #2a3040;
}

.form-group input:focus,
.form-group select:focus {
  outline: none;
  border-color: var(--clr-accent);
  box-shadow: 0 0 0 3px rgba(199, 144, 30, 0.15);
}

/* ─── Autocomplete lieu ───────────────────────────────────────────── */

.form-group--lieu {
  grid-column: span 2;
}

.ac-wrapper {
  position: relative;
}

.ac-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 200;
  background: #ffffff;
  border: 1px solid #c4b89e;
  border-radius: var(--radius-base, 6px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.12);
  max-height: 280px;
  overflow-y: auto;
}

[data-theme="dark"] .ac-dropdown {
  background: #1a1f2e;
  border-color: #2a3040;
  box-shadow: 0 4px 16px rgba(0,0,0,0.4);
}

.ac-item {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  cursor: pointer;
  font-size: var(--font-sm);
}

.ac-item:hover,
.ac-item.active {
  background: #F0EBDF;
}

[data-theme="dark"] .ac-item:hover,
[data-theme="dark"] .ac-item.active {
  background: #1e2536;
}

.ac-badge {
  flex-shrink: 0;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 2px 6px;
  border-radius: 3px;
  background: var(--clr-border);
  color: var(--clr-text-muted);
}

.ac-badge--commune  { background: #e8f4e8; color: #2d6a2d; }
.ac-badge--departement { background: #e8eef8; color: #2d4a8a; }
.ac-badge--region   { background: #f3eafc; color: #6a2da0; }
.ac-badge--pays     { background: #fdecea; color: #a02d2d; }

/* ─── Filtres ─────────────────────────────────────────────────────── */

.search-form__filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-6);
  padding: var(--space-4) 0;
  border-top: 1px solid #d4c9b5;
  border-bottom: 1px solid #d4c9b5;
  margin-bottom: var(--space-5);
}

[data-theme="dark"] .search-form__filters {
  border-color: #2a3040;
}

.filter-group {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.filter-label {
  font-size: var(--font-sm);
  font-weight: 600;
  color: var(--clr-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.filter-options {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: center;
}

.filter-options label {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-sm);
  cursor: pointer;
  color: var(--clr-text);
}

.filter-options label input[type="radio"] {
  accent-color: var(--clr-accent);
  width: 16px;
  height: 16px;
}

.filter-options--date {
  gap: var(--space-2);
}

.filter-options--date select {
  padding: var(--space-2) var(--space-3);
  border: 1px solid #c4b89e;
  border-radius: var(--radius-base);
  background: #FFFFFF;
  color: var(--clr-text);
  font-size: var(--font-sm);
}

[data-theme="dark"] .filter-options--date select {
  background: #0e1520;
  border-color: #2a3040;
}

.year-input {
  width: 90px;
  padding: var(--space-2) var(--space-3) !important;
  border: 1px solid #c4b89e;
  border-radius: var(--radius-base);
  background: #FFFFFF;
  color: var(--clr-text);
  font-size: var(--font-sm);
}

[data-theme="dark"] .year-input {
  background: #0e1520;
  border-color: #2a3040;
}

.date-sep {
  font-size: var(--font-sm);
  color: var(--clr-text-muted);
}

.search-form__actions {
  display: flex;
  gap: var(--space-3);
  align-items: center;
}

/* ─── Zone de résultats ───────────────────────────────────────────── */

.results-area { }

.results-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--space-4);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--clr-separator);
}

.results-count {
  font-size: var(--font-base);
  color: var(--clr-text-muted);
}

.results-count strong {
  color: var(--clr-text);
  font-size: var(--font-lg);
}

.results-sort {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-sm);
  color: var(--clr-text-muted);
}

.results-sort select {
  padding: var(--space-1) var(--space-3);
  border: 1px solid #c4b89e;
  border-radius: var(--radius-base);
  background: #FFFFFF;
  color: var(--clr-text);
  font-size: var(--font-sm);
}

[data-theme="dark"] .results-sort select {
  background: #0e1520;
  border-color: #2a3040;
}

.results-loading {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-8);
  justify-content: center;
  color: var(--clr-text-muted);
}

.spinner {
  width: 24px;
  height: 24px;
  border: 3px solid var(--clr-border);
  border-top-color: var(--clr-accent);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin { to { transform: rotate(360deg); } }

/* ─── Tableau résultats (desktop) ──────────────────────────────── */

.results-list {
  /* Container for both table and mobile cards */
}

.results-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  border: 1px solid #d4c9b5;
  border-radius: var(--radius-base);
  overflow: hidden;
}

.results-table thead th {
  background: #E8E0D2;
  padding: 12px 15px;
  text-align: left;
  font-weight: 600;
  border-bottom: 2px solid #c4b89e;
  color: #8a7350;
  font-size: var(--font-sm);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.results-table tbody tr {
  cursor: pointer;
}

.results-table tbody tr.row-hover td {
  background: #F5E6C8 !important;
}

.results-table td {
  padding: 10px 15px;
  border-bottom: 1px solid #E8E0D2;
  color: #333333;
  line-height: 1.5;
}

[data-theme="dark"] .results-table td {
  color: #e0e0e0;
}

.results-table .td-sexe {
  text-align: center;
  vertical-align: middle;
  width: 40px;
}

.results-table .td-nom {
  font-weight: 600;
  vertical-align: middle;
  white-space: nowrap;
  color: #1a1a1a;
}

[data-theme="dark"] .results-table .td-nom {
  color: #f0f0f0;
}

.results-table .td-prenom {
  vertical-align: middle;
  color: #555555;
}

.results-table .td-prenom strong {
  color: #1a1a1a;
}

[data-theme="dark"] .results-table .td-prenom {
  color: #a0a0a0;
}

[data-theme="dark"] .results-table .td-prenom strong {
  color: #f0f0f0;
}

.results-table .td-event {
  font-size: var(--font-xs);
  color: #777777;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
  width: 80px;
}

.results-table .td-date {
  white-space: nowrap;
  width: 100px;
}

.results-table .td-date strong,
.results-table .td-lieu strong {
  color: #1a1a1a;
}

[data-theme="dark"] .results-table .td-date strong,
[data-theme="dark"] .results-table .td-lieu strong {
  color: #f0f0f0;
}

.results-table .td-lieu {
  font-size: 13px;
}

/* Alternance de couleurs par personne */
.results-table .row-even td { background: #FAF7F2; }
.results-table .row-odd td { background: #F0EBDF; }

.acte-num {
  display: inline-block;
  margin-left: 8px;
  font-size: 11px;
  color: var(--clr-text-muted);
  font-family: monospace;
}

/* ─── Cards mobile ────────────────────────────────────────────── */

.person-card {
  background: #FAF7F2;
  border: 1px solid #d4c9b5;
  border-radius: 8px;
  padding: 15px;
  margin-bottom: 12px;
  cursor: pointer;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
  transition: border-color var(--ease-base);
}

.person-card:hover {
  border-color: var(--clr-accent);
}

.person-card:nth-child(even) {
  background: #F0EBDF;
}

.card-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 2px solid #d4c9b5;
}

.card-gender {
  font-size: 20px;
}

.card-name {
  flex: 1;
}

.card-surname {
  font-size: 16px;
  font-weight: 600;
  color: var(--clr-text);
  margin-bottom: 2px;
}

.card-firstname {
  font-size: 14px;
  color: var(--clr-text-muted);
}

.card-info {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.info-row {
  display: flex;
  padding: 8px;
  background: rgba(0,0,0,0.03);
  border-radius: 4px;
}

.info-label {
  font-size: 12px;
  color: var(--clr-text-muted);
  min-width: 70px;
  font-weight: 500;
}

.info-value {
  font-size: 14px;
  color: var(--clr-text);
  flex: 1;
}

.card-acte {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed #d4c9b5;
  text-align: right;
  font-size: 12px;
  color: var(--clr-text-muted);
  font-family: monospace;
}

/* ─── Responsive : desktop / mobile ──────────────────────────── */

.mobile-only { display: none; }
.desktop-only { display: table; }

@media (max-width: 768px) {
  .mobile-only { display: block; }
  .desktop-only { display: none; }
}

/* ─── Pagination ──────────────────────────────────────────────────── */

.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--space-2);
  margin-top: var(--space-8);
  flex-wrap: wrap;
}

.pagination__btn {
  padding: var(--space-2) var(--space-4);
  border: 1px solid #d4c9b5;
  border-radius: var(--radius-base);
  background: #FAF7F2;
  color: var(--clr-text);
  font-size: var(--font-sm);
  cursor: pointer;
  transition: all var(--ease-base);
}

.pagination__btn:hover {
  border-color: var(--clr-accent);
  color: var(--clr-accent);
  background: #F5E6C8;
}

.pagination__btn.active {
  background: var(--clr-accent);
  border-color: var(--clr-accent);
  color: white;
  font-weight: 600;
}

.pagination__btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.pagination__info {
  font-size: var(--font-sm);
  color: var(--clr-text-muted);
  padding: 0 var(--space-2);
}

/* ─── État vide ───────────────────────────────────────────────────── */

.empty-state {
  text-align: center;
  padding: var(--space-12) var(--space-4);
  color: var(--clr-text-muted);
}

.empty-state__icon {
  font-size: 3rem;
  margin-bottom: var(--space-4);
}

.empty-state h2 {
  font-size: var(--font-xl);
  color: var(--clr-text);
  margin-bottom: var(--space-3);
}

.empty-state p {
  max-width: 500px;
  margin: 0 auto var(--space-6);
  line-height: 1.6;
}

.empty-state__tips {
  background: #FAF7F2;
  border: 1px solid #d4c9b5;
  border-radius: var(--radius-base);
  padding: var(--space-4) var(--space-6);
  max-width: 500px;
  margin: 0 auto;
  text-align: left;
}

.empty-state__tips strong {
  color: var(--clr-text);
}

.empty-state__tips ul {
  margin: var(--space-2) 0 0 var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  font-size: var(--font-sm);
}

/* ─── Modale fiche individuelle ───────────────────────────────────── */

.person-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4);
}

.person-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.5);
  backdrop-filter: blur(4px);
}

.person-modal__content {
  position: relative;
  z-index: 1;
  background: #FAF7F2;
  border: 1px solid #d4c9b5;
  border-radius: var(--radius-lg);
  padding: var(--space-8);
  max-width: 600px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 8px 32px rgba(0,0,0,0.15);
}

.person-modal__close {
  position: absolute;
  top: var(--space-4);
  right: var(--space-4);
  background: none;
  border: none;
  font-size: 1.5rem;
  cursor: pointer;
  color: var(--clr-text-muted);
  line-height: 1;
  padding: var(--space-1);
}

.person-modal__close:hover { color: var(--clr-text); }

.person-detail__name {
  font-size: var(--font-2xl);
  font-weight: 700;
  color: var(--clr-text);
  margin-bottom: var(--space-1);
}

.person-detail__sub {
  color: var(--clr-text-muted);
  margin-bottom: var(--space-6);
}

.person-detail__section {
  margin-bottom: var(--space-5);
}

.person-detail__section h3 {
  font-size: var(--font-sm);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #8a7350;
  margin-bottom: var(--space-3);
  padding-bottom: var(--space-2);
  border-bottom: 1px solid #d4c9b5;
}

.person-detail__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3);
}

.person-detail__item {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.person-detail__item-label {
  font-size: var(--font-xs);
  color: #8a7350;
}

.person-detail__item-value {
  font-size: var(--font-base);
  font-weight: 500;
  color: var(--clr-text);
}

/* ─── Dark mode overrides ────────────────────────────────────────── */

[data-theme="dark"] .results-table {
  border-color: #2a3040;
}

[data-theme="dark"] .results-table thead th {
  background: #1e2536;
  border-bottom-color: #2a3040;
  color: #a09080;
}

[data-theme="dark"] .results-table td {
  border-bottom-color: #1e2536;
}

[data-theme="dark"] .results-table .row-even td {
  background: #161b27;
}

[data-theme="dark"] .results-table .row-odd td {
  background: #111621;
}

[data-theme="dark"] .results-table tbody tr.row-hover td {
  background: rgba(201, 149, 42, 0.18) !important;
}

[data-theme="dark"] .person-card {
  background: #161b27;
  border-color: #2a3040;
}

[data-theme="dark"] .person-card:nth-child(even) {
  background: #111621;
}

[data-theme="dark"] .card-header {
  border-bottom-color: #2a3040;
}

[data-theme="dark"] .info-row {
  background: rgba(255,255,255,0.04);
}

[data-theme="dark"] .person-modal__content {
  background: #161b27;
  border-color: #2a3040;
}

[data-theme="dark"] .person-detail__section h3 {
  color: #C9952A;
  border-bottom-color: #2a3040;
}

[data-theme="dark"] .person-detail__item-label {
  color: #a09080;
}

[data-theme="dark"] .pagination__btn {
  background: #161b27;
  border-color: #2a3040;
}

[data-theme="dark"] .pagination__btn:hover {
  background: rgba(201, 149, 42, 0.15);
}

[data-theme="dark"] .empty-state__tips {
  background: #161b27;
  border-color: #2a3040;
}

/* ─── Contenu SEO ────────────────────────────────────────────────── */

.seo-content {
  max-width: 800px;
  margin: 0 auto;
  padding: var(--space-8) 0 var(--space-12);
  color: var(--clr-text);
  line-height: 1.7;
}

.seo-content h2 {
  font-family: 'Playfair Display', serif;
  font-size: var(--font-xl);
  font-weight: 600;
  color: var(--clr-text);
  margin: var(--space-8) 0 var(--space-4);
}

.seo-content h2:first-child {
  margin-top: 0;
}

.seo-content p {
  margin-bottom: var(--space-4);
  font-size: var(--font-base);
  color: var(--clr-text-muted);
}

.seo-content ul {
  margin: 0 0 var(--space-4) var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.seo-content li {
  font-size: var(--font-base);
  color: var(--clr-text-muted);
}

.seo-content strong {
  color: var(--clr-text);
}

/* FAQ accordéon */
.faq-item {
  border: 1px solid #d4c9b5;
  border-radius: var(--radius-base);
  margin-bottom: var(--space-3);
  overflow: hidden;
}

[data-theme="dark"] .faq-item {
  border-color: #2a3040;
}

.faq-item summary {
  cursor: pointer;
  padding: var(--space-4) var(--space-5);
  background: #FAF7F2;
  list-style: none;
  transition: background var(--ease-base);
}

.faq-item summary::-webkit-details-marker { display: none; }

.faq-item summary::before {
  content: '+';
  float: right;
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--clr-accent);
  margin-left: var(--space-3);
}

.faq-item[open] summary::before {
  content: '−';
}

[data-theme="dark"] .faq-item summary {
  background: #161b27;
}

.faq-item summary:hover {
  background: #F0EBDF;
}

[data-theme="dark"] .faq-item summary:hover {
  background: #1e2536;
}

.faq-item summary h3 {
  display: inline;
  font-size: var(--font-base);
  font-weight: 600;
  color: var(--clr-text);
  margin: 0;
}

.faq-item p {
  padding: var(--space-4) var(--space-5);
  margin: 0;
  background: #FFFFFF;
  font-size: var(--font-sm);
  color: var(--clr-text-muted);
  line-height: 1.7;
}

[data-theme="dark"] .faq-item p {
  background: #0e1520;
}

/* ─── Utilitaires ─────────────────────────────────────────────────── */

.hidden { display: none !important; }

@media (max-width: 768px) {
  .insee-layout { padding: var(--space-4) var(--space-2); }
  .search-form { padding: var(--space-4); }
  .search-form__main { grid-template-columns: 1fr; }
  .form-group--lieu { grid-column: span 1; }
  .search-form__filters { gap: var(--space-4); }
  .filter-options { gap: var(--space-2); }
  .results-header { flex-direction: column; align-items: flex-start; gap: var(--space-3); }
  .person-detail__grid { grid-template-columns: 1fr; }
  .person-modal__content { padding: var(--space-4); }
}