/* frontend/styles/shared-home-openings.css */
/* Shared opening cards appear on home, request menus and linked performance lists. */
.home-opening-performances { margin:0; min-width:0; width:100%; }
.home-opening-performances .pass-section-heading { margin-bottom:8px; }
.home-opening-performances .home-opening-add { position:relative; display:inline-flex; align-items:center; gap:6px; min-height:36px; padding:6px 10px; border:1px solid var(--green,#3ecf8e); border-radius:4px; background:var(--surface,#fff); color:var(--accent-ink,#167c55); font-size:13px; font-weight:600; line-height:20px; text-decoration:none; white-space:nowrap; }
.home-opening-add svg { flex:none; width:18px; height:18px; }
.home-opening-add::after { content:''; position:absolute; inset:-4px 0; }
.home-opening-add:hover { background:#edf8f1; }
.home-opening-add:focus-visible { outline:2px solid var(--accent-ink,#167c55); outline-offset:3px; }
.home-opening-more { display:flex; align-items:center; justify-content:center; box-sizing:border-box; min-height:44px; width:100%; margin-top:12px; padding:10px 16px; border:1px solid var(--primary,#644fc1); border-radius:12px; background:var(--surface,#fff); color:var(--primary,#644fc1); font-size:13px; font-weight:600; line-height:20px; text-decoration:none; }
.home-opening-more:hover { background:var(--primary-soft,#f1eefb); }
.home-opening-more:focus-visible { outline:2px solid var(--primary,#644fc1); outline-offset:3px; }
.home-opening-strip .home-opening-list { display:flex; gap:8px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x proximity; scroll-behavior:smooth; scrollbar-width:none; padding:2px 0; }
.home-opening-strip .home-opening-list::-webkit-scrollbar { display:none; width:0; height:0; }
.home-opening-carousel { position:relative; }
.home-opening-arrow { display:none; position:absolute; z-index:2; top:36%; width:36px; height:36px; padding:8px; border:1px solid #e2ddf0; border-radius:50%; background:#fffffff2; color:#644fc1; box-shadow:0 2px 8px #171b1920; cursor:pointer; transform:translateY(-50%); }
.home-opening-arrow svg { display:block; width:18px; height:18px; }
.home-opening-prev { left:5px; }
.home-opening-next { right:5px; }
.home-opening-next svg { transform:rotate(180deg); }
.home-opening-arrow[hidden] { display:none; }
.home-opening-arrow:disabled { color:#b5afbf; cursor:default; box-shadow:none; }
.home-opening-arrow:focus-visible { outline:2px solid #644fc1; outline-offset:3px; }
@media (any-hover:hover) and (any-pointer:fine) {
  .home-opening-arrow { display:block; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .15s; }
  .home-opening-carousel:hover .home-opening-arrow,.home-opening-carousel:focus-within .home-opening-arrow { opacity:1; visibility:visible; pointer-events:auto; }
  .home-opening-arrow[hidden] { display:none; }
}
.home-opening-performances .pass-section-heading h2 { font-size:14px; line-height:20px; font-weight:600; }
.home-opening-strip .pass-section-heading h2 { font-size:18px; line-height:1.3; }
.home-opening-performances .pass-section-mark { display:none; }
.home-opening-item { box-sizing:border-box; display:flex; flex-direction:column; flex:0 0 calc(40% - 6.4px); min-width:0; gap:0; border:0; border-radius:10px; color:#171b19; text-decoration:none; scroll-snap-align:start; }
.home-opening-art { position:relative; display:block; aspect-ratio:3/4; overflow:hidden; border:1px solid #e2ddf0; border-radius:10px; background:#f1eefb; }
.home-opening-art img { display:block; width:100%; height:100%; object-fit:cover; }
.home-opening-sale { position:absolute; top:6px; left:6px; padding:3px 6px; border-radius:4px; background:var(--primary,#644fc1); color:#fff; font-size:10px; font-weight:600; line-height:14px; white-space:nowrap; }
.home-opening-sale.is-presale { background:var(--green,#3ecf8e); }
.home-opening-placeholder { display:flex; box-sizing:border-box; width:100%; height:100%; padding:12px; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:#644fc1; text-align:center; }
.home-opening-placeholder > span { width:22px; height:22px; opacity:.65; }
.home-opening-placeholder svg { width:100%; height:100%; }
.home-opening-placeholder strong { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; font-size:14px; line-height:20px; font-weight:600; overflow-wrap:anywhere; }
.home-opening-placeholder small { font-size:10px; font-weight:500; opacity:.65; }
.home-opening-item:nth-child(even) .home-opening-art { border-color:#dce9e2; background:#edf8f1; }
.home-opening-item:nth-child(even) .home-opening-placeholder { color:#167c55; }
.home-opening-copy { padding:8px 2px 0; }
.home-opening-date,.home-opening-item h3 { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; text-overflow:ellipsis; font-size:15px; line-height:21px; font-weight:600; letter-spacing:-.2px; overflow-wrap:anywhere; }
.home-opening-date { display:block; height:21px; white-space:nowrap; color:#644fc1; font-variant-numeric:tabular-nums; }
.home-opening-item h3 { height:42px; margin:4px 0; color:#171b19; }
.home-opening-item p { display:inline-block; box-sizing:border-box; min-height:22px; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin:6px 0 0; padding:3px 6px; border-radius:6px; background:#f0f1f2; color:#62676d; font-size:11px; line-height:16px; font-weight:500; }
.home-opening-list:focus-visible,.home-opening-item:focus-visible { outline:2px solid #644fc1; outline-offset:2px; }
.home-opening-full .home-opening-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.home-opening-detail { display:block; min-width:0; color:inherit; text-decoration:none; }
.home-opening-detail:focus-visible { outline:2px solid #644fc1; outline-offset:2px; border-radius:10px; }
.home-opening-application { display:flex; align-items:center; justify-content:space-between; gap:4px; min-height:44px; padding:4px 2px 2px; }
.home-opening-counts { display:flex; align-items:center; gap:3px; color:#6b756f; font-size:11px; line-height:18px; white-space:nowrap; }
.home-opening-counts > span { display:inline-flex; }
.home-opening-counts svg { width:12px; height:12px; }
.home-opening-counts strong { color:#171b19; font-weight:600; }
.home-opening-apply { position:relative; flex:none; display:inline-flex; align-items:center; gap:3px; min-height:28px; padding:4px 7px; border:0; border-radius:5px; background:#f1eefb; color:#644fc1; font-size:11px; line-height:18px; font-weight:600; cursor:pointer; }
.home-opening-apply::after { content:''; position:absolute; inset:-8px 0; }
.home-opening-apply.is-requestable { isolation:isolate; }
.home-opening-apply.is-requestable::before { content:''; position:absolute; z-index:-1; inset:0; border-radius:inherit; background:linear-gradient(110deg,transparent 35%,#ffffffc4 50%,transparent 65%); background-size:300% 100%; pointer-events:none; animation:home-opening-shimmer 3.8s ease-in-out infinite; }
@keyframes home-opening-shimmer { 0%,65% { background-position:150% 0; opacity:0; } 70% { opacity:1; } 95%,100% { background-position:-50% 0; opacity:0; } }
.home-opening-apply.is-joined { background:#edf8f1; color:#167c55; }
.home-opening-apply { text-decoration:none; }
@media(max-width:360px) {
  .home-opening-application { flex-direction:column; align-items:stretch; gap:4px; min-height:56px; }
  .home-opening-apply { align-self:flex-end; }
}
@media(prefers-reduced-motion:reduce) {
  .home-opening-strip .home-opening-list { scroll-behavior:auto; }
  .home-opening-arrow { transition:none; }
  .home-opening-apply.is-requestable::before { animation:none; display:none; }
}
.home-opening-apply:disabled { border-color:#dde3df; background:#f5f6f5; color:#6b756f; cursor:default; }
.home-opening-apply:focus-visible { outline:2px solid #644fc1; outline-offset:2px; }