/*
 * 원우방재 공통 메뉴 아이콘
 * - 기존 메뉴 문구와 동작은 유지하고 아이콘만 보강한다.
 * - 메뉴별 클래스로 아이콘을 연결해 브라우저별 href 선택자 누락 문제를 없앤다.
 */
:root{
  --ww-menu-navy:#173a63;
  --ww-menu-red:#cf2029;
}

#drawer.drawer{
  --drawer-icon:url("/icons/menu/page.svg");
}
#drawer.drawer .drawer-body a,
#drawer.drawer .drawer-footer a{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  color:#243b57;
  text-decoration:none;
}
#drawer.drawer .drawer-body a::before,
#drawer.drawer .drawer-footer a::before{
  content:"";
  display:block;
  flex:0 0 20px;
  width:20px;
  height:20px;
  background-color:var(--drawer-icon-color,var(--ww-menu-navy));
  -webkit-mask-image:var(--drawer-icon);
  -webkit-mask-position:center;
  -webkit-mask-size:contain;
  -webkit-mask-repeat:no-repeat;
  mask-image:var(--drawer-icon);
  mask-position:center;
  mask-size:contain;
  mask-repeat:no-repeat;
  transition:background-color .15s ease,transform .15s ease;
}
#drawer.drawer .drawer-body a:hover,
#drawer.drawer .drawer-body a:focus-visible,
#drawer.drawer .drawer-footer a:hover,
#drawer.drawer .drawer-footer a:focus-visible{
  color:#9f1720;
  background:rgba(207,32,41,.075);
}
#drawer.drawer .drawer-body a:hover::before,
#drawer.drawer .drawer-body a:focus-visible::before,
#drawer.drawer .drawer-footer a:hover::before,
#drawer.drawer .drawer-footer a:focus-visible::before{
  background-color:var(--ww-menu-red);
  transform:translateY(-1px);
}

/* 홈 / 계정 */
#drawer.drawer a.menu-home{--drawer-icon:url("/icons/menu/home.svg");}
#drawer.drawer a.menu-overdue-home{--drawer-icon:url("/icons/menu/home-alert.svg");}
#drawer.drawer a.menu-my-profile,
#drawer.drawer a.menu-admin-password{--drawer-icon:url("/icons/menu/user.svg");}
#drawer.drawer a.menu-users{--drawer-icon:url("/icons/menu/users.svg");}
#drawer.drawer a.menu-user-create{--drawer-icon:url("/icons/menu/user-plus.svg");}

/* 대상처 / 업무대행 */
#drawer.drawer a.menu-site-list{--drawer-icon:url("/icons/menu/building.svg");}
#drawer.drawer a.menu-site-create{--drawer-icon:url("/icons/menu/building-plus.svg");}
#drawer.drawer a.menu-agency{--drawer-icon:url("/icons/menu/briefcase.svg");}

/* 점검 / 점검관리 */
#drawer.drawer a.menu-inspection-calendar{--drawer-icon:url("/icons/menu/calendar.svg");}
#drawer.drawer a.menu-field-records{--drawer-icon:url("/icons/menu/clipboard-check.svg");}
#drawer.drawer a.menu-field-resume{--drawer-icon:url("/icons/menu/edit.svg");}
#drawer.drawer a.menu-work-calendar{--drawer-icon:url("/icons/menu/progress.svg");}
#drawer.drawer a.menu-work-progress{--drawer-icon:url("/icons/menu/list-check.svg");}
#drawer.drawer a.menu-work-deadline{--drawer-icon:url("/icons/menu/alarm.svg");}

/* 업무일지 / 견적 / 자재 */
#drawer.drawer a.menu-work-diary-list{--drawer-icon:url("/icons/menu/book.svg");}
#drawer.drawer a.menu-work-diary-create{--drawer-icon:url("/icons/menu/edit.svg");}
#drawer.drawer a.menu-estimate{--drawer-icon:url("/icons/menu/quote.svg");}
#drawer.drawer a.menu-materials{--drawer-icon:url("/icons/menu/boxes.svg");}

/* 입출금 / 매출 / 수금 */
#drawer.drawer a.menu-finance{--drawer-icon:url("/icons/menu/wallet.svg");}
#drawer.drawer a.menu-sales{--drawer-icon:url("/icons/menu/chart.svg");}
#drawer.drawer a.menu-collection-inspection,
#drawer.drawer a.menu-collection-construction,
#drawer.drawer a.menu-collection-agency{--drawer-icon:url("/icons/menu/coins.svg");}

/* 삭제·작업이력 / 설정 */
#drawer.drawer a.menu-site-deleted,
#drawer.drawer a.menu-schedule-deleted,
#drawer.drawer a.menu-estimate-deleted,
#drawer.drawer a.menu-finance-deleted,
#drawer.drawer a.menu-work-diary-deleted,
#drawer.drawer a.menu-material-deleted{--drawer-icon:url("/icons/menu/trash.svg");}
#drawer.drawer a.menu-site-activity,
#drawer.drawer a.menu-schedule-activity,
#drawer.drawer a.menu-estimate-activity,
#drawer.drawer a.menu-finance-activity,
#drawer.drawer a.menu-work-diary-activity,
#drawer.drawer a.menu-material-activity{--drawer-icon:url("/icons/menu/history.svg");}
#drawer.drawer a.menu-settings{--drawer-icon:url("/icons/menu/settings.svg");}
#drawer.drawer a.menu-logout{--drawer-icon:url("/icons/menu/logout.svg");}


/* 구버전 header.php에도 적용되는 href 기반 보조 매핑 */
#drawer.drawer .drawer-body a[href="/dashboard/index.php"]{--drawer-icon:url("/icons/menu/home.svg");}
#drawer.drawer .drawer-body a[href="/finance/finance_overdue_home.php"]{--drawer-icon:url("/icons/menu/home-alert.svg");}
#drawer.drawer .drawer-body a[href^="/users/my_profile.php"]{--drawer-icon:url("/icons/menu/user.svg");}
#drawer.drawer .drawer-body a[href="/users/user_list.php"]{--drawer-icon:url("/icons/menu/users.svg");}
#drawer.drawer .drawer-body a[href="/users/user_create.php"]{--drawer-icon:url("/icons/menu/user-plus.svg");}
#drawer.drawer .drawer-body a[href="/site/site_list.php"]{--drawer-icon:url("/icons/menu/building.svg");}
#drawer.drawer .drawer-body a[href="/site/site_create.php"]{--drawer-icon:url("/icons/menu/building-plus.svg");}
#drawer.drawer .drawer-body a[href^="/inspections/inspection_schedule_calendar.php"]{--drawer-icon:url("/icons/menu/calendar.svg");}
#drawer.drawer .drawer-body a[href="/inspections/inspection_field_records.php"]{--drawer-icon:url("/icons/menu/clipboard-check.svg");}
#drawer.drawer .drawer-body a[href^="/work/work_deadline_calendar.php"]{--drawer-icon:url("/icons/menu/progress.svg");}
#drawer.drawer .drawer-body a[href="/work/work_case_progress_list.php"]{--drawer-icon:url("/icons/menu/list-check.svg");}
#drawer.drawer .drawer-body a[href^="/work/work_deadline_dashboard.php"]{--drawer-icon:url("/icons/menu/alarm.svg");}
#drawer.drawer .drawer-body a[href="/work_diary/work_diary_list.php"]{--drawer-icon:url("/icons/menu/book.svg");}
#drawer.drawer .drawer-body a[href="/work_diary/work_diary_form.php"]{--drawer-icon:url("/icons/menu/edit.svg");}
#drawer.drawer .drawer-body a[href="/estimate/estimate_list.php"]{--drawer-icon:url("/icons/menu/quote.svg");}
#drawer.drawer .drawer-body a[href="/material/material_list.php"]{--drawer-icon:url("/icons/menu/boxes.svg");}
#drawer.drawer .drawer-body a[href="/finance/finance_list.php"]{--drawer-icon:url("/icons/menu/wallet.svg");}
#drawer.drawer .drawer-body a[href="/finance/sales_dashboard.php"]{--drawer-icon:url("/icons/menu/chart.svg");}
#drawer.drawer .drawer-body a[href^="/finance/finance_collection_year.php"]{--drawer-icon:url("/icons/menu/coins.svg");}
#drawer.drawer .drawer-body a[href*="_deleted_list.php"]{--drawer-icon:url("/icons/menu/trash.svg");}
#drawer.drawer .drawer-body a[href*="_activity.php"]{--drawer-icon:url("/icons/menu/history.svg");}
#drawer.drawer .drawer-body a[href="/settings/menu_access.php"]{--drawer-icon:url("/icons/menu/settings.svg");}
#drawer.drawer .drawer-footer a[href="/auth/logout.php"]{--drawer-icon:url("/icons/menu/logout.svg");}

/* 헤더 새로고침은 기존 동작을 유지하고 기호만 동일한 선형 아이콘으로 교체한다. */
.topbar-refresh > span{
  width:19px;
  height:19px;
  font-size:0 !important;
  background-color:currentColor;
  -webkit-mask:url("/icons/menu/refresh.svg") center / contain no-repeat;
  mask:url("/icons/menu/refresh.svg") center / contain no-repeat;
}

/* PC·모바일 헤더 로그아웃 아이콘은 실제 SVG 이미지로 출력한다.
 * CSS mask 의존을 제거해 일부 모바일 환경에서 빈 원형 버튼만 보이는 문제를 방지한다.
 */
.topbar-logout{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:6px;
}
.topbar-logout-icon{
  display:block;
  flex:0 0 17px;
  width:17px;
  height:17px;
}
.topbar-logout-label{
  display:inline-block;
  white-space:nowrap;
}

@media(max-width:720px){
  #drawer.drawer .drawer-body a,
  #drawer.drawer .drawer-footer a{
    gap:11px;
  }
  #drawer.drawer .drawer-body a::before,
  #drawer.drawer .drawer-footer a::before{
    flex-basis:22px;
    width:22px;
    height:22px;
  }
  .topbar-logout{
    min-width:84px !important;
    padding:0 10px !important;
  }
}
@media(max-width:390px){
  .topbar-logout{
    width:40px !important;
    min-width:40px !important;
    padding:0 !important;
    overflow:hidden;
    gap:0;
  }
  .topbar-logout-icon{
    flex-basis:18px;
    width:18px;
    height:18px;
  }
  .topbar-logout-label{
    display:none;
  }
}


/* 2026-08-29 UX 보정: 메뉴별 아이콘 색상 구분 */
#drawer.drawer a.menu-home,
#drawer.drawer a.menu-overdue-home{--drawer-icon-color:#2f6fed;}
#drawer.drawer a.menu-my-profile,
#drawer.drawer a.menu-admin-password,
#drawer.drawer a.menu-users,
#drawer.drawer a.menu-user-create{--drawer-icon-color:#7c3aed;}
#drawer.drawer a.menu-site-list,
#drawer.drawer a.menu-site-create,
#drawer.drawer a.menu-agency{--drawer-icon-color:#0f766e;}
#drawer.drawer a.menu-inspection-calendar,
#drawer.drawer a.menu-field-records,
#drawer.drawer a.menu-field-resume,
#drawer.drawer a.menu-work-calendar,
#drawer.drawer a.menu-work-progress,
#drawer.drawer a.menu-work-deadline{--drawer-icon-color:#dc2626;}
#drawer.drawer a.menu-work-diary-list,
#drawer.drawer a.menu-work-diary-create{--drawer-icon-color:#2563eb;}
#drawer.drawer a.menu-estimate{--drawer-icon-color:#9333ea;}
#drawer.drawer a.menu-materials{--drawer-icon-color:#b45309;}
#drawer.drawer a.menu-finance,
#drawer.drawer a.menu-sales,
#drawer.drawer a.menu-collection-inspection,
#drawer.drawer a.menu-collection-construction,
#drawer.drawer a.menu-collection-agency{--drawer-icon-color:#16a34a;}
#drawer.drawer a.menu-site-deleted,
#drawer.drawer a.menu-schedule-deleted,
#drawer.drawer a.menu-estimate-deleted,
#drawer.drawer a.menu-finance-deleted,
#drawer.drawer a.menu-work-diary-deleted,
#drawer.drawer a.menu-material-deleted{--drawer-icon-color:#ef4444;}
#drawer.drawer a.menu-site-activity,
#drawer.drawer a.menu-schedule-activity,
#drawer.drawer a.menu-estimate-activity,
#drawer.drawer a.menu-finance-activity,
#drawer.drawer a.menu-work-diary-activity,
#drawer.drawer a.menu-material-activity{--drawer-icon-color:#475569;}
#drawer.drawer a.menu-settings,
#drawer.drawer a.menu-logout{--drawer-icon-color:#f59e0b;}


/* ========================================================================== */
/* 2026-08-29 메뉴 아이콘 색상 v2 - 자주쓰는 메뉴까지 URL 기준으로 색상 적용 */
/* ========================================================================== */
#drawer.drawer .drawer-body button.menu-link,
#drawer.drawer .drawer-footer button.menu-link{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
#drawer.drawer .drawer-body button.menu-link::before,
#drawer.drawer .drawer-footer button.menu-link::before{
  content:"";
  display:block;
  flex:0 0 20px;
  width:20px;
  height:20px;
  background-color:var(--drawer-icon-color,var(--ww-menu-navy));
  -webkit-mask-image:var(--drawer-icon);
  -webkit-mask-position:center;
  -webkit-mask-size:contain;
  -webkit-mask-repeat:no-repeat;
  mask-image:var(--drawer-icon);
  mask-position:center;
  mask-size:contain;
  mask-repeat:no-repeat;
}
#drawer.drawer .drawer-body a[href^="/dashboard/"]{--drawer-icon-color:#2563eb;}
#drawer.drawer .drawer-body a[href^="/users/"]{--drawer-icon-color:#7c3aed;}
#drawer.drawer .drawer-body a[href^="/site/"],
#drawer.drawer .drawer-body a[href^="/agency/"],
#drawer.drawer .drawer-body a[href^="/fire_judgment/"]{--drawer-icon-color:#0f766e;}
#drawer.drawer .drawer-body a[href^="/inspections/"],
#drawer.drawer .drawer-body a[href^="/work/"]{--drawer-icon-color:#dc2626;}
#drawer.drawer .drawer-body a[href^="/work_diary/"]{--drawer-icon-color:#2563eb;}
#drawer.drawer .drawer-body a[href^="/estimate/"]{--drawer-icon-color:#9333ea;}
#drawer.drawer .drawer-body a[href^="/material/"]{--drawer-icon-color:#b45309;}
#drawer.drawer .drawer-body a[href^="/finance/"]{--drawer-icon-color:#16a34a;}
#drawer.drawer .drawer-body a[href^="/settings/"]{--drawer-icon-color:#f59e0b;}
#drawer.drawer .drawer-quick-edit{--drawer-icon:url("/icons/menu/edit.svg");--drawer-icon-color:#2563eb;}
#drawer.drawer .menu-field-resume-reset{--drawer-icon:url("/icons/menu/refresh.svg");--drawer-icon-color:#f59e0b;}
#drawer.drawer a.menu-site-deleted,
#drawer.drawer a.menu-schedule-deleted,
#drawer.drawer a.menu-estimate-deleted,
#drawer.drawer a.menu-finance-deleted,
#drawer.drawer a.menu-work-diary-deleted,
#drawer.drawer a.menu-material-deleted{--drawer-icon-color:#ef4444;}
#drawer.drawer a.menu-site-activity,
#drawer.drawer a.menu-schedule-activity,
#drawer.drawer a.menu-estimate-activity,
#drawer.drawer a.menu-finance-activity,
#drawer.drawer a.menu-work-diary-activity,
#drawer.drawer a.menu-material-activity{--drawer-icon-color:#64748b;}
#drawer.drawer .drawer-body button.menu-link:hover::before,
#drawer.drawer .drawer-body button.menu-link:focus-visible::before{
  background-color:var(--ww-menu-red);
}
@media(max-width:720px){
  #drawer.drawer .drawer-body button.menu-link::before,
  #drawer.drawer .drawer-footer button.menu-link::before{
    flex-basis:22px;width:22px;height:22px;
  }
}