/*
 Theme Name:   Edubin Child
 Theme URI:    https://example.com
 Description:  Edubin 자식 테마입니다.
 Author:       당신의 이름
 Template:     edubin
 Version:      1.0.0
*/
.lesson-status-deducted {
  font-size: 2em;
  font-weight: bold;
  color: #d9534f;
}
.lesson-status-penalty {
  font-size: 2em;
  font-weight: bold;
  color: #f0ad4e;
}
.lesson-status-normal {
  font-size: 2em;
  font-weight: bold;
  color: #5cb85c;
}





/* Footer 문구 아래 여백 늘리기 */
/* edubin-child/style.css */
#colophon.custom-footer-v1 .site-info {
  margin-top: 60px !important;
}

/* 푸터 하단 flex 컨테이너 */
.custom-footer-v1 .footer-bottom-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 0;
  border-top: none !important;
  margin-top: 40px;
}

/* 각 칸 flex 비율 */
.custom-footer-v1 .footer-bottom-info > div {
  flex: 1;
}




/* 좌·중·우 텍스트 정렬 */
.custom-footer-v1 .footer-left {
  text-align: left;
}
.custom-footer-v1 .footer-center {
  text-align: center;
}
.custom-footer-v1 .footer-right {
  text-align: right;
}

/* 오직 푸터 메뉴에만 적용될 클래스 */
.footer-bottom-menu {
  display: inline-block;
  list-style: none;
  margin: 0;
  padding: 0;
}
.footer-bottom-menu li {
  display: inline-block;
  margin-left: 16px;
}
.footer-bottom-menu li:first-child {
  margin-left: 0;
}

/* edubin-child/style.css 맨 아래에 추가 */

footer#colophon.custom-footer-v1 {
  background-color: #ffffff !important;
}

/* 1) 푸터 전체에서 border 제거 */
#colophon.custom-footer-v1 {
  border: none !important;
  box-shadow: none !important;
}

/* 2) 위젯 영역에 border-bottom 있었다면 */
#colophon.custom-footer-v1 .footer-widgets {
  border-bottom: none !important;
}

/* 3) 하단 정보 영역에도 border-top 있었다면 */
#colophon.custom-footer-v1 .footer-bottom-info {
  border-top: none !important;
}

/* 4) 혹시 hr 태그로 구분선을 넣었다면 숨기기 */
#colophon.custom-footer-v1 hr {
  display: none !important;
}

/* ─────────────────────────────────────────────
   Footer 전체: 배경 흰색, 테두리(위/아래) 흰색으로 덮어쓰기
───────────────────────────────────────────── */
footer#colophon.custom-footer-v1 {
  background-color: #ffffff !important;
  color: #333333 !important;        /* 텍스트 색은 필요에 따라 조정 */
  padding: 60px 0 !important;
  border-top:    1px solid #ffffff !important;
  border-bottom: 1px solid #ffffff !important;
  box-shadow: none !important;
}

/* ─────────────────────────────────────────────
   위젯 영역 경계선(만약 있다면) 흰색으로 덮기
───────────────────────────────────────────── */
footer#colophon.custom-footer-v1 .footer-widgets {
  border-bottom: 1px solid #ffffff !important;
}

/* ─────────────────────────────────────────────
   하단 정보 영역 경계선(만약 있다면) 흰색으로 덮기
───────────────────────────────────────────── */
footer#colophon.custom-footer-v1 .footer-bottom-info {
  border-top: 1px solid #ffffff !important;
}



/* ─────────────────────────────────────────────
   푸터 전체 + 내부 컨테이너 배경 완전 흰색 덮어쓰기
───────────────────────────────────────────── */
#colophon.custom-footer-v1,
#colophon.custom-footer-v1 .edubin-container,
#colophon.custom-footer-v1 .footer-widgets,
#colophon.custom-footer-v1 .footer-bottom-info {
  background: #ffffff !important;  
  background-image: none !important;
  /* 혹시 gradient 나 background-color 별도 지정된 게 있다면 이 줄이 덮어씁니다 */
}

/* 혹시 .site-footer 클래스가 배경을 줄 수도 있으니 추가로 */
.site-footer.custom-footer-v1 {
  background: #ffffff !important;
}


/* ─────────────────────────────────────────────
   만약 위젯 영역이나 추가 구획에도 배경이 있다면
───────────────────────────────────────────── */
html body
  #colophon.custom-footer-v1 .footer-widgets,
html body
  #colophon.custom-footer-v1 .footer-bottom-info {
  background-color: #ffffff !important;
}


/* ─────────────────────────────────────────────
   Footer 및 자식 요소의 모든 테두리, 그림자 제거
───────────────────────────────────────────── */
#colophon.custom-footer-v1,
#colophon.custom-footer-v1 *,
#colophon.custom-footer-v1 *::before,
#colophon.custom-footer-v1 *::after {
  border: none !important;
  box-shadow: none !important;
}

/* 만약 hr 태그가 남아 있다면 숨기기 */
#colophon.custom-footer-v1 hr {
  display: none !important;
}


/* ────────────────────────────────────────────
   Edubin-specific 경계선/그림자 완전 제거
──────────────────────────────────────────── */
footer#colophon.custom-footer-v1,
footer#colophon.custom-footer-v1 *,
footer#colophon.custom-footer-v1 *::before,
footer#colophon.custom-footer-v1 *::after {
  border: none !important;
  box-shadow: none !important;
  background-image: none !important;
  content: none !important;
}

/* Edubin default footer-bottom 래퍼가 쓰는 경계선 제거 */
footer#colophon.custom-footer-v1 .footer-bottom,
footer#colophon.custom-footer-v1 .edubin-footer-default-wrapper {
  border-top: none !important;
  border-bottom: none !important;
}

/* 혹시 hr 태그를 썼다면 숨기기 */
footer#colophon.custom-footer-v1 hr {
  display: none !important;
}




/* ────────────────────────────────────────────
   Footer 전체 텍스트 & 링크를 파란색으로
───────────────────────────────────────────── */
footer#colophon.custom-footer-v1,
footer#colophon.custom-footer-v1 * {
  /* 텍스트 컬러 */
  color: #0000ff !important;
}

/* 링크(a 태그)는 별도로 다시 지정 */
footer#colophon.custom-footer-v1 a {
  color: #0000ff !important;
  text-decoration: none; /* 필요하면 제거 */
}

/* hover 시 색 변화 원하면 이렇게 */
footer#colophon.custom-footer-v1 a:hover {
  color: #0033cc !important;
}


/* 푸터 하단 메뉴 링크를 파란색으로 강제 지정 */
.footer-bottom-menu a {
  color: #0000ff !important;
}


/* ────────────────────────────────────────────
   푸터 하단: 전화번호·메뉴는 분리선 위, 저작권은 분리선 아래
───────────────────────────────────────────── */
.custom-footer-v1 .footer-bottom-info {
  display: flex;
  flex-wrap: wrap;
}

/* 1) 전화번호(.footer-center)와 메뉴(.footer-right)는 분리선 위에 */
.custom-footer-v1 .footer-center,
.custom-footer-v1 .footer-right {
  order: 1;
  width: 50%;           /* 두 칸을 좌우로 나란히 */
  padding-bottom: 15px; /* 분리선과 약간의 여백 */
}

/* 2) 저작권(.footer-left)은 전체 너비로 아래로 이동, 상단에 분리선 추가 */
.custom-footer-v1 .footer-left {
  order: 2;
  width: 100%;
  border-top: 1px solid #ccc; /* 분리선 */
  margin-top: 15px;
  padding-top: 15px;
}

/* (선택) 분리선 색이나 두께 조정하고 싶으면 아래 값 변경 */
.custom-footer-v1 .footer-left {
  border-color: #888888;
  border-width: 1px;
}


footer#colophon {
  background-color: #ffffff !important;
  color:       #333333 !important;
}


.btn-normal {
    border: 2px solid #ef4444;
    color: #ef4444;
    width: 48px;
    height: 48px;
    font-size: 24px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: transparent;
}

.btn-requested {
    border: 2px solid #fbbf24;
    color: #fbbf24;
    background: #fef3c7;
    width: 48px;
    height: 48px;
    font-size: 24px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.btn-requested:hover::after {
    content: "신청 승인 대기 중";
    position: absolute;
    background: #fff;
    color: #000;
    padding: 2px 6px;
    border: 1px solid #ddd;
    border-radius: 4px;
    top: -30px;
    white-space: nowrap;
    font-size: 12px;
}


/* 라벨 배지 (호환성 안전 버전) */
.section-label{
  display:inline-block;
  padding:.35rem .6rem;
  border:2px solid #64748b;   /* 기본값 */
  background:#f8fafc;         /* 아주 옅은 회색 */
  border-radius:.6rem;
  font-weight:700;
  line-height:1;
  letter-spacing:.2px;
  margin-bottom:.5rem;
  color:#0f172a;
}

/* 항목별 색상(배경은 연한 톤으로) */
.section-label--student{ border-color:#2563eb; background:#eff6ff; } /* 파랑 */
.section-label--ai-fix { border-color:#10b981; background:#ecfdf5; } /* 초록 */
.section-label--ai-exp { border-color:#f59e0b; background:#fff7ed; } /* 주황 */
.section-label--tutor  { border-color:#8b5cf6; background:#f5f3ff; } /* 보라 */

/* (옵션) 패널 안 상자 스타일 */
.comment-panel .box{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:.6rem;
  padding:.75rem;
}


/* 강사 코멘트 저장 버튼 (브랜드 보라) */
.btn-comment{
  background:#7c3aed !important;   /* 배경 */
  color:#fff !important;
  border:2px solid #6d28d9 !important;  /* 테두리 */
  padding:.55rem 1rem !important;
  border-radius:.6rem !important;
  font-weight:600 !important;
  line-height:1 !important;
  transition:transform .05s ease, background .15s ease, box-shadow .15s ease !important;
  box-shadow:0 2px 6px rgba(109,40,217,.18) !important;
  cursor:pointer !important;
}
.btn-comment:hover{ background:#6d28d9 !important; }
.btn-comment:active{ transform:translateY(1px) !important; }
.btn-comment:disabled{ opacity:.7 !important; cursor:not-allowed !important; }




/* 알림벨 상단 고정 */
#floating-bell{
  position: fixed !important;
  top: calc(16px + var(--wp-admin--admin-bar--height, 0px)) !important; /* 로그인 시 관리자바 높이 고려 */
  right: 16px !important;
  bottom: auto !important;  /* 기존 아래 고정 제거 */
  z-index: 99999 !important;
}

/* 모바일에서 좀 더 안쪽으로 */
@media (max-width: 640px){
  #floating-bell{ right: 10px; top: calc(10px + var(--wp-admin--admin-bar--height, 0px)); }
}


/* 상단 고정 알림벨 크기 키우기 */
#floating-bell .tm-bell{
  font-size: 28px;     /* ← 아이콘(🔔) 크기 */
  line-height: 1;
}

/* 배지(숫자) 위치/크기도 살짝 보정 */
#floating-bell .tm-badge{
  top: -6px;          /* 아이콘이 커지면 살짝 더 위 */
  right: 8px;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  font-size: 12px;
}

/* 드롭다운 패널 표시 시작 위치 보정(아이콘 아래로) */
#floating-bell .tm-panel{
  top: 42px;
}

/* 모바일에서 너무 크면 조금 줄이기 (선택) */
@media (max-width: 640px){
  #floating-bell .tm-bell{ font-size: 26px; }
  #floating-bell .tm-panel{ top: 38px; }
}

/* 아이콘 주변 여백 & 히트영역 확대 */
#floating-bell .tm-bell{
  font-size: 28px;
  line-height: 1;
  padding: 15px;                /* ← 여백 추가 (상하좌우) */
  border-radius: 10px;         /* 모서리 둥글게(옵션) */
  background: transparent;     /* 필요시 살짝 배경색: rgba(0,0,0,.04) */
  position: relative;          /* 배지 위치 기준 */
}

/* 배지 위치를 패딩에 맞춰 보정 */
#floating-bell .tm-badge{
  top: -6px;                   /* 기존 -10px → 패딩 고려해 보정 */
  right: -6px;                 /* 기존 -12px → 보정 */
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  font-size: 12px;
}

/* 드롭다운 시작 위치(아이콘 아래) — 패딩만큼 살짝 내림 */
#floating-bell .tm-panel{
  top: 46px;                   /* 기존 42px → 46px */
}

/* 호버시 배경 강조(옵션) */
#floating-bell .tm-bell:hover{
  background: rgba(0,0,0,.05);
}

/* 모바일 보정 */
@media (max-width: 640px){
  #floating-bell .tm-bell{ font-size: 26px; padding: 6px; }
  #floating-bell .tm-badge{ top: -6px; right: -6px; }
  #floating-bell .tm-panel{ top: 42px; }
}


/* 숫자 뱃지 위치 조정 (오른쪽 상단 기준) */
#floating-bell .tm-badge{
  top: -6px !important;    /* 원하는 값으로 조정 */
  right: 8px !important;  /* 원하는 값으로 조정 */
}


/* 모달 안: 선택한 세션 안내 문구 텍스트 크게 */
#lateSelectedInfo{
  font-size: 16px;     /* 더 크게 하려면 20~22px로 */
  font-weight: 700;
  color: #111827;
}

/* 세션 리스트의 회차/날짜/시간 텍스트 키우기 */
li[data-session-epoch] > div{
  font-size: 16px;     /* 필요시 18px 등으로 조절 */
  line-height: 1.5;
}

/* 회차 번호는 좀 더 도드라지게 */
li[data-session-epoch] strong{
  font-size: 16px;     /* 필요시 19~20px */
  margin-right: 6px;
}

/* 모달의 '선택한 세션' 안내문 두 줄 간격 넓히기 */
#lateSelectedInfo{
  font-size: 16px;        /* 필요시 20~22px로 */
  font-weight: 700;
  color: #111827;
  line-height: 1.5;       /* ← 줄 간격 (1.6~2.0 사이로 취향대로) */
  white-space: pre-line;  /* ← \n 줄바꿈을 실제 줄바꿈으로 렌더링 */
  margin-bottom: 10px;    /* 아래 여백 조금 */
}



/* 지각 예상 모달 제목 크기/간격 */
#lateModal h2{
  font-size: 16px;   /* 20~24px 사이로 취향대로 */
  line-height: 1.35; /* 줄 간격 살짝 넉넉하게 */
  margin-bottom: 14px;
}





/* 연한 네이비 사각 말풍선 (가로 살짝 확대) */
.tm-bell.tm-msg{
  --bubble:#4A90E2;                 /* 연한 네이비 톤 */
  position:relative;
  display:inline-block;
  width:35px;                        /* 가로 길이 + */
  height:16px;
  background:var(--bubble) !important;
  border:0 !important;
  border-radius:8px;
  background-image:none !important;
  box-shadow:0 1px 2px rgba(0,0,0,.18);
  filter:none !important;            /* 혹시 상속된 필터가 있으면 제거 */
  mix-blend-mode:normal;             /* 겹침으로 어두워지는 것 방지 */
}

/* 꼬리 (본체와 같은 색) */
.tm-bell.tm-msg::after{
  content:"";
  position:absolute;
  left:11px;                         /* 가로 확장에 맞춰 위치 보정 */
  bottom:-6px;
  width:0;height:0;
  border:7px solid transparent;
  border-top-color:var(--bubble);
  border-bottom:0;border-left:0;
}

/* 선택: 호버 시 살짝 밝게 */
.tm-bell.tm-msg:hover{ filter:brightness(1.08); }



#tmBell.tm-msg{
  left: -39px !important;  /* 이미 적용하신 값 */
  top: 8px !important;     /* 아래로 6px 내려가기 (원하는 만큼 조절) */
  
}

/* 1-2. 다음/다다음 등 일반 형제일 때 */
#tmBell.tm-msg ~ .tm-badge{
  position:absolute;
  right: 40px !important;
  top: 0px !important;
  z-index: 3;
}



/* trial 폼 항목 간 간격 */
.trial-form-wrapper form > * { margin-bottom: 16px; }
.trial-form-wrapper form > *:last-child { margin-bottom: 0; }
/* 라벨과 입력 사이 간격 */
.trial-form-wrapper label { display:block; margin-bottom: 8px; }
/* 인풋/셀렉트 높이 조금 넉넉하게 */
.trial-form-wrapper input[type="text"],
.trial-form-wrapper input[type="email"],
.trial-form-wrapper select {
  padding: 10px 12px;
}



/* 체험 안내 박스(겨자색) */
.trial-notice{
  background: #FDE68A !important;   /* 밝은 겨자색 */
  border: 1px solid #F59E0B !important; /* 테두리 */
  color: #7C4A03 !important;         /* 글자색 */
  border-radius: 8px;
  padding: 20px;
}
.trial-notice p { margin: 0; }
.trial-notice p + p { margin-top: 8px; }


.ml-hidden{display:none;}



 /* ▼▼ 여기부터 추가 (패치 CSS) ▼▼ */
  .ml-reg * { box-sizing: border-box; }
  .ml-reg .tutor-box .row{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  .ml-reg .tutor-box .row > div{ min-width: 0; }
  .ml-reg select,
  .ml-reg input[type="text"],
  .ml-reg input[type="email"],
  .ml-reg input[type="password"],
  .ml-reg textarea{
    width: 100%;
    max-width: 100%;
    display: block;
  }
  .ml-reg .tutor-box select[name="ml_birth_country"]{
    width: 100% !important;
    max-width: 100% !important;
  }
  .ml-reg .tutor-box .tutor-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.ml-reg .tutor-box .tutor-row > div{ min-width:0; }
.ml-reg .tutor-box select,
.ml-reg .tutor-box input[type="text"],
.ml-reg .tutor-box textarea{ width:100%; max-width:100%; display:block; }
.ml-reg .tutor-box select[name="ml_birth_country"]{ width:100%; max-width:100%; }
