/* Simple datepicker styles matching provided design */
.gseye-dp-wrap{max-width:520px;margin:16px auto;font-family:inherit}
.gseye-dp-legend{display:flex;gap:24px;align-items:center;margin:8px 0 16px}
.gseye-dp-legend .legend{display:inline-flex;align-items:center;gap:8px;color:#222;font-weight:600}
.gseye-dp-legend .legend em{display:inline-block;width:22px;height:22px;border-radius:4px;background:#f5f5f5;border:1px solid #eee}
.gseye-dp-legend .legend.holiday em{background:#efb4b4}

.gseye-dp{border:1px solid #e1e1e1;background:#fff;padding:12px}
.gseye-dp .dp-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.gseye-dp .dp-title{flex:1;text-align:center;font-weight:800;border:1px solid #e1e1e1;background:#f5f5f5;padding:10px;border-radius:4px}
.gseye-dp .nav{
    /*display:flex;gap:8px*/
    display:none;   /* < > 버튼 숨김 */
}
.gseye-dp .nav button{background:#f5f5f5;border:1px solid #ddd;border-radius:4px;padding:6px 10px;cursor:pointer}

.gseye-dp table{width:100%;border-collapse:separate;border-spacing:8px}
.gseye-dp th{font-weight:800;color:#222}
.gseye-dp td{width:calc(100%/7);text-align:center;padding:18px 6px;background:#fafafa;border-radius:6px;color:#222}
.gseye-dp td.empty{background:transparent}
.gseye-dp td.holiday{background:#efb4b4;color:#222}

/* === 날짜 칸 사이 여백 더 주기 === */
.gseye-dp table{
    width:100%;
    border-collapse:separate;      /* 칸끼리 떨어뜨리기 */
    border-spacing:3px 3px;        /* 가로, 세로 여백 (원하면 4~10px로 조절) */
    table-layout:fixed;
}

/* 날짜 셀: 테두리 제거하고 카드처럼 */
.gseye-dp td{
    height:64px;
    padding:0;
    text-align:center;
    vertical-align:middle;
    background:#fafafa;
    color:#222;
    border:none;                   /* 그리드 선 제거 */
    border-radius:6px;             /* 살짝 둥글게 */
    font-size:14px;
}

/* 빈 칸 */
.gseye-dp td.empty{
    background:transparent;
    border:none;
}

/* 휴진(일요일) 칸 */
.gseye-dp td.holiday{
    background:#efb4b4;
}

.gseye-dp .dp-title{
    cursor:pointer;
}

.gseye-dp table th {
    border: 0px !important;
}

/* === 월 선택 팝업(타이틀 클릭 시 나오는 부분) === */
.gseye-dp .dp-month-picker{
    margin-top:8px;
    padding:12px;
    border:1px solid #e1e1e1;   /* .gseye-dp / .dp-title 과 같은 라인 */
    background:#fff;            /* 전체 박스 배경 */
    border-radius:4px;
    display:none;               /* 기본은 숨김, JS에서 show() */
}

/* 상단 연도 바 - 기존 dp-header 느낌으로 */
.gseye-dp .dp-month-picker .mp-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:8px;
}

.gseye-dp .dp-month-picker .mp-header .mp-year{
    flex:1;
    text-align:center;
    font-weight:800;
    font-size:14px;
    color:#222;
}

/* 연도 이동 버튼 – 기존 .nav button 스타일 재사용 느낌 */
.gseye-dp .dp-month-picker .mp-header button{
    background:#f5f5f5;
    border:1px solid #ddd;
    border-radius:4px;
    padding:4px 10px;
    cursor:pointer;
}

/* 월 목록 – 날짜 칸처럼 카드형 */
.gseye-dp .dp-month-picker .mp-body{
    display:grid;
    grid-template-columns:repeat(4,1fr); /* 1~12월 4열 그리드 */
    gap:6px;
}

.gseye-dp .dp-month-picker .mp-month{
    display:block;
    width:100%;
    padding:8px 0;
    text-align:center;
    background:#fafafa;         /* 날짜 셀과 같은 배경 */
    border:1px solid #e1e1e1;   /* 달력 외곽과 비슷한 라인 */
    border-radius:6px;          /* 날짜 셀 radius와 통일 */
    font-size:13px;
    color:#222;
    cursor:pointer;
}

/* 현재 월 표시 – 휴진 색 계열 재사용 */
.gseye-dp .dp-month-picker .mp-month.current{
    font-weight:700;
    /*background:#efb4b4;         !* .legend.holiday, .td.holiday 와 같은 계열 *!*/
    border-color:skyblue;
}
