@charset "UTF-8";

/* ============================================================
 * widget_runtime.css — 디자인 빌더로 게시된 페이지의 프론트엔드 런타임 CSS
 *  - design_builder.css 에서 빌더(편집 화면) 전용 부분 제외하고,
 *    프론트엔드에서 실제로 필요한 최소한의 스타일만 발췌
 *  - 같은 셀렉터를 design_builder.css 도 가지고 있으나,
 *    프론트엔드(user/page.php, user/index.php) 는 이 파일만 로드하여 38KB → 약 1KB 절감
 * ============================================================ */

/* ============================================================
 * 사용자 컨텐츠 영역 (.db-rt-dynamic) — base.css * reset isolation
 *  base.css 의 * 룰이 모든 element 에 font-family/weight/size/color 등을 직접 박는 환경에서
 *  컨텐츠 영역 안 element 들이 inheritance 동작하도록 명시적으로 inherit 강제.
 *  사용자가 toolbar 로 부분 inline style 박았을 때 다른 속성이 reset 되는 문제 방지.
 * ============================================================ */
.db-rt-dynamic * {font-family:inherit; font-weight:inherit; font-size:inherit; color:inherit; letter-spacing:inherit; line-height:inherit; vertical-align:baseline;}
.db-rt-dynamic strong, .db-rt-dynamic b {font-weight:bold;}
.db-rt-dynamic em, .db-rt-dynamic i {font-style:italic;}
.db-rt-dynamic u {text-decoration:underline;}
.db-rt-dynamic s, .db-rt-dynamic strike, .db-rt-dynamic del {text-decoration:line-through;}
.db-rt-dynamic sub {vertical-align:sub; font-size:smaller;}
.db-rt-dynamic sup {vertical-align:super; font-size:smaller;}
.db-rt-dynamic ul {list-style:disc !important; padding-left:1.5em !important;}
.db-rt-dynamic ol {list-style:decimal !important; padding-left:1.5em !important;}
.db-rt-dynamic li {display:list-item !important; list-style:inherit !important;}
.db-rt-dynamic ul li {list-style:disc !important;}
.db-rt-dynamic ol li {list-style:decimal !important;}
.db-rt-dynamic blockquote {border-left:4px solid #d1d5db; padding-left:0.8em;}

/* widget-section — 위젯 단위 wrap (빌더 db-widget-box 와 공통) */
.widget-section {position:relative;}

/* builder-widgets-wrap — 메인 위젯 wrap.
   flex column 으로 형제 widget-section 간 margin collapse 차단. */
.builder-widgets-wrap {display:flex; flex-direction:column;}

/* 탭 자식 위젯 컨테이너 — 탭 안의 자식 widget-section 간 margin collapse 차단.
   [hidden] 속성을 가진 비활성 탭은 display:none 이 우선되어야 하므로 :not([hidden]) 으로 한정 */
.tab-content-box:not([hidden]) {display:flex; flex-direction:column;}

/* 엔터 줄바꿈 device 별 표시 — <br data-d="..."> 마커 기반.
   - 마커 없는 <br>: 모든 device 에 표시 (기본/하위 호환)
   - 마커 있는 <br>: 명시된 device 에만 표시. 마커는 공백 구분 다중 가능 (예: "desktop tablet")
   ※ 프론트엔드는 viewport 미디어 쿼리만 사용 (디자인모드의 html.db-sim-* 시뮬은 제외) */
@media(min-width:1101px) {
	br[data-d]:not([data-d~="desktop"]) {display:none;}
}
@media(max-width:1100px) and (min-width:601px) {
	br[data-d]:not([data-d~="tablet"]) {display:none;}
}
@media(max-width:600px) {
	br[data-d]:not([data-d~="mobile"]) {display:none;}
}