/* assets/css/shop-basic-info.css */
/* ショップ基本情報編集ページ（ページ固有スタイル） */

.shop-basic-info-external-links {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.shop-basic-info-external-header {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 0.5rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: #4b5563;
  margin-bottom: 0.25rem;
}

.shop-basic-info-external-row {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 0.5rem;
}

.shop-basic-info-external-field-wrapper {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.shop-basic-info-external-field-label {
  font-size: 0.8rem;
  font-weight: 500;
  color: #4b5563;
  display: none;
}

.shop-basic-info-external-row input[type="text"],
.shop-basic-info-external-row input[type="url"] {
  width: 100%;
  padding: 8px;
  border: 1px solid #d1d5db;
  border-radius: 4px;
  font-size: 0.9rem;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .shop-basic-info-external-header {
    display: none;
  }

  .shop-basic-info-external-row {
    grid-template-columns: 1fr;
  }

  .shop-basic-info-external-field-label {
    display: block;
  }
}

/* Shop basic-information page: own the screen geometry here, not in a
   trailing override of the Community-approved shared stylesheet. */
body.fanika-shop-basic-info {
  background: #edf7fe;
}
/* Recovered from the 2026-10-14 Shop-specific QA094 presentation.
 * Retain the current QA-085 grid and its 860px shared width contract. */
body.fanika-shop-basic-info .shop-basic-info-form > .pm-form-section {
  box-sizing: border-box;
  padding-top: 12px;
  background: #fff;
  border: 1px solid #e5ebf2;
  border-radius: 14px;
}
/* The 10/14 max-width-only image rule did not fill the 3:1 cover viewport.
 * Set the image's dimensions at its owning Shop selector instead. */
body.fanika-shop-basic-info .shop-basic-info-form .fanika-profile-media-preview--cover img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: cover;
}

body.fanika-shop-basic-info .shop-basic-info-actions {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
body.fanika-shop-basic-info .shop-basic-info-actions > button,
body.fanika-shop-basic-info .shop-basic-info-actions > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  min-height: 42px;
  box-sizing: border-box;
  border-radius: 8px;
  padding: 8px 10px;
  text-align: center;
  text-decoration: none;
}
body.fanika-shop-basic-info .shop-basic-info-actions .shop-basic-info-draft-btn {
  border-color: #e8b9ce;
  background: #fff;
  color: #c43c7e;
}
body.fanika-shop-basic-info .shop-basic-info-actions .pm-form-submit-btn {
  background: #e83e8c;
  border-color: #e83e8c;
  color: #fff;
}
body.fanika-shop-basic-info .shop-basic-info-actions .shop-basic-info-current-top__button {
  border: 1px solid #d8e1ea;
  background: #fff;
  color: #344054;
}
@media (max-width: 767px) {
  body.fanika-shop-basic-info .shop-basic-info-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* QA094 Shop page header: use the Foundation composition and Shop genre.
 * Keep these rules scoped to /shop-edit; do not alter Community or other pages. */
body.fanika-shop-basic-info .shop-basic-info-page > .fanika-creator-page-header.fanika-ui-genre--shop {
  background: linear-gradient(90deg, #fff3d6 0%, #fff9e9 54%, #fff 100%);
  border-color: #f1e0b3;
}
body.fanika-shop-basic-info .shop-basic-info-page > .fanika-creator-page-header.fanika-ui-genre--shop .fanika-creator-page-header__icon {
  background: #fff;
  color: var(--fanika-ui-genre-shop-accent, #52a8dd);
  border: 1px solid #f1e0b3;
}

/* QA094: shop cover editor follows the approved community two-column control. */
body.fanika-shop-basic-info .shop-basic-info-form > .pm-form-section > .shop-cover-frame-field { grid-column:1/-1 !important; order:0 !important; width:100%; min-width:0; box-sizing:border-box; }
body.fanika-shop-basic-info .shop-basic-info-form > .pm-form-section > .pm-form-field:has(> #ec_description) { grid-column:1/-1 !important; order:0 !important; }
body.fanika-shop-basic-info .shop-cover-frame-controls { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,3fr); gap:20px; width:100%; min-width:0; padding:16px; box-sizing:border-box; border:1px solid #d9e4f0; border-radius:12px; background:#fff; }
body.fanika-shop-basic-info .shop-cover-frame-controls > * { min-width:0; }
body.fanika-shop-basic-info .shop-cover-frame-controls select { width:100%; }
body.fanika-shop-basic-info .shop-cover-crop-window { height:175px; border:1px solid #d9e4f0; border-radius:8px; background:#edf7fe; overflow:hidden; display:flex; align-items:center; justify-content:center; touch-action:none; }
body.fanika-shop-basic-info .shop-cover-crop-window img { width:100%; height:100%; object-fit:contain; }
body.fanika-shop-basic-info .shop-cover-crop-options[hidden] { display:none !important; }
body.fanika-shop-basic-info .fanika-profile-editor-v2__width-illustration { height:72px; background:#edf7fe; border-radius:8px; margin:10px 0; position:relative; overflow:hidden; }
body.fanika-shop-basic-info .fanika-profile-editor-v2__width-image { background:#c9b6e5; height:30px; margin:8px auto 0; width:100%; }
body.fanika-shop-basic-info .fanika-profile-editor-v2__width-illustration[data-mode=standard] .fanika-profile-editor-v2__width-image { width:80%; }
body.fanika-shop-basic-info .fanika-profile-editor-v2__width-content { background:#fff; height:5px; width:65%; margin:10px auto; }
@media(max-width:767px){body.fanika-shop-basic-info .shop-cover-frame-controls {grid-template-columns:minmax(0,1fr);}}


/* QA094: Shop uses the approved Community basic-info page geometry.
 * The shared creator stylesheet defaults to 860px; Shop must explicitly
 * override that limit, including the shared bottom navigation. */
html:has(body.fanika-shop-basic-info .shop-basic-info-page),
body.fanika-shop-basic-info,
body.fanika-shop-basic-info .site-content,
body.fanika-shop-basic-info .site-main,
body.fanika-shop-basic-info .entry-content {
  background-color: #edf7fe;
}
body.fanika-creator-basic-info.fanika-shop-basic-info .pm-form-page.shop-basic-info-page {
  box-sizing: border-box;
  width: min(calc(100% - 32px), 1080px);
  max-width: 1080px !important;
  margin-inline: auto;
}
body.fanika-shop-basic-info .fanika-shared-back-navigation {
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  width: min(calc(100% - 32px), 1080px);
  max-width: 1080px;
  margin: 12px auto 100px;
  padding: 0;
}
body.fanika-shop-basic-info .fanika-shared-back-navigation .fanika-shared-back-button {
  box-sizing: border-box;
  flex: 0 0 180px;
  width: 180px;
  height: 42px;
}
@media (max-width: 767px) {
  body.fanika-creator-basic-info.fanika-shop-basic-info .pm-form-page.shop-basic-info-page,
  body.fanika-shop-basic-info .fanika-shared-back-navigation {
    width: min(calc(100% - 16px), 1080px);
  }
}