/* =============================================================================
   Astrolabe — Widget : À Paraître (jxc-paraitre-*)
   @keyframes jxc-spin + is-loading → jxc-shared.css
   ============================================================================= */

.jxc-paraitre-widget {
position: relative;
padding: 0 0 40px;
}

/* ── Tagline ─────────────────────────────────────────────────────────────────── */

.jxc-paraitre-tagline {
font-family: var(--jxc-font);
font-size: 17px;
font-weight: 400;
color: var(--jxc-text-muted, #646464);
line-height: 1.6;
margin: 0 0 40px;
max-width: 780px;
}

/* ── Barre de filtres mois ───────────────────────────────────────────────────── */

.jxc-paraitre-tabs {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin: 0 0 40px;
padding: 0;
}

.jxc-paraitre-month-tab {
padding: 8px 18px;
font-family: var(--jxc-font);
font-size: 13px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.05em;
color: var(--jxc-dark);
background: #ffffff;
border: 2px solid var(--jxc-border-light);
border-radius: 4px;
cursor: pointer;
transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
line-height: 1.4;
}

.jxc-paraitre-month-tab:hover {
background-color: var(--jxc-dark);
border-color: var(--jxc-dark);
color: #ffffff;
}

.jxc-paraitre-month-tab.is-active {
background-color: var(--jxc-accent);
border-color: var(--jxc-accent);
color: #ffffff;
}

/* ── Titre de section mois ───────────────────────────────────────────────────── */

.jxc-paraitre-month-section {
margin: 0 0 50px;
}

.jxc-paraitre-month-section:last-child {
margin-bottom: 0;
}

.jxc-paraitre-month-title {
font-family: var(--jxc-font);
font-size: 40px;
font-weight: 900;
text-transform: uppercase;
line-height: 44px;
color: var(--jxc-dark) !important;
margin: 0 0 24px;
}


/* ── Carte album ─────────────────────────────────────────────────────────────── */

.jxc-paraitre-card {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: 0;
}

.jxc-paraitre-card__cover-link {
display: block;
width: 100%;
text-decoration: none;
overflow: hidden;
border-radius: 3px;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
transition: box-shadow 0.25s ease, transform 0.25s ease;
line-height: 0;
}

.jxc-paraitre-card:hover .jxc-paraitre-card__cover-link {
box-shadow: 0 8px 28px rgba(0, 0, 0, 0.22);
transform: translateY(-3px);
}

.jxc-paraitre-card__cover {
width: 100%;
height: auto;
display: block;
aspect-ratio: 7 / 10;
object-fit: cover;
border-radius: 3px;
}

.jxc-paraitre-card__body {
width: 100%;
padding: 12px 4px 0;
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
}

.jxc-paraitre-card__date {
display: block;
font-family: var(--jxc-font);
font-size: 12px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.08em;
color: var(--jxc-accent);
line-height: 1.3;
}

.jxc-paraitre-card__title {
margin: 4px 0 0;
font-family: var(--jxc-font);
font-size: 15px;
font-weight: 700;
line-height: 1.25;
}

.jxc-paraitre-card__title a {
text-decoration: none;
color: var(--jxc-dark);
transition: color 0.2s ease;
}

.jxc-paraitre-card__title a:hover { color: var(--jxc-accent); }

.jxc-paraitre-card__tome {
margin: 2px 0 0;
font-family: var(--jxc-font);
font-size: 14px;
font-weight: 400;
color: #646464;
line-height: 1.3;
}

.jxc-paraitre-card__authors {
margin: 2px 0 0;
font-family: var(--jxc-font);
font-size: 14px;
font-weight: 400;
color: #646464;
font-style: italic;
line-height: 1.3;
}

.jxc-paraitre-card__author-link {
color: inherit;
text-decoration: none;
transition: color 0.2s ease;
}

.jxc-paraitre-card__author-link:hover {
color: var(--jxc-accent);
text-decoration: underline;
}

.jxc-paraitre-card__collection {
margin: 4px 0 0;
font-family: var(--jxc-font);
font-size: 11px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.06em;
color: #888;
line-height: 1.3;
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
}

.jxc-paraitre-card__coll-picto {
height: 24px;
width: auto;
display: inline-block;
vertical-align: middle;
object-fit: contain;
flex-shrink: 0;
}

.jxc-paraitre-card__keywords {
margin: 4px 0 0;
font-family: var(--jxc-font);
font-size: 11px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.06em;
color: #888;
line-height: 1.3;
}

.jxc-paraitre-card__genre {
display: inline-block;
margin: 6px 0 0;
padding: 2px 10px;
font-family: var(--jxc-font);
font-size: 11px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.06em;
color: var(--jxc-accent);
border: 1px solid var(--jxc-accent);
border-radius: 3px;
line-height: 1.5;
}

/* ── États ────────────────────────────────────────────────────────────────────── */

.jxc-paraitre-empty {
font-family: var(--jxc-font);
font-size: 15px;
color: var(--jxc-text-muted);
text-align: center;
padding: 40px 0;
}

.jxc-paraitre-load-more {
display: block;
margin: 32px auto 0;
padding: 11px 32px;
font-family: var(--jxc-font);
font-size: 14px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.06em;
color: var(--jxc-accent);
background: transparent;
border: 2px solid var(--jxc-accent);
border-radius: 4px;
cursor: pointer;
transition: background-color 0.2s ease, color 0.2s ease;
line-height: 1.4;
}

.jxc-paraitre-load-more:hover {
background-color: var(--jxc-accent);
color: #ffffff;
}

.jxc-paraitre-load-more:disabled { opacity: 0.5; cursor: not-allowed; }

.jxc-paraitre-loader {
text-align: center;
padding: 24px 0;
}

.jxc-paraitre-spinner {
display: inline-block;
width: 36px;
height: 36px;
border: 3px solid var(--jxc-border-light);
border-top-color: var(--jxc-accent);
border-radius: 50%;
animation: jxc-spin 0.7s linear infinite;
}

/* ── Responsive ──────────────────────────────────────────────────────────────── */

@media (max-width: 1024px) {
.jxc-paraitre-month-title { font-size: 32px; }
}

@media (max-width: 767px) {
.jxc-paraitre-tabs { gap: 6px; }

.jxc-paraitre-month-tab {
padding: 6px 12px;
font-size: 12px;
}

.jxc-paraitre-month-title {
font-size: 24px;
}
}