/**
 * onweb_schedule 1.0.7 - style.css
 *
 * ============================================================
 * 🎨 포인트 컬러 커스터마이징 (여기만 수정하면 됩니다)
 * ============================================================
 * 버튼, 오늘 날짜 강조, 선택된 날짜 등 캘린더 전체에서 쓰이는
 * 포인트 컬러는 바로 아래 :root 블록에서 변경합니다.
 * PHP 파일을 열 필요 없이 이 style.css 파일만 수정하면 됩니다.
 */
:root {
    --ows-accent: #000000;  /* 포인트 컬러 (버튼/강조 표시) - 원하는 색상으로 교체하세요 */
    --ows-sun:    #dc2626;  /* 일요일 · 공휴일 색상 */
    --ows-sat:    #2563eb;  /* 토요일 색상 */
}

/* ========== 공통 기반 ========== */
.ows-wrap {
    --ows-line:   #eaecf0;
    --ows-ink:    #1a1f27;
    --ows-sub:    #6b7280;
    --ows-bg:     #ffffff;
    --ows-soft:   #f8f9fb;
    --ows-ev-h:   28px;   /* 이벤트 라벨 높이 — list.skin.php $ev_h 와 동기 */
    max-width: 100%;
    margin: 0 auto;
    color: var(--ows-ink);
    font-size: 15px;
    line-height: 1.5;
}
.ows-wrap *, .ows-wrap *::before, .ows-wrap *::after { box-sizing: border-box; }
.ows-wrap a   { text-decoration: none; color: inherit; }
.ows-wrap button { font: inherit; cursor: pointer; border: none; }
.ows-wrap .sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }

/* ========== 상단 컨트롤 ========== */
.ows-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin: 0 0 16px;
}
.ows-nav { display: flex; align-items: center; gap: 6px; }
.ows-title {
    margin: 0;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -.03em;
    min-width: 160px;
    text-align: center;
}
.ows-nav-btn {
    display: flex; align-items: center; justify-content: center;
    width: 36px; height: 36px;
    border: 1.5px solid var(--ows-line);
    border-radius: 10px;
    font-size: 20px;
    color: var(--ows-sub);
    background: var(--ows-bg);
    transition: border-color .15s, color .15s;
}
.ows-nav-btn:hover { border-color: var(--ows-accent, #000000); color: var(--ows-accent, #000000); }
.ows-today-btn {
    margin-left: 6px;
    padding: 8px 14px;
    border: 1.5px solid var(--ows-line);
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ows-sub);
    background: var(--ows-bg);
    transition: border-color .15s, color .15s;
}
.ows-today-btn:hover { border-color: var(--ows-accent, #000000); color: var(--ows-accent, #000000); }
.ows-actions { display: flex; align-items: center; gap: 8px; }

/* 월간/주간/목록 세그먼트 컨트롤 */
.ows-seg {
    display: flex; padding: 3px;
    border: 1px solid var(--ows-line); border-radius: 11px;
    background: var(--ows-soft);
}
.ows-seg-btn {
    padding: 7px 14px; border-radius: 8px;
    font-size: 13px; font-weight: 600; color: var(--ows-sub);
    transition: background .15s, color .15s;
}
.ows-seg-btn:hover { color: var(--ows-ink); }
.ows-seg-btn.ows-seg-on { background: #fff; color: var(--ows-ink); box-shadow: 0 1px 2px rgba(16,20,28,.08); }

/* ICS 구독 링크 */
.ows-ics-link {
    padding: 9px 14px; border: 1.5px solid var(--ows-line); border-radius: 10px;
    font-size: 12px; font-weight: 600; color: var(--ows-sub);
    transition: border-color .15s, color .15s;
    white-space: nowrap;
}
.ows-ics-link:hover { border-color: var(--ows-accent, #000000); color: var(--ows-accent, #000000); }

.ows-write-btn {
    display: inline-flex; align-items: center;
    padding: 9px 20px;
    border-radius: 10px;
    background: var(--ows-accent, #000000);
    color: #fff !important;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -.01em;
    transition: filter .15s, transform .15s, box-shadow .15s;
}
.ows-write-btn:hover { filter: brightness(1.1); color: #fff !important; transform: translateY(-1px); box-shadow: 0 4px 12px rgba(16,20,28,.18); }

/* ========== 분류 드롭다운 ========== */
.ows-cate-wrap { display: flex; align-items: center; gap: 10px; }
.ows-cate-lb { font-size: 12px; font-weight: 700; color: var(--ows-sub); letter-spacing: .04em; }
.ows-cate-sel-box {
    position: relative;
    display: inline-block;
}
.ows-cate-sel-box::after {
    content: "";
    position: absolute; right: 14px; top: 50%;
    width: 8px; height: 8px;
    border-right: 2px solid var(--ows-sub);
    border-bottom: 2px solid var(--ows-sub);
    transform: translateY(-65%) rotate(45deg);
    pointer-events: none;
}
.ows-cate-sel {
    appearance: none; -webkit-appearance: none; -moz-appearance: none;
    padding: 9px 36px 9px 16px;
    border: 1.5px solid var(--ows-line);
    border-radius: 11px;
    background: var(--ows-bg);
    font-size: 13px; font-weight: 700;
    color: var(--ows-ink);
    cursor: pointer;
    min-width: 150px;
    transition: border-color .15s, box-shadow .15s;
}
.ows-cate-sel:hover { border-color: var(--ows-accent, #000000); }
.ows-cate-sel:focus {
    outline: none; border-color: var(--ows-accent, #000000);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--ows-accent, #000000) 14%, transparent);
}

/* ========== 캘린더 그리드 ========== */
.ows-cal {
    border: 1px solid var(--ows-line);
    border-radius: 18px;
    overflow: hidden;
    background: var(--ows-bg);
}

/* 요일 헤더 - 연한 배경 + 포인트컬러 밑줄, 여유 있는 높이 */
.ows-dow {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    background: var(--ows-soft);
    border-bottom: 2px solid var(--ows-accent, #000000);
}
.ows-dow span {
    padding: 18px 0;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    color: var(--ows-ink);
    letter-spacing: .08em;
}
.ows-dow .ows-sun { color: var(--ows-sun, #dc2626); }
.ows-dow .ows-sat { color: var(--ows-sat, #2563eb); }

/* 주(row) */
.ows-week {
    position: relative;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    border-bottom: 1px solid var(--ows-line);
}
.ows-week:last-child { border-bottom: 0; }

/* 날짜 셀 */
.ows-day {
    position: relative;
    border-right: 1px solid var(--ows-line);
    padding: 14px 14px 12px;
    min-height: inherit;
    transition: background .15s;
}
.ows-day:last-child { border-right: 0; }
.ows-day.ows-out    { background: color-mix(in srgb, var(--ows-soft) 50%, #fff); }
.ows-day.ows-hover   { background: color-mix(in srgb, var(--ows-accent, #000000) 6%, #fff); }

/* 오늘 강조 - 셀 전체에 은은한 배경 틴트 */
.ows-day.ows-today {
    background: color-mix(in srgb, var(--ows-accent, #000000) 5%, #fff);
}

/* 날짜 숫자 */
.ows-day-num {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 30px; height: 30px;
    padding: 0 4px;
    border: none;
    border-radius: 50%;
    background: transparent;
    font-size: 14px;
    font-weight: 500;
    color: var(--ows-ink);
    transition: background .12s;
    line-height: 1;
}
.ows-day-num:hover { background: var(--ows-soft); }

/* 오늘 날짜 숫자 */
.ows-day.ows-today .ows-day-num {
    background: var(--ows-accent, #000000);
    color: #fff;
    font-weight: 800;
}
.ows-day.ows-today .ows-day-num:hover { filter: brightness(1.1); }

/* 당월 외 날짜 */
.ows-day.ows-out .ows-day-num       { color: #c5cad4; }
.ows-day.ows-sun .ows-day-num       { color: var(--ows-sun, #dc2626); }
.ows-day.ows-sat .ows-day-num       { color: var(--ows-sat, #2563eb); }
.ows-day.ows-out.ows-sun .ows-day-num { color: color-mix(in srgb, var(--ows-sun, #dc2626) 45%, #fff); }
.ows-day.ows-out.ows-sat .ows-day-num { color: color-mix(in srgb, var(--ows-sat, #2563eb) 45%, #fff); }
/* 오늘이면 항상 흰색 유지 */
.ows-day.ows-today.ows-sun .ows-day-num,
.ows-day.ows-today.ows-sat .ows-day-num { color: #fff; }

/* 공휴일 */
.ows-hol {
    display: block;
    margin-top: 1px;
    font-size: 10px;
    font-weight: 500;
    color: var(--ows-sun, #dc2626);
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ========== 이벤트 라벨 ========== */
.ows-bars { position: absolute; left: 0; top: 0; right: 0; bottom: 0; pointer-events: none; }

.ows-bar {
    pointer-events: auto;
    position: absolute;
    height: var(--ows-ev-h);
    display: flex; align-items: center; gap: 5px;
    padding: 0 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    overflow: hidden;
    white-space: nowrap;
    box-shadow: 0 1px 2px rgba(16,20,28,.08);
    transition: filter .1s, box-shadow .1s, transform .1s;
    cursor: pointer;
}
.ows-bar:hover { filter: brightness(1.06); box-shadow: 0 3px 10px rgba(16,20,28,.16); transform: translateY(-1px); }
.ows-bar-time  { font-size: 11px; opacity: .82; flex: none; }
.ows-bar-title { overflow: hidden; text-overflow: ellipsis; }

/* 주 넘김 연결 */
.ows-bar.ows-cl { border-top-left-radius: 0; border-bottom-left-radius: 0; padding-left: 6px; }
.ows-bar.ows-cr { border-top-right-radius: 0; border-bottom-right-radius: 0; padding-right: 4px; }

/* 드래그 */
.ows-bar.ows-editable { cursor: grab; }
.ows-bar.ows-dragging { opacity: .5; cursor: grabbing; box-shadow: 0 6px 16px rgba(0,0,0,.22); }
.ows-drag-on { user-select: none; }

/* 리사이즈 핸들 */
.ows-rz {
    position: absolute; right: 0; top: 0; bottom: 0;
    width: 12px;
    cursor: ew-resize;
    z-index: 1;
}
.ows-rz::before {
    content: "";
    position: absolute; right: 4px; top: 6px; bottom: 6px;
    width: 3px; border-radius: 2px;
    background: currentColor; opacity: .35;
}

/* +N 더보기 */
.ows-more {
    position: absolute;
    left: 8px;
    border: none;
    border-radius: 6px;
    padding: 2px 8px;
    background: var(--ows-soft);
    color: var(--ows-sub);
    font-size: 11px;
    font-weight: 700;
    transition: background .12s;
}
.ows-more:hover { background: var(--ows-line); color: var(--ows-ink); }

/* 모바일 점 표시 */
.ows-dots { display: none; position: absolute; left: 0; right: 0; bottom: 6px; text-align: center; }
.ows-dots i { display: inline-block; width: 5px; height: 5px; margin: 0 1.5px; border-radius: 50%; background: var(--ows-accent, #000000); }

/* ========== 목록 뷰 (카드형) ========== */
.ows-list { display: flex; flex-direction: column; gap: 10px; }
.ows-list[hidden] { display: none; }
.ows-lcard {
    position: relative;
    display: flex; align-items: center; gap: 14px;
    padding: 14px 18px 14px 22px;
    border: 1px solid var(--ows-line);
    border-radius: 14px;
    background: var(--ows-bg);
    overflow: hidden;
    transition: border-color .15s, box-shadow .15s, transform .1s;
}
.ows-lcard:hover {
    border-color: color-mix(in srgb, var(--ows-accent, #000000) 40%, var(--ows-line));
    box-shadow: 0 4px 14px rgba(16,20,28,.08);
    transform: translateY(-1px);
}
.ows-lcard-bar { position: absolute; left: 0; top: 0; bottom: 0; width: 5px; }
.ows-lcard-thumb { width: 44px; height: 44px; border-radius: 10px; object-fit: cover; flex: none; }
.ows-lcard-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.ows-lcard-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ows-lcard-range { font-size: 12px; font-weight: 600; color: var(--ows-sub); }
.ows-lcard-sca {
    padding: 1px 8px; border-radius: 99px;
    background: var(--ows-soft); color: var(--ows-sub);
    font-size: 11px; font-weight: 700;
}
.ows-lcard-title {
    font-size: 15px; font-weight: 700; color: var(--ows-ink);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ows-lcard-name {
    flex: none; font-size: 12px; color: var(--ows-sub);
    padding-left: 10px; white-space: nowrap;
}
.ows-lcard-notice { background: color-mix(in srgb, var(--ows-sun, #dc2626) 4%, #fff); }
.ows-chip { display: inline-block; width: 10px; height: 10px; border-radius: 4px; margin-right: 8px; vertical-align: -1px; }
.ows-cmt {
    margin-left: 4px; padding: 1px 7px;
    border-radius: 99px;
    background: var(--ows-soft);
    color: var(--ows-sub);
    font-size: 11px; font-weight: 700;
}
.ows-empty { text-align: center; color: var(--ows-sub); padding: 40px 0; font-size: 14px; }

/* ========== 주간 아젠다 뷰 (월간과 다른 카드형 디자인) ========== */
.ows-agenda {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 10px;
}
.ows-agenda[hidden] { display: none; }
.ows-wa-col {
    border: 1px solid var(--ows-line);
    border-radius: 14px;
    background: var(--ows-bg);
    overflow: hidden;
    display: flex; flex-direction: column;
    min-height: 280px;
}
.ows-wa-col.ows-wa-today { border-color: var(--ows-accent, #000000); border-width: 1.5px; }
.ows-wa-head {
    padding: 14px 10px 12px;
    text-align: center;
    background: var(--ows-soft);
    border-bottom: 1px solid var(--ows-line);
}
.ows-wa-dow { display: block; font-size: 11px; font-weight: 700; color: var(--ows-sub); letter-spacing: .06em; }
.ows-wa-num {
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; margin-top: 4px;
    border-radius: 50%; font-size: 15px; font-weight: 700; color: var(--ows-ink);
}
.ows-wa-col.ows-wa-today .ows-wa-num { background: var(--ows-accent, #000000); color: #fff; }
.ows-wa-col.ows-wa-sun .ows-wa-num { color: var(--ows-sun, #dc2626); }
.ows-wa-col.ows-wa-sat .ows-wa-num { color: var(--ows-sat, #2563eb); }
.ows-wa-col.ows-wa-today.ows-wa-sun .ows-wa-num,
.ows-wa-col.ows-wa-today.ows-wa-sat .ows-wa-num { color: #fff; }
.ows-wa-hol { display: block; font-size: 10px; color: var(--ows-sun, #dc2626); margin-top: 2px; }
.ows-wa-body { flex: 1; padding: 10px 8px; display: flex; flex-direction: column; gap: 6px; }
.ows-wa-empty { margin: 12px 0 0; text-align: center; font-size: 12px; color: #d1d5db; }
.ows-wa-chip {
    display: flex; align-items: center; gap: 4px;
    padding: 7px 9px; border-radius: 8px;
    font-size: 12px; font-weight: 600;
    box-shadow: 0 1px 2px rgba(16,20,28,.08);
    transition: filter .1s, transform .1s;
}
.ows-wa-chip:hover { filter: brightness(1.06); transform: translateY(-1px); }
.ows-wa-chip-t { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ows-wa-cont { flex: none; font-size: 11px; opacity: .8; }



/* 공지 일정 강조 */
.ows-notice-pin { font-size: 10px; margin-right: 3px; flex: none; }
.ows-notice-badge {
    display: inline-flex; align-items: center;
    padding: 1px 7px; margin-right: 6px;
    border-radius: 5px;
    background: var(--ows-sun, #dc2626);
    color: #fff; font-size: 10px; font-weight: 800;
    letter-spacing: .02em; vertical-align: 1px;
}

/* ========== 모달 ========== */
.ows-noscroll { overflow: hidden; }
.ows-modal {
    position: fixed; inset: 0; z-index: 9990;
    display: flex; align-items: center; justify-content: center;
    padding: 20px;
}
.ows-modal[hidden] { display: none; }
.ows-modal-bg { position: absolute; inset: 0; background: rgba(15,20,30,.48); }
.ows-modal-box {
    position: relative;
    width: 100%; max-width: 580px; max-height: 88vh;
    display: flex; flex-direction: column;
    background: #fff;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,.28);
    animation: ows-pop .18s cubic-bezier(.34,1.3,.7,1);
}
@keyframes ows-pop { from { transform: translateY(12px) scale(.97); opacity: 0; } to { transform: none; opacity: 1; } }
.ows-modal-head {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 10px;
    padding: 18px 20px;
    background: var(--ows-soft);
}
.ows-modal-head strong { font-size: 17px; font-weight: 800; line-height: 1.3; word-break: keep-all; }
.ows-x {
    flex: none; width: 32px; height: 32px;
    border: none;
    border-radius: 10px;
    background: rgba(0,0,0,.08);
    color: inherit;
    font-size: 20px; line-height: 1;
    display: flex; align-items: center; justify-content: center;
}
.ows-x:hover { background: rgba(0,0,0,.16); }
.ows-modal-body { padding: 18px 20px; overflow-y: auto; }
.ows-meta {
    margin: 0 0 16px;
    padding: 0;
    list-style: none;
    display: flex; flex-direction: column; gap: 6px;
}
.ows-meta li { display: flex; gap: 10px; font-size: 13px; }
.ows-meta b  { flex: none; width: 34px; color: var(--ows-sub); font-weight: 700; }
.ows-content { font-size: 14px; line-height: 1.7; word-break: break-word; }
.ows-content img { max-width: 100%; height: auto; border-radius: 8px; }
.ows-modal-imgs { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.ows-modal-imgs img { display: block; width: 100%; height: auto; border-radius: 10px; border: 1px solid var(--ows-line); }
.ows-msg { margin: 12px 0; color: var(--ows-sub); text-align: center; font-size: 14px; }
.ows-modal-foot { display: flex; gap: 8px; padding: 12px 20px 18px; }
.ows-modal-foot:empty { display: none; }
.ows-btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 10px 18px;
    border: 1.5px solid var(--ows-line);
    border-radius: 10px;
    font-size: 13px; font-weight: 600;
    color: var(--ows-ink);
    background: #fff;
    transition: border-color .15s;
}
.ows-btn:hover { border-color: #b0b7c3; }
.ows-btn-main {
    flex: 1;
    background: var(--ows-accent, #000000);
    border-color: transparent;
    color: #fff !important;
    font-weight: 700;
}
.ows-btn-main:hover { filter: brightness(1.1); color: #fff !important; }

/* 날짜별 시트 */
.ows-daylist  { margin: 0; padding: 0; list-style: none; }
.ows-dayitem  {
    display: flex; align-items: center; gap: 10px;
    width: 100%; padding: 10px;
    border: none; border-bottom: 1px solid #f0f1f4;
    background: #fff; text-align: left;
    font-size: 14px; border-radius: 8px;
    transition: background .1s;
}
.ows-dayitem:hover { background: var(--ows-soft); }
.ows-dayitem-thumb { width: 36px; height: 36px; object-fit: cover; border-radius: 8px; flex: none; }
.ows-dayitem-t { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.ows-dayitem-r { flex: none; margin-left: 12px; color: var(--ows-sub); font-size: 12px; }

/* ========== 접근성 ========== */
.ows-wrap a:focus-visible,
.ows-wrap button:focus-visible { outline: 2px solid var(--ows-accent, #000000); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .ows-modal-box { animation: none; } }

/* ========== 모바일 ========== */
@media (max-width: 719px) {
    .ows-wrap { padding: 0 20px; font-size: 14px; }

    /* 상단 컨트롤: 줄바꿈 허용, 세그먼트/버튼 축소 */
    .ows-top { gap: 10px; }
    .ows-title { font-size: 17px; min-width: 0; }
    .ows-nav-btn { width: 32px; height: 32px; font-size: 18px; }
    .ows-today-btn { padding: 6px 10px; font-size: 12px; }
    .ows-actions { width: 100%; justify-content: flex-end; flex-wrap: wrap; row-gap: 8px; }
    .ows-cate-wrap { order: -1; width: 100%; }
    .ows-cate-lb { display: none; }
    .ows-cate-sel { width: 100%; }
    .ows-seg-btn { padding: 6px 10px; font-size: 12px; }
    .ows-ics-link { display: none; } /* 모바일에서는 전체 내보내기/게시판설정 링크 숨김(공간 절약) */
    .ows-write-btn { padding: 8px 14px; font-size: 12px; }

    /* 월간 캘린더: PC와 동일하게 일정 라벨을 표시하되, 가로 스크롤로 확보 */
    .ows-cal { overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
    .ows-cal .ows-dow,
    .ows-cal .ows-week { min-width: 600px; }
    .ows-day { padding: 8px 8px 6px; }
    .ows-day-num { min-width: 24px; height: 24px; font-size: 12px; }
    .ows-bar { font-size: 11px; }
    .ows-dots { display: none; } /* 이제 실제 일정이 보이므로 점 표시는 불필요 */

    /* 주간 아젠다: 요일별로 세로 나열 (가로 스크롤 대신, 스크롤 한 번으로 전체 확인) */
    .ows-agenda { display: flex; flex-direction: column; gap: 8px; }
    .ows-wa-col { flex-direction: row; align-items: stretch; min-height: 0; }
    .ows-wa-head {
        flex: none; width: 66px;
        border-bottom: 0; border-right: 1px solid var(--ows-line);
        display: flex; flex-direction: column; align-items: center; justify-content: center;
        padding: 10px 4px;
    }
    .ows-wa-body { flex: 1; flex-direction: row; flex-wrap: wrap; align-items: center; padding: 10px; }
    .ows-wa-chip { flex: none; max-width: 100%; }
    .ows-wa-empty { margin: 0; padding-left: 2px; }

    /* 목록 카드 */
    .ows-lcard { padding: 12px 14px 12px 18px; gap: 10px; }
    .ows-lcard-thumb { width: 38px; height: 38px; }
    .ows-lcard-title { font-size: 14px; }
    .ows-lcard-name { display: none; } /* 좁은 화면에서는 작성자 생략 */
}

