/* --- AnyGiftUIのデザイン調整 --- */

/* 1. セクション全体の定義 */
#anygift-config-section {
    background-color: #fff !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden;
}

/* 2. AnyGiftヘッダーのデザイン変更 */
.anygift-gift-form__title {
    display: block !important; 
    font-size: 16px !important; 
    font-weight: bold !important;
    color: #333 !important;
    padding: 12px 16px !important; 
    margin: 0 !important;
    background-color: #fff !important;
    border-bottom: 1px solid #eee !important;
}

/* 3. AnyGift生成テーブル：横幅固定 */
#egift-table {
    background-color: #fff !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
    table-layout: fixed !important;
}

.anygift-gift-form__table {
    width: 100% !important;
    table-layout: fixed !important;
    background-color: #fff !important;
    margin: 0 !important;
}

/* 4. ラベル(TH)と入力欄(TD) */
.anygift-gift-form__th {
    background-color: #fff !important;
    width: 100px !important;
    font-size: 14px;
    font-weight: bold;
    padding: 15px 10px !important;
    border-bottom: 1px solid #eee !important;
    vertical-align: middle !important;
}

.anygift-gift-form__td {
    background-color: #fff !important;
    padding: 15px 10px !important;
    border-bottom: 1px solid #eee !important;
}

/* 5. デジタルカード選択エリア：横スクロールを維持 */
.anygift-message-card-selector-image-list {
    display: flex !important;
    flex-wrap: nowrap !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    padding-bottom: 10px !important;
    box-sizing: border-box !important;
    -webkit-overflow-scrolling: touch;
}

/* 6. 入力フォーム */
.anygift-gift-form__message,
.anygift-gift-form__sender {
    width: 100% !important;
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    padding: 10px !important;
    box-sizing: border-box !important;
    background-color: #fff !important;
}

/* 7. プレビューボタンの親要素 */
.anygift-preview-modal-open-button-wrapper {
    margin-top: 10px !important; 
    padding: 0 0 20px 0 !important; 
    text-align: center !important;
    display: flex !important;
    justify-content: center !important;
}

/* 8. プレビューボタン */
.anygift-preview-modal-open-button {
    background-color: #f5f5f5 !important;
    color: #333 !important;
    border: 1px solid #ccc !important;
    border-radius: 20px !important;
    padding: 10px 30px !important;
}

/* --- AnyGift チェックボックスセクションのデザイン調整 --- */

/* 1. 全体コンテナ */
#anygift-checkbox {
    margin-top: 16px !important;
    background-color: transparent !important;
    border: none !important;
    padding: 0 !important;
}

/* 2. 枠線設定 */
.anygift-checkbox__wrapper {
    display: flex !important;
    align-items: center !important;
    background-color: #fff !important;
    border: 2px solid #bdbdbd !important;
    border-radius: 4px !important;
    padding: 12px 15px !important;
    cursor: pointer;
    box-sizing: border-box !important;
    width: 100% !important;
}

/* 3. ラジオボタン変更 */
#anygift-checkbox-input {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 18px !important;
    height: 18px !important;
    border: 1px solid #ccc !important;
    border-radius: 50% !important; 
    background-color: #fff !important; 
    cursor: pointer; 
    position: relative; 
    margin: 0 !important; 
    flex-shrink: 0; 
}   

/* チェック時のボタンカラー指定 */
#anygift-checkbox-input:checked::after {
    content: "" !important; 
    position: absolute !important; 
    top: 50% !important; 
    left: 50% !important; 
    transform: translate(-50%, -50%) !important; 
    width: 10px !important; 
    height: 10px !important; 
    border-radius: 50% !important; 
    background-color: #d2461e !important; 
    border: none !important; 
}  

/* 4. ラベル：ボールド解除 */
.anygift-checkbox__label {
    font-size: 15px !important;
    font-weight: normal !important;
    color: #333 !important;
    padding-left: 10px !important;
}

/* 5. 説明文（注釈エリア）レイアウトのみ維持 */
.anygift-checkbox__caption {
    margin-top: 10px !important;
    padding-left: 5px !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    white-space: pre-wrap !important;
    display: block !important;
}
  
.anygift-checkbox__caption::before {
    content: none !important;
}
  
.anygift-checkbox__caption::after {
    display: block;
    content: "e\30AE\30D5\30C8\306F\31\56DE\306E\6CE8\6587\3067\31\3064\306E\53D7\53D6\7528URL\3092\767A\884C\3044\305F\3057\307E\3059\3002\A\8907\6570\306B\8D08\308B\5834\5408\306F\6CE8\6587\3092\5206\3051\3066\3054\8CFC\5165\3044\305F\3060\3051\307E\3059\3088\3046\304A\9858\3044\305F\3057\307E\3059\3002";
    color: #d2461e !important;
    white-space: pre-wrap !important;
    margin-top: 8px !important;
    font-weight: bold !important;
    line-height: 1.6 !important;
}

/* 6. AnyGiftバナー調整 */
.anygift-banner__about-button-wrapper {
    margin-top: 10px !important;
    justify-content: flex-end !important;
}

/* 7. エラーメッセージ：赤枠 */ 
.anygift-error-message { 
    border: 2px solid #ff0000 !important; 
    border-radius: 4px !important; 
    padding: 10px 12px !important; 
    box-sizing: border-box !important; 
} 

/* 8. メッセージ・贈り主名 入力補助テキスト */ 
.anygift-gift-form__td:has(.anygift-gift-form__message)::after { 
    content: "\203B\30E1\30C3\30BB\30FC\30B8\306F 200\5B57\307E\3067\5165\529B\3067\304D\307E\3059" !important; 
    margin-top: 4px; 
    font-size: 14px; 
    color: #616161; 
    display: block;
} 
 
.anygift-gift-form__td:has(.anygift-gift-form__sender)::after { 
    content: "\203B\8D08\308A\4E3B\540D\306F 30\5B57\307E\3067\5165\529B\3067\304D\307E\3059" !important;
    display: block; 
    margin-top: 4px; 
    font-size: 14px; 
    color: #616161; 
}   

.harmonick-delivery-option__wrapper { 
    display: flex !important; 
    align-items: center !important; 
    background-color: #fff !important; 
    border: 2px solid #bdbdbd !important; 
    border-radius: 4px !important; 
    padding: 12px 15px !important; 
    cursor: pointer; 
    box-sizing: border-box !important; 
    width: 100% !important; 
    margin-bottom: 8px !important; 
} 
 
#harmonick-specify-address-input { 
    appearance: none !important; 
    -webkit-appearance: none !important; 
    width: 18px !important; 
    height: 18px !important; 
    border: 1px solid #ccc !important; 
    border-radius: 50% !important; 
    background-color: #fff !important; 
    cursor: pointer; 
    position: relative; 
    margin: 0 !important; 
    flex-shrink: 0; 
} 
 
#harmonick-specify-address-input:checked::after { 
    content: "" !important; 
    position: absolute !important; 
    top: 50% !important; 
    left: 50% !important; 
    transform: translate(-50%, -50%) !important; 
    width: 10px !important; 
    height: 10px !important; 
    border-radius: 50% !important; 
    background-color: #d2461e !important; 
    border: none !important; 
} 
 
.harmonick-delivery-option__label { 
    font-size: 15px !important; 
    font-weight: normal !important; 
    color: #333 !important; 
    padding-left: 10px !important; 
    cursor: pointer; 
}

/* 9. 選べるギフトエラーメッセージ変更 */
/* 共通：元テキストを消す */
.agx-modal--mixed .anygift-validation-modal__title,
.agx-modal--quantity .anygift-validation-modal__title,
.agx-modal--mixed .validation-modal__subhead,
.agx-modal--quantity .validation-modal__subhead {
  font-size: 0 !important;
}

/* パターン1：eギフト混在 */
.agx-modal--mixed .anygift-validation-modal__title::before {
  content: "\300C\9078\3079\308B\0065\30AE\30D5\30C8\300D\5546\54C1\304C\30AB\30FC\30C8\306B\5165\3063\3066\3044\307E\3059";
  font-size: 1.125rem !important;
}
.agx-modal--mixed .validation-modal__subhead::before {
  content: "\300C\9078\3079\308B\0065\30AE\30D5\30C8\300D\306F\3001\4ED6\306E\5546\54C1\3068\540C\6642\306B\3054\8CFC\5165\3044\305F\3060\3051\307E\305B\3093\3002";
  font-size: 0.875rem !important;
}

/* パターン2：数量複数 */
.agx-modal--quantity .anygift-validation-modal__title::before {
  content: "\300C\9078\3079\308B\0065\30AE\30D5\30C8\300D\306E\6570\91CF\304C\8907\6570\500B\9078\629E\3055\308C\3066\3044\307E\3059";
  font-size: 1.125rem !important;
}
.agx-modal--quantity .validation-modal__subhead::before {
  content: "\300C\9078\3079\308B\0065\30AE\30D5\30C8\300D\306F\3001\0031\56DE\306E\3054\6CE8\6587\306B\3064\304D\0031\70B9\306E\307F\3054\8CFC\5165\3044\305F\3060\3051\307E\3059\3002";
  font-size: 0.875rem !important;
}