/* 포스터제작소 · 화이트 라인 테마
   흰 바탕 + 1px 검정 선으로 구역 나눔. 색은 흰색·검정·파랑(주요 버튼·선택)·빨강(제목 점·삭제)만 씀.
   common/apple-theme.css(어두운 편집 화면) 뒤에 불러와 같은 범위(html[data-page=hyeonpan])로 덮어씀.
   인쇄 창·이미지 저장에는 data-page 표시가 없어 포스터 내용에는 적용되지 않음 */
html[data-page=hyeonpan]{--wl-ink:#111;--wl-line:1px solid #111;--wl-blue:var(--ap-blue-focus,#0071e3);--wl-red:#e5383b}

/* 바탕: 공통 메뉴줄·화면 전체·작업대·속성 칸 모두 흰색 */
html[data-page=hyeonpan] body,
html[data-page=hyeonpan] #root > div,
html[data-page=hyeonpan] #root main,
html[data-page=hyeonpan] #root aside{background:#fff !important;color:var(--wl-ink) !important}
html[data-page=hyeonpan] .gnav{background:#fff !important;border-bottom:var(--wl-line) !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important}
html[data-page=hyeonpan] .gnav a{background:#fff !important;color:var(--wl-ink) !important;border-color:transparent !important}
html[data-page=hyeonpan] .gnav a:hover{border-color:var(--wl-ink) !important}
html[data-page=hyeonpan] .gnav a.gnav-active{color:var(--wl-blue) !important;border-color:var(--wl-blue) !important}

/* 어두운 칸·버튼 → 흰색, 어두운 테두리 → 검정 선 */
html[data-page=hyeonpan] #root [class*="bg-[#1E1E20]"],
html[data-page=hyeonpan] #root [class*="bg-[#1A1A1E]"],
html[data-page=hyeonpan] #root [class*="bg-[#232326]"],
html[data-page=hyeonpan] #root [class*="bg-[#2A2A2E]"],
html[data-page=hyeonpan] #root [class*="bg-[#2E2E32]"],
html[data-page=hyeonpan] #root [class*="bg-[#3A3A40]"],
html[data-page=hyeonpan] #root [class*="bg-[#FAFAFB]"],
html[data-page=hyeonpan] #root [class*="bg-[#E8E8EB]"]{background-color:#fff !important}
html[data-page=hyeonpan] #root [class*="border-[#2A2A2E]"],
html[data-page=hyeonpan] #root [class*="border-[#3A3A42]"],
html[data-page=hyeonpan] #root [class*="border-[#3A3A40]"],
html[data-page=hyeonpan] #root [class*="border-[#E5E5E8]"]{border-color:var(--wl-ink) !important}
html[data-page=hyeonpan] #root [class*="bg-[#3A3A40]"][class*="w-px"]{background-color:var(--wl-ink) !important} /* 도구줄 세로 구분선 */
html[data-page=hyeonpan] #root [class*="text-[#EDEDEF]"],
html[data-page=hyeonpan] #root [class*="text-[#A0A0A8]"],
html[data-page=hyeonpan] #root [class*="text-[#8A8A92]"],
html[data-page=hyeonpan] #root [class*="text-[#CCC]"],
html[data-page=hyeonpan] #root [class*="text-[#BBB]"]{color:var(--wl-ink) !important}
/* 흰 바탕이 된 버튼은 마우스를 올리면 검정 테두리로 표시 */
html[data-page=hyeonpan] #root [class*="hover:bg-[#3A3A40]"]:hover{background-color:#fff !important;box-shadow:inset 0 0 0 1px var(--wl-ink) !important}
html[data-page=hyeonpan] #root [class*="hover:text-white"]:hover{color:var(--wl-ink) !important}

/* index.php의 fixHeaderSeparation()이 '포스터제작소' 글자가 든 칸들(#root·바깥 칸·제목 묶음)에 직접 칠하는 검정(#111)과
   도형 탭 줄 위의 어두운 선(#2A2A2E)을 흰 테마에 맞게 덮어씀 (직접 칠한 색은 !important로만 덮을 수 있음) */
html[data-page=hyeonpan] #root{background:#fff !important}
html[data-page=hyeonpan] #root header div[style*="background"]{background:transparent !important}
html[data-page=hyeonpan] #root aside [style*="border-top"]{border-top-color:var(--wl-ink) !important}

/* 상단 도구줄: 흰 바탕 + 아래 선, 로고 자리에 상록보육원 심볼(배경 투명, ../img/logo-symbol.png 312×160), 제목 옆 빨간 점 */
html[data-page=hyeonpan] #root header{background:#fff !important;color:var(--wl-ink) !important;border-bottom:var(--wl-line) !important}
html[data-page=hyeonpan] #root header [class*="rounded-lg"][class*="bg-white"]{width:62px;height:32px;border:0 !important;border-radius:0 !important;
  background:url("../img/logo-symbol.png") center/contain no-repeat !important;font-size:0 !important;color:transparent !important}
/* '+ 로고 추가하기' 버튼은 눈에 잘 띄게 빨간 굵은 글씨 */
html[data-page=hyeonpan] #root header button[title^="상록보육원 로고"]{color:var(--wl-red) !important;font-weight:800 !important}
html[data-page=hyeonpan] #root header span[class*="text-[18px]"]::after{content:"";display:inline-block;width:7px;height:7px;margin-left:6px;border-radius:50%;background:var(--wl-red);vertical-align:3px}

/* 되돌리기·다시하기: 검정 테두리 알약 + 검정 화살표 */
html[data-page=hyeonpan] #root header button[title^="되돌리기"],
html[data-page=hyeonpan] #root header button[title^="다시하기"]{background-color:#fff !important;border:var(--wl-line) !important}
html[data-page=hyeonpan] #root header button[title^="되돌리기"]::after,
html[data-page=hyeonpan] #root header button[title^="다시하기"]::after{color:var(--wl-ink)}
html[data-page=hyeonpan] #root header button[title^="되돌리기"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 14 4 9l5-5'/%3E%3Cpath d='M4 9h10.5a5.5 5.5 0 0 1 0 11H11'/%3E%3C/svg%3E")}
html[data-page=hyeonpan] #root header button[title^="다시하기"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m15 14 5-5-5-5'/%3E%3Cpath d='M20 9H9.5a5.5 5.5 0 0 0 0 11H13'/%3E%3C/svg%3E")}
html[data-page=hyeonpan] #root header button[title^="되돌리기"]:not(:disabled):hover::after,
html[data-page=hyeonpan] #root header button[title^="다시하기"]:not(:disabled):hover::after{color:#fff}
html[data-page=hyeonpan] #root header button[title^="되돌리기"]:not(:disabled):hover::before{filter:invert(1)}
html[data-page=hyeonpan] #root header button[title^="다시하기"]:not(:disabled):hover::before{filter:invert(1)}

/* 왼쪽 패널: 오른쪽 경계선, 탭은 알약 모양 · 선택된 탭은 파랑 테두리 */
html[data-page=hyeonpan] #root aside:first-of-type{border-right:var(--wl-line) !important}
html[data-page=hyeonpan] #root aside button[class*="flex-1"][class*="h-8"]{border-radius:999px !important;border:1px solid transparent}
html[data-page=hyeonpan] #root aside button[class*="flex-1"][class*="h-8"].bg-white{border-color:var(--wl-blue) !important;color:var(--wl-blue) !important}
html[data-page=hyeonpan] #root aside [class*="border-dashed"]{border-color:var(--wl-ink) !important}
/* 왼쪽 패널의 흰색 주요 버튼(템플릿으로 저장 등)은 흰 바탕에 묻히지 않게 파랑 테두리 */
html[data-page=hyeonpan] #root aside button[class*="h-10"].bg-white{border:1px solid var(--wl-blue) !important;color:var(--wl-blue) !important}
html[data-page=hyeonpan] #root aside button[class*="h-10"].bg-white:hover{background:var(--wl-blue) !important;color:#fff !important}

/* 가운데 위 용지·확대 줄 */
html[data-page=hyeonpan] #root main > [class*="bg-[#F5F5F7]"]{background:#fff !important;border-bottom:var(--wl-line) !important}

/* 패널의 선택된 버튼(정렬·선 굵기 등 'bg-white … border-white')은 파랑 테두리로 표시 */
html[data-page=hyeonpan] #root aside button.bg-white.border-white{border-color:var(--wl-blue) !important;color:var(--wl-blue) !important}
/* 굵게·기울임 등 '마우스를 올리면 검정'(hover:bg-[#111]) 버튼: apple-theme의 [class*="bg-[#111]"]에 걸려 평소에도 검정이 되던 것을 되돌림 */
html[data-page=hyeonpan] #root [class*="hover:bg-[#111]"]{background-color:#fff !important;color:var(--wl-ink) !important;border-color:var(--wl-ink) !important}
html[data-page=hyeonpan] #root [class*="hover:bg-[#111]"]:hover{background-color:var(--wl-ink) !important;color:#fff !important}

/* 선택한 개체 위에 뜨는 앞으로·뒤로·삭제 막대 */
html[data-page=hyeonpan] #root main [class*="-top-8"][class*="bg-[#1E1E20]"]{border:var(--wl-line);box-shadow:none !important}
html[data-page=hyeonpan] #root main [class*="-top-8"][class*="bg-[#1E1E20]"] button{color:var(--wl-ink) !important}
html[data-page=hyeonpan] #root main [class*="-top-8"][class*="bg-[#1E1E20]"] button[class*="text-[#FF8A80]"]{color:var(--wl-red) !important}
html[data-page=hyeonpan] #root main [class*="-top-8"][class*="bg-[#1E1E20]"] button:hover{color:var(--wl-blue) !important}

/* 배경 무늬 크기·밀집도 조절 상자 */
html[data-page=hyeonpan] .hp-pat-tune{background:#fff;border:var(--wl-line)}
html[data-page=hyeonpan] .hp-pat-row,
html[data-page=hyeonpan] .hp-pat-row > span{color:var(--wl-ink)}

/* 추천 템플릿 묶음 버튼(캠프·음식): 선택 = 파랑 채움, 나머지 = 흰 바탕 + 검정 테두리 */
html[data-page=hyeonpan] #camp-tpls .camp-chips button{height:34px;font-size:13px;background:#fff;border:var(--wl-line);color:var(--wl-ink)}
html[data-page=hyeonpan] #camp-tpls .camp-chips button:hover{background:#fff;border-color:var(--wl-blue);color:var(--wl-blue)}
html[data-page=hyeonpan] #camp-tpls .camp-chips button.on{background:var(--wl-blue);border-color:var(--wl-blue);color:#fff}
html[data-page=hyeonpan] #camp-tpls .camp-chips button span{opacity:1;font-size:11px}

/* 오른쪽 속성 칸의 '텍스트 편집' 상자(index.php .hp-right-text, 어두운 바탕용): 흰 바탕·검정 글자·검정 테두리로 */
html[data-page=hyeonpan] .hp-right-text{background:#fff;color:var(--wl-ink);border:var(--wl-line)}
html[data-page=hyeonpan] .hp-right-text::before{color:var(--wl-ink)}
html[data-page=hyeonpan] .hp-right-text :is(select,input:not([type=range]):not([type=color]),textarea){color:var(--wl-ink) !important;background-color:#fff !important;border-color:var(--wl-ink) !important}

/* 템플릿 목록 카드·검색칸 */
html[data-page=hyeonpan] .camp-card,
html[data-page=hyeonpan] #tpl-inline-list .tpl-card{background:#fff !important;border:var(--wl-line) !important;color:var(--wl-ink) !important}
html[data-page=hyeonpan] #tpl-search{background:#fff !important;border:var(--wl-line) !important;color:var(--wl-ink) !important}
