/* ============================================================
   dark.css — 시스템 다크모드 자동 대응 (prefers-color-scheme)
   모든 페이지 공용: 각 html에서 기존 css들 뒤에 마지막으로 로드.
   팔레트: 배경 #041721 · 포인트 #1785BE · 일반 글자 흰색
   ============================================================ */
@media (prefers-color-scheme: dark) {

:root { color-scheme: dark; }

/* ---------- 공통 팔레트 (참고용)
   배경      #041721
   패널      #0a2733
   패널2/칩  #123748
   라인      rgba(255,255,255,.14)
   본문      #fff · 보조 rgba(255,255,255,.72)
   포인트    #1785BE · 밝은 포인트(작은 텍스트) #4db2ee
---------- */

/* ============ 기본 배경/텍스트 — 일반 글자는 모두 흰색 ============ */
html { background: #041721 !important; }
body { background: #041721 !important; color: #fff; }
p, li, td, th, dt, dd, label, strong, b,
h1, h2, h3, h4, h5, h6 { color: #fff; }
a { color: #4db2ee; }

/* ============ 서브페이지 헤더 (style.css) ============ */
.header_wrapper { background-color: #06202c; color: #fff; }
body.info-page .header_wrapper { background: transparent; }
body.info-page .header_title { color: #fff; }
body.info-page .header_btn_back a,
body.info-page .header_btn_info a { background: rgba(10,39,51,.85); color: #fff; }

/* ============ 서브페이지 카드/목록 (style.css) ============ */
.content_li,
.list_group { background: rgba(10,39,51,.75); }
.inner_ul li strong { color: #fff; }
.list_group ul li { color: #fff; }
.list_group ul li p a { color: #4db2ee; }
.list_group ul li + li::before { background: rgba(255,255,255,.14); }   /* 교회상세 항목 구분선 — 반투명 흰색 */
.li-photo { background: #123748; }
.cap-gray { background: #123748; color: #fff !important; border-color: rgba(255,255,255,.16); }
.navi-box { background: rgba(10,39,51,.82); }
.navi-btn { color: rgba(255,255,255,.72) !important; }   /* 내비연결 앱 이름 — 반투명 흰색 */
.navi-btn img { background: #fff; }
.addr-copy { background: #123748; color: #fff; }
.ch-tabs a { background: rgba(32,72,90,.65); color: #fff; }   /* 비선택 탭 — 살짝 밝게 */
/* 교회정보 주메뉴 — 선택 탭: 흰 배경 + 기본컬러 글자 */
.ch-tabs a.on { background: #fff; color: #1785BE; }

/* ============ 전화 시트 (style.css + map.css 공용) ============ */
.call-sheet-group { background: #0a2733; }
.cs-btn { background: #0a2733; color: #fff; }
.cs-cancel { color: #fff !important; }           /* '취소' — 흰색 */
.call-sheet-body { color: #fff; }

/* ============ 지도 페이지 — 바디/버튼 (map.css) ============ */
.btn.current, .btn.walk { background: #0a2733; color: #fff; }
.mt-item, .mt-item span { background: #0a2733; }
.mt-item span { color: #fff; }
.mt-item.on { border-color: #1785BE; }
.mt-item.on span { color: #4db2ee; }

/* 검색 — 검색바 래퍼는 투명 (라이트 모드와 동일, 어두운 박스 제거).
   PC 사이드바 배경은 아래 @media 블록에서 별도 지정 */
.search_wrapper { background: transparent; }
.searchFrm input { background-color: #0a2733; color: #fff; }
.searchFrm input::placeholder { color: rgba(255,255,255,.55); }
.searchFrm .searchList li { background-color: #0a2733; color: #fff; }
.search-loading i { color: #4db2ee; }

/* 내비/교회정보 시트 */
.nav-sheet-body { background: #0a2733; }
.ns-title { color: #fff; }
.footer .c_info { background: #0a2733; }
.c_name { color: #fff !important; }
.ci-close { color: #fff; }
.ci-photo img { background: #123748; }
.ci-copy { background: #123748; color: #fff; }
.ci-phone-btn { background: rgba(23,160,90,.2); }
.ci-btn { background: #123748; color: #fff !important; }
.ci-nav-btn { color: rgba(255,255,255,.72) !important; }   /* 내비앱 이름 — 반투명 흰색 */
.ci-nav-btn img { background: #fff; }

/* 교회 목록/근처 패널 */
.ch-item:hover, .ch-item:active { background: #123748; }
.ch-item + .ch-item::before { background: rgba(255,255,255,.14); }   /* 목록 구분선 — 반투명 흰색 (라이트는 반투명 검정) */
.ch-item-photo { background: #123748; }
.ch-item-name { color: #fff; }
.ch-item-dist { background: rgba(23,133,190,.24); color: #4db2ee; }
.md-group-title, .pc-group-title { color: rgba(255,255,255,.72); }   /* '근처교회' 등 그룹 제목 — 반투명 흰색 */
.md-group-title span { background: #123748; color: rgba(255,255,255,.72); }
.md-sem:hover, .md-sem:active { background: #123748; }
.md-sem + .md-sem::before { background: rgba(255,255,255,.14); }   /* 집회 목록 구분선 — 반투명 흰색 */
.md-sem-photo { background: #123748; }
.md-sem-photo .sem-sil, .pc-sem-photo .sem-sil, .li-photo .sem-sil { color: rgba(255,255,255,.3); }   /* 강사 미지정 실루엣 */
.md-sem-info .t { color: #fff; }
.md-nearby-head { background: #0a2733; }
.sl-cnt { background: #123748; color: rgba(255,255,255,.72); }
.nearby-range b { color: #4db2ee; }
.nearby-range input[type=range]::-webkit-slider-thumb { background: #fff; }
.nearby-range input[type=range]::-moz-range-thumb { background: #fff; }

/* 지역(권역) 시트 */
.region-sheet .rs-body { background: #0a2733; }
.region-row .region-ico { background: rgba(23,133,190,.24); color: #4db2ee; }
.rs-list li:hover, .rs-list li:active { background: #123748; }
.rs-ico { background: rgba(23,133,190,.24); color: #4db2ee; }
.rs-title, .rs-text b, .rs-close { color: #fff; }

/* 모달/알림 */
.page-modal .pm-box { background: #0a2733; color: #fff; }
#myModal .modal-content { background: #0a2733; color: #fff; }
#myModal .modal-title, #myModal .close { color: #fff; }
.ma-card { background: #0a2733; }
.ma-ico { background: rgba(23,133,190,.24); color: #4db2ee; }
.ma-msg { color: #fff; }
.ma-btn.ma-choice { background: #123748; color: #fff !important; }
.ma-btn.ma-choice:active { background: #17435a; }
.ma-btn.ma-cancel { background: rgba(255,255,255,.12); color: #fff !important; }   /* 라이트 규칙이 !important라 동일하게 강제 */

/* ============ 플로팅 캡슐/주간바/더보기 (map.css + map.pc.css) ============ */
.pc-float-toggle { background: rgba(4,23,33,.92); color: #fff; }
.pc-float-toggle .toggle::after { background: #fff; }
.sem-week { background: rgba(4,23,33,.95); }
.sem-week .sw-label { color: #fff; }
.sem-week .sw-nav { background: #123748; color: #fff; }
.sem-week .sw-nav:active { background: #17435a; }
.more-btn { background: #123748; }
.more-btn, .more-btn i,
.pc-float-toggle .more-btn, .pc-float-toggle .more-btn i { color: #fff !important; }   /* 점3개 더보기 아이콘 */
.more-btn:active { background: #17435a; }
.more-panel { background: rgba(4,23,33,.82); }

/* 지도 위 라벨/마커 보조 */
.fp-ico { background: #fff; }                          /* 주유 브랜드 아이콘 — 흰 배경 */
.fp-label { background: rgba(4,23,33,.94); color: #fff; }
.fp-label b { color: #fff; }                           /* 휘발유 가격 — 흰색 */
.fp-label b::before, .fp-label em::before { color: rgba(255,255,255,.6); }   /* 휘/경 표시 */
.fp-label em { color: #7be3a0; }                       /* 경유 가격 — 밝은 초록 */
.fp-label > span { color: rgba(255,255,255,.72); }     /* 브랜드명 */
.pub-poi .pp-name { background: rgba(4,23,33,.88); color: #fff; }
.sp-ph { background: #123748; color: #fff; }   /* 사진 없는 성도 — 이름 첫글자 흰색 */
.sp-name { background: rgba(4,23,33,.92); color: #fff; }

/* ============ 성도보기/가족 시트 (map.css) ============ */
.fam-sheet { background: #0a2733; }
.sf-rel { background: rgba(23,133,190,.24); color: #4db2ee; }
.sf-name, .sd-name, .sd-name small, .sd-addr2 { color: #fff; }
.sf-title { color: rgba(255,255,255,.6); }   /* 호칭 — 반투명 흰색 */
.sf-item + .sf-item::before { background: rgba(255,255,255,.14); }   /* 가족목록 구분선 — 밝은 라인 반투명 */
.sd-duty { color: #4db2ee; }
.fs-title { color: #fff; }
.fs-back { color: #4db2ee; }
.fam-sheet .fld p { color: #fff; }
body.saints-page .fld p { color: #fff; }
body.saints-page .pc-fields { background: rgba(10,39,51,.6); }
/* 성도상세·가족시트 항목 구분선 — 반투명 흰색 */
.fam-sheet .pc-fields li + li,
body.saints-page .pc-fields li + li { border-top-color: rgba(255,255,255,.12); }
body.saints-page .sv-back .bk-txt { color: #fff; }

/* ============ PC 레이아웃 (map.pc.css) ============ */
@media (min-width: 673px) {
    .search_wrapper { background: rgba(4,23,33,.92); }   /* PC 사이드바 패널 배경 */
    .pc-panel-toggle { background: #0a2733; color: #fff; }
    .pc-back { background: #0a2733; color: #fff; }
    .pc-name { color: #fff; }
    .pc-fields .fld p, .pc-fields .fld p a { color: #fff; }
    .pc-fields .addr-copy { background: #123748; color: #fff; }
    .pc-group-title { color: rgba(255,255,255,.72); }   /* '근처교회' 등 — 반투명 흰색 */
    .pc-group-title span { background: #123748; color: rgba(255,255,255,.72); }
    .pc-sem-photo { background: #123748; }
    .pc-sem-info .t { color: #fff; }
    .pc-seminars .pc-sem:hover, .pc-seminars .pc-sem:active { background: #123748; }
    .pc-seminars .pc-sem + .pc-sem::before { background: rgba(255,255,255,.14); }   /* 집회 목록 구분선 */
    .pc-churches-title { color: #fff; }
    .pc-side2 { background: #06202c; }
    .pc-side2 .ci-btn { background: #123748; }
    .pc-side2-close { color: #fff; }
    .pc-ch-tabs a { background: #1a475c; color: #fff; }   /* 비선택 탭 — 살짝 밝게 */
    .pc-ch-tabs a.on { background: #fff; color: #1785BE; }   /* 선택 탭 — 흰 배경 + 기본컬러 글자 */
    .pc-ch-tabs a:hover:not(.on) { background: #17435a; }
    #pcExtraBody .gb-composer { background: rgba(4,23,33,.97); }
    .pc-nearby-head { background: #0a2733; }
}

/* ============ 방명록 (guest.css) ============ */
.gb-count { color: #fff; }                       /* '방명록 N개' 제목 */
.gb-count span { color: #4db2ee; }
.gb-name { color: #fff; }                        /* 글쓴이 이름 */
.gb-msg { color: #fff; }                         /* 글 내용 */
.gbm-close, .gbr-title, .gbm-title { color: #fff; }
.gbm-item { color: #fff !important; }            /* 옵션 메뉴 항목 텍스트 */
.gbm-item i { color: #fff; }                     /* 옵션 메뉴 아이콘 */
.gbm-blist li { color: #fff; }                   /* 차단 목록 */
.gbr-target { color: #fff; }                     /* 모달 — 이름 뒤 내용까지 흰색 */
.gbr-target b { color: #4db2ee; }
.gbr-cancel { color: #fff !important; }
.gb-btns .gb-more:hover { color: #fff; }
.gb-avatar { background-color: #123748; }
.gb-composer input { background: #0a2733; color: #fff; }
.gb-composer input:focus { background: #123748; }
.gb-composer input::placeholder { color: rgba(255,255,255,.55); }
.content_wrapper .gb-composer { background: rgba(4,23,33,.97); }
.gb-btns .gb-more { background: #123748; color: #fff; }
.gbm-body { background: #0a2733; color: #fff; }
.gbm-item:active { background: #123748; }
.gbr-box { background: #0a2733; color: #fff; }
.gbr-target { background: #123748; }
.gbr-cancel { background: rgba(255,255,255,.12); color: #fff; }
.gbm-bl-off { background: rgba(23,133,190,.24); color: #4db2ee; }

/* ============ 교회사진 (photos.css) ============ */
.ph-cell { background-color: #123748; }
.ph-busy-box { background: #0a2733; color: #fff; }
.ph-more { background: rgba(4,23,33,.78); color: #fff; }

/* ============ 부트스트랩 기본 ============ */
.btn-default { background-color: #123748; color: #fff; border-color: rgba(255,255,255,.16); }
.btn { color: #fff; }   /* 어두운 배경 버튼 문자 — 흰색 통일 */

/* ============ 회색 글자 → 반투명 흰색 (3단계) ============ */
/* 보조 텍스트 (#666~#8a9x) → 흰색 72% */
#s_sch, #s_sch_time,
.call-sheet-num,
.md-sem-info .s,
.rs-sub, .rs-path,
.search-loading,
.fp-label > span,
.sf-name em,
.fam-sheet .fld-name,
body.saints-page .fld-name,
.inner_ul li,
.gb-church, .gb-meta, .gb-loading, .gb-hidden-row,
.more-panel .more-help a { color: rgba(255,255,255,.72); }

/* 옅은 회색 (#9aa~#b0b — 라벨/아이콘/빈 안내) → 흰색 55% */
.ns-close,
.ci-nav-title,
.ch-item-nation,
span.ch-item-photo.ch-item-noimg,
.md-empty, .nearby-empty,
.md-sem-photo,
.fam-sheet .fld-ico,
body.saints-page .fld-ico,
.fld-name, .navi-title,
.li-photo,
.inner_ul li i,
.gb-empty, .gb-avatar.gb-noimg { color: rgba(255,255,255,.55); }

/* 아주 옅은 회색 (#c3c~ — 화살표/닫기) → 흰색 40% */
.walk-bar .wb-x, .walk-res .wr-x,
.ch-item-arrow, .md-sem-arrow, .rs-arrow, .li-arrow,
.fld-ico { color: rgba(255,255,255,.4); }

/* 플로팅 옵션 캡슐 라벨/구분선 — 흰색 */
.pc-float-toggle::before, .pc-float-toggle::after,
.pc-float-toggle .fuel-float::before,
.pc-float-toggle .mode-float::before, .pc-float-toggle .mode-float::after,
.pc-float-toggle .saints-float::before,
.pc-float-toggle .pub-float::before { color: #fff; }

/* PC 레이아웃 회색 글자 */
@media (min-width: 673px) {
    .pc-fields .fld-name, .pc-sem-info .s, .pc-sem-empty, .pc-group-empty { color: rgba(255,255,255,.72); }
    .pc-fields .fld-ico, .pc-sem-photo { color: rgba(255,255,255,.55); }
    .pc-fields li { border-bottom-color: rgba(255,255,255,.12); }   /* PC 교회정보 항목 구분선 */
    .pc-sem-arrow { color: rgba(255,255,255,.4); }
    .pc-group-title span { color: rgba(255,255,255,.72); }
}

/* ============ 기능안내 모달 (map.css) ============ */
.help-tips-dim{ background: rgba(0,0,0,.55); }
.help-tips{ background: #0a2733; box-shadow: 0 18px 50px rgba(0,0,0,.6); }
.ht-close{ color: rgba(255,255,255,.5); }
.ht-hero{
    /* color-mix 미지원 폴백 — 밝은 포인트색 링 */
    background:
        radial-gradient(circle at 50% 58%,
            rgba(77,178,238,.20) 0 30px,
            rgba(77,178,238,.12) 30px 56px,
            rgba(77,178,238,.07) 56px 84px,
            rgba(77,178,238,.035) 84px 114px,
            transparent 114px);
    background:
        radial-gradient(circle at 50% 58%,
            color-mix(in srgb, var(--hc, #4db2ee) 22%, transparent) 0 30px,
            color-mix(in srgb, var(--hc, #4db2ee) 13%, transparent) 30px 56px,
            color-mix(in srgb, var(--hc, #4db2ee) 8%, transparent) 56px 84px,
            color-mix(in srgb, var(--hc, #4db2ee) 4%, transparent) 84px 114px,
            transparent 114px);
}
.ht-hero i{ color: #4db2ee; color: color-mix(in srgb, var(--hc, #4db2ee) 65%, #fff); }
.ht-head h3{ color: #fff; }
.ht-text-box{ background: #123748; }
.ht-text{ color: rgba(255,255,255,.82); }
.ht-text b{ color: #4db2ee; }
.ht-prev{ background: rgba(255,255,255,.1); color: #fff; }
.ht-prev:active{ background: rgba(255,255,255,.16); }
.ht-never{ color: rgba(255,255,255,.5); }
.ht-never:active{ background: rgba(255,255,255,.07); }

}