@charset "utf-8";

/* ═══════════════════════════════════════════════════════════
   eventsend.css
   기념일 발송 대시보드 (/group/eventSend) 전용 스타일
═══════════════════════════════════════════════════════════ */

/* ── 대시보드 레이아웃 ─────────────────────────────── */
.es_dash_row {
    display: flex;
    gap: 1em;
    align-items: stretch;
}
.es_dash_row > .es_event_list_panel {
    flex: 1.2;
    display: flex;
    flex-direction: column;
    min-height: 0;
}
.es_event_list_panel .es_event_table_wrap {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}
.es_dash_col {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1em;
    min-width: 0;
}

/* ── 이벤트 목록 페이징 ────────────────────────────── */
.es_event_pagination {
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.25em;
    padding-top: 0.75em;
    margin-top: 0.5em;
    border-top: 1px solid #f2f4f8;
}
.es_event_pagination .es_pag_btn {
    min-width: 28px;
    height: 28px;
    padding: 0 0.5em;
    border: 1px solid #e3e7ee;
    background: #fff;
    border-radius: 5px;
    font-size: 12px;
    color: #555;
    cursor: pointer;
    line-height: 1;
}
.es_event_pagination .es_pag_btn:hover:not(:disabled):not(.active) {
    background: #f4f6fb;
}
.es_event_pagination .es_pag_btn.active {
    background: var(--point-blue-1, #2664eb);
    color: #fff;
    border-color: var(--point-blue-1, #2664eb);
    cursor: default;
}
.es_event_pagination .es_pag_btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

/* ── 패널 공통 ─────────────────────────────────────── */
.es_dash_panel {
    background: #fff;
    border: 1px solid var(--border-basic, #e5e5e5);
    border-radius: 10px;
    padding: 1.25em 1.25em 1em;
}
.es_dash_panel_head {
    display: flex;
    align-items: center;
    gap: 0.4em;
    margin-bottom: 0.875em;
}
.es_dash_panel_tit {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text-primary, #222);
}

/* ── 툴팁 (이벤트 목록 ?) ─────────────────────────── */
.es_tooltip_wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
}
.es_tooltip_icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #e3e7ee;
    color: #6a7384;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}
.es_tooltip_bubble {
    position: absolute;
    top: calc(100% + 6px);
    left: 50%;
    transform: translateX(-40%);
    background: var(--point-blue-1, #2664eb);
    color: #fff;
    font-size: 12px;
    line-height: 1.45;
    padding: 0.5em 0.85em;
    border-radius: 5px;
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(0,0,0,.12);
    z-index: 3;
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s ease;
}
.es_tooltip_wrap:hover .es_tooltip_bubble {
    opacity: 1;
}

/* ── 이벤트 테이블 ─────────────────────────────────── */
.es_event_table_wrap {
    overflow-x: auto;
}
.es_event_table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.es_event_table th,
.es_event_table td {
    padding: 0.7em 0.5em;
    text-align: center;
    border-bottom: 1px solid #f2f4f8;
    color: #444;
    white-space: nowrap;
}
.es_event_table th {
    font-weight: 500;
    color: #888;
    font-size: 12.5px;
    padding-bottom: 0.6em;
}
.es_event_table td.tl,
.es_event_table th.tl {
    text-align: left;
}
.es_event_table tbody tr:last-child td {
    border-bottom: none;
}

.es_event_name {
    color: var(--text-primary, #222);
    font-weight: 600;
    text-decoration: none;
}
.es_event_name:hover {
    color: var(--point-blue-1, #2664eb);
    text-decoration: underline;
}

.es_detail_link {
    color: #6a7384;
    font-size: 12.5px;
    text-decoration: none;
}
.es_detail_link:hover {
    color: var(--point-blue-1, #2664eb);
    text-decoration: underline;
}

.txt_blue { color: var(--point-blue-1, #2664eb); font-weight: 600; }
.txt_red  { color: #e25858; font-weight: 600; }

/* ── 상태 배지 ─────────────────────────────────────── */
.es_badge {
    display: inline-block;
    padding: 0.25em 0.6em;
    border-radius: 20px;
    font-size: 11.5px;
    font-weight: 700;
}
.es_badge--active {
    background: #e4eeff;
    color: var(--point-blue-1, #2664eb);
}
.es_badge--ended {
    background: #eef0f3;
    color: #8892a0;
}
.es_badge--saved {
    background: #fff1d6;
    color: #c88100;
}

/* ── 결제 여부 ─────────────────────────────────────── */
.es_payment {
    font-size: 12.5px;
}
.es_payment--done {
    color: #444;
}
.es_payment--pending {
    color: var(--point-blue-1, #2664eb);
    text-decoration: underline;
}
.es_payment--pending:hover {
    color: var(--point-blue-2, #1a4fc7);
}

/* ── 알림톡 영역 (카카오 커스텀 바로가기 — kakaoCustomBridge 디자인 차용) ── */
/* 우측 컬럼이 좌측 패널 높이에 stretch 될 때 알림톡 패널이 남는 공간을 모두 메워
   좌·우 컬럼 높이가 항상 동일하도록 함 */
.es_alim_panel {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}
.es_alim_card_row {
    display: flex;
    gap: 0.75em;
    flex: 1;
    min-height: 0;
}
.es_alim_card {
    position: relative;
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    padding: 1em 1em 3.75em;
    border-radius: 1em;
    text-decoration: none;
    color: var(--text-primary, #222);
    transition: box-shadow 0.2s, transform 0.2s;
    overflow: hidden;
}
.es_alim_card:hover {
    box-shadow: 0 5px 15px 0 rgba(0,0,0,0.18);
    transform: translateY(-1px);
}
.es_alim_card--profile { background-color: antiquewhite; }
.es_alim_card--design  { background-color: var(--point-blue-10, #C8E5FF); }

.es_alim_card_tit {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text-primary, #222);
    line-height: 1.3;
}
.es_alim_card_desc {
    font-size: 0.75rem;
    color: var(--text-tertiary, #6a7384);
    line-height: 1.5;
    margin-top: 0.5em;
    letter-spacing: -0.3px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.es_alim_card_icon {
    position: absolute;
    right: 0.75em;
    bottom: 0.75em;
    width: 3.5em;
    height: 3.5em;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    pointer-events: none;
}
.es_alim_card--profile .es_alim_card_icon {
    background-image: url('https://d26rnxki7j12cd.cloudfront.net/img/img/mypage/KakaoTalk_icon.png');
}
.es_alim_card--design .es_alim_card_icon {
    background-image: url('https://d26rnxki7j12cd.cloudfront.net/img/img/mypage/kakao_custom_coupon_icon.png');
}