/* 제한 사용자(LMTD_YN='Y') 전용 홈 레이아웃 — limited-home.html 전용 */
/* 일반 화면 CSS 와 클래스명이 겹치지 않게 전부 lim- 접두어를 쓴다. 전역 .right/.center 같은
   레이아웃 클래스와 충돌해 표가 무너졌던 전례가 있어, 여기서는 공용 클래스를 쓰지 않는다. */

.lim-wrap { min-height: 100vh; background: #F2F2F7; }

/* ── 상단 바 ─────────────────────────────────────────────── */
.lim-header {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; padding: 14px 24px; background: #fff;
  border-bottom: 1px solid #E5E5EA;
}
.lim-logo img { height: 34px; display: block; }
.lim-header-right { display: flex; align-items: center; gap: 10px; }
.lim-who { font-size: 14px; color: #3A3A3C; font-weight: 600; margin-right: 4px; }
.lim-hbtn {
  border: 1px solid #D1D1D6; background: #fff; color: #1C1C1E;
  border-radius: 8px; padding: 7px 14px; font-size: 13px; cursor: pointer;
}
.lim-hbtn:hover { background: #F2F2F7; }
.lim-hbtn-out { color: #FF3B30; border-color: #FFD3D0; }

/* ── 본문 ────────────────────────────────────────────────── */
.lim-main { max-width: 900px; margin: 0 auto; padding: 24px 20px 48px; }
.lim-card { background: #fff; border-radius: 14px; padding: 20px 22px; margin-bottom: 18px; }
.lim-title { font-size: 17px; font-weight: 700; color: #1C1C1E; margin: 0; }
.lim-card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }

/* 신청 버튼 — 필요한 기능이 5개뿐이라 크게, 한눈에 */
.lim-apply-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px; margin-top: 14px;
}
.lim-apply-btn {
  display: flex; align-items: center; gap: 10px;
  padding: 18px 16px; border: 1px solid #D1D1D6; border-radius: 12px;
  background: #fff; cursor: pointer; font-size: 15px; font-weight: 600; color: #1C1C1E;
  text-align: left; transition: border-color .12s, background .12s;
}
.lim-apply-btn:hover { border-color: #007AFF; background: #F5F9FF; }
.lim-apply-ico { font-size: 20px; line-height: 1; }

/* 탭 */
.lim-tabs { display: flex; gap: 4px; margin-left: auto; }
.lim-tab {
  border: 0; background: transparent; color: #8E8E93;
  padding: 6px 12px; border-radius: 8px; font-size: 13px; cursor: pointer;
}
.lim-tab.active { background: #E9F1FF; color: #007AFF; font-weight: 700; }
.lim-refresh { border: 0; background: transparent; color: #8E8E93; font-size: 16px; cursor: pointer; padding: 4px 6px; }

/* 목록 */
.lim-list { border-top: 1px solid #F0F0F2; }
.lim-row {
  display: flex; align-items: center; gap: 12px;
  padding: 13px 4px; border-bottom: 1px solid #F0F0F2; cursor: pointer;
}
.lim-row:hover { background: #FAFAFC; }
.lim-row-type {
  flex: 0 0 92px; font-size: 12px; color: #636366;
  background: #F2F2F7; border-radius: 6px; padding: 4px 0; text-align: center;
}
.lim-row-title { flex: 1 1 auto; font-size: 14px; color: #1C1C1E; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lim-row-date { flex: 0 0 auto; font-size: 12px; color: #8E8E93; }
.lim-row-stat { flex: 0 0 62px; font-size: 12px; text-align: center; font-weight: 600; }
.lim-stat-pending  { color: #FF9500; }
.lim-stat-approved { color: #34C759; }
.lim-stat-rejected { color: #FF3B30; }
.lim-stat-draft    { color: #8E8E93; }
.lim-empty { padding: 34px 0; text-align: center; color: #8E8E93; font-size: 14px; }

/* 모바일 — 상단 바와 목록만 줄인다(버튼 그리드는 auto-fit 이 알아서 1열이 된다) */
@media (max-width: 767px) {
  .lim-header { padding: 10px 14px; }
  .lim-logo img { height: 26px; }
  .lim-who { display: none; }
  .lim-main { padding: 14px 12px 32px; }
  .lim-card { padding: 16px 14px; }
  .lim-row-type { flex-basis: 74px; }
  .lim-row-date { display: none; }
}

/* 일반 화면의 3분할 레이아웃(.container/.main)을 무력화 — 제한 사용자는 단일 컬럼이다.
   header/menu/left/right/bottom 마운트는 내용 없이 빈 div 로만 남는다(로드 자체를 안 하므로). */
body.limited-user .container,
body.limited-user .main {
  display: block; max-width: none; width: auto; margin: 0; padding: 0; gap: 0;
}
