/* Mobile Theme CSS (scoped) — 다크 테마 기본 */

#mobile-scope{
  background:
    radial-gradient(900px 520px at 15% 0%, rgba(34,211,238,0.12), transparent 55%),
    radial-gradient(800px 480px at 85% 25%, rgba(59,130,246,0.08), transparent 50%),
    linear-gradient(180deg, #020617 0%, #0b1220 50%, #020617 100%);
  color: rgba(248,250,252,0.95);
}

/* 로그인: 우측 방사형 제거 — :has() 대신 data 속성(브라우저 호환·확실) */
#mobile-scope[data-active-view='MOBILE_LOGIN']{
  background:
    radial-gradient(900px 520px at 15% 0%, rgba(34,211,238,0.1), transparent 58%),
    linear-gradient(180deg, #020617 0%, #0b1220 50%, #020617 100%) !important;
}

/* 커뮤니티: 미래형 다크 테마 — 기본 다크와 동일한 그라데이션 유지 */

#mobile-scope input,
#mobile-scope select,
#mobile-scope textarea{
  background-color: rgba(0,0,0,0.42) !important;
  border-color: rgba(148,163,184,0.36) !important;
  color: rgba(248,250,252,0.95) !important;
}

/* 등록·수정 모달 — 입력 높이·폰트 균형, 주소란 리사이즈 금지 */
#mobile-scope [role="dialog"] input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
#mobile-scope [role="dialog"] select,
#mobile-scope [role="dialog"] textarea{
  border-radius: 0.5rem !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
}
#mobile-scope [role="dialog"] input.ilk-register-addr-road,
#mobile-scope [role="dialog"] input.ilk-register-addr-detail,
#mobile-scope [role="dialog"] textarea.ilk-register-addr-road,
#mobile-scope [role="dialog"] textarea.ilk-register-addr-detail,
#mobile-scope .mil-signup-page .ilk-signup-addr-road,
#mobile-scope .mil-signup-page .ilk-signup-addr-detail{
  resize: none !important;
  overflow: hidden !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
#mobile-scope .mil-signup-page .ilk-signup-addr-road{
  min-height: 3rem !important;
  max-height: 3rem !important;
}
#mobile-scope .mil-signup-page .ilk-signup-addr-detail{
  min-height: 3rem !important;
  max-height: 3rem !important;
}
#mobile-scope [role="dialog"] input.ilk-register-addr-road,
#mobile-scope [role="dialog"] input.ilk-register-addr-detail{
  height: 2.5rem !important;
  min-height: 2.5rem !important;
  max-height: 2.5rem !important;
}
#mobile-scope [role="dialog"] textarea.ilk-register-addr-road{
  min-height: 2.5rem !important;
  max-height: 2.5rem !important;
}
#mobile-scope [role="dialog"] textarea.ilk-register-addr-detail{
  min-height: 2.5rem !important;
  max-height: 2.5rem !important;
}
#mobile-scope input::placeholder,
#mobile-scope textarea::placeholder{
  color: rgba(255,255,255,0.48) !important;
}

#mobile-scope input:focus,
#mobile-scope select:focus,
#mobile-scope textarea:focus{
  outline: none;
  border-color: rgba(34,211,238,0.55) !important;
  box-shadow: 0 0 0 3px rgba(6,182,212,0.18);
}

/* -------------------------------------------------------------
   Readability (Mobile)
-------------------------------------------------------------- */

#mobile-scope{
  font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif !important;
  font-size: 15px;
  line-height: 1.5;
  letter-spacing: 0.02em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
#mobile-scope *,
#mobile-scope *::before,
#mobile-scope *::after{
  font-family: inherit !important;
}
#mobile-scope .font-mono{
  font-family: 'Pretendard Variable', Pretendard, ui-monospace, monospace !important;
}

/* 공통 상단바(MobileAppTopBar) 안의 글자만 Gugi — 로켓 SVG·아이콘은 영향 없음, 본문·다른 패널은 Pretendard 유지.
   클래스는 래퍼 <div class="mobile-app-topbar"> 에 있으므로 요소 선택자(header.~) 대신 클래스 선택자로 적용. */
#mobile-scope .mobile-app-topbar,
#mobile-scope .mobile-app-topbar * {
  font-family: 'Gugi', sans-serif !important;
}

/* 맛대맛 상단바 타이틀 — 일꾼 브랜드 Gugi (Pretendard inherit 덮어씀) */
#mobile-scope .mdm-brand-gugi {
  font-family: 'Gugi', sans-serif !important;
  font-weight: 400 !important;
}

/* 우측 시스템 메뉴(SideMenu) 패널만 Gugi — .font-mono보다 뒤에 두어 하단 카피까지 통일 */
#mobile-scope .mil-side-menu,
#mobile-scope .mil-side-menu * {
  font-family: 'Gugi', sans-serif !important;
}

#mobile-scope .text-\[8px\],
#mobile-scope .text-\[9px\],
#mobile-scope .text-\[10px\]{ font-size: 12px !important; }
#mobile-scope .text-\[11px\],
#mobile-scope .text-\[12px\],
#mobile-scope .text-\[13px\],
#mobile-scope .text-xs{ font-size: 14px !important; }
#mobile-scope .text-\[14px\],
#mobile-scope .text-\[15px\],
#mobile-scope .text-\[16px\],
#mobile-scope .text-sm,
#mobile-scope .text-base{ font-size: 16px !important; }
#mobile-scope .text-lg{ font-size: 18px !important; }
#mobile-scope .text-xl,
#mobile-scope .text-2xl{ font-size: 20px !important; }
#mobile-scope .text-3xl{ font-size: 22px !important; }

/* 다크 배경 위 흰 텍스트 투명도 */
#mobile-scope .text-white\/10{ color: rgba(255,255,255,0.10) !important; }
#mobile-scope .text-white\/20{ color: rgba(255,255,255,0.20) !important; }
#mobile-scope .text-white\/30{ color: rgba(255,255,255,0.30) !important; }
#mobile-scope .text-white\/40{ color: rgba(255,255,255,0.40) !important; }
#mobile-scope .text-white\/50{ color: rgba(255,255,255,0.50) !important; }
#mobile-scope .text-white\/60{ color: rgba(255,255,255,0.60) !important; }

#mobile-scope .text-slate-300{ color: rgba(203,213,225,0.88) !important; }
#mobile-scope .text-slate-400{ color: rgba(148,163,184,0.88) !important; }
#mobile-scope .text-slate-500{ color: rgba(148,163,184,0.72) !important; }

#mobile-scope .drop-shadow,
#mobile-scope .drop-shadow-md,
#mobile-scope .drop-shadow-lg{
  filter: none !important;
}

#mobile-scope .bg-black\/20{ background-color: rgba(0,0,0,0.20) !important; }
#mobile-scope .bg-black\/30{ background-color: rgba(0,0,0,0.30) !important; }
#mobile-scope .bg-black\/40{ background-color: rgba(0,0,0,0.40) !important; }
#mobile-scope .bg-black\/50{ background-color: rgba(0,0,0,0.50) !important; }
#mobile-scope .bg-black\/60{ background-color: rgba(0,0,0,0.60) !important; }

#mobile-scope .border-white\/5{ border-color: rgba(255,255,255,0.05) !important; }
#mobile-scope .border-white\/10{ border-color: rgba(255,255,255,0.10) !important; }

#mobile-scope .backdrop-blur-sm{
  backdrop-filter: blur(4px) !important;
}
#mobile-scope .backdrop-blur-md{
  backdrop-filter: blur(6px) !important;
}
#mobile-scope .backdrop-blur-xl{
  backdrop-filter: blur(8px) !important;
}

#mobile-scope .bg-slate-900\/50,
#mobile-scope .bg-slate-900\/40,
#mobile-scope .bg-slate-800\/40{
  background: rgba(7,14,26,0.78) !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.08) inset, 0 0 16px rgba(59,130,246,0.045) !important;
}

#mobile-scope button{
  text-shadow: none !important;
}

/* 로그인 제출 — 미래형 HUD (다크 글래스 + 시안 네온, 골드/쉬인 없음) */
#mobile-scope button.mil-login-submit--future:not(:disabled) {
  background-color: rgba(6, 14, 28, 0.92) !important;
  background-image: linear-gradient(
    180deg,
    rgba(12, 28, 52, 0.88) 0%,
    rgba(4, 10, 22, 0.96) 100%
  ) !important;
  color: #a5f3fc !important;
  border-color: rgba(34, 211, 238, 0.38) !important;
  box-shadow:
    inset 0 0 0 1px rgba(167, 139, 250, 0.08),
    inset 0 1px 0 rgba(34, 211, 238, 0.18),
    0 0 24px -6px rgba(34, 211, 238, 0.28),
    0 8px 24px -12px rgba(0, 0, 0, 0.65) !important;
  filter: none !important;
  text-shadow: 0 0 12px rgba(34, 211, 238, 0.35) !important;
}
#mobile-scope button.mil-login-submit--future:not(:disabled):hover {
  border-color: rgba(103, 232, 249, 0.55) !important;
  box-shadow:
    inset 0 0 0 1px rgba(167, 139, 250, 0.14),
    inset 0 1px 0 rgba(103, 232, 249, 0.28),
    0 0 32px -4px rgba(34, 211, 238, 0.42),
    0 10px 28px -10px rgba(0, 0, 0, 0.7) !important;
}
#mobile-scope button.mil-login-submit--future:not(:disabled)::before {
  content: '';
  position: absolute;
  left: 12%;
  right: 12%;
  top: 0;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(103, 232, 249, 0.75) 50%,
    transparent
  );
  z-index: 2;
  opacity: 0.85;
}
#mobile-scope button.mil-login-submit--future .mil-login-submit-grid {
  z-index: 0;
  opacity: 0.35;
  background-image:
    linear-gradient(rgba(34, 211, 238, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(34, 211, 238, 0.05) 1px, transparent 1px);
  background-size: 12px 12px;
  mask-image: linear-gradient(180deg, black 0%, transparent 88%);
}
#mobile-scope button.mil-login-submit--future .mil-login-submit-scan {
  z-index: 1;
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(34, 211, 238, 0.12) 48%,
    rgba(103, 232, 249, 0.22) 50%,
    rgba(34, 211, 238, 0.08) 52%,
    transparent 100%
  );
  background-size: 100% 200%;
  animation: mil-login-scan 3.2s linear infinite;
  opacity: 0.7;
}
#mobile-scope button.mil-login-submit--future .mil-login-submit-corners::before,
#mobile-scope button.mil-login-submit--future .mil-login-submit-corners::after {
  content: '';
  position: absolute;
  width: 10px;
  height: 10px;
  border-color: rgba(103, 232, 249, 0.65);
  border-style: solid;
  pointer-events: none;
}
#mobile-scope button.mil-login-submit--future .mil-login-submit-corners::before {
  top: 5px;
  left: 5px;
  border-width: 1px 0 0 1px;
}
#mobile-scope button.mil-login-submit--future .mil-login-submit-corners::after {
  bottom: 5px;
  right: 5px;
  border-width: 0 1px 1px 0;
}
#mobile-scope button.mil-login-submit--future .mil-login-submit-label {
  letter-spacing: 0.28em;
  padding-left: 0.28em;
}
@keyframes mil-login-scan {
  0% {
    background-position: 0 -100%;
  }
  100% {
    background-position: 0 100%;
  }
}
#mobile-scope button.mil-login-submit:disabled {
  opacity: 0.45 !important;
  filter: none !important;
}

/* 로그인 카드 뒤 배경: 시안·빨강 번짐 불빛(박스 뒤에서 비춤) */
#mobile-scope .mil-login-card-stack {
  position: relative;
  z-index: 1;
}
#mobile-scope .mil-login-card-stack::before {
  content: '';
  position: absolute;
  inset: -32px -28px -36px -28px;
  z-index: 0;
  border-radius: 2rem;
  pointer-events: none;
  background:
    radial-gradient(ellipse 78% 70% at 48% 40%, rgba(251, 191, 36, 0.22), transparent 58%),
    radial-gradient(ellipse 65% 60% at 58% 62%, rgba(255, 255, 255, 0.12), transparent 55%),
    radial-gradient(ellipse 90% 80% at 50% 50%, rgba(251, 191, 36, 0.06), transparent 65%);
  filter: blur(24px);
  opacity: 0.92;
}
#mobile-scope .mil-login-card-stack > .mil-login-card-ring {
  position: relative;
  z-index: 1;
}

/* 안쪽 작은 패널: 살짝 떠 있는 3D */
#mobile-scope .mil-login-card-raised {
  transform: translateY(-1px);
}

/* 회전 네온: 바깥 박스와 안쪽 패널 사이(margin 고리)에서만 보이도록 — ::before는 전체에 깔리고 .mil-login-card-raised가 가운데를 가림 */
#mobile-scope .mil-login-card-ring {
  isolation: isolate;
  /* 고리 바깥쪽만 살짝 어두운 틀(회전선은 그 안쪽 고리에서만 보임) */
  background-color: rgba(5, 8, 13, 0.92);
}
#mobile-scope .mil-login-card-ring::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 0;
  width: 220%;
  height: 220%;
  transform: translate(-50%, -50%);
  border-radius: inherit;
  /* 각 모서리에 짧은 띠 — 좌상·우하=흰색, 우상·좌하=황금색 */
  background: conic-gradient(
    from 0deg,
    transparent 0deg 34deg,
    #fbbf24 34deg 56deg,
    transparent 56deg 124deg,
    rgba(255, 255, 255, 0.95) 124deg 146deg,
    transparent 146deg 214deg,
    #fbbf24 214deg 236deg,
    transparent 236deg 304deg,
    rgba(255, 255, 255, 0.95) 304deg 326deg,
    transparent 326deg 360deg
  );
  filter: drop-shadow(0 0 4px rgba(251, 191, 36, 0.55)) drop-shadow(0 0 4px rgba(255, 255, 255, 0.45));
  animation: mil-login-ring-rotate 7s linear infinite;
  will-change: transform;
  pointer-events: none;
}
@keyframes mil-login-ring-rotate {
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  #mobile-scope .mil-login-card-ring::before {
    animation: none !important;
  }
}

/*
 * 로그인 화면(MOBILE_LOGIN)에서만 전체 텍스트를 Gugi로 통일.
 * 파일 맨 끝에 두어 #mobile-scope * · .font-mono 등보다 우선 적용.
 * 다른 data-active-view 페이지는 기존 Pretendard 규칙 그대로 유지.
 */
#mobile-scope[data-active-view='MOBILE_LOGIN'],
#mobile-scope[data-active-view='MOBILE_LOGIN'] *,
#mobile-scope[data-active-view='MOBILE_LOGIN'] *::before,
#mobile-scope[data-active-view='MOBILE_LOGIN'] *::after {
  font-family: 'Gugi', sans-serif !important;
}

/*
 * 시스템 메뉴로 이동하는 화면(홈·실시간관제·내정보·결제·설정·이용내역·공지) 본문 전체 Gugi.
 * MobileAppShell에서 data-gugi-menu-pages 설정 시에만 적용 — 구인·커뮤니티 등은 Pretendard 유지.
 * 파일 맨 끝 — .font-mono 등보다 우선.
 */
#mobile-scope[data-gugi-menu-pages],
#mobile-scope[data-gugi-menu-pages] *,
#mobile-scope[data-gugi-menu-pages] *::before,
#mobile-scope[data-gugi-menu-pages] *::after {
  font-family: 'Gugi', sans-serif !important;
}

/*
 * 회원 유형 선택 — 위 #mobile-scope 의 Pretendard·inherit 규칙보다 우선해 전체 Gugi.
 * (MOBILE_LOGIN 과 동일 패턴)
 */
#mobile-scope[data-active-view='MOBILE_ROLE_SELECT'],
#mobile-scope[data-active-view='MOBILE_ROLE_SELECT'] *,
#mobile-scope[data-active-view='MOBILE_ROLE_SELECT'] *::before,
#mobile-scope[data-active-view='MOBILE_ROLE_SELECT'] *::after {
  font-family: 'Gugi', sans-serif !important;
}

/* Tailwind CDN `.font-sans` 유틸이 덮는 경우 */
#mobile-scope[data-active-view='MOBILE_ROLE_SELECT'] .font-sans {
  font-family: 'Gugi', sans-serif !important;
}

/* 회원 유형 선택 루트(data-*) — data-active-view 누락·WebView 캐시 시에도 Gugi 유지 */
#mobile-scope [data-ilkkun-gugi-role-select],
#mobile-scope [data-ilkkun-gugi-role-select] *,
#mobile-scope [data-ilkkun-gugi-role-select] *::before,
#mobile-scope [data-ilkkun-gugi-role-select] *::after {
  font-family: 'Gugi', sans-serif !important;
}

/* =========================================================================
   낮 모드(밝은 환경) 가독성 강화 — 2026-05
   ──────────────────────────────────────────────────────────────────────────
   다크 톤은 유지하되, 햇빛 아래에서도 글자/카드 경계가 잘 보이도록
   white-alpha 텍스트·테두리·연한 배경의 채도/명도를 살짝 끌어올립니다.
   기존 변종 클래스(text-white/30, border-white/[0.06] 등)를 *마지막에* 다시
   덮어쓰므로 컴포넌트 코드를 건드리지 않고 전 화면에 즉시 반영됩니다.
   ========================================================================= */

/* ① 흰 글자 알파 — 본문/보조 텍스트가 너무 옅게 보이는 문제 보정 */
#mobile-scope .text-white\/25,
#mobile-scope .text-white\/30,
#mobile-scope .text-white\/35{ color: rgba(255,255,255,0.55) !important; }
#mobile-scope .text-white\/40,
#mobile-scope .text-white\/45{ color: rgba(255,255,255,0.65) !important; }
#mobile-scope .text-white\/50,
#mobile-scope .text-white\/55{ color: rgba(255,255,255,0.74) !important; }
#mobile-scope .text-white\/60,
#mobile-scope .text-white\/65{ color: rgba(255,255,255,0.82) !important; }
#mobile-scope .text-white\/70,
#mobile-scope .text-white\/75{ color: rgba(255,255,255,0.88) !important; }
#mobile-scope .text-white\/80,
#mobile-scope .text-white\/85{ color: rgba(255,255,255,0.94) !important; }
#mobile-scope .text-white\/88,
#mobile-scope .text-white\/90,
#mobile-scope .text-white\/95{ color: rgba(255,255,255,0.98) !important; }
/* 임의값 알파 — Tailwind arbitrary 클래스 변종도 보정 */
#mobile-scope .text-white\/\[0\.4\],
#mobile-scope .text-white\/\[0\.45\]{ color: rgba(255,255,255,0.65) !important; }
#mobile-scope .text-white\/\[0\.5\],
#mobile-scope .text-white\/\[0\.55\]{ color: rgba(255,255,255,0.74) !important; }
#mobile-scope .text-white\/\[0\.6\],
#mobile-scope .text-white\/\[0\.65\]{ color: rgba(255,255,255,0.82) !important; }

/* ② Slate 보조 텍스트도 가독성 강화 */
#mobile-scope .text-slate-300{ color: rgba(226,232,240,0.96) !important; }
#mobile-scope .text-slate-400{ color: rgba(203,213,225,0.95) !important; }
#mobile-scope .text-slate-500{ color: rgba(165,180,200,0.86) !important; }

/* ③ 컨테이너 박스 — 카드·등록 패널 테두리 (주간 가독성, 소폭 강화) */
#mobile-scope .border-white\/5,
#mobile-scope .border-white\/\[0\.04\],
#mobile-scope .border-white\/\[0\.05\]{ border-color: rgba(255,255,255,0.18) !important; }
#mobile-scope .border-white\/10,
#mobile-scope .border-white\/\[0\.06\],
#mobile-scope .border-white\/\[0\.07\],
#mobile-scope .border-white\/\[0\.08\]{ border-color: rgba(255,255,255,0.24) !important; }
#mobile-scope .border-white\/12,
#mobile-scope .border-white\/15,
#mobile-scope .border-white\/\[0\.10\],
#mobile-scope .border-white\/\[0\.12\],
#mobile-scope .border-white\/\[0\.14\]{ border-color: rgba(255,255,255,0.30) !important; }
#mobile-scope .border-white\/20,
#mobile-scope .border-white\/22{ border-color: rgba(255,255,255,0.36) !important; }
#mobile-scope .border-white\/25,
#mobile-scope .border-white\/30{ border-color: rgba(255,255,255,0.42) !important; }
#mobile-scope .border-white\/40{ border-color: rgba(255,255,255,0.48) !important; }

/* slate 계열 카드 테두리 — 목록·출력 박스 */
#mobile-scope .border-slate-500\/40{ border-color: rgba(100,116,139,0.58) !important; }
#mobile-scope .border-slate-600\/50{ border-color: rgba(71,85,105,0.68) !important; }
#mobile-scope .border-slate-700{ border-color: rgba(51,65,85,0.72) !important; }
#mobile-scope .border-slate-800{ border-color: rgba(30,41,59,0.76) !important; }

/* 점선 테두리(dashed)도 동일하게 강화 — 안내·구분선 가독성 */
#mobile-scope .border-dashed.border-white\/12,
#mobile-scope .border-dashed.border-white\/10,
#mobile-scope .border-dashed.border-white\/20{ border-color: rgba(255,255,255,0.34) !important; }

/* ④ 옅은 흰 배경(컨테이너 ‘유리’ 패널) — 살짝 밝게 + 미세한 내부 라이트 보더 */
#mobile-scope .bg-white\/\[0\.02\]{ background-color: rgba(255,255,255,0.05) !important; }
#mobile-scope .bg-white\/\[0\.03\]{ background-color: rgba(255,255,255,0.06) !important; }
#mobile-scope .bg-white\/\[0\.04\],
#mobile-scope .bg-white\/5{ background-color: rgba(255,255,255,0.08) !important; }
#mobile-scope .bg-white\/\[0\.05\]{ background-color: rgba(255,255,255,0.09) !important; }
#mobile-scope .bg-white\/\[0\.06\]{ background-color: rgba(255,255,255,0.10) !important; }
#mobile-scope .bg-white\/\[0\.07\],
#mobile-scope .bg-white\/\[0\.08\]{ background-color: rgba(255,255,255,0.12) !important; }
#mobile-scope .bg-white\/10{ background-color: rgba(255,255,255,0.14) !important; }

/* ⑤ 검은 반투명 배경(입력 박스·필 등) — 콘트라스트를 키워 외곽이 명확 */
#mobile-scope .bg-black\/20{ background-color: rgba(0,0,0,0.32) !important; }
#mobile-scope .bg-black\/25{ background-color: rgba(0,0,0,0.38) !important; }
#mobile-scope .bg-black\/30{ background-color: rgba(0,0,0,0.44) !important; }
#mobile-scope .bg-black\/35{ background-color: rgba(0,0,0,0.50) !important; }
#mobile-scope .bg-black\/40{ background-color: rgba(0,0,0,0.55) !important; }
#mobile-scope .bg-black\/50{ background-color: rgba(0,0,0,0.62) !important; }
#mobile-scope .bg-black\/60{ background-color: rgba(0,0,0,0.70) !important; }

/* ⑥ 라운드 카드(둥근 모서리 + border 보유 박스)에 미세한 highlight ring
      — 햇빛 아래에서 카드와 본문 배경의 차이가 더 잘 보이도록 도와 줍니다. */
#mobile-scope .rounded-lg[class*=" border-"],
#mobile-scope .rounded-xl[class*=" border-"],
#mobile-scope .rounded-2xl[class*=" border-"],
#mobile-scope .rounded-\[1\.25rem\][class*=" border-"],
#mobile-scope .rounded-\[1\.35rem\][class*=" border-"],
#mobile-scope .rounded-3xl[class*=" border-"]{
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.10) inset,
    0 8px 24px -12px rgba(0,0,0,0.55) !important;
}

/* ⑥-2 등록·수정 모달 — 섹션/입력 컨테이너 테두리 한 단계 더 */
#mobile-scope .ilk-register-form .rounded-2xl[class*="border"],
#mobile-scope .ilk-register-form .rounded-xl[class*="border"],
#mobile-scope [role="dialog"] .rounded-2xl[class*="border"]:not(.mil-login-card-ring),
#mobile-scope [role="dialog"] .rounded-xl[class*="border"]{
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.12) inset,
    0 10px 28px -14px rgba(0,0,0,0.5) !important;
}

/* ⑦ 입력 필드 placeholder — 또렷이 보이도록 */
#mobile-scope input::placeholder,
#mobile-scope textarea::placeholder{
  color: rgba(255,255,255,0.62) !important;
}

/* ⑧ 비활성 버튼 — 너무 흐릿하지 않도록(클릭 가능 여부는 cursor 로 구분) */
#mobile-scope button:disabled:not(.mil-login-submit){
  opacity: 0.72 !important;
}

/* ⑨ 글로벌 분리선 — divider/hr 가 보이지 않던 문제 보정 */
#mobile-scope hr,
#mobile-scope .divide-white\/10 > * + *,
#mobile-scope .divide-white\/5 > * + *{
  border-color: rgba(255,255,255,0.22) !important;
}

/* =============================================================================
   일당·아르바이트 「기업회원」 필터 — 밝은 UI (data-employer-light on #mobile-scope)
   mobile.theme.css 의 #mobile-scope .text-white/* !important 가 TS·인라인 스타일보다
   우선하므로, 동일·더 높은 특이성(#mobile-scope[id][data-*])으로 덮어씁니다.
   ============================================================================= */
#mobile-scope[data-employer-light='1']{
  background:
    radial-gradient(900px 520px at 15% 0%, rgba(99,102,241,0.08), transparent 55%),
    radial-gradient(800px 480px at 85% 25%, rgba(59,130,246,0.06), transparent 50%),
    linear-gradient(180deg, #d4dce8 0%, #e4eaf4 50%, #d4dce8 100%) !important;
  color: rgb(41 37 36) !important;
}

#mobile-scope[data-employer-light='1'] select,
#mobile-scope[data-employer-light='1'] .ilkun-complex-employer-light select{
  background-color: #fff !important;
  border-color: rgb(176 192 212) !important;
  color: rgb(41 37 36) !important;
}

#mobile-scope[data-employer-light='1'] .text-white\/10,
#mobile-scope[data-employer-light='1'] .text-white\/20,
#mobile-scope[data-employer-light='1'] .text-white\/25,
#mobile-scope[data-employer-light='1'] .text-white\/30,
#mobile-scope[data-employer-light='1'] .text-white\/35,
#mobile-scope[data-employer-light='1'] .text-white\/40,
#mobile-scope[data-employer-light='1'] .text-white\/45,
#mobile-scope[data-employer-light='1'] .text-white\/50,
#mobile-scope[data-employer-light='1'] .text-white\/55,
#mobile-scope[data-employer-light='1'] .text-white\/60,
#mobile-scope[data-employer-light='1'] .text-white\/65,
#mobile-scope[data-employer-light='1'] .text-white\/70,
#mobile-scope[data-employer-light='1'] .text-white\/75,
#mobile-scope[data-employer-light='1'] .text-white\/80,
#mobile-scope[data-employer-light='1'] .text-white\/85,
#mobile-scope[data-employer-light='1'] .text-white\/88,
#mobile-scope[data-employer-light='1'] .text-white\/90,
#mobile-scope[data-employer-light='1'] .text-white\/95,
#mobile-scope[data-employer-light='1'] .text-white\/\[0\.4\],
#mobile-scope[data-employer-light='1'] .text-white\/\[0\.45\],
#mobile-scope[data-employer-light='1'] .text-white\/\[0\.5\],
#mobile-scope[data-employer-light='1'] .text-white\/\[0\.55\],
#mobile-scope[data-employer-light='1'] .text-white\/\[0\.6\],
#mobile-scope[data-employer-light='1'] .text-white\/\[0\.65\]{
  color: rgb(87 83 78) !important;
}

#mobile-scope[data-employer-light='1'] .text-white\/85,
#mobile-scope[data-employer-light='1'] .text-white\/80,
#mobile-scope[data-employer-light='1'] .text-white\/90,
#mobile-scope[data-employer-light='1'] .text-white\/95,
#mobile-scope[data-employer-light='1'] .text-white\/\[0\.6\],
#mobile-scope[data-employer-light='1'] .text-white\/\[0\.65\]{
  color: rgb(41 37 36) !important;
}

#mobile-scope[data-employer-light='1'] .text-amber-200,
#mobile-scope[data-employer-light='1'] .text-amber-200\/90,
#mobile-scope[data-employer-light='1'] .text-amber-200\/95,
#mobile-scope[data-employer-light='1'] .text-amber-300,
#mobile-scope[data-employer-light='1'] .text-amber-400,
#mobile-scope[data-employer-light='1'] .text-amber-500\/70{
  color: rgb(180 83 9) !important;
}

#mobile-scope[data-employer-light='1'] .text-cyan-200\/85,
#mobile-scope[data-employer-light='1'] .text-cyan-200\/90,
#mobile-scope[data-employer-light='1'] .text-cyan-100\/80,
#mobile-scope[data-employer-light='1'] .text-cyan-300\/90{
  color: rgb(15 118 110) !important;
}

#mobile-scope[data-employer-light='1'] .text-stone-700,
#mobile-scope[data-employer-light='1'] .ilk-card-member-meta{
  color: rgb(68 64 60) !important;
}

#mobile-scope[data-employer-light='1'] .text-emerald-800,
#mobile-scope[data-employer-light='1'] .text-teal-800,
#mobile-scope[data-employer-light='1'] .ilk-card-receipt-no{
  color: rgb(6 95 70) !important;
}

#mobile-scope[data-employer-light='1'] .bg-purple-500\/20.text-purple-300,
#mobile-scope[data-employer-light='1'] .bg-purple-500\/20{
  background-color: rgb(237 233 254) !important;
  color: rgb(91 33 182) !important;
  border-color: rgb(196 181 253) !important;
}

#mobile-scope[data-employer-light='1'] .bg-blue-500\/20.text-blue-300,
#mobile-scope[data-employer-light='1'] .bg-blue-500\/20{
  background-color: rgb(224 242 254) !important;
  color: rgb(3 105 161) !important;
  border-color: rgb(186 230 253) !important;
}

#mobile-scope[data-employer-light='1'] .bg-indigo-500\/20.text-indigo-300,
#mobile-scope[data-employer-light='1'] .bg-indigo-500\/20{
  background-color: rgb(224 231 255) !important;
  color: rgb(55 48 163) !important;
  border-color: rgb(199 210 254) !important;
}

#mobile-scope[data-employer-light='1'] .text-purple-300{
  color: rgb(91 33 182) !important;
}

#mobile-scope[data-employer-light='1'] .from-slate-950.to-slate-900,
#mobile-scope[data-employer-light='1'] .ilk-card-pay-panel{
  background: linear-gradient(90deg, rgb(255 255 255 / 0.96), rgb(238 242 248 / 0.98)) !important;
  border-color: rgb(176 192 212) !important;
}

#mobile-scope[data-employer-light='1'] .ilk-card-pay-panel .text-amber-400,
#mobile-scope[data-employer-light='1'] .from-slate-950.to-slate-900 .text-amber-400{
  color: rgb(4 120 87) !important;
}

#mobile-scope[data-employer-light='1'] .ilk-card-pay-panel .text-amber-500\/70,
#mobile-scope[data-employer-light='1'] .from-slate-950.to-slate-900 .text-amber-500\/70{
  color: rgb(5 150 105 / 0.85) !important;
}

/* 목록 래퍼(.ilkun-complex-employer-light) — JS data 속성 없어도 카드 본문 가독성 보장 */
#mobile-scope .ilkun-complex-employer-light .text-white\/10,
#mobile-scope .ilkun-complex-employer-light .text-white\/20,
#mobile-scope .ilkun-complex-employer-light .text-white\/25,
#mobile-scope .ilkun-complex-employer-light .text-white\/30,
#mobile-scope .ilkun-complex-employer-light .text-white\/35,
#mobile-scope .ilkun-complex-employer-light .text-white\/40,
#mobile-scope .ilkun-complex-employer-light .text-white\/45,
#mobile-scope .ilkun-complex-employer-light .text-white\/50,
#mobile-scope .ilkun-complex-employer-light .text-white\/55,
#mobile-scope .ilkun-complex-employer-light .text-white\/60,
#mobile-scope .ilkun-complex-employer-light .text-white\/65,
#mobile-scope .ilkun-complex-employer-light .text-white\/70,
#mobile-scope .ilkun-complex-employer-light .text-white\/75,
#mobile-scope .ilkun-complex-employer-light .text-white\/80,
#mobile-scope .ilkun-complex-employer-light .text-white\/85,
#mobile-scope .ilkun-complex-employer-light .text-white\/88,
#mobile-scope .ilkun-complex-employer-light .text-white\/90,
#mobile-scope .ilkun-complex-employer-light .text-white\/95,
#mobile-scope .ilkun-complex-employer-light .text-white\/\[0\.4\],
#mobile-scope .ilkun-complex-employer-light .text-white\/\[0\.45\],
#mobile-scope .ilkun-complex-employer-light .text-white\/\[0\.5\],
#mobile-scope .ilkun-complex-employer-light .text-white\/\[0\.55\],
#mobile-scope .ilkun-complex-employer-light .text-white\/\[0\.6\],
#mobile-scope .ilkun-complex-employer-light .text-white\/\[0\.65\]{
  color: rgb(87 83 78) !important;
}

#mobile-scope .ilkun-complex-employer-light .text-white\/85,
#mobile-scope .ilkun-complex-employer-light .text-white\/80,
#mobile-scope .ilkun-complex-employer-light .text-white\/90,
#mobile-scope .ilkun-complex-employer-light .text-white\/95{
  color: rgb(41 37 36) !important;
}

#mobile-scope .ilkun-complex-employer-light .text-amber-200,
#mobile-scope .ilkun-complex-employer-light .text-amber-200\/90,
#mobile-scope .ilkun-complex-employer-light .text-amber-200\/95,
#mobile-scope .ilkun-complex-employer-light .text-amber-300,
#mobile-scope .ilkun-complex-employer-light .text-amber-400,
#mobile-scope .ilkun-complex-employer-light .text-amber-500\/70,
#mobile-scope .ilkun-complex-employer-light .text-cyan-200\/85,
#mobile-scope .ilkun-complex-employer-light .text-cyan-200\/90,
#mobile-scope .ilkun-complex-employer-light .text-cyan-100\/80,
#mobile-scope .ilkun-complex-employer-light .ilk-card-member-meta,
#mobile-scope .ilkun-complex-employer-light .ilk-card-receipt-no{
  color: rgb(68 64 60) !important;
}

#mobile-scope .ilkun-complex-employer-light .ilk-card-receipt-no,
#mobile-scope .ilkun-complex-employer-light .text-emerald-800{
  color: rgb(6 95 70) !important;
}

#mobile-scope .ilkun-complex-employer-light .from-slate-950.to-slate-900,
#mobile-scope .ilkun-complex-employer-light .ilk-card-pay-panel{
  background: linear-gradient(90deg, rgb(255 255 255 / 0.96), rgb(238 242 248 / 0.98)) !important;
  border-color: rgb(176 192 212) !important;
}

#mobile-scope .ilkun-complex-employer-light .from-slate-950.to-slate-900 .text-amber-400,
#mobile-scope .ilkun-complex-employer-light .ilk-card-pay-panel .text-amber-400{
  color: rgb(4 120 87) !important;
}

#mobile-scope .ilkun-complex-employer-light .from-slate-950.to-slate-900 .text-amber-500\/70,
#mobile-scope .ilkun-complex-employer-light .ilk-card-pay-panel .text-amber-500\/70{
  color: rgb(5 150 105 / 0.85) !important;
}

/* 일당·아르바이트 기업회원 — 평점·근무정보·분야 칼럼 (Tailwind CDN 미생성 대비) */
#mobile-scope .ilk-rating-chip-light,
#mobile-scope[data-employer-light='1'] .ilk-rating-chip-light{
  display: inline-flex !important;
  width: 100% !important;
  min-height: 1.625rem !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.25rem !important;
  border-radius: 0.5rem !important;
  border: 2px solid rgb(245 158 11) !important;
  background-color: rgb(15 23 42) !important;
  color: rgb(255 255 255) !important;
  box-shadow: 0 2px 8px rgba(15,23,42,0.18) !important;
}

#mobile-scope .ilk-el-schedule-label,
#mobile-scope[data-employer-light='1'] .ilk-el-schedule-label{
  color: rgb(255 255 255) !important;
  background-color: rgb(31 41 55) !important;
  border-color: rgb(75 85 99) !important;
}

#mobile-scope .ilk-el-schedule-value,
#mobile-scope[data-employer-light='1'] .ilk-el-schedule-value{
  color: rgb(28 25 23) !important;
  background-color: rgb(250 250 249) !important;
  border-color: rgb(214 211 209) !important;
}

#mobile-scope .ilk-el-category-pillar,
#mobile-scope[data-employer-light='1'] .ilk-el-category-pillar{
  color: rgb(255 255 255) !important;
}

#mobile-scope .ilk-el-category-pillar span,
#mobile-scope .ilk-el-category-pillar svg,
#mobile-scope[data-employer-light='1'] .ilk-el-category-pillar span,
#mobile-scope[data-employer-light='1'] .ilk-el-category-pillar svg{
  color: rgb(255 255 255) !important;
}

/* ── 일꾼·맛대맛 브랜드 워드마크 — Pretendard·text-size 규칙보다 우선 (파일 맨 끝) ── */
#mobile-scope [data-ilkkun-brand-wordmark],
#mobile-scope #matdaemat-ai-root [data-mdm-topbar-brand] {
  font-family: 'Gugi', sans-serif !important;
  font-weight: 400 !important;
  font-size: 20px !important;
  line-height: 1.15 !important;
  letter-spacing: -0.02em !important;
}
#mobile-scope #matdaemat-ai-root [data-mdm-topbar-brand] {
  color: rgba(255, 255, 255, 0.98) !important;
}
#mobile-scope #matdaemat-ai-root [data-mdm-topbar-rocket] {
  transform: translateX(-0.5rem) !important;
  flex-shrink: 0 !important;
}
#mobile-scope #matdaemat-ai-root [data-mdm-topbar-actions] {
  display: flex !important;
  align-items: center !important;
  column-gap: 0.625rem !important;
  flex-shrink: 0 !important;
}
#mobile-scope #matdaemat-ai-root [data-mdm-topbar-menu-btn] {
  color: rgba(255, 255, 255, 0.84) !important;
  padding: 0.125rem !important;
  line-height: 0 !important;
}
#mobile-scope #matdaemat-ai-root [data-mdm-topbar-menu-icon] {
  display: block !important;
  width: 19px !important;
  height: 19px !important;
}
#mobile-scope #matdaemat-ai-root [data-mdm-topbar-menu-icon] line {
  stroke: currentColor !important;
  stroke-width: 2.45 !important;
  stroke-linecap: round !important;
}