/* Corrective: upstream page-flip@latest ships CSS targeting .sft__wrapper
   (typo) while its own JS creates .stf__wrapper -- see Task 2 of the plan
   for how this was confirmed directly in the published bundle. */
/* height:100% added on top of the typo fix: the library's own CSS (even
   under its correct spelling) never gives .stf__wrapper a height, so
   .stf__block's height:100% (set by the library) has nothing to resolve
   against. Harmless to keep now that mountFlipbook() uses PageFlip's
   "fixed" size mode (explicit pixel width/height, set inline by the
   library itself from our JS settings) instead of "stretch" -- that mode
   relied on live-measuring this chain, which broke down live (book
   rendered as a huge, scrolling column of oversized pages). */
.stf__wrapper { position: relative; width: 100%; height: 100%; box-sizing: border-box; }

.mv-fotoalbum-flipbook { width: 100%; max-width: 1100px; margin: 0 auto; }

/* The theme's .mv-qr-downloads { display: flex; } (style.css:754) is an
   author-stylesheet rule, which beats the browser's built-in [hidden] UA
   rule regardless of the hidden attribute being set -- found by final
   review. Without this, the download button is visible before any album
   exists and a click downloads a blank PDF. */
.mv-qr-downloads[hidden] { display: none; }

/* The theme's full CSS (brand custom properties, .mv-btn, .mv-contact-field,
   .mv-qr-error/-downloads/-note) is already inlined into every page's <head>
   via momentvia_inline_theme_css() (weddcam-theme-v2/functions.php), ungated
   by page type -- this plugin's templates reuse those exact classes rather
   than duplicating them here. Only genuinely new classes live in this file. */
.mv-fotoalbum-style-picker {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 1rem;
  margin: 1.5rem 0 2rem;
}
.mv-fotoalbum-style-card {
  padding: 1.25rem;
  background: #fbf8f3;
  border: 1px solid #e2d9c9;
  border-radius: 10px;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.mv-fotoalbum-style-card:hover { box-shadow: 0 4px 16px rgba(26,24,21,0.08); }
.mv-fotoalbum-style-card h3 {
  font-family: "Fraunces", Georgia, serif;
  font-size: 1.05rem;
  margin: 0 0 0.4rem;
  color: #1a1815;
}
.mv-fotoalbum-style-card p { margin: 0; font-size: 0.9rem; color: #45403a; }
.mv-fotoalbum-style-card.is-active {
  border-color: #b3925f;
  background: #e9dfcb;
}

/* Miniature preview of what each style's layout actually produces, using
   real sample photos (assets/images/preview-*.jpg, decorative only -- never
   part of a generated album) laid out with the same relative proportions
   and rotation angles as the real grid()/scrapbook()/magazine() canvas
   drawing in photobook-styles.js. */
.mv-fotoalbum-style-preview {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
  margin-bottom: 1rem;
  border-radius: 6px;
  overflow: hidden;
  background: #efe9db;
}
.mv-fotoalbum-style-preview img {
  position: absolute;
  display: block;
  object-fit: cover;
}

.mv-fotoalbum-style-preview--grid img { width: 44%; height: 44%; border-radius: 2px; }
.mv-fotoalbum-style-preview--grid img:nth-child(1) { top: 4%; left: 4%; }
.mv-fotoalbum-style-preview--grid img:nth-child(2) { top: 4%; right: 4%; }
.mv-fotoalbum-style-preview--grid img:nth-child(3) { bottom: 4%; left: 4%; }
.mv-fotoalbum-style-preview--grid img:nth-child(4) { bottom: 4%; right: 4%; }

.mv-fotoalbum-style-preview--scrapbook img {
  width: 38%;
  height: 38%;
  border: 3px solid #fff;
  border-radius: 1px;
  box-sizing: border-box;
  box-shadow: 0 3px 8px rgba(26,24,21,0.28);
}
.mv-fotoalbum-style-preview--scrapbook img:nth-child(1) { top: 8%; left: 6%; transform: rotate(-8deg); }
.mv-fotoalbum-style-preview--scrapbook img:nth-child(2) { top: 4%; right: 8%; transform: rotate(6deg); }
.mv-fotoalbum-style-preview--scrapbook img:nth-child(3) { bottom: 6%; left: 14%; transform: rotate(5deg); }
.mv-fotoalbum-style-preview--scrapbook img:nth-child(4) { bottom: 4%; right: 10%; transform: rotate(-5deg); }

.mv-fotoalbum-style-preview--magazine img { border-radius: 2px; }
.mv-fotoalbum-style-preview--magazine img:nth-child(1) { top: 5%; left: 5%; width: 54%; height: 90%; }
.mv-fotoalbum-style-preview--magazine img:nth-child(2) { top: 5%; right: 5%; width: 32%; height: 42%; }
.mv-fotoalbum-style-preview--magazine img:nth-child(3) { bottom: 5%; right: 5%; width: 32%; height: 42%; }

.mv-fotoalbum-select-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 0.6rem;
  margin: 1.5rem 0;
}
.mv-fotoalbum-select-thumb {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 6px;
  border: 2px solid transparent;
  cursor: pointer;
}
.mv-fotoalbum-select-thumb.is-selected { border-color: #b3925f; }
