/**
 * KU Showcase Frontend Stylesheet - compact self-hosted edition
 */

.ku-showcase-container {
    --ku-gap: 16px;
    position: relative;
    width: 100%;
    margin: 28px auto;
    padding: 16px 24px 12px;
    box-sizing: border-box;
    border-radius: 14px;
    box-shadow: 0 4px 22px rgba(0, 0, 0, 0.07);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    overflow: hidden;
    background-color: #CCCCCC;
    transition: box-shadow 0.3s ease;
}

.ku-showcase-container * { box-sizing: border-box; }

.ku-showcase-overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    pointer-events: none; z-index: 1;
}

.ku-showcase-inner {
    position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center;
}

.ku-showcase-ad {
    position: absolute;
    top: 8px;
    right: 10px;
    max-width: calc(100% - 20px);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    z-index: 4;
}
.ku-showcase-ad.ku-ad-style1 { background: transparent !important; border: none !important; padding: 2px 4px; }
.ku-showcase-ad.ku-ad-style2 { padding: 3px 7px; }
.ku-showcase-ad.ku-ad-style3 { border-style: solid; border-width: 1px; padding: 2px 6px; }

.ku-showcase-micro {
    text-align: center; font-weight: 700; margin-bottom: 2px; letter-spacing: 0.04em; line-height: 1.2;
}

/* モック寄せ固定SVG見出し */
.ku-showcase-heading-image {
    width: 100%; display: flex; justify-content: center; margin: -1px 0 4px; line-height: 0;
}
.ku-heading-svg {
    display: block; width: min(94%, 420px); height: auto;
}
.ku-heading-svg.is-light {
    filter: brightness(0) invert(1);
}

.ku-slider-wrapper {
    position: relative; width: 100%; margin: 2px 0 10px; padding: 0 16px;
}
.ku-slider-track-window {
    overflow: hidden; width: 100%; padding: 2px 2px 6px; user-select: none;
    -webkit-user-select: none; touch-action: pan-y;
}
.ku-slider-track {
    display: flex; transition: transform 0.35s cubic-bezier(0.25, 1, 0.5, 1);
    will-change: transform; align-items: center; gap: var(--ku-gap, 16px);
}
.ku-slider-slide {
    flex: 0 0 calc((100% - (var(--ku-gap, 16px) * 4)) / 5); min-width: 0;
}
.ku-book-link { display: block; text-decoration: none; color: inherit; }
.ku-book-cover-wrap {
    width: 100%; aspect-ratio: 1 / 1.45; background: #fff; border-radius: 5px; overflow: hidden;
    box-shadow: 0 4px 12px rgba(0,0,0,.12); display: flex; align-items: center; justify-content: center;
    transition: transform .22s ease, box-shadow .22s ease;
}
.ku-book-cover {
    width: 100%; height: 100%; object-fit: contain; display: block; border-radius: 5px;
}
.ku-book-link:hover .ku-book-cover-wrap,
.ku-book-link:focus .ku-book-cover-wrap {
    transform: translateY(-5px); box-shadow: 0 8px 22px rgba(0,0,0,.2);
}

.ku-slider-arrow {
    position: absolute; top: calc(50% - 3px); transform: translateY(-50%); width: 38px; height: 38px;
    border-radius: 50%; background: #fff; border: 1px solid #e2e8f0; box-shadow: 0 2px 10px rgba(0,0,0,.16);
    display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 5; color: #334155;
    padding: 0; transition: background .2s, transform .2s, box-shadow .2s;
}
.ku-slider-arrow:hover { background:#fff; transform:translateY(-50%) scale(1.08); box-shadow:0 4px 14px rgba(0,0,0,.22); }
.ku-slider-arrow.ku-prev { left: -4px; }
.ku-slider-arrow.ku-next { right: -4px; }
.ku-slider-arrow:disabled { opacity:.3; cursor:not-allowed; transform:translateY(-50%) scale(1)!important; }

.ku-cta-text-mobile { display: none; }
.ku-cta-wrapper { width:100%; display:flex; justify-content:center; margin:0 0 4px; }
.ku-cta-button {
    display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 28px;
    text-decoration:none; font-size:16px; font-weight:700; box-shadow:0 4px 14px rgba(230,122,0,.35);
    transition:all .25s ease; cursor:pointer; text-align:center;
}
.ku-cta-button:hover,.ku-cta-button:focus {
    transform:translateY(-2px); box-shadow:0 6px 20px rgba(230,122,0,.48); filter:brightness(1.06);
}
.ku-cta-arrow { display:inline-block; transition:transform .2s ease; flex:0 0 auto; }
.ku-cta-button:hover .ku-cta-arrow { transform:translateX(3px); }

.ku-terms-note {
    width:100%; text-align:center; margin:1px 0 0; line-height:1.35; opacity:.9; font-weight:400;
}
.ku-amazon-content-disclaimer {
    width:100%; margin:-22px auto 28px; padding:0 8px; box-sizing:border-box; color:#777;
    font-size:9px; line-height:1.45; text-align:left; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
}

.ku-no-items { width:100%; text-align:center; padding:24px 12px; color:#64748b; font-size:13px; }

@media (max-width: 768px) {
    .ku-showcase-container { padding:16px 16px 12px; margin:20px auto; }
    .ku-slider-slide { flex:0 0 calc((100% - (var(--ku-gap,16px) * 2)) / 3); }
    .ku-cta-button { width:75%!important; }
}

@media (max-width: 480px) {
    .ku-showcase-container { padding:14px 12px 12px; border-radius:10px; }
    .ku-showcase-ad { top: 6px; right: 8px; font-size: 10px; }
    .ku-showcase-heading-image { margin:-1px 0 3px; }
    .ku-heading-svg { width:min(96%,310px); }
    .ku-slider-wrapper { margin:1px 0 8px; padding:0 12px; }
    .ku-slider-track-window { padding:2px 2px 5px; }
    .ku-slider-slide { flex:0 0 48%; }
    .ku-slider-arrow { width:32px; height:32px; }
    .ku-slider-arrow.ku-prev { left:-8px; }
    .ku-slider-arrow.ku-next { right:-8px; }
    .ku-cta-button { width:60%!important; padding:7px 12px; font-size:13px; gap:6px; }
    .ku-cta-text-desktop { display:none; }
    .ku-cta-text-mobile {
        display:flex; flex-direction:column; align-items:center; justify-content:center; line-height:1.15; white-space:nowrap;
    }
    .ku-terms-note { margin-top:2px; line-height:1.3; }
    .ku-amazon-content-disclaimer { margin:-14px auto 20px; font-size:8px; line-height:1.4; }
}

/* v1.5 continuous autoplay clones reuse the same slide styling. */
