@charset "utf-8";

.p12-wrap {display:flex; flex-direction:column; min-height:100%; background:var(--card);}

/* 헤더 */
.p12-head {display:flex; align-items:center; gap:18.5px; padding:22.2px 29.5px; background:var(--card); border-bottom:1.85px solid var(--line);}
.p12-head .cancel {color:var(--body); font-size:25.8px; font-weight:500;}
.p12-head h1 {flex:1; text-align:center; color:var(--ink); font-size:29.5px; font-weight:700;}
.p12-head .done {color:#7C3AED; font-size:25.8px; font-weight:700;}

.p12-body {flex:1;}

/* 안내 박스 */
.p12-notice {margin:25.8px 29.5px; padding:27.7px 31.4px; background:#F5F3FF; border:1.85px solid #DDD6FE; border-radius:18.5px; display:flex; flex-direction:column; gap:14.8px;}
.p12-notice .h {display:flex; align-items:center; gap:11.1px; color:#7C3AED; font-size:24px; font-weight:700;}
.p12-notice .h img {width:27.7px; height:27.7px;}
.p12-notice ul {display:flex; flex-direction:column; gap:7.4px;}
.p12-notice li {position:relative; padding-left:20.3px; color:#7C3AED; font-size:22.2px; line-height:1.5;}
.p12-notice li::before {content:"·"; position:absolute; left:5px; font-weight:700;}

/* 섹션 공통 */
.p12-sec {display:flex; flex-direction:column; gap:14.8px; padding:25.8px 29.5px 31.4px; background:var(--card); border-bottom:1.85px solid var(--line);}
.p12-label {color:var(--sub); font-size:20.3px; font-weight:600; letter-spacing:0.7px;}

/* 카테고리 칩 */
.p12-cats {display:flex; flex-wrap:wrap; gap:12.9px;}
.p12-cat {padding:14.8px 27.7px; background:var(--snow); border:1.85px solid var(--line); border-radius:36.9px; color:var(--body); font-size:22.2px; font-weight:600;}
.p12-cat.on {background:#7C3AED; border-color:#7C3AED; color:#fff;}

/* 제목 (Q.) */
.p12-qsec {display:flex; flex-direction:column; gap:11.1px; padding:29.5px; background:var(--card); border-bottom:1.85px solid var(--line);}
.p12-qsec .qh {display:flex; align-items:center; gap:11.1px; color:#7C3AED; font-size:29.5px; font-weight:800;}
.p12-qsec .qh img {width:33.2px; height:33.2px;}
.p12-qsec textarea {border:0; background:none; color:var(--ink); font-size:31.4px; font-weight:700; line-height:1.4; width:100%; resize:none; outline:none; min-height:88px;}
.p12-qsec textarea::placeholder {color:var(--mute);}
.p12-count {color:var(--sub); font-size:20.3px; text-align:right;}

/* 본문 에디터 */
.p12-ehead {display:flex; align-items:center; gap:9.2px; color:var(--body); font-size:22.2px; font-weight:700;}
.p12-ehead img {width:25.8px; height:25.8px;}
.p12-toolbar {display:flex; flex-wrap:wrap; gap:7.4px; padding-bottom:20.3px; border-bottom:1.85px solid var(--line);}
.p12-tbtn {display:flex; align-items:center; justify-content:center; width:59px; height:59px; background:var(--snow); border:1.85px solid var(--line); border-radius:12.9px; color:var(--body); font-size:24px; font-weight:700;}
.p12-tbtn.u {text-decoration:underline;}
.p12-tbtn.sm {font-size:20.3px;}
.p12-tbtn img {width:27.7px; height:27.7px;}
.p12-editor {min-height:258px; color:var(--ink); font-size:25.8px; line-height:1.8; padding-top:5.5px; outline:none;}

/* 사진 첨부 */
.p12-add {display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7.4px; width:125.5px; height:125.5px; background:var(--snow); border:3.7px dashed var(--mute); border-radius:18.5px;}
.p12-add img {width:40.6px; height:40.6px;}
.p12-add span {color:var(--sub); font-size:18.5px; font-weight:600;}
.p12-photos {display:flex; flex-wrap:wrap; gap:16.6px;}
.p12-photo {position:relative; width:125.5px; height:125.5px; border-radius:18.5px; overflow:hidden; background:var(--snow);}
.p12-photo img.real {width:100%; height:100%; object-fit:cover;}
.p12-photo .del {position:absolute; top:7.4px; right:7.4px; display:flex; align-items:center; justify-content:center; width:33.2px; height:33.2px; background:rgba(0,0,0,0.6); border-radius:16.6px;}
.p12-photo .del img {width:18.5px; height:18.5px;}
.p12-pcount {color:#7C3AED; font-size:20.3px; font-weight:600;}

/* 익명 토글 */
.p12-anon {display:flex; align-items:center; gap:18.5px; padding:25.8px 29.5px; background:var(--card); border-bottom:1.85px solid var(--line);}
.p12-anon .ico {flex:none; display:flex; align-items:center; justify-content:center; width:62.8px; height:62.8px; background:#F5F3FF; border-radius:16.6px;}
.p12-anon .ico img {width:31.4px; height:31.4px;}
.p12-anon .tx {flex:1; display:flex; flex-direction:column; gap:3.7px;}
.p12-anon .tx b {color:var(--ink); font-size:24px; font-weight:600;}
.p12-anon .tx span {color:var(--sub); font-size:20.3px; font-weight:400;}
.p12-switch {flex:none; width:81.2px; height:44.3px; background:var(--mute); border-radius:22.2px; padding:3.7px; display:flex; align-items:center;}
.p12-switch .knob {width:36.9px; height:36.9px; background:#fff; border-radius:50%; box-shadow:0 1.85px 7.4px rgba(0,0,0,0.2); transition:transform .15s;}
.p12-switch.on {background:#7C3AED;}
.p12-switch.on .knob {transform:translateX(36.9px);}

/* 등록 버튼 */
.p12-submit {padding:22.2px 29.5px 44.3px; background:var(--card);}
.p12-submit button {width:100%; display:flex; align-items:center; justify-content:center; gap:14.8px; padding:25.8px; background:linear-gradient(135deg, #1E3A5F, #2D1B69 50%, #7C3AED); border-radius:22.2px; color:#fff; font-size:27.7px; font-weight:700;}
.p12-submit button img {width:33.2px; height:33.2px;}

/* 푸터 탭바 */
.p12-nav {display:flex; align-items:center; justify-content:space-between; padding:20px 40px; background:var(--card); border-top:1.85px solid var(--line);}
.p12-nav .tab {display:flex; flex-direction:column; align-items:center; gap:5.8px; color:var(--sub); font-size:19.2px;}
.p12-nav .tab img {width:42px; height:42px;}
.p12-nav .tab.on {color:var(--teal);}
.p12-nav .tab-fab {position:relative; align-self:stretch; width:96px;}
.p12-nav .tab-fab .fab {position:absolute; left:50%; top:0; transform:translate(-50%,-50%); display:flex; align-items:center; justify-content:center; width:96px; height:96px; border-radius:50%; background:linear-gradient(135deg, #0D9488, #1E3A5F); border:5px solid var(--card); box-shadow:0 10px 24px rgba(13,148,136,0.4);}
.p12-nav .tab-fab .fab img {width:48px; height:48px;}
