/* ======= Toast ======= */
.me-stars__toast{
  position: sticky;
  top: 8px;
  z-index: 2;
  background: #EAF7EF;
  color:#1B6B46;
  border:1px solid #B7E4CE;
  padding:10px 12px;
  border-radius:10px;
  margin-bottom:8px;
  font-weight:600;
}
.me-stars__toast.is-error{
  background:#FFECEF;
  color:#D13863;
  border-color:#D13863;
}

/* ================== ARTICLES — CSS ================== */
:root{
  --brand:#1E274A;
  --sand:#EACD90;
  --row-alt:#FFF8E4;
  --ok-bg:#EAF7EF;
  --ok-bd:#B7E4CE;
  --ok-tx:#1B6B46;
}

.me-stars__top{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  margin:8px 0 16px;
}

.me-stars__add{
  background:#EACD90;
  border:none;
  border-radius:9999px;
  padding:12px 18px;
  font-weight:700;
  line-height:1;
  color:#1E274A !important;
  text-decoration:none;
  display:inline-block;
  transform:scale(1);
  transition:transform .3s ease;
}
.me-stars__add:hover{ transform:scale(1.05); }

.me-stars__table{
  width:100%;
  table-layout:fixed;
  border-collapse:separate !important;
  border-spacing:0 14px !important;
  color:var(--brand);
  border:0 !important;
}

.me-stars__table thead,
.me-stars__table tbody,
.me-stars__table tr,
.me-stars__table th,
.me-stars__table td{
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background-image:none !important;
}

.me-stars__table thead th{
  text-align:left;
  font-weight:700;
  padding:12px 24px;
  background:transparent !important;
}

.me-stars__table .col-title{ width:40% }
.me-stars__table .col-dm{ width:20% }
.me-stars__table .col-status{ width:20% }
.me-stars__table .col-actions{ width:20% }

.me-stars__table tbody td{
  position:relative;
  z-index:1;
  padding:18px 24px;
  vertical-align:middle;
  background:#fff;
}

.me-stars__table tbody tr:nth-child(odd) td{
  background:var(--row-alt);
}

.me-stars__table tbody td:first-child{ border-radius:20px 0 0 20px }
.me-stars__table tbody td:last-child{ border-radius:0 20px 20px 0 }

.title-cell{ display:flex; align-items:center; gap:14px }
.title-thumb{
  width:60px;
  height:60px;
  border-radius:10px;
  object-fit:cover;
  background:#eee;
  flex:0 0 60px;
}
.post-title{ font-weight:600 }

.with-icon{ display:inline-flex; align-items:center; gap:8px }
.ico{ width:18px; height:18px; display:block }
.ico-cal{ width:20px; height:20px; color:#EACD90 }

.me-stars__status{
  display:inline-block;
  padding:6px 10px;
  border-radius:9999px;
  font-weight:600;
  font-size:14px;
  background:var(--ok-bg);
  color:var(--ok-tx);
  border:1px solid var(--ok-bd);
}

/* ===== Actions ===== */
.me-stars__actionsTh{ text-align:right; padding-right:24px }
.me-stars__actions{
  text-align:right;
  white-space:nowrap;
  padding-right:24px;
}

.me-stars__actions .action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  border-radius:50%;
  vertical-align:middle;
  margin-left:12px;
  line-height:0;
  padding:0;
  border:1.5px solid transparent;
  cursor:pointer;
  transition:transform .15s ease, filter .15s ease;
}
.me-stars__actions .action:first-child{ margin-left:0 }
.me-stars__actions .action:hover{
  transform:scale(1.05);
  filter:brightness(.97);
}
.me-stars__actions .action::before{
  content:"";
  width:24px;
  height:24px;
  display:block;
  background-repeat:no-repeat;
  background-position:center;
  background-size:24px 24px;
}
.action--view{ background:#1E274A; border-color:#1E274A }
.action--view::before{ background-image:url("https://www.mariage-etoile.fr/wp-content/uploads/2025/09/icon-voir.svg") }
.action--del{ background:#FFCACA; border-color:#FFCACA; color:#1E274A }
.action--del::before{ background-image:url("https://www.mariage-etoile.fr/wp-content/uploads/2025/09/icon-supprimer.svg") }

.me-stars__empty{
  text-align:center;
  padding:24px;
}

/* ===== Responsive ===== */
@media (max-width:900px){
  .me-stars__table .col-title{width:42%}
  .me-stars__table .col-dm{width:18%}
  .me-stars__table .col-status{width:28%}
  .me-stars__table .col-actions{width:12%}
}
@media (max-width:720px){
  .me-stars__table thead{display:none}
  .me-stars__table,
  .me-stars__table tbody,
  .me-stars__table tr,
  .me-stars__table td{
    display:block;
    width:100%;
  }
  .me-stars__table tbody td{
    padding:12px 16px;
    border-radius:12px !important;
  }
  .me-stars__actions{
    margin-top:8px;
    text-align:right;
  }
}