
/* =========================================================
   HOME DASHBOARD - Ivory Gold Final
========================================================= */

main.main-home {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

main.main-home > .main-inner {
  width: 1400px;
  max-width: calc(100vw - 40px);
  min-height: 760px;
  margin: 28px auto 80px;
  padding: 0;
  box-sizing: border-box;
}

.home-page {
  width: 100%;
  max-width: none;
  margin: 0;
}

.home-wrap {
  width: 100%;
  margin: 0;
  padding: 10px 0 110px;
  box-sizing: border-box;
}

.home-inner{
  position:relative;

  width:100%;

  padding:0 !important;

  background:none !important;
  border:0 !important;
  box-shadow:none !important;

  min-height:auto !important;
}

/* 좌측상단 L 포인트 */
.home-inner::after {
  content: "";
  position: absolute;
  left: -26px;
  top: -26px;
  width: 60px;
  height: 280px;
  border-left: 10px solid rgba(151, 113, 48, .45);
  border-top: 10px solid rgba(151, 113, 48, .45);
  z-index: 2;
  pointer-events: none;
}

/* 우측하단 L 포인트 */
.home-corner-br {
  position: absolute;
  right: -22px;
  bottom: -22px;
  width: 60px;
  height: 150px;
  border-right: 10px solid rgba(151, 113, 48, .45);
  border-bottom: 10px solid rgba(151, 113, 48, .45);
  z-index: 2;
  pointer-events: none;
}

/* Hero */
/* =========================================================
   HERO CARD - FINAL CLEAN
========================================================= */

.home-hero{
  position:relative;
  z-index:1;

  min-height:138px;

  margin:0 0 26px;

  padding:0 260px 0 70px;

  border-radius:28px;

  display:flex;
  align-items:center;
  justify-content:flex-start;

  overflow:hidden;

  /* 월계관 + 배경 */
  background:
    url('/offering/static/img/hero-emblem.png')
    right 42px center / 190px auto no-repeat,

    linear-gradient(
      90deg,
      #fffdfa 0%,
      #fffcf3 42%,
      #fff8e6 70%,
      #fffdf6 100%
    );

  /* 기존 border 제거 */
  border:none;

  /* 부드러운 외곽선 */
  outline:1px solid rgba(198,168,108,.22);

  /* 훨씬 부드러운 그림자 */
  box-shadow:
    0 10px 26px rgba(90,70,30,.08),
    0 2px 8px rgba(90,70,30,.04),
    inset 0 1px 0 rgba(255,255,255,.85);

  box-sizing:border-box;
}


.home-hero::before {
  content: "";
  position: absolute;
  inset: 10px 12px;
  border: 2px solid rgba(139, 105, 48, .25);
  border-radius: 22px;
  pointer-events: none;
}

.home-hero::after {
  content: "🏵";
  font-family: "Segoe UI Emoji", "Apple Color Emoji", sans-serif;
  position: absolute;
  right: 70px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 92px;
  opacity: .28;
  pointer-events: none;
}


.home-hero h2,
.home-hero p {
  position: relative;
  z-index: 1;
}

.home-hero h2 {
  margin: 0 0 14px;
  font-size: 36px;
  font-weight: 900;
  letter-spacing: -1.2px;
  line-height: 1.2;
  color: #2b1d12;
}

.home-hero p {
  margin: 0;
  font-size: 19px;
  font-weight: 750;
  color: #6b4f2a;
}

.stat-grid,
.dashboard-grid {
  position: relative;
  z-index: 1;
  width: 100%;
}

.stat-grid {
  margin: 0 0 28px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 24px;
}

.stat-grid .card {
  min-height: 106px;
  padding: 24px;
  border-radius: 18px;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(154, 121, 65, .18);
  box-shadow:
    0 12px 24px rgba(85, 63, 32, .13),
    inset 0 1px 0 rgba(255,255,255,.75);
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-sizing: border-box;
  overflow: hidden;
}

.stat-grid .label {
  font-size: 13px;
  font-weight: 850;
  color: #4b5563;
}

.stat-grid .num {
  font-size: 25px;
  font-weight: 900;
  color: #111827;
}

.stat-grid .card::after {
  content: "";
  width: 30px;
  height: 30px;
  background-color: rgba(239,232,218,.9);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 17px;
  border-radius: 10px;
  position: absolute;
  top: 18px;
  right: 18px;
}

.stat-grid .card:nth-child(3) {
  background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%);
  border-color: rgba(255,255,255,.35);
  box-shadow: 0 16px 34px rgba(37,99,235,.26);
}

.stat-grid .card:nth-child(3) .label,
.stat-grid .card:nth-child(3) .num {
  color: #fff;
}

.dashboard-grid {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 24px;
  align-items: stretch;
}

.dash-section {
  min-height: 320px;
  padding: 32px 26px;
  border-radius: 20px;
  background: rgba(255,255,255,.84);
  border: 1px solid rgba(154,121,65,.18);
  box-shadow:
    0 14px 30px rgba(85,63,32,.13),
    inset 0 1px 0 rgba(255,255,255,.7);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}

.dash-section h3 {
  margin: 0 0 22px;
  padding-left: 12px;
  font-size: 19px;
  font-weight: 900;
  line-height: 1.1;
}

.dash-section:nth-child(1) h3 { color:#15803d; border-left:5px solid #16a34a; }
.dash-section:nth-child(2) h3 { color:#1d4ed8; border-left:5px solid #2563eb; }
.dash-section:nth-child(3) h3 { color:#c2410c; border-left:5px solid #ea580c; }
.dash-section:nth-child(4) h3 { color:#475569; border-left:5px solid #64748b; }

.dash-btn {
  display: flex;
  align-items: center;
  width: 100%;
  height: 58px;
  margin-bottom: 14px;
  padding: 0 20px;
  border-radius: 16px;
  color: #1f2937;
  text-decoration: none;
  font-size: 16px;
  font-weight: 850;
  box-sizing: border-box;
}

.dash-btn:last-child {
  margin-bottom: 0;
}

.dash-btn::before {
  content: "";
  width: 29px;
  height: 29px;
  margin-right: 14px;
  border-radius: 50%;
  background-color: rgba(255,255,255,.94);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px;
  box-shadow: 0 2px 5px rgba(15,23,42,.10);
  flex-shrink: 0;
}

.dash-section:nth-child(1) .dash-btn { background-color: rgba(101,161,112,.35); }
.dash-section:nth-child(2) .dash-btn { background-color: rgba(85,118,181,.30); }
.dash-section:nth-child(3) .dash-btn { background-color: rgba(214,134,78,.34); }
.dash-section:nth-child(4) .dash-btn { background-color: rgba(148,140,132,.22); }

@media (max-width: 1100px) {
  main.main-home > .main-inner {
    max-width: calc(100vw - 40px);
  }

  .stat-grid,
  .dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  main.main-home > .main-inner {
    max-width: calc(100vw - 28px);
  }

  .home-wrap {
    padding-top: 18px;
  }

  .home-inner {
    padding: 20px;
  }

  .home-inner::after,
  .home-corner-br {
    display: none;
  }

  .home-hero {
    min-height: 120px;
    padding: 26px 24px;
  }

  .home-hero::after {
    display: none;
  }

  .stat-grid,
  .dashboard-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}

/* =========================================================
   홈 대시보드 아이콘 복구
========================================================= */

/* 상단 통계카드 아이콘 */
.icon-member::after {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%2364748b"><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5s-3 1.34-3 3 1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5z"/></svg>');
}

.icon-type::after {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%2364748b"><path d="M12 2L3 9l9 7 9-7z"/></svg>');
}

.icon-offering::after {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23ffffff"><path d="M11 8v10h2V8h-2zM5 10v6h2v-6H5z"/></svg>');
}

.icon-expense::after {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%238b6f5b"><path d="M21 7.28V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-2.28z"/></svg>');
}

/* 하단 메뉴 버튼 아이콘 */
.btn-offering-input::before {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%2316a34a"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>');
}

.btn-offering-list::before {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%2316a34a"><path d="M4 6h16v2H4zm0 5h16v2H4zm0 5h16v2H4z"/></svg>');
}

.btn-offering-types::before {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%2316a34a"><path d="M12 2L3 9l9 7 9-7z"/></svg>');
}

.btn-expense-input::before {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%232563eb"><path d="M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6z"/></svg>');
}

.btn-expense-list::before {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%232563eb"><path d="M3 13h2v-2H3v2zm0 4h2v-2H3v2zm0-8h2V7H3v2z"/></svg>');
}

.btn-expense-summary::before {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%232563eb"><path d="M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8z"/></svg>');
}

.btn-report-sum::before {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23ea580c"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"/></svg>');
}

.btn-settlement::before {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23ea580c"><path d="M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4z"/></svg>');
}

.btn-tax-receipt::before {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23ea580c"><path d="M12 2L4 5v6c0 5 3.4 9.7 8 10.9 4.6-1.2 8-6 8-11V5l-8-3z"/></svg>');
}

.btn-member-mgt::before {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%2364748b"><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5zM8 11c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5z"/></svg>');
}

.btn-audit-logs::before {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%2364748b"><path d="M13 3H6v18h12V8l-5-5z"/></svg>');
}

.btn-pin-mgt::before {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%2364748b"><path d="M12.65 10C11.83 7.67 9.61 6 7 6c-3.3 0-6 2.7-6 6s2.7 6 6 6c2.6 0 4.8-1.7 5.6-4H17v4h4v-4h2v-4h-10.35z"/></svg>');
}



/* ============================================================================================= 

      2026-05-19 내부 카드 입체감  호버 보정

   ============================================================================================= */

/* 상단 숫자 카드 입체감 */
.stat-grid .card {
  background:
    linear-gradient(145deg, rgba(255,255,255,.96), rgba(255,250,240,.88)) !important;
  border: 1px solid rgba(176, 137, 70, .18) !important;
  box-shadow:
    0 16px 30px rgba(75, 55, 25, .14),
    0 3px 8px rgba(255,255,255,.9) inset,
    0 -8px 18px rgba(210, 180, 120, .08) inset !important;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease !important;
}

.stat-grid .card:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(176, 137, 70, .34) !important;
  box-shadow:
    0 22px 42px rgba(75, 55, 25, .20),
    0 3px 8px rgba(255,255,255,.95) inset,
    0 -8px 18px rgba(210, 180, 120, .10) inset !important;
}

/* 오늘 헌금 파란 카드 전용 입체감 */
.stat-grid .card:nth-child(3) {
  background:
    linear-gradient(135deg, #1e3a8a 0%, #2563eb 58%, #60a5fa 100%) !important;
  box-shadow:
    0 18px 34px rgba(37, 99, 235, .34),
    inset 0 1px 0 rgba(255,255,255,.28),
    inset 0 -12px 24px rgba(15, 23, 42, .18) !important;
}

.stat-grid .card:nth-child(3):hover {
  box-shadow:
    0 24px 48px rgba(37, 99, 235, .42),
    inset 0 1px 0 rgba(255,255,255,.32),
    inset 0 -12px 24px rgba(15, 23, 42, .20) !important;
}

/* 하단 큰 내부 카드 입체감 */
.dash-section {
  background:
    linear-gradient(145deg, rgba(255,255,255,.95), rgba(255,250,241,.84)) !important;
  border: 1px solid rgba(176, 137, 70, .16) !important;
  box-shadow:
    0 18px 38px rgba(75, 55, 25, .14),
    0 3px 9px rgba(255,255,255,.9) inset,
    0 -10px 20px rgba(210, 180, 120, .07) inset !important;
  transition:
    transform .2s ease,
    box-shadow .2s ease,
    border-color .2s ease !important;
}

.dash-section:hover {
  transform: translateY(-5px) !important;
  border-color: rgba(176, 137, 70, .32) !important;
  box-shadow:
    0 26px 52px rgba(75, 55, 25, .20),
    0 3px 10px rgba(255,255,255,.95) inset,
    0 -10px 20px rgba(210, 180, 120, .08) inset !important;
}

/* 메뉴 버튼 입체감 */
.dash-btn {
  border: 1px solid rgba(255,255,255,.42) !important;
  box-shadow:
    0 8px 16px rgba(55, 43, 24, .10),
    inset 0 1px 0 rgba(255,255,255,.65),
    inset 0 -6px 12px rgba(0,0,0,.035) !important;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    background .18s ease,
    color .18s ease !important;
}

/* 버튼 호버 */
.dash-btn:hover {
  transform: translateX(7px) translateY(-2px) !important;
  box-shadow:
    0 14px 24px rgba(55, 43, 24, .16),
    inset 0 1px 0 rgba(255,255,255,.8),
    inset 0 -6px 12px rgba(0,0,0,.035) !important;
}

/* 원형 아이콘 입체감 */
.dash-btn::before {
  box-shadow:
    0 5px 10px rgba(15, 23, 42, .16),
    inset 0 1px 0 rgba(255,255,255,.85) !important;
}

/* 상단 카드 우측 작은 아이콘도 입체감 */
.stat-grid .card::after {
  box-shadow:
    0 5px 10px rgba(15, 23, 42, .13),
    inset 0 1px 0 rgba(255,255,255,.85) !important;
}

/* 카드 안쪽 은은한 빛 */
.dash-section::after {
  content: "";
  position: absolute;
  right: -60px;
  top: -60px;
  width: 170px;
  height: 170px;
  border-radius: 999px;
  pointer-events: none;
  opacity: .9;
}

.dash-section:nth-child(1)::after {
  background: radial-gradient(rgba(34,197,94,.13), transparent 70%);
}
.dash-section:nth-child(2)::after {
  background: radial-gradient(rgba(37,99,235,.13), transparent 70%);
}
.dash-section:nth-child(3)::after {
  background: radial-gradient(rgba(234,88,12,.16), transparent 70%);
}
.dash-section:nth-child(4)::after {
  background: radial-gradient(rgba(100,116,139,.13), transparent 70%);
}


/* =========================================================
   HERO FINAL - 좌측 텍스트  우측 월계관
========================================================= */

.home-hero{
  position: relative;
  z-index: 1;

  min-height: 140px;
  margin: 0 0 34px;

  /* 글씨를 좌측으로 */
  padding: 0px 460px 0 70px;

  border-radius: 30px;
  overflow: hidden;

  display: flex;
  align-items: center;
  justify-content: flex-start;

  background:
    url('/offering/static/img/hero-emblem.png')
    right 60px center / 160px auto no-repeat,
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,249,229,.88));

  border: 1px solid rgba(176,137,70,.22);

  box-shadow:
    0 18px 42px rgba(75,55,25,.14),
    inset 0 1px 0 rgba(255,255,255,.72);

  box-sizing: border-box;
}

/* 기존 가상요소 잔상 제거 */
.home-hero::after{
  content: none !important;
  display: none !important;
}

/* 은은한 금빛만 유지 */
.home-hero::before{
  content: "";
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,.16) 0%,
      rgba(255,245,210,.16) 42%,
      rgba(255,230,160,.08) 62%,
      transparent 78%
    );

  pointer-events: none;
}

/* 텍스트 영역 */
.hero-content{
  position: relative;
  z-index: 2;
  max-width: 720px;
  margin-left: 0 !important;
  margin-right: auto !important;
  text-align: left !important;
}

/* 제목 */
.hero-content h2{
  margin: 0px 0 14px;
  font-size: 34px;
  font-weight: 900;
  letter-spacing: -2px;
  line-height: 1.08;
  color: #1f2937;
  text-align: left;
  text-shadow:
    0 2px 0 rgba(255,255,255,.55);
}

/* 설명 */
.hero-content p{
  margin: 0;
  font-size: 18px;
  font-weight: 750;
  color: #7a5a2d;
  letter-spacing: -.3px;
  text-align: left;
  text-shadow:
    0 1px 0 rgba(255,255,255,.5);
}

.hero-content h2,
.hero-content p{
  text-align:left !important;
}

.dash-section:nth-child(3) h3{
  color:#0369a1;
  border-left:5px solid #0ea5e9;
}

.dash-section:nth-child(3) .dash-btn{
  background-color:rgba(14,165,233,.22);
}

.btn-fund-dashboard::before{
  background-image:url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%230ea5e9"><path d="M3 13h8V3H3v10zm10 8h8V3h-8v18z"/></svg>');
}

.btn-cash-assets::before{
  background-image:url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%230ea5e9"><path d="M2 6h20v12H2z"/></svg>');
}

.btn-fund-trans::before{
  background-image:url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%230ea5e9"><path d="M7 7h11v3l4-4-4-4v3H5v6h2z"/></svg>');
}

.stat-cashflow{
  background: linear-gradient(
      135deg,
      #0f766e,
      #14b8a6
  ) !important;
  color:#fff !important;
}


/* 홈 상단 KPI 5칸 + 이번달 순현금 */
.stat-grid{
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
}

.icon-cashflow::after{
  background-image:url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%230f766e"><path d="M4 7h16v2H4zm0 4h10v2H4zm0 4h16v2H4z"/></svg>') !important;
}

/* =========================================================
   HOME 폭 1380px 복구 + 5카드 안정화
   ========================================================= */
main.main-home > .main-inner{
  width:1380px !important;
  max-width:calc(100vw - 40px) !important;
}

.home-wrap,
.home-inner,
.home-hero,
.stat-grid,
.dashboard-grid{
  max-width:1380px !important;
}

/* 5개 홈 카드 간격 안정화 */
.dashboard-grid{
  grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
  gap:20px !important;
}

/* 상단 KPI 5개 */
.stat-grid{
  grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
  gap:20px !important;
}

/* 기부금영수증 아이콘 */
.btn-donation::before{
  background-image:url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%2364748b"><path d="M6 2h12c1.1 0 2 .9 2 2v18l-4-2-4 2-4-2-4 2V4c0-1.1.9-2 2-2zm2 5v2h8V7H8zm0 4v2h8v-2H8zm0 4v2h5v-2H8z"/></svg>') !important;
}
