@charset "UTF-8";
/* actu.css — Page Actualités (actualites.html) */
body.page-actus{
  margin:0; background:linear-gradient(180deg,#fff 0%,var(--brand-soft-2,#f1fcfa) 100%);
  color:var(--ink,#1b2430); font-family:var(--font-body,'Public Sans','Segoe UI',Arial,sans-serif);
}
.actus-main{ max-width:1100px; margin:0 auto; padding:40px 24px 64px; box-sizing:border-box; min-height:60vh; }
.actus-hero{ text-align:center; margin-bottom:32px; }
.actus-kicker{ margin:0 0 6px; font-size:.8rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--brand-strong,#0d8b73); }
.actus-hero h1{ margin:0 0 10px; font-family:var(--font-display,'Fraunces',Georgia,serif); font-size:clamp(1.8rem,4vw,2.6rem); color:var(--ink,#1b2430); }
.actus-intro{ margin:0 auto; max-width:620px; color:var(--ink-soft,#4b5a63); line-height:1.6; }

.news-list{ list-style:none; margin:0; padding:0; display:grid; gap:20px; grid-template-columns:1fr; }
@media(min-width:700px){ .news-list{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1000px){ .news-list{ grid-template-columns:repeat(3,1fr); } }
.news-item{
  position:relative; background:#fff; border:1px solid var(--line,#e4ece9); border-radius:var(--radius-lg,18px);
  padding:22px 22px 24px; box-shadow:0 10px 26px -18px rgba(27,36,48,.35); text-align:left;
  border-top:4px solid var(--brand,#14a892);
}
.news-item[hidden]{ display:none; }
.news-date{ display:inline-block; font-size:.78rem; font-weight:700; color:var(--brand-deep,#0b6c58); background:var(--brand-soft,#e8f7f3); padding:3px 10px; border-radius:999px; }
.news-title{ margin:12px 0 8px; font-family:var(--font-display,'Fraunces',Georgia,serif); font-size:1.2rem; line-height:1.3; text-align:left; }
.news-desc{ margin:0; font-size:.95rem; line-height:1.6; color:#334155; text-align:left; }
/* (ancien système d'emplacements) */
.news-item.is-draft{ border:2px dashed var(--gold,#c7ae33); opacity:.8; }
.news-item.is-draft::after{ content:"Vide — invisible pour les visiteurs"; position:absolute; top:-11px; left:16px; background:var(--gold,#c7ae33); color:#1b2430; font-size:.7rem; font-weight:800; padding:2px 8px; border-radius:999px; }

/* Photo "lifestyle" en tête de carte (remplaçable par l'admin) */
.news-item{ overflow:hidden; }
.news-media{ margin:-22px -22px 16px; aspect-ratio:3/2; overflow:hidden; background:#e8f7f3; }
.news-media[hidden]{ display:none; }
.news-media img{ width:100%; height:100% !important; object-fit:cover; display:block; transition:transform .8s ease; }
.news-item:hover .news-media img{ transform:scale(1.04); }
.news-item:has(.news-media:not([hidden])){ border-top:0; }
/* Mobile-first : la 1re actualité en "une" façon magazine */
@media(min-width:1000px){
  .news-list > .news-item:first-child:not([hidden]){ grid-column:span 2; }
}
.actus-hero h1{ font-weight:600; letter-spacing:-.02em; font-size:clamp(2.1rem,8vw,3.6rem); line-height:1.05; }

.actus-empty{ text-align:center; color:var(--ink-soft,#4b5a63); margin:24px 0; }
.actus-admin-hint{ max-width:720px; margin:24px auto 0; font-size:.85rem; color:var(--ink-soft,#4b5a63); background:#fff8e1; border:1px solid #f0dca0; border-radius:10px; padding:10px 14px; text-align:center; }
.actus-empty[hidden],.actus-admin-hint[hidden]{ display:none; }

.actus-cta{ display:flex; justify-content:center; gap:12px; flex-wrap:wrap; margin-top:40px; }
.tyk-btn-inline{
  display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 22px; border-radius:6px;
  font-weight:800; text-decoration:none; color:#fff;
  background:linear-gradient(110deg,var(--brand-deep,#0b6c58) 0%,var(--brand,#14a892) 100%);
}
.tyk-btn-inline.ghost{ background:#fff; color:var(--brand-strong,#0d8b73); border:1.5px solid var(--brand-strong,#0d8b73); }
.tyk-btn-inline:focus-visible{ outline:3px solid var(--gold,#c7ae33); outline-offset:2px; }
@media(max-width:560px){ .actus-main{ padding:28px 16px 48px; } .tyk-btn-inline{ width:100%; } }

/* ======================================================================
   Administration des actualités (actualites.js) — même style que l'édition des logements
   ====================================================================== */
.news-list[aria-busy="true"]{ min-height:200px; }
.actus-adminbar{
  position:relative; display:flex; flex-wrap:wrap; align-items:center; gap:14px 20px; margin:0 0 26px; padding:16px 22px 16px 24px;
  background:#fff; border:1px solid #edf0f4; border-radius:14px; box-shadow:0 14px 30px -24px rgba(30,39,53,.5); color:#1e2735;
}
.actus-adminbar[hidden]{ display:none; }
.actus-adminbar::before{ content:""; position:absolute; left:0; top:16px; bottom:16px; width:3px; border-radius:2px; background:#232e3f; }
.actus-adminbar p{ flex:1 1 280px; margin:0; font-size:.88rem; line-height:1.5; color:#64748b; text-align:left; }
.actus-adminbar p strong{ display:block; font-size:.82rem; letter-spacing:.18em; text-transform:uppercase; color:#1e2735; }
.actus-adminbar button{
  display:inline-flex; align-items:center; gap:9px; min-height:44px; padding:0 22px; border:0; border-radius:9px; cursor:pointer;
  background:#232e3f; color:#fff; font:inherit; font-size:.9rem; font-weight:600; box-shadow:0 10px 22px -12px rgba(30,39,53,.8);
}
.actus-adminbar button::before{ content:"+"; font-size:1.25rem; line-height:1; font-weight:400; }
.actus-adminbar button:hover{ background:#33415a; }
.news-admin{ display:flex; gap:8px; margin-top:16px; padding-top:14px; border-top:1px solid #edf0f4; }
.na-btn{
  display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:0 16px; border:1px solid #cfd6e0; border-radius:8px;
  background:#fff; color:#1e2735; font:inherit; font-size:.85rem; font-weight:600; cursor:pointer;
}
.na-btn:hover{ border-color:#33415a; background:#f5f7fa; }
.na-btn.danger{ color:#dc2626; border-color:#f3a5a5; background:#fff7f7; }
.na-btn.danger:hover{ background:#fee2e2; border-color:#dc2626; }
.na-btn.primary{ min-height:46px; padding:0 28px; border:0; background:#232e3f; color:#fff; box-shadow:0 10px 22px -12px rgba(30,39,53,.8); }
.na-btn.primary:hover{ background:#33415a; }
.na-btn:disabled{ opacity:.6; cursor:wait; }
.na-btn:focus-visible, .na-drop:focus-visible, .na-link:focus-visible{ outline:3px solid #94a3b8; outline-offset:2px; }

body.na-open{ overflow:hidden; }
.na-overlay{
  position:fixed; inset:0; z-index:60000; display:flex; align-items:flex-start; justify-content:center; padding:32px 16px; overflow-y:auto;
  background:rgba(20,27,38,.55); backdrop-filter:blur(3px);
}
.na-dialog{
  position:relative; width:100%; max-width:680px; box-sizing:border-box; padding:30px 30px 26px; border-radius:16px; background:#fff; color:#1e2735;
  font-family:var(--font-body,'Public Sans','Segoe UI',Arial,sans-serif); text-align:left; box-shadow:0 30px 60px -20px rgba(15,23,32,.5);
}
.na-dialog h2{ margin:0 44px 6px 0; padding:2px 0 2px 16px; border-left:3px solid #232e3f; font-size:1rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.na-sub{ margin:0 0 22px; padding-left:19px; font-size:.86rem; color:#64748b; }
.na-close{ position:absolute; top:16px; right:16px; width:36px; height:36px; display:grid; place-items:center; border-radius:9px; border:1px solid #e2e7ee; background:#f5f7fa; color:#1e2735; font-size:1.25rem; cursor:pointer; }
.na-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:16px 18px; }
.na-field{ display:flex; flex-direction:column; gap:7px; font-size:.86rem; font-weight:500; }
.na-field.full{ grid-column:1 / -1; }
.na-field small{ font-weight:400; font-size:.76rem; color:#64748b; }
.na-field :is(input[type=text],input[type=date],input[type=url],textarea){
  box-sizing:border-box; width:100%; min-height:44px; padding:10px 14px; background:#f5f7fa; border:1px solid #e2e7ee; border-radius:9px;
  font:inherit; font-size:.92rem; font-weight:400; color:#1e2735;
}
.na-field textarea{ resize:vertical; line-height:1.55; }
.na-field :is(input,textarea):focus{ outline:none; background:#fff; border-color:#33415a; box-shadow:0 0 0 3px rgba(51,65,90,.14); }
.na-photo{ display:grid; grid-template-columns:200px minmax(0,1fr); gap:16px; align-items:start; }
.na-preview{ aspect-ratio:3/2; border-radius:10px; overflow:hidden; background:#eef1f5; border:1px dashed #cfd6e0; display:grid; place-items:center; color:#64748b; font-size:.8rem; }
.na-preview img{ width:100%; height:100%; object-fit:cover; display:block; }
.na-photo-actions{ display:flex; flex-direction:column; gap:10px; }
.na-drop{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-height:72px; padding:12px; border:0; border-radius:10px; cursor:pointer;
  background:#232e3f; color:#fff; font:inherit; outline:1.5px dashed rgba(255,255,255,.55); outline-offset:-7px;
}
.na-drop strong{ font-size:.9rem; font-weight:600; }
.na-drop small{ font-size:.75rem; opacity:.8; }
.na-drop:hover, .na-drop.is-over{ background:#33415a; }
.na-url{ display:flex; gap:8px; }
.na-url input{ flex:1; min-width:0; min-height:40px; padding:8px 12px; background:#f5f7fa; border:1px solid #e2e7ee; border-radius:9px; font:inherit; font-size:.86rem; }
.na-link{ align-self:flex-start; padding:0; border:0; background:none; color:#dc2626; font:inherit; font-size:.82rem; font-weight:600; text-decoration:underline; cursor:pointer; }
.na-link[hidden]{ display:none; }
.na-error{ margin:16px 0 0; padding:10px 12px; border-radius:8px; background:#fdecec; color:#9b1c1c; font-size:.85rem; }
.na-error[hidden]{ display:none; }
.na-actions{ display:flex; justify-content:flex-end; gap:10px; margin-top:22px; padding-top:18px; border-top:1px solid #e2e7ee; }
@media (max-width:600px){
  .na-overlay{ padding:0; }
  .na-dialog{ min-height:100%; border-radius:0; padding:22px 16px; }
  .na-grid, .na-photo{ grid-template-columns:1fr; }
  .na-actions{ flex-direction:column-reverse; }
  .na-actions .na-btn{ width:100%; }
  .actus-adminbar button{ width:100%; justify-content:center; }
}
.na-dialog h2{ text-align:left !important; font-family:var(--font-body,'Public Sans','Segoe UI',Arial,sans-serif) !important; line-height:1.3; }
.na-dialog :is(p,label,small,legend){ text-align:left; }

/* Flèche « Voir comme un visiteur » : replie la barre admin et masque Modifier / Supprimer */
.actus-adminbar .actus-fold{
  gap:8px; padding:0 14px 0 12px; background:#fff; color:#1e2735; border:1px solid #cfd6e0; box-shadow:none; font-size:.82rem;
}
.actus-adminbar .actus-fold::before{
  content:""; width:9px; height:9px; margin-top:-4px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); transition:transform .2s, margin .2s;
}
.actus-adminbar .actus-fold:hover{ background:#f5f7fa; border-color:#33415a; }
body.actus-preview .actus-adminbar .actus-fold::before{ transform:rotate(-135deg); margin-top:4px; }
body.actus-preview .actus-adminbar [data-actu-add], body.actus-preview .news-admin{ display:none !important; }
body.actus-preview .actus-adminbar p{ font-size:0; }
body.actus-preview .actus-adminbar p strong{ font-size:.82rem; }
body.actus-preview .actus-adminbar p::after{ content:"Édition repliée — vous voyez la page comme un visiteur"; display:block; font-size:.88rem; }

/* Texte des actualités mis en forme (**gras**, puces) */
.news-desc p{ margin:0 0 10px; }
.news-desc p:last-child, .news-desc ul:last-child{ margin-bottom:0; }
.news-desc ul{ margin:0 0 10px; padding:0; list-style:none; display:grid; gap:6px; }
.news-desc li{ position:relative; padding-left:18px; }
.news-desc li::before{ content:""; position:absolute; left:3px; top:.65em; width:6px; height:6px; border-radius:50%; background:#33415a; }
.news-desc strong{ color:#1e2735; }
