/*!
Theme Name: shiga-ds
Theme URI: 
Author: shiga-ds
Author URI: 
Description: 滋賀県電器商業組合テーマ（Underscores ベース）
Version: 1.0.0
Tested up to: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: underscores
*/

/* =========================================================
  組合員ログイン（Ultimate Member）を GUI に合わせる
  ※ css/style.css は変更せず、ここに追記する
========================================================= */

/* UM 枠をリセットして白カード内に収める */
.p-login .c-form--um-login .um {
  max-width: 100% !important;
  width: 100% !important;
  margin: 1.5rem 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

.p-login .c-form--um-login .um-form {
  margin: 0;
}

.p-login .c-form--um-login .um-header,
.p-login .c-form--um-login .um .um-form > h1,
.p-login .c-form--um-login .um .um-form > h2 {
  display: none !important;
}

/* 項目名（ログインID / パスワード） */
.p-login .c-form--um-login .um .um-field {
  padding: 0 0 10px !important;
  margin: 0 !important;
}

.p-login .c-form--um-login .um .um-field-label {
  width: 100% !important;
  float: none !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  text-align: center;
  font-weight: bold;
  color: #2C3E50;
}

.p-login .c-form--um-login .um .um-field-label label {
  font-weight: bold;
  color: #2C3E50;
}

.p-login .c-form--um-login .um .um-field-area {
  width: 100% !important;
  float: none !important;
  padding: 0 !important;
}

/* 入力欄（GUI の .c-form-input 相当） */
.p-login .c-form--um-login .um input[type="text"],
.p-login .c-form--um-login .um input[type="password"],
.p-login .c-form--um-login .um input[type="email"],
.p-login .c-form--um-login .um input[type="number"] {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
  display: block;
  min-height: 36px;
  line-height: 34px;
  padding: 5px 10px;
  border: 1px solid #b7b7b7;
  border-radius: 5px;
  background: #ffffff;
  font-size: 14px;
  font-size: 0.875rem;
}

.p-login .c-form--um-login .um input:focus {
  outline: none;
  background: #f8f8f8;
  border-color: #b7b7b7;
}

/* 緑のログインボタン1つ（.c-basic-btn.login 相当・縦サイズ合わせ） */
.p-login .c-form--um-login .um-col-alt {
  margin-top: 0.75rem;
}

.p-login .c-form--um-login .um-center,
.p-login .c-form--um-login .um-left,
.p-login .c-form--um-login .um-right {
  float: none !important;
  width: 100% !important;
  text-align: center;
}

.p-login .c-form--um-login .um .um-button,
.p-login .c-form--um-login .um input[type="submit"].um-button,
.p-login .c-form--um-login .um input[type="submit"].um-submit-login,
.p-login .c-form--um-login .um input[type="submit"].c-basic-btn,
.p-login .c-form--um-login #um-submit-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 64px !important;
  height: auto !important;
  margin: 0.5rem 0 0 !important;
  padding: 1.5rem 2rem !important;
  border: 1px solid #2ECC71 !important;
  border-radius: 50px !important;
  background-color: #2ECC71 !important;
  background-image: url(images/icon/icon_member_w.svg) !important;
  background-repeat: no-repeat !important;
  background-position: calc(50% - 2.8em) center !important;
  background-size: 15px 15px !important;
  color: #fff !important;
  font-weight: bold !important;
  font-size: 20px !important;
  line-height: 1.25 !important;
  cursor: pointer;
  box-shadow: none !important;
  text-shadow: none !important;
}

@media screen and (max-width: 767px) {
  .p-login .c-form--um-login .um .um-button,
  .p-login .c-form--um-login .um input[type="submit"].um-button,
  .p-login .c-form--um-login #um-submit-btn {
    min-height: 52px !important;
    padding: 1rem 2rem !important;
    font-size: 16px !important;
  }
}

.p-login .c-form--um-login .um .um-button:hover,
.p-login .c-form--um-login .um input[type="submit"].um-button:hover,
.p-login .c-form--um-login #um-submit-btn:hover {
  background-color: #27C263 !important;
  border-color: #27C263 !important;
  opacity: 1;
}

/* 2つ目ボタン・パスワード忘れ・Remember me は非表示（緑ボタン1つのみ） */
.p-login .c-form--um-login .um-button.um-alt,
.p-login .c-form--um-login .um-half .um-alt,
.p-login .c-form--um-login .um-col-alt-b,
.p-login .c-form--um-login .um-field-checkbox,
.p-login .c-form--um-login .um-field-radio,
.p-login .c-form--um-login a.um-link-alt {
  display: none !important;
}

/* 入力エラー（GUI の .c-form-error .error 相当） */
.p-login .c-form--um-login .um-field-error,
.p-login .c-form--um-login .um-error-block,
.p-login .c-form--um-login p.um-notice.err {
  width: auto !important;
  max-width: 100% !important;
  margin: 6px 0 0 !important;
  padding: 5px 10px 5px 23px !important;
  background: url(images/icon/icon_exclamation_r.svg) no-repeat left center !important;
  background-size: 13px 13px !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #eb4f4f !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  text-align: left !important;
  position: relative !important;
}

/* UM 標準の吹き出し矢印・閉じるアイコンを消す */
.p-login .c-form--um-login .um-field-error .um-field-arrow,
.p-login .c-form--um-login .um-field-error .um-faicon-caret-up,
.p-login .c-form--um-login p.um-notice.err > i {
  display: none !important;
}

/* エラー時の入力欄背景（GUI 相当） */
.p-login .c-form--um-login .um-form input.um-error,
.p-login .c-form--um-login .um-form input[type="text"].um-error,
.p-login .c-form--um-login .um-form input[type="password"].um-error,
.p-login .c-form--um-login .um-form input[type="email"].um-error,
.p-login .c-form--um-login .um-field.um-error input,
.p-login .c-form--um-login .um-field.um-error-block input {
  background-color: #ffe8e8 !important;
  border-color: #eb4f4f !important;
}

/* =========================================================
  お問い合わせ：個人情報同意チェック（MW WP Form）
  ※ css/style.css は変更せず、ここに追記する
  ※ GUI（gui/contact/）に合わせ左寄せ＋必須マーク
  ※ チェック本体の HTML は mw-wp-form/form-fields/checkbox.php で
     label.c-form-checkbox.c-form-req 構造に上書きしている
========================================================= */

/* GUIどおり左寄せ（.max-width 内で左から配置） */
.p-contact .c-form-agree {
  text-align: left;
}

.p-contact .c-form-agree .mwform-checkbox-field {
  display: inline-block;
}

/* 枠なし・インライン（GUI の .c-form-agree .c-form-checkbox 相当） */
.p-contact .c-form-agree label.c-form-checkbox {
  display: inline-block;
  width: auto;
  border: none;
  box-shadow: none;
  padding: 0;
  background: none;
}

/* 必須バッジ分の余白（GUI の .c-form-agree .c-form-req span） */
.p-contact .c-form-agree label.c-form-req .c-form-checkbox__parts {
  padding-right: 55px;
  position: relative;
}

.p-contact .c-form-agree label.c-form-checkbox .c-form-checkbox__parts::before {
  top: -1px;
  background: #fff;
  border: 1px solid #666;
}

.p-contact .c-form-agree label.c-form-checkbox input:checked + .c-form-checkbox__parts::before {
  border-color: #0399EB;
  background-color: #0399EB;
  background-image: url(images/icon/icon_check_w.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 70% 70%;
}

.p-contact .c-form-agree label.c-form-checkbox:has(.c-form-checkbox__input:checked) {
  background: none;
  border: none;
}

/* エラー文言も左寄せ（css/style.css の center 指定を上書き） */
.p-contact .c-form-agree .c-form-error {
  text-align: left;
  margin-bottom: 10px;
  display: block;
}

.p-contact .c-form-agree .c-form-error .error {
  text-align: left;
}

/* =========================================================
  FAQ：見出し横のカテゴリ表示（report と同様・タームがあるときのみ）
  ※ css/style.css は変更せず、ここに追記する
========================================================= */
.p-faq .c-adbox__head .cate {
  display: inline-block;
  vertical-align: middle;
  margin-right: 0.5rem;
  height: 24px;
  padding: 0 1rem;
  font-size: 13px;
  font-size: 0.8125rem;
  font-weight: bold;
  line-height: 22px;
  color: #0399EB;
  border: 1px solid #0399EB;
  border-radius: 12px;
  background: #e5f4fd;
}

/* =========================================================
  マップ吹き出し：中身はクリック不可（表示のみ）
  ※ css/style.css は変更せず、ここに追記する
========================================================= */
.c-map__name,
.c-map__dtl {
  pointer-events: none;
  cursor: default;
  text-decoration: none;
}

/* =========================================================
  マップ右側一覧：画像なし時は店名以下を左寄せ
  ※ PC（1200px〜）で flex row-reverse + space-between のため
    画像が無いと .inner だけが右に寄る
========================================================= */
@media screen and (min-width: 1200px) {
  .p-search-map .c-list-shop__wrap .c-list-shop__body--no-thumb {
    -webkit-box-direction: normal;
    -webkit-box-orient: horizontal;
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    justify-content: flex-start;
  }

  .p-search-map .c-list-shop__wrap .c-list-shop__body--no-thumb .inner {
    width: 100%;
    text-align: left;
  }
}

/* =========================================================
  お知らせ：カテゴリ複数選択時のバッジ余白
  ※ 詳細（.c-blog__head）では margin-right:0 が指定されているため
    一覧と同じ間隔になるよう上書きする
========================================================= */
.c-list-news__meta .cate {
  display: inline-block;
  margin-right: 0.35rem;
  margin-bottom: 0.25rem;
  vertical-align: middle;
}
.c-list-news__meta .cate:last-of-type {
  margin-right: 0;
}
.c-blog__head .c-list-news__meta .cate {
  margin-right: 0.35rem;
}
.c-blog__head .c-list-news__meta .cate:last-of-type {
  margin-right: 0;
}

/* =========================================================
  組合員専用：横断検索（お知らせ＋書類・資料）
  ※ 見た目は css/style.css の .c-free-search を利用
  ※ 余白・結果文言のみここに追記
========================================================= */
.p-member .c-member-search {
  max-width: 480px;
  margin: 0 auto 1.5rem;
}
.p-member .c-member-search__meta {
  margin-top: 0.75rem;
  text-align: center;
  font-size: 14px;
  font-size: 0.875rem;
  color: #2C3E50;
}
.p-member .c-member-search__clear {
  margin-left: 0.75rem;
  color: #0399EB;
  text-decoration: underline;
}
.p-member .c-member-search__clear:hover {
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  .p-member .c-member-search {
    max-width: 100%;
    margin-bottom: 1rem;
  }
}