/* ============================================================
   Pawa Pastoral — Frontend CSS
   ============================================================ */

:root {
  --pawap-primary:   #2C3E50;
  --pawap-accent:    #3498DB;
  --pawap-success:   #27AE60;
  --pawap-warning:   #F39C12;
  --pawap-danger:    #E74C3C;
  --pawap-purple:    #8E44AD;
  --pawap-bg:        #F8F9FA;
  --pawap-border:    #DEE2E6;
  --pawap-text:      #2C3E50;
  --pawap-muted:     #6C757D;
  --pawap-radius:    10px;
  --pawap-shadow:    0 2px 12px rgba(0,0,0,.08);
  --pawap-font:      'Open Sans', sans-serif;
}

/* ── Wrapper ─────────────────────────────────────────────── */
.pawap-wrap { font-family: var(--pawap-font); color: var(--pawap-text); max-width: 760px; margin: 0 auto; padding: 0 16px; }

/* ── Card ────────────────────────────────────────────────── */
.pawap-card { background: #fff; border: 1px solid var(--pawap-border); border-radius: var(--pawap-radius); overflow: hidden; box-shadow: var(--pawap-shadow); }
.pawap-card__header { background: linear-gradient(135deg, #2C3E50, #34495e); color: #fff; padding: 24px 28px; }
.pawap-card__header h2 { margin: 0 0 8px; font-size: 20px; font-weight: 700; }
.pawap-card__header p  { margin: 0; opacity: .85; font-size: 14px; }
.pawap-card__body { padding: 28px; }

/* ── Formulaires ─────────────────────────────────────────── */
.pawap-form-group { margin-bottom: 20px; }
.pawap-form-group label { display: block; font-weight: 600; font-size: 14px; margin-bottom: 6px; color: var(--pawap-primary); }
.pawap-input, .pawap-textarea, .pawap-select {
  width: 100%; padding: 10px 14px; border: 1.5px solid var(--pawap-border);
  border-radius: 6px; font-size: 14px; font-family: var(--pawap-font);
  outline: none; transition: border-color .2s, box-shadow .2s; box-sizing: border-box;
}
.pawap-input:focus, .pawap-textarea:focus, .pawap-select:focus {
  border-color: var(--pawap-accent); box-shadow: 0 0 0 3px rgba(52,152,219,.12);
}
.pawap-textarea { resize: vertical; min-height: 100px; }
.pawap-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

/* ── Boutons ─────────────────────────────────────────────── */
.pawap-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 22px; border-radius: 6px; font-size: 14px; font-weight: 600;
  cursor: pointer; text-decoration: none; border: 2px solid transparent;
  transition: all .2s; font-family: var(--pawap-font); white-space: nowrap;
}
.pawap-btn--primary  { background: var(--pawap-accent); color: #fff; border-color: var(--pawap-accent); }
.pawap-btn--primary:hover { background: #2980b9; border-color: #2980b9; color: #fff; }
.pawap-btn--outline  { background: transparent; color: var(--pawap-primary); border-color: var(--pawap-primary); }
.pawap-btn--outline:hover { background: var(--pawap-primary); color: #fff; }
.pawap-btn--ghost    { background: transparent; color: var(--pawap-muted); border-color: var(--pawap-border); }
.pawap-btn--ghost:hover { background: var(--pawap-bg); }
.pawap-btn--sm       { padding: 6px 14px; font-size: 13px; }

/* ── Alertes ─────────────────────────────────────────────── */
.pawap-alert { padding: 12px 16px; border-radius: 6px; font-size: 14px; margin-bottom: 16px; }
.pawap-alert--success { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
.pawap-alert--error   { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }

/* ── Section header ─────────────────────────────────────── */
.pawap-section-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; flex-wrap: wrap; gap: 10px; }
.pawap-section-header h2 { margin: 0; font-size: 20px; }

/* ── Tabs de filtre ─────────────────────────────────────── */
.pawap-filter-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 20px; }
.pawap-tab {
  padding: 6px 14px; border: 1.5px solid var(--pawap-border); border-radius: 20px;
  /*background: #fff;*/ font-size: 13px; cursor: pointer; transition: all .15s;
  font-family: var(--pawap-font); white-space: nowrap;
}
.pawap-tab:hover, .pawap-tab.is-active { background: var(--pawap-primary); border-color: var(--pawap-primary); color: #fff; }

/* ── Cartes items (prières / RDV) ────────────────────────── */
.pawap-item-card {
  background: #fff; border: 1px solid var(--pawap-border); border-radius: var(--pawap-radius);
  padding: 18px; margin-bottom: 14px; box-shadow: var(--pawap-shadow);
  border-left: 4px solid var(--pawap-border); transition: box-shadow .2s;
}
.pawap-item-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,.1); }

.pawap-status-pending     { border-left-color: var(--pawap-warning); }
.pawap-status-in_progress { border-left-color: var(--pawap-purple); }
.pawap-status-answered    { border-left-color: var(--pawap-success); }
.pawap-status-closed      { border-left-color: var(--pawap-muted); }
.pawap-status-confirmed   { border-left-color: var(--pawap-success); }
.pawap-status-cancelled   { border-left-color: var(--pawap-danger); }
.pawap-status-done        { border-left-color: var(--pawap-accent); }

.pawap-item-card__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.pawap-item-card__header h3 { margin: 0; font-size: 16px; font-weight: 700; }
.pawap-item-card__body { font-size: 14px; color: var(--pawap-muted); margin: 0 0 10px; line-height: 1.5; }
.pawap-item-card__footer { display: flex; gap: 16px; font-size: 12px; color: var(--pawap-muted); }
.pawap-item-card__note { background: #fffde7; border: 1px solid #ffe082; border-radius: 6px; padding: 12px; margin-top: 12px; font-size: 13px; }
.pawap-item-card__note strong { display: block; margin-bottom: 4px; }
.pawap-item-card__location { font-size: 13px; color: var(--pawap-muted); margin: 6px 0 0; }

/* Badges statut */
.pawap-status-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 10px; border-radius: 20px; font-size: 11px; font-weight: 700;
  white-space: nowrap; flex-shrink: 0;
}
.pawap-status-badge--pending     { background: #fff3cd; color: #856404; }
.pawap-status-badge--in_progress { background: #f3e5f5; color: #6a1b9a; }
.pawap-status-badge--answered    { background: #d4edda; color: #155724; }
.pawap-status-badge--closed      { background: #e9ecef; color: #495057; }
.pawap-status-badge--confirmed   { background: #d4edda; color: #155724; }
.pawap-status-badge--cancelled   { background: #f8d7da; color: #721c24; }
.pawap-status-badge--done        { background: #cce5ff; color: #004085; }
.pawap-status-badge--pending.appt{ background: #fff3cd; color: #856404; }

/* Infos RDV */
.pawap-appt-meta { display: flex; gap: 16px; flex-wrap: wrap; font-size: 13px; color: var(--pawap-muted); margin-bottom: 10px; }

/* ── Contenu du jour ─────────────────────────────────────── */
.pawap-daily-card {
  background: linear-gradient(160deg, #1a252f, #2C3E50);
  color: #fff; border-radius: 14px; padding: 36px 32px;
  text-align: center; box-shadow: 0 8px 32px rgba(0,0,0,.2);
  position: relative; overflow: hidden;
}
.pawap-daily-card::before {
  content: '✨'; position: absolute; top: -10px; right: 20px; font-size: 80px; opacity: .07;
}
.pawap-daily-card__badge {
  display: inline-block; background: rgba(255,255,255,.15);
  backdrop-filter: blur(4px); padding: 6px 16px; border-radius: 20px;
  font-size: 13px; font-weight: 600; margin-bottom: 20px;
}
.pawap-daily-card__title { font-size: 22px; font-weight: 700; margin: 0 0 16px; }
.pawap-daily-card__body { font-size: 18px; line-height: 1.8; font-style: italic; margin: 0 0 20px; opacity: .95; }
.pawap-daily-card__ref  { font-size: 15px; font-weight: 600; opacity: .8; margin: 0 0 20px; }
.pawap-daily-card__audio { margin: 16px 0; }
.pawap-daily-card__audio audio { width: 100%; opacity: .9; }
.pawap-daily-card__share { margin-top: 12px; }
.pawap-daily-card .pawap-btn--ghost { color: rgba(255,255,255,.8); border-color: rgba(255,255,255,.3); }
.pawap-daily-card .pawap-btn--ghost:hover { background: rgba(255,255,255,.1); color: #fff; }

/* ── Notifications ────────────────────────────────────────── */
.pawap-badge-count {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--pawap-danger); color: #fff; border-radius: 50%;
  width: 22px; height: 22px; font-size: 11px; font-weight: 700; margin-left: 6px;
}

.pawap-notif-list { display: flex; flex-direction: column; gap: 10px; }

.pawap-notif-item {
  background: #fff; border: 1px solid var(--pawap-border); border-radius: 8px;
  padding: 14px 16px; cursor: pointer; transition: background .15s;
}
.pawap-notif-item.is-unread { background: #f0f7ff; border-color: #90caf9; }
.pawap-notif-item:hover { background: var(--pawap-bg); }

.pawap-notif-item__title {
  display: flex; align-items: center; gap: 8px;
  font-weight: 700; font-size: 15px; margin-bottom: 4px;
}
.pawap-unread-dot {
  width: 8px; height: 8px; background: var(--pawap-accent);
  border-radius: 50%; flex-shrink: 0;
}
.pawap-notif-item__msg  { font-size: 13px; color: var(--pawap-muted); margin: 0 0 6px; }
.pawap-notif-item__date { font-size: 11px; color: var(--pawap-muted); }

/* ── Accès requis ─────────────────────────────────────────── */
.pawap-access-required { text-align: center; padding: 48px 24px; }
.pawap-access-icon     { font-size: 52px; margin-bottom: 12px; }

/* ── Load more ───────────────────────────────────────────── */
.pawap-load-more-wrap { text-align: center; margin-top: 24px; }
.pawap-empty { text-align: center; padding: 40px; color: var(--pawap-muted); background: #fff; border: 1px dashed var(--pawap-border); border-radius: var(--pawap-radius); }

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 600px) {
  .pawap-form-row { grid-template-columns: 1fr; }
  .pawap-daily-card { padding: 24px 20px; }
  .pawap-daily-card__body { font-size: 16px; }
  .pawap-item-card__header { flex-direction: column; }
  .pawap-filter-tabs { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
}