/**
 * マイアカウント（ログイン後）意匠。
 * WooCommerce ネイティブのアカウント領域（ダッシュボード／注文／住所／アカウント詳細）を
 * 商品カード・商品一覧と同じデザイン言語に揃える:
 *   - 基調色は --mymoods-blue（ヘッダーロゴと同じ #2500c1）
 *   - ボーダーレス寄り・角丸 10px・余白多め（archive-product.php の STD-6/STD-9 方針）
 *   - ボタンは商品カードと同じピル形状（radius 9999px / Poppins / 青塗り）
 * WC 標準クラスを対象にするため、テンプレート上書きは不要。
 * ログイン／会員登録は form-login.php 側（本番意匠の再現）が別途担当する。
 */

/* 成功通知の緑だけは機能色として維持する（青一色にすると成功／情報の区別が消えるため）。 */
:root { --mm-success: 21, 136, 8; }

/* ===== ページ幅・見出し ===== */
.woocommerce-account .page-title,
.woocommerce-account h1.entry-title {
  font-family: var(--mymoods-font-poppins), sans-serif;
  font-size: clamp(2.4rem, 4vw, 3.2rem);
  font-weight: var(--mymoods-font-weight-black, 900);
  color: #1a1a1a;
  margin: 1.5rem 0 3rem;
}

.woocommerce-account .woocommerce {
  max-width: 120rem;
  margin: 0 auto;
  padding-bottom: 6rem;
}

/* ===== 2カラム（左ナビ／右コンテンツ） ===== */
/* WooCommerce の clearfix 疑似要素がグリッドアイテム化して段組みを崩すため無効化。
   併せて WC 標準の float/width 指定を解除し、各カラムに収める。 */
.woocommerce-account .woocommerce::before,
.woocommerce-account .woocommerce::after {
  display: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content {
  float: none;
  width: auto;
}
/* ナビがある（＝ログイン後）ページのみ2カラム化。lost-password 等の単一カラムは対象外。 */
@media screen and (min-width: 768px) {
  .woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) {
    display: grid;
    grid-template-columns: 24rem 1fr;
    gap: 4.8rem;
    align-items: start;
  }
}

/* ===== 左ナビ ===== */
/* 縦リストは維持しつつ、罫線を細く・角丸をカードと同じ 10px に揃える。 */
.woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0 0 2.4rem;
  padding: 0.6rem;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}
.woocommerce-MyAccount-navigation li {
  border-bottom: none;
}
.woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 1.3rem 1.6rem;
  border-radius: 8px;
  color: #1a1a1a;
  text-decoration: none;
  font-weight: 600;
  font-size: 1.5rem;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.woocommerce-MyAccount-navigation li a:hover {
  background: rgba(var(--mymoods-blue-rgb), 0.06);
  color: var(--mymoods-blue);
}
.woocommerce-MyAccount-navigation li.is-active a {
  background: var(--mymoods-blue);
  color: #fff;
}

/* ===== 右コンテンツ ===== */
.woocommerce-MyAccount-content {
  font-size: 1.5rem;
  line-height: 1.9;
  color: #1a1a1a;
}
.woocommerce-MyAccount-content > p {
  margin: 0 0 1.6rem;
}
.woocommerce-MyAccount-content a:not(.button) {
  color: var(--mymoods-blue);
  text-decoration: underline;
}
.woocommerce-MyAccount-content mark,
.woocommerce-MyAccount-content .woocommerce-Address-title a {
  background: none;
}

/* ===== ボタン（商品カードと同じピル形状） ===== */
/* Rise の .button は ::before（塗り）／::after（枠）疑似要素で描画されるため、
   それらを無効化して直接スタイルを当てる（スコープを .woocommerce-account に限定）。 */
.woocommerce-account .button::before,
.woocommerce-account .woocommerce-Button::before,
.woocommerce-account .button::after,
.woocommerce-account .woocommerce-Button::after {
  display: none !important;
}
.woocommerce-account .button,
.woocommerce-account .woocommerce-Button,
.woocommerce-account button[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--mymoods-blue) !important;
  color: #fff !important;
  border: 1px solid var(--mymoods-blue) !important;
  border-radius: 9999px !important;
  padding: 1.1rem 2.8rem;
  min-height: 40px;
  font-family: var(--mymoods-font-poppins), sans-serif;
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: normal;
  text-decoration: none;
  box-shadow: none;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.woocommerce-account .button:hover,
.woocommerce-account .woocommerce-Button:hover,
.woocommerce-account button[type="submit"]:hover {
  background: var(--mymoods-blue-dark) !important;
  border-color: var(--mymoods-blue-dark) !important;
  color: #fff !important;
}

/* ===== フォーム（アカウント詳細・住所編集） ===== */
.woocommerce-account form .form-row {
  margin: 0 0 1.8rem;
  display: block;
}
.woocommerce-account form .form-row label {
  display: block;
  font-weight: 600;
  font-size: 1.4rem;
  margin-bottom: 0.6rem;
}
.woocommerce-account form .input-text,
.woocommerce-account form .woocommerce-Input,
.woocommerce-account form input[type="text"],
.woocommerce-account form input[type="email"],
.woocommerce-account form input[type="tel"],
.woocommerce-account form input[type="password"],
.woocommerce-account form select,
.woocommerce-account form textarea {
  width: 100%;
  padding: 1.2rem 1.4rem;
  font-size: 1.5rem;
  border: 1px solid rgba(0, 0, 0, 0.18);
  border-radius: 8px;
  background: #fff;
  box-sizing: border-box;
}
.woocommerce-account form .input-text:focus,
.woocommerce-account form select:focus,
.woocommerce-account form textarea:focus {
  outline: none;
  border-color: var(--mymoods-blue);
  box-shadow: 0 0 0 3px rgba(var(--mymoods-blue-rgb), 0.12);
}
/* fieldset はボーダーレス基調に寄せ、見出しの太さで区切りを作る。 */
.woocommerce-account fieldset {
  border: none;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 0;
  padding: 2.4rem 0 0;
  margin: 3.2rem 0 0;
}
.woocommerce-account fieldset legend {
  font-family: var(--mymoods-font-poppins), sans-serif;
  font-weight: 700;
  font-size: 1.7rem;
  color: #1a1a1a;
  padding: 0;
}

/* ===== テーブル（注文一覧・注文詳細・住所） ===== */
/* テーブル構造は WooCommerce 標準のまま。罫線を細く・余白を広く・ヘッダーを青の淡い塗りに。 */
.woocommerce-account .shop_table,
.woocommerce-account .woocommerce-orders-table,
.woocommerce-account table.account-orders-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.4rem;
  margin-bottom: 2.4rem;
}
.woocommerce-account .shop_table th,
.woocommerce-account .shop_table td {
  padding: 1.6rem 1.4rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  text-align: left;
  vertical-align: middle;
}
.woocommerce-account .shop_table thead th {
  background: rgba(var(--mymoods-blue-rgb), 0.05);
  color: var(--mymoods-blue);
  font-family: var(--mymoods-font-poppins), sans-serif;
  font-weight: 700;
  border-bottom: 1px solid rgba(var(--mymoods-blue-rgb), 0.18);
}
/* 注文番号・合計は視線が止まる列なので少し強く。 */
.woocommerce-account .shop_table td.woocommerce-orders-table__cell-order-number a {
  font-weight: 700;
}

/* ===== 住所ブロック ===== */
/* clearfix 疑似要素がグリッドアイテム化して段組みを崩すため無効化。 */
.woocommerce-account .woocommerce-Addresses::before,
.woocommerce-account .woocommerce-Addresses::after {
  display: none;
}
.woocommerce-account .woocommerce-Addresses {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2.4rem;
  margin: 0;
}
.woocommerce-account .woocommerce-Address {
  float: none;
  width: auto;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  padding: 2.4rem;
}
.woocommerce-account .woocommerce-Address-title h3,
.woocommerce-account .woocommerce-Address-title h2 {
  font-family: var(--mymoods-font-poppins), sans-serif;
  font-size: 1.7rem;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 1rem;
}
@media screen and (max-width: 767px) {
  .woocommerce-account .woocommerce-Addresses { grid-template-columns: 1fr; }
}

/* ===== 通知・メッセージ ===== */
/* WC 既定の上ボーダー／アイコンフォント（このテーマは未読込のため豆腐化）を打ち消す。 */
.woocommerce-account .woocommerce-message,
.woocommerce-account .woocommerce-info,
.woocommerce-account .woocommerce-error {
  border: none;
  border-radius: 8px;
  padding: 1.4rem 1.8rem;
  font-size: 1.4rem;
  margin-bottom: 2rem;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 1.2rem;
  flex-wrap: wrap;
}
.woocommerce-account .woocommerce-message::before,
.woocommerce-account .woocommerce-info::before,
.woocommerce-account .woocommerce-error::before {
  display: none;
}
.woocommerce-account .woocommerce-message .button,
.woocommerce-account .woocommerce-info .button,
.woocommerce-account .woocommerce-error .button {
  margin-left: auto;
}
/* 成功＝緑は機能色として維持（青一色にすると情報メッセージと区別がつかなくなるため）。 */
.woocommerce-account .woocommerce-message {
  background: rgba(var(--mm-success), 0.08);
  border-left: 3px solid rgb(var(--mm-success));
}
.woocommerce-account .woocommerce-info {
  background: rgba(var(--mymoods-blue-rgb), 0.06);
  border-left: 3px solid var(--mymoods-blue);
}
.woocommerce-account .woocommerce-error {
  background: rgba(229, 0, 0, 0.06);
  border-left: 3px solid #e50000;
}