/**
 * @file
 * Card visual for the "Book by user" view (/my-books).
 *
 * Field-row Views output rendered by masonry_views — each .views-row is one
 * book. This stylesheet wraps that row as a card (white bg, soft shadow,
 * rounded corners) and lays out the fields top-to-bottom: cover image flush at
 * the top, title + genre + price + rating + view count in a padded body,
 * favourite flag in an action row.
.path-my-books #block-socialblue-content,
.path-my-books .views-element-container,
.path-my-books .view-id-book_by_user {
  max-width: 100%;
  width: 100%;
}
*/

#block-socialblue-content:has(.view-id-book_by_user),
.views-element-container:has(.view-id-book_by_user),
.view-id-book_by_user {
  max-width: 100%;
  width: 100%;
}

/* Full-width / no-sidebar treatment is for the standalone book-listing pages
 * only (/my-books, /more-books, /my-book-reviews). It must NOT apply to the
 * profile "Books" tab (/user/*/books), which shares this view but needs the
 * normal profile layout (hero card + complementary sidebar). */
.path-my-books .region--complementary,
.path-more-books .region--complementary,
.path-my-book-reviews .region--complementary {
  display: none;
}

.path-my-books .region--content,
.path-more-books .region--content,
.path-my-book-reviews .region--content {
  width: 100%;
  max-width: 100%;
  flex: 1 1 100%;
}

/* Open Social: complementary flex caps content at ~66%. Stack section = full width. */
.path-my-books section.layout--with-complementary,
.path-my-book-reviews section.layout--with-complementary {
  display: block;
}

.path-my-books section.layout--with-complementary > .region--content,
.path-my-books section.layout--with-complementary > aside,
.path-my-book-reviews section.layout--with-complementary > .region--content,
.path-my-book-reviews section.layout--with-complementary > aside {
  width: 100%;
  max-width: 100%;
}

.view-id-book_by_user .masonry-layout > .views-row,
.view-id-book_by_user .views-row.masonry-item {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.04);
  overflow: hidden;
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  margin-bottom: 1.25rem;
  min-height: 0;
}

/*
 * Row-wrap card: every field is forced onto its own full-width line so the card
 * still stacks top-to-bottom — except the last two (comment count + flag), left
 * at auto width so they share one action-bar line at the bottom.
 */
.view-id-book_by_user .views-row > .views-field-field-book-cover,
.view-id-book_by_user .views-row > .views-field-title,
.view-id-book_by_user .views-row > .views-field-field-genre,
.view-id-book_by_user .views-row > .views-field-field-teaser-premise-tagline,
.view-id-book_by_user .views-row > .views-field-field-price,
.view-id-book_by_user .views-row > .views-field-totalcount,
.view-id-book_by_user .views-row > .views-field-field-share-the-luv {
  flex: 0 0 100%;
  max-width: 100%;
}

/* Book cover image flush at the top of the card. */
.view-id-book_by_user .views-row .views-field-field-book-cover {
  margin: 0;
  line-height: 0;
}

.view-id-book_by_user .views-row .views-field-field-book-cover img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* Title — primary line of the card body. */
.view-id-book_by_user .views-row .views-field-title {
  padding: 0.75rem 0.875rem 0.25rem;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.25;
  word-break: break-word;
}

.view-id-book_by_user .views-row .views-field-title a {
  color: inherit;
  text-decoration: none;
}

.view-id-book_by_user .views-row .views-field-title a:hover {
  text-decoration: underline;
}

/* Price — bold accent below the title. */
.view-id-book_by_user .views-row .views-field-field-price {
  padding: 0 0.875rem 0.5rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: #1a6e6e;
}

/* Genre pill (matches the profile teaser .card__link--genre look). */
.view-id-book_by_user .views-row .views-field-field-genre {
  padding: 0 0.875rem 0.5rem;
}

.view-id-book_by_user .views-row .views-field-field-genre a,
.view-id-book_by_user .views-row .views-field-field-genre .field-content {
  display: inline-block;
  font-size: 0.75rem;
  color: #1a6e6e;
  text-decoration: none;
}

/* View count + rating share a row. */
.view-id-book_by_user .views-row .views-field-totalcount,
.view-id-book_by_user .views-row .views-field-field-share-the-luv {
  padding: 0 0.875rem;
  font-size: 0.8125rem;
  color: #555;
}

.view-id-book_by_user .views-row .views-field-field-teaser-premise-tagline {
  padding: 0 0.875rem;
}

.view-id-book_by_user .views-row .views-field-totalcount {
  padding-bottom: 0.25rem;
}

/*
 * Bottom action bar: comment count (left, with speech-bubble icon) and the
 * follow/unfollow flag (right), split by a divider — both share one line.
 */
.view-id-book_by_user .views-row > .views-field-comment-count,
.view-id-book_by_user .views-row > .views-field-link-flag {
  display: flex;
  align-items: center;
  margin-top: 0.5rem;
  min-height: 2.75rem;
  padding: 0.5rem 0.875rem;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  font-size: 0.8125rem;
  box-sizing: border-box;
}

/* Left side: grows to fill, comment icon + count. */
.view-id-book_by_user .views-row > .views-field-comment-count {
  flex: 1 1 auto;
  gap: 0.4rem;
  color: #444;
}

.view-id-book_by_user .views-row > .views-field-comment-count::before {
  content: "";
  flex: 0 0 auto;
  width: 1rem;
  height: 1rem;
  background: center / contain no-repeat
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23444'%3E%3Cpath d='M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2z'/%3E%3C/svg%3E");
}

/* Right side: auto width, divider on its left, holds the flag button. */
.view-id-book_by_user .views-row > .views-field-link-flag {
  flex: 0 0 auto;
  margin-left: auto;
}

.view-id-book_by_user .views-row .views-field-link-flag a {
  color: #1a6e6e;
  text-decoration: none;
}

.view-id-book_by_user .views-row .views-field-link-flag a:hover {
  text-decoration: underline;
}

/* Created date (if displayed) — subtle helper text. */
.view-id-book_by_user .views-row .views-field-created {
  padding: 0 0.875rem 0.25rem;
  font-size: 0.75rem;
  color: #888;
}

form:not(.layout-builder-configure-block) .select-wrapper:after {
  display: none;
}

section.layout--with-complementary:has(.view-id-book_by_user.view-display-id-block_1) {
  display: block;
}

section.layout--with-complementary:has(.view-id-book_by_user.view-display-id-block_1) > .region--content {
  width: 100%;
  max-width: 100%;
  flex: 1 1 100%;
}

section.layout--with-complementary:has(.view-id-book_by_user.view-display-id-block_1) > .region--complementary,
section.layout--with-complementary:has(.view-id-book_by_user.view-display-id-block_1) > aside {
  display: none;
}

#block-socialblue-content:has(.view-id-book_by_user.view-display-id-block_1),
.views-element-container:has(.view-id-book_by_user.view-display-id-block_1) {
  width: 100%;
  max-width: 100%;
}