/* R1 の作り直し（shop）2026-10-08。app.css の後に読む */

/* ---------- 店の詳細：浮いた丸ボタン → 下へ送ると題名つきの帯 ---------- */
.sd-round { background: var(--card) !important; color: var(--ink) !important; transition: background var(--t-ui), box-shadow var(--t-ui); }
.shop-detail-nav { transition: background var(--t-ui), box-shadow var(--t-ui); }
.shop-detail.sd-scrolled .shop-detail-nav { background: var(--bg); box-shadow: 0 1px 0 var(--line); }
.shop-detail.sd-scrolled .shop-detail-nav .modal-title { visibility: visible; font-size: 17px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shop-detail.sd-scrolled .sd-round { background: transparent !important; box-shadow: none; }

/* 中の部品は sd-sheet の左右 20px にそろえる（二重の字下げをしない） */
.sd-sheet .ui-note { padding: 6px 0 4px; }
.sd-sheet .ui-quote { margin-left: 0; margin-right: 0; }
.sd-sheet .ui-fields { padding-left: 0; padding-right: 0; }
.sd-count { margin-left: 8px; font-size: 14px; font-weight: 400; color: var(--t2); letter-spacing: 0; }
.detail-photos-uploaded { padding: 4px 0 0; }
.detail-photos-uploaded > .ui-note { grid-column: 1 / -1; }
.uploaded-photo-item { width: auto; height: auto; }

/* 連絡先（電話・サイト）・SNS の行 */
.sd-contact .ui-rows, #detail-socials-list .ui-rows { margin: 0; }
a.ui-row-act { text-decoration: none; display: inline-flex; align-items: center; }

/* 訪問・仕入れの行（今日の仕入れと同じ形） */
.sd-visit { min-height: 60px; }
.sd-purchase .ui-row-end { max-width: 46%; gap: 4px; }
.sd-acts { display: inline-flex; align-items: center; font-size: 13px; color: var(--t3); white-space: nowrap; }
.sd-acts button { background: none; border: 0; padding: 6px 0; font: inherit; font-size: 13px; color: var(--t2); cursor: pointer; }
.sd-acts > span { padding: 0 5px; }
.detail-request .ui-row-act { flex: none; }

/* SNS の追加（··· の中）：R1 の入力欄 */
.social-add-form.ui-fields { padding: 4px 0 16px; border-bottom: 1px solid var(--line); }
.social-add-form .ui-btn { margin-top: 4px; }

/* ---------- 記録 › 詳しく ---------- */
.purchase-mode-seg { margin: 4px 0 6px !important; }
.purchase-mode-seg[hidden] { display: none; }
.purchase-cur { gap: 6px; color: var(--ink); }
.purchase-cur-chev { flex: none; color: var(--t2); }
.purchase-amt .ui-amt-s:empty { display: none; }
.purchase-amount-input { -moz-appearance: textfield; appearance: textfield; }
.purchase-amount-input::-webkit-inner-spin-button, .purchase-amount-input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

/* ---------- 場所を追加 ---------- */
.add-shop-seg { margin: 4px 0 6px !important; }
.add-shop-seg > button { white-space: nowrap; padding-left: 2px; padding-right: 2px; font-size: 14px; }
.add-shop-fields { padding: 10px 0 8px; }
.add-shop-addr input { padding-right: 4px; }
.add-shop-here { flex: none; background: none; border: 0; font: inherit; font-size: 13px; font-weight: 600; color: var(--ink); padding: 0 16px 0 8px; height: 50px; cursor: pointer; white-space: nowrap; }
.add-shop-pos { font-size: 13px; color: var(--t2); padding: 0 4px; font-variant-numeric: tabular-nums; }
.add-shop-row { display: grid; grid-template-columns: 1fr 2fr; gap: 10px; }

/* ---------- 地図 ---------- */
/* 入力中も欄の形が見えるように（ダークで背景に溶けない） */
#map-top .map-search:focus-within { background: var(--s1); box-shadow: inset 0 0 0 2px var(--ink); }
#map-top .map-search-clear { display: flex; align-items: center; justify-content: center; padding: 0; margin-right: -4px; }
#map-top .map-search-clear[hidden] { display: none; }
.map-suggest { background: var(--card); box-shadow: var(--shadow-float), 0 0 0 1px var(--line); }
.map-fabs .map-fab { transition: opacity var(--t-ui), transform var(--t-ui) var(--ease); }
/* 一覧のシートを上まで広げた時は、地図のボタンを隠す */
@media (max-width: 1023px) {
  #tab-map:has(.bottom-sheet.expanded) .map-fabs { opacity: 0; transform: translateY(12px); pointer-events: none; }
}
[data-theme="dark"] .map-fabs .map-fab { background: var(--s2); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .map-fabs .map-fab { background: var(--s2); } }

/* ---------- 国・都市／町を選ぶ ---------- */
.area-search input::-webkit-search-cancel-button, .area-search input::-webkit-search-decoration { -webkit-appearance: none; appearance: none; display: none; }
.area-search input { text-overflow: ellipsis; }

/* ---------- 確認シート：題名は本文の頭に。上の「閉じる」は出さない（キャンセルだけ） ---------- */
#confirm-modal .modal-header { display: none; }
#confirm-modal .modal-body { padding-top: 22px; }
.confirm-head { margin: 0 0 6px; font-size: var(--fs-section); font-weight: 700; line-height: 1.4; letter-spacing: -.3px; }
.confirm-head[hidden] { display: none; }
.confirm-text { margin: 0; font-size: 15px; line-height: 1.65; color: var(--t2); }
.confirm-text.lead { font-size: 17px; color: var(--ink); font-weight: 600; }
.confirm-text:empty { display: none; }
/* 国・都市は area-picker.js がカタカナで選ぶボタンに置き換える（R1 の欄の見た目に合わせる） */
.add-shop-fields [hidden] { display: none !important; }
.add-shop-fields .area-field { margin: 0; display: flex; flex-direction: column; gap: 6px; }
.add-shop-fields .area-field > label { font-size: 13px; font-weight: 600; color: var(--t2); padding: 0 4px; margin: 0; letter-spacing: 0; text-transform: none; }