/* ============================================================
   한우프라자 v2 — 행사·이벤트 게시판 스킨 (퍼블 html/event.html 기준)
   퍼블 style.css 는 수정하지 않고, 연동에 필요한 최소 보정만 둔다.
   선택자는 .event_board / .ev_view / .ev_write 로 한정.
   ============================================================ */

/* ── 목록: 탭을 button → a 로 바꿨으므로 퍼블 .ev_tab button 규칙을 링크에도 적용 ── */
.event_board .ev_tab a{
    display:inline-flex; align-items:center; height:40px; padding:0 22px; border:0; border-radius:4px;
    background-color:#f0f0f0; color:#7f7f7f;
    font-size:var(--fs-base); font-weight:600; letter-spacing:-0.05em; white-space:nowrap;
    transition:background-color .25s, color .25s;
}
.event_board .ev_tab a:hover{ background-color:#e6e2dc; color:var(--black-color); }
.event_board .ev_tab a.on{ background-color:var(--brown); color:var(--white-color); }

/* 종료·예정 표시 (퍼블 메인 .ec_end 규칙 재사용 — 썸네일에 position 기준만 추가) */
.event_board .evc_thumb{ position:relative; }
.event_board .ec_end, .event_board .ec_soon{ font-style:normal; }
.event_board .ec_soon{
    position:absolute; left:14px; top:14px; height:26px; padding:0 12px; border-radius:13px;
    background-color:var(--gold); color:var(--white-color); font-size:12px; font-weight:700; line-height:26px; letter-spacing:-0.03em;
}
.event_board .ev_card.end .evc_thumb.has_img{ filter:grayscale(.3); }

/* 카드 기간·매장 (퍼블 카드에 없는 정보 — 제목과 설명 사이 한 줄) */
.event_board .evc_date{ display:block; margin-top:6px; font-size:13px; font-weight:600; color:var(--gold-txt); letter-spacing:-0.03em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.event_board .evc_date + .evc_desc{ -webkit-line-clamp:2; }

/* 검색·관리 도구줄 (퍼블 외 보조 UI — 검색어가 있거나 등록 권한/관리자일 때만 노출) */
.event_board .ev_tools{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:20px; }
.event_board .ev_search{ display:flex; align-items:center; gap:10px; }
.event_board .ev_search .jn_ipt input{ width:260px; height:40px; font-size:14px; }
.event_board .ev_search .jn_sub_btn{ width:72px; height:40px; font-size:14px; }
.event_board .ev_search_reset{ font-size:13px; color:#7f7f7f; text-decoration:underline; }
.event_board .ev_admin{ display:flex; gap:8px; }
.event_board .svd_btn.no_arrow:after{ content:none; }
.event_board .ev_list + .paging_box{ margin-top:58px; }

/* ── 상세 ─────────────────────────────────────────── */
.ev_view .svd_badge.ev_badge{ border-color:var(--brown); background-color:var(--brown); color:var(--white-color); }
.ev_view .svd_badge.ev_badge.end{ border-color:#9a9a9a; background-color:#9a9a9a; }
.ev_view .svd_badge.ev_badge.soon{ border-color:var(--gold); background-color:var(--gold); }
.ev_view .ev_meta{ flex-wrap:wrap; gap:6px 24px; }
.ev_view .ev_meta_item{ font-size:15px; font-weight:500; color:#555; letter-spacing:-0.03em; white-space:nowrap; }
.ev_view .ev_meta_item em{ margin-right:8px; font-style:normal; font-weight:700; color:var(--gold-txt); }
.ev_view .ev_meta .svd_info{ margin-left:0; }
.ev_view .ev_atc{ margin-top:40px; }
.ev_view .ev_imgs{ display:flex; flex-direction:column; gap:16px; }
.ev_view .ev_imgs img{ display:block; width:100%; height:auto; border-radius:12px; box-shadow:4px 11px 16px rgba(0,0,0,.12); }
.ev_view .ev_body{ margin-top:0; }
.ev_view .ev_imgs + .ev_body{ margin-top:36px; }
.ev_view .ev_body img{ max-width:100%; height:auto; }
.ev_view .ev_body p + p{ margin-top:1em; }
.ev_view .ev_attach{ margin-top:40px; padding:22px 24px; border:1px solid #ece7e0; border-radius:10px; background-color:#faf8f5; }
.ev_view .ev_attach_group + .ev_attach_group{ margin-top:14px; padding-top:14px; border-top:1px dashed #e4e1de; }
.ev_view .ev_attach_tit{ display:block; margin-bottom:6px; font-size:14px; font-weight:700; color:var(--black-color); }
.ev_view .ev_attach li{ padding:3px 0; font-size:14px; color:#555; }
.ev_view .ev_attach li a:hover{ color:var(--gold-txt); text-decoration:underline; }
.ev_view .ev_attach li span{ color:#9a9a9a; }
.ev_view .ev_foot{ position:relative; }
.ev_view .ev_admin_btns{ display:flex; justify-content:center; gap:8px; margin-top:16px; }
.ev_view .ev_admin_btns .svd_btn{ padding:8px 14px; font-size:13px; }

/* ── 등록/수정 폼 (퍼블 join2 .jn_form 계열 재사용) ─────────────── */
.ev_write .ev_form{ max-width:800px; margin:40px auto 0; }
.ev_write .jn_ipt select,
.ev_write .jn_ipt textarea{
    flex:1 1 auto; min-width:0; width:100%; padding:0 15px; border:1px solid #e9ebec; border-radius:4px; background-color:var(--white-color);
    font-size:15px; font-weight:500; color:var(--black-color); letter-spacing:-0.03em;
}
.ev_write .jn_ipt select{ height:50px; padding-right:40px; background-image:url('../../../img_pub/main/ico_select.svg'); background-repeat:no-repeat; background-position:right 15px center; }
.ev_write .jn_ipt textarea{ min-height:360px; padding:14px 15px; line-height:1.7; resize:vertical; }
.ev_write .jn_ipt select:focus, .ev_write .jn_ipt textarea:focus{ border-color:var(--gold); outline:none; }
.ev_write .jn_ipt input[type=file]{ padding-top:12px; font-size:14px; font-weight:400; }
.ev_write .jn_ipt input[type=date]{ flex:1 1 0; }
.ev_write .jn_period{ gap:8px; }
.ev_write .jn_tilde{ flex:none; color:#9a9a9a; }
.ev_write .jn_hint.gray{ color:#7f7f7f; font-weight:400; }
.ev_write .jn_field > label + .jn_hint{ margin:-4px 0 10px; }
.ev_write .jn_opts{ display:flex; flex-wrap:wrap; gap:20px; padding:6px 0; }
.ev_write .jn_file + .jn_file{ margin-top:8px; }
.ev_write .jn_file .jn_ipt + .jn_ipt{ margin-top:5px; }
.ev_write .jn_file .jn_chk{ margin-top:8px; }
.ev_write .jn_file .jn_chk span{ font-size:13px; }
.ev_write .jn_editor{ position:relative; }
.ev_write .jn_editor textarea#wr_content{
    width:100%; min-height:360px; padding:14px 15px; border:1px solid #e9ebec; border-radius:4px; background-color:var(--white-color);
    font-size:15px; line-height:1.7; color:var(--black-color); letter-spacing:-0.03em; resize:vertical;
}
.ev_write .jn_editor textarea#wr_content:focus{ border-color:var(--gold); outline:none; }
.ev_write #char_count_desc{ margin-bottom:6px; font-size:12px; color:#9a9a9a; }
.ev_write #char_count_wrap{ margin-top:6px; font-size:12px; color:#9a9a9a; text-align:right; }
.ev_write #autosave_wrapper{ position:relative; }
.ev_write .jn_autosave{ position:absolute; right:0; top:-34px; border:0; background:none; font-size:12px; color:#7f7f7f; text-decoration:underline; }
.ev_write #autosave_pop{
    display:none; position:absolute; top:56px; right:0; z-index:10; width:360px; max-width:100%; padding:16px;
    border:1px solid #ddd; border-radius:6px; background-color:var(--white-color); box-shadow:0 8px 24px rgba(0,0,0,.08); font-size:13px;
}
.ev_write #autosave_pop strong{ display:block; margin-bottom:8px; }
.ev_write #autosave_pop ul li{ display:flex; justify-content:space-between; gap:8px; padding:6px 0; border-top:1px solid #efedeb; }
.ev_write #autosave_pop > div{ margin-top:8px; text-align:right; }
.ev_write #autosave_pop .autosave_close{ border:0; background:none; font-size:12px; color:#7f7f7f; text-decoration:underline; }
.ev_write #captcha{ display:inline-flex; align-items:center; gap:6px; flex-wrap:wrap; }
.ev_write #captcha #captcha_key{ height:44px; padding:0 12px; border:1px solid #e9ebec; border-radius:4px; }
.ev_write .jn_btns{ display:flex; justify-content:center; gap:10px; margin-top:40px; padding-top:28px; border-top:1px solid #e4e1de; }
.ev_write .jn_btns .lg_btn{ display:inline-flex; align-items:center; justify-content:center; width:auto; min-width:200px; margin-top:0; }
.ev_write .jn_btns .lg_btn.cancel{ background-color:#f0f0f0; color:#555; }
.ev_write .jn_btns .lg_btn.cancel:hover{ background-color:#e6e2dc; color:var(--black-color); }

/* ── 반응형 ─────────────────────────────────────────── */
@media screen and (max-width: 960px){
    .event_board .ev_tools{ flex-direction:column; align-items:stretch; }
    .event_board .ev_search{ flex-wrap:wrap; }
    .event_board .ev_search .jn_ipt{ flex:1 1 auto; }
    .event_board .ev_search .jn_ipt input{ width:auto; }
    .ev_view .ev_meta{ flex-direction:column; align-items:flex-start; gap:6px; }
    .ev_view .ev_meta .svd_info{ margin:0; }
}
@media screen and (max-width: 650px){
    .event_board .ev_tab a{ height:34px; padding:0 12px; font-size:14px; }
    .ev_view .ev_attach{ padding:16px; }
    .ev_view .ev_admin_btns{ flex-wrap:wrap; }
    .ev_write .ev_form{ margin-top:28px; }
    .ev_write .jn_period{ flex-wrap:wrap; }
    .ev_write .jn_period input[type=date]{ flex:1 1 100%; }
    .ev_write .jn_tilde{ display:none; }
    .ev_write .jn_btns{ flex-direction:column; }
    .ev_write .jn_btns .lg_btn{ width:100%; }
}
