/* /board/assets/css/board-write.css */
/* ArtistMind - Board Write (responsive form, a11y, dark) */
:root{
  --bw-bg:#fff; --bw-text:#111; --bw-muted:#6b7280;
  --bw-border:#e5e7eb; --bw-soft:#f8fafc;
  --bw-accent:#7244ED; --bw-ink:#fff;
  --bw-radius:14px; --bw-shadow:0 6px 18px rgba(0,0,0,.06);
}
@media (prefers-color-scheme:dark){
  :root{
    --bw-bg:#0f1115; --bw-text:#e5e7ef; --bw-muted:#9aa1ad;
    --bw-border:#242837; --bw-soft:#12141a;
    --bw-accent:#8b73ff;
  }
}

.board-write{ color:var(--bw-text); }
.board-write .bw-head{ margin:8px 0 18px; }
.board-write .bw-title{
  font-weight:800; font-size:clamp(1.4rem,2.4vw,2rem); margin:0 0 .4rem;
}
.board-write .warn{
  background:linear-gradient(180deg, #fff3, transparent);
  color:#b42318; border:1px solid #f2b8b5; padding:.75rem 1rem;
  border-radius:10px; margin:.4rem 0 0;
}

/* form wrapper */
.board-write .bw-form{
  background:var(--bw-soft); border:1px solid var(--bw-border);
  border-radius:var(--bw-radius); box-shadow:var(--bw-shadow);
  padding:clamp(16px,2.5vw,28px);
  display:grid; gap:16px;
}

/* fields */
.board-write .field{ display:grid; gap:8px; }
.board-write .field>label{ font-weight:700; }
.board-write .field .combo{ display:flex; gap:8px; align-items:center; }

/* inputs */
.board-write input[type="text"],
.board-write input[type="password"],
.board-write select,
.board-write textarea{
  width:100%; border:1px solid var(--bw-border); background:var(--bw-bg);
  color:var(--bw-text); border-radius:10px; padding:10px 12px; line-height:1.5;
}
.board-write textarea{ resize:vertical; min-height:200px; }
.board-write .hint{ color:var(--bw-muted); font-size:.85rem; margin:.25rem 0 0; }

/* inline row (checkboxes + password) */
.board-write .inline-row{
  display:grid; grid-template-columns:1fr 1fr minmax(200px, 1fr); gap:10px; align-items:center;
}
.board-write .inline-row .check{ display:flex; align-items:center; gap:.5rem; font-weight:600; }

/* attached list */
.board-write .attached-list{ margin:0; padding:0; list-style:none; display:grid; gap:6px; }
.board-write .attached-list li{ display:flex; gap:.5rem; align-items:center; }
.board-write .attached-list .muted{ color:var(--bw-muted); font-size:.85rem; }

/* actions */
.board-write .actions{
  display:flex; justify-content:flex-end; gap:8px; margin-top:4px;
}
.board-write .btn{
  --_bg:transparent; --_ink:var(--bw-text); --_bd:var(--bw-border);
  display:inline-flex; align-items:center; justify-content:center; gap:.5ch;
  height:42px; padding:0 16px; border-radius:10px;
  border:1px solid var(--_bd); background:var(--_bg); color:var(--_ink);
  font-weight:700; cursor:pointer; text-decoration:none;
  transition:transform .12s ease, background .18s ease, border-color .18s ease;
}
.board-write .btn:hover{ transform:translateY(-1px); }
.board-write .btn-primary{
  --_bg:var(--bw-accent); --_ink:var(--bw-ink); --_bd:var(--bw-accent);
}
.board-write .btn.ghost{
  --_bg:transparent;
  --_bd:color-mix(in oklab, var(--bw-accent) 40%, var(--bw-border));
  --_ink:var(--bw-accent);
}

/* focus a11y */
.board-write a:focus-visible,
.board-write button:focus-visible,
.board-write input:focus-visible,
.board-write select:focus-visible,
.board-write textarea:focus-visible{
  outline:2px solid color-mix(in oklab, var(--bw-accent) 65%, #fff);
  outline-offset:2px; border-radius:10px;
}

/* responsive */
@media (max-width: 640px){
  .board-write .inline-row{
    grid-template-columns:1fr;
  }
}


/* === 페이지 전용: 이 페이지에서는 .container 폭 제한 해제 === */
.bw-nocontainer .container,
.bw-nocontainer #container,
.bw-nocontainer .wrap,
.bw-nocontainer .inner{
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* page shell (no .container) */
.bw-page{
  width:100%;
  padding:3.6875vw var(--grid_pd3) 2.2vw
}


/* 글쓰기: 카테고리 셀/토글 */
.cat-picker{ display:flex; flex-direction:column; gap:.5rem; }
.cp-toggle{
  display:flex; align-items:center; gap:.5rem;
  font-weight:700; padding:.35rem .55rem; border:none; background:transparent; cursor:pointer;
}
.cp-toggle[aria-expanded="true"]::before{ content:'▾'; }
.cp-toggle[aria-expanded="false"]::before{ content:'▸'; }

.cp-sub{ display:flex; flex-wrap:wrap; gap:.35rem .4rem; padding:.25rem .25rem .1rem 1.15rem; }
.cp-pill{
  display:inline-flex; align-items:center; gap:.35rem;
  border:1px solid #ddd; border-radius:999px; padding:.28rem .6rem; background:#fff; cursor:pointer;
}
.cp-pill input{ appearance:none; width:.9rem; height:.9rem; border:1px solid #aaa; border-radius:50%; display:inline-block; position:relative; }
.cp-pill input:checked{ border-color:#111; }
.cp-pill input:checked::after{ content:''; position:absolute; inset:.18rem; background:#111; border-radius:50%; }
.cp-pill:hover{ border-color:#bbb; }