/* ── Reset & Base ────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --primary:      #F2B705;
  --primary-dark: #D99F00;
  --primary-soft: #FFF7CC;
  --danger:       #F04452;
  --success:      #00C471;
  --bg:           #FAFAF7;
  --card:         #FFFFFF;
  --text:         #171A20;
  --muted:        #6E716B;
  --border:       #E3DED2;
  --border-strong:#C8BFAE;
  --dark:         #171A20;
  --radius:       16px;
  --radius-sm:    10px;
  --radius-lg:    20px;
  --shadow:       0 1px 3px rgba(34,40,49,.04), 0 10px 28px rgba(34,40,49,.08);
  --shadow-sm:    0 1px 2px rgba(34,40,49,.06);
  --shadow-lg:    0 18px 48px rgba(34,40,49,.16);
  --input-h:      48px;
  /* 시맨틱 색상 변수 — 다크모드에서 자동 전환 */
  --input-bg:        #FFFFFF;
  --subtle:          #FFF7CC;
  --info-bg:         #FFF7CC;
  --info-text:       #6A5200;
  --warn-bg:         #FFF7CC;
  --warn-text:       #6A5200;
  --warn-border:     #DDC57E;
  --success-bg:      #E6F7EF;
  --success-text:    #00875A;
  --danger-bg:       #FEE9EB;
  --danger-text:     #D63649;
  --danger-border:   #FBCDD1;
  --neutral-bg:      #F5F4EF;
  --neutral-text:    #6E716B;
  --bar-bg:          rgba(255,255,255,.92);
  --bar-border:      #EAE6DA;
  --bar-text:        #171A20;
}

/* ── 다크 모드 ──────────────────────────────────────────── */
[data-theme="dark"] {
  --primary:      #F2B705;
  --primary-dark: #F2B705;
  --primary-soft: #332C12;
  --bg:           #111318;
  --card:         #1B1F27;
  --text:         #F7F3EA;
  --muted:        #A8A298;
  --input-bg:     #202630;
  --subtle:       #24271F;
  --info-bg:      #352F20;
  --info-text:    #E8CE7B;
  --warn-bg:      #352F20;
  --warn-text:    #E8CE7B;
  --warn-border:  #5F522D;
  --success-bg:   #0C3B24;
  --success-text: #5CD9A0;
  --danger-bg:    #3B1015;
  --danger-text:  #FF7A82;
  --danger-border:#5C1F26;
  --neutral-bg:   #242A34;
  --neutral-text: #A8A298;
  --border:       #323843;
  --border-strong:#454C59;
  --bar-bg:       #141820;
  --bar-border:   #2F3540;
  --bar-text:     #F7F3EA;
  --dark:         #EDEEF0;
  --shadow:       0 2px 8px rgba(0,0,0,.3), 0 12px 32px rgba(0,0,0,.4);
  --shadow-sm:    0 1px 2px rgba(0,0,0,.4);
  --shadow-lg:    0 16px 48px rgba(0,0,0,.55);
}
[data-theme="dark"] body { background: var(--bg); color: var(--text); }
[data-theme="dark"] .card,
[data-theme="dark"] #slide-menu,
[data-theme="dark"] #app-header { background: var(--card); }
[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select {
  background: var(--input-bg) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}
[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(1); opacity: 0.6; cursor: pointer; }
[data-theme="dark"] .um-row:hover,
[data-theme="dark"] .ticket-card:hover { background: var(--subtle); }
[data-theme="dark"] .my-info-panel { background: var(--subtle); }
[data-theme="dark"] .filter-btn { background: var(--card); color: var(--muted); border-color: var(--border); }
[data-theme="dark"] .filter-btn:hover { background: var(--primary); border-color: var(--primary); color: #fff; }
[data-theme="dark"] .tag-pill { background: var(--card); color: var(--muted); border-color: var(--border); }
[data-theme="dark"] .tag-pill:hover { background: var(--subtle); }
[data-theme="dark"] .header-nav-btn { background: var(--card); color: var(--muted); border-color: var(--border); }
[data-theme="dark"] .header-nav-btn:hover { background: var(--primary); border-color: var(--primary); color: #fff; }
[data-theme="dark"] #page-upload .card-logo h1 { color: #D8D3C9; }
[data-theme="dark"] #page-upload .card-logo .logo-mark,
[data-theme="dark"] #page-upload .card-logo .logo-mark[style] {
  background: #3A342A !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.28);
}
[data-theme="dark"] #page-upload .card-logo .logo-mark svg {
  fill: #D8D3C9;
}
[data-theme="dark"] .schedule-filter-box,
[data-theme="dark"] #page-upload .upload-form input,
[data-theme="dark"] #page-upload .upload-form textarea,
[data-theme="dark"] #page-upload .upload-form select {
  background: var(--input-bg) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}
[data-theme="dark"] .schedule-filter-box {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
}
[data-theme="dark"] .schedule-filter-date {
  border-color: #49515E !important;
  background: #1D222B !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02) !important;
}
[data-theme="dark"] .upload-field-fix {
  border-color: #49515E !important;
  background: #1D222B !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02) !important;
}
[data-theme="dark"] .schedule-filter-box span,
[data-theme="dark"] #page-upload .upload-form label,
[data-theme="dark"] #page-upload .upload-form p {
  color: var(--muted) !important;
}
[data-theme="dark"] #page-upload .upload-form input::placeholder,
[data-theme="dark"] #page-upload .upload-form textarea::placeholder {
  color: rgba(168,162,152,.82) !important;
}
[data-theme="dark"] #page-upload .upload-form input:hover,
[data-theme="dark"] #page-upload .upload-form textarea:hover,
[data-theme="dark"] #page-upload .upload-form select:hover {
  background: #20252f !important;
}
[data-theme="dark"] .schedule-filter-box input:focus,
[data-theme="dark"] #page-upload .upload-form input:focus,
[data-theme="dark"] #page-upload .upload-form textarea:focus,
[data-theme="dark"] #page-upload .upload-form select:focus {
  background: var(--input-bg) !important;
  border-color: var(--primary) !important;
  color: var(--text) !important;
  box-shadow: 0 0 0 4px rgba(242,183,5,.18) !important;
}
[data-theme="dark"] #notif-panel { background: var(--card); }
[data-theme="dark"] .notif-item:hover { background: var(--subtle); }
[data-theme="dark"] .item-card:hover { background: var(--subtle); }
[data-theme="dark"] .item-thumb-placeholder { background: var(--subtle); color: var(--muted); }
[data-theme="dark"] .room-card:hover { background: var(--subtle); }
[data-theme="dark"] .badge-available { background: rgba(0,196,113,.14); color: #5CD9A0; }
[data-theme="dark"] .badge-rented { background: rgba(245,158,11,.15); color: #FCD34D; }
[data-theme="dark"] .badge-completed { background: var(--neutral-bg); color: var(--muted); }
[data-theme="dark"] .page-footer { border-top-color: var(--border); }
[data-theme="dark"] .listings-box { background: var(--card); }

body {
  font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Segoe UI', Roboto, 'Helvetica Neue', system-ui, sans-serif;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  letter-spacing: 0;
}
body.app-mode {
  max-width: 430px;
  margin: 0 auto;
  overflow-x: hidden;
  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
}

/* ── Page 전환 ──────────────────────────────────────────── */
.page { display: none; }
.page.active { display: block; }

/* ══════════════════════════════════════════════════════════
   WIZ Refined Marketplace Refresh
   - 차콜, 클린 옐로우, 포슬린 화이트 3색 팔레트
══════════════════════════════════════════════════════════ */
:root {
  --primary:      #F2B705;
  --primary-dark: #D99F00;
  --primary-soft: #FFF7CC;
  --bg:           #FAFAF7;
  --card:         #FFFFFF;
  --text:         #171A20;
  --muted:        #6E716B;
  --border:       #E3DED2;
  --border-strong:#C8BFAE;
  --input-bg:     #FFFFFF;
  --subtle:       #FFF7CC;
  --info-bg:      #FFF7CC;
  --info-text:    #6A5200;
  --bar-bg:       rgba(255,255,255,.92);
  --bar-border:   #EAE6DA;
  --bar-text:     #171A20;
  --radius:       14px;
  --radius-sm:    8px;
  --radius-lg:    18px;
  --shadow:       0 1px 2px rgba(34,40,49,.04), 0 10px 28px rgba(34,40,49,.08);
  --shadow-sm:    0 1px 2px rgba(34,40,49,.06);
  --shadow-lg:    0 18px 48px rgba(34,40,49,.16);
}

* { letter-spacing: 0 !important; }

body {
  background: var(--bg);
}
#splash-screen {
  background: linear-gradient(180deg, #FAFAF7 0%, #FFF7CC 100%) !important;
}
body.app-mode {
  background: var(--bg);
  padding-top: 60px;
}
body.app-mode .page.active {
  padding: 18px 14px 28px;
  min-height: calc(100vh - 60px);
}

/* ══════════════════════════════════════════════════════════
   다크 모드 최종 override (WIZ refresh 기준)
══════════════════════════════════════════════════════════ */
[data-theme="dark"] {
  --primary:      #F2B705;
  --primary-dark: #F2B705;
  --primary-soft: #352F20;
  --bg:           #111318;
  --card:         #1B1F27;
  --text:         #F7F3EA;
  --muted:        #A8A298;
  --border:       #323843;
  --input-bg:     #202630;
  --subtle:       #24271F;
  --info-bg:      #352F20;
  --info-text:    #E8CE7B;
  --bar-bg:       #141820;
  --bar-border:   #2F3540;
  --bar-text:     #F7F3EA;
}
[data-theme="dark"] body,
[data-theme="dark"] body.app-mode {
  background: var(--bg);
}
[data-theme="dark"] .card,
[data-theme="dark"] .listings-box,
[data-theme="dark"] .hamburger-btn,
[data-theme="dark"] #header-theme-btn,
[data-theme="dark"] .header-nav-btn,
[data-theme="dark"] .filter-btn,
[data-theme="dark"] .tag-pill {
  background: var(--card) !important;
  border-color: var(--border) !important;
}
[data-theme="dark"] #app-header,
[data-theme="dark"] #bottom-nav {
  background: var(--bar-bg) !important;
  border-color: var(--bar-border) !important;
}
[data-theme="dark"] .bnav-item {
  color: rgba(247,243,234,.68) !important;
}
[data-theme="dark"] .bnav-item.active {
  color: var(--primary) !important;
}
[data-theme="dark"] .bnav-item.bnav-add {
  color: rgba(247,243,234,.68) !important;
}
[data-theme="dark"] .bnav-item.bnav-add.active {
  color: var(--primary) !important;
}
[data-theme="dark"] .header-loc-btn,
[data-theme="dark"] .hamburger-btn,
[data-theme="dark"] #header-theme-btn {
  background: rgba(247,243,234,.08) !important;
  border-color: rgba(247,243,234,.14) !important;
  color: var(--bar-text) !important;
}
[data-theme="dark"] .filter-btn.active,
[data-theme="dark"] .tag-pill.active {
  background: var(--primary) !important;
  color: #171A20 !important;
}
[data-theme="dark"] .filter-btn.active,
[data-theme="dark"] .tag-pill.active,
[data-theme="dark"] .bnav-item.active,
[data-theme="dark"] .bnav-item.bnav-add .bnav-icon-wrap {
  box-shadow: none !important;
}
[data-theme="dark"] .hamburger-btn,
[data-theme="dark"] #header-theme-btn,
[data-theme="dark"] .item-more-btn,
[data-theme="dark"] .chat-plus-btn,
[data-theme="dark"] .chat-header-back-btn,
[data-theme="dark"] .chat-header-wish-btn,
[data-theme="dark"] .chat-header-more-btn,
[data-theme="dark"] .cal-nav-btn,
[data-theme="dark"] .range-picker-trigger,
[data-theme="dark"] .bnav-item {
  -webkit-tap-highlight-color: transparent;
  background-clip: padding-box;
  box-shadow: none !important;
  outline: none !important;
}
[data-theme="dark"] .hamburger-btn:hover,
[data-theme="dark"] .hamburger-btn:active,
[data-theme="dark"] #header-theme-btn:hover,
[data-theme="dark"] #header-theme-btn:active,
[data-theme="dark"] .item-more-btn:hover,
[data-theme="dark"] .item-more-btn:active,
[data-theme="dark"] .chat-plus-btn:hover,
[data-theme="dark"] .chat-plus-btn:active,
[data-theme="dark"] .chat-header-back-btn:hover,
[data-theme="dark"] .chat-header-back-btn:active,
[data-theme="dark"] .chat-header-more-btn:hover,
[data-theme="dark"] .chat-header-more-btn:active,
[data-theme="dark"] .cal-nav-btn:hover,
[data-theme="dark"] .cal-nav-btn:active,
[data-theme="dark"] .range-picker-trigger:hover,
[data-theme="dark"] .range-picker-trigger:active,
[data-theme="dark"] .bnav-item:hover,
[data-theme="dark"] .bnav-item:active {
  background: rgba(247,243,234,.12) !important;
  border-color: rgba(247,243,234,.22) !important;
  color: var(--text) !important;
  box-shadow: none !important;
  outline: none !important;
}
[data-theme="dark"] .chat-header-wish-btn:hover,
[data-theme="dark"] .chat-header-wish-btn:active,
[data-theme="dark"] .chat-header-wish-btn.is-active {
  background: rgba(225,29,72,.14) !important;
  border-color: rgba(253,164,175,.45) !important;
  color: #fb7185 !important;
  box-shadow: none !important;
}
[data-theme="dark"] .bnav-item.bnav-add:hover,
[data-theme="dark"] .bnav-item.bnav-add:active {
  background: transparent !important;
}
[data-theme="dark"] .bnav-item.bnav-add:hover .bnav-icon-wrap,
[data-theme="dark"] .bnav-item.bnav-add:active .bnav-icon-wrap {
  background: var(--primary-dark) !important;
  box-shadow: none !important;
}
[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select {
  background: var(--input-bg) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}
[data-theme="dark"] select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--muted) 50%),
    linear-gradient(135deg, var(--muted) 50%, transparent 50%) !important;
  background-position:
    calc(100% - 18px) calc(50% - 3px),
    calc(100% - 12px) calc(50% - 3px) !important;
  background-size: 6px 6px, 6px 6px !important;
  background-repeat: no-repeat !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
}
[data-theme="dark"] select:focus {
  background: var(--input-bg) !important;
  color: var(--text) !important;
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 4px rgba(242,183,5,.18) !important;
}
[data-theme="dark"] select option {
  background: var(--card);
  color: var(--text);
}
[data-theme="dark"] #gps-location,
[data-theme="dark"] .menu-user-bar,
[data-theme="dark"] #chat-input-area {
  background: var(--card) !important;
}
[data-theme="dark"] .chat-input-wrap {
  background: var(--card);
  border-radius: 10px;
}
[data-theme="dark"] #chat-input {
  background: var(--input-bg) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
  box-shadow: none !important;
}
[data-theme="dark"] #chat-input::placeholder {
  color: var(--muted) !important;
  opacity: 1;
}
[data-theme="dark"] #chat-suggest-btn {
  background: transparent !important;
  color: var(--muted) !important;
}
[data-theme="dark"] #chat-suggest-btn:hover {
  color: var(--text) !important;
}
[data-theme="dark"] #chat-messages {
  background: var(--card) !important;
}
[data-theme="dark"] .item-card:hover {
  background: rgba(255,201,51,.10);
}
[data-theme="dark"] .card,
[data-theme="dark"] .modal-box,
[data-theme="dark"] .listings-box,
[data-theme="dark"] .item-thumb,
[data-theme="dark"] .item-thumb-placeholder,
[data-theme="dark"] .price-table-cell,
[data-theme="dark"] .more-menu,
[data-theme="dark"] #slide-menu,
[data-theme="dark"] #notif-panel,
[data-theme="dark"] .room-card,
[data-theme="dark"] .ticket-card,
[data-theme="dark"] .my-item-row {
  border-color: var(--border) !important;
}
[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] select:focus {
  background: var(--input-bg) !important;
  border-color: var(--primary) !important;
  box-shadow: none !important;
}

/* ══════════════════════════════════════════════════════════
   다크 모드 — 누락 요소 보강
══════════════════════════════════════════════════════════ */
[data-theme="dark"] .info-card          { background: #0f172a; }
[data-theme="dark"] .user-badge         { background: #1e3a5f; }
[data-theme="dark"] .mypage-avatar      { background: #d97706; }
[data-theme="dark"] .manner-track       { background: #303846; }
[data-theme="dark"] .manner-score       { color: #fbbf24; }
[data-theme="dark"] .manner-fill        { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
[data-theme="dark"] .more-menu          { background: var(--card); border-color: var(--border); }
[data-theme="dark"] .more-menu-item:hover { background: #334155; }
[data-theme="dark"] .sup-comment-admin  { background: #1e3a5f; border-left-color: var(--primary); }
[data-theme="dark"] .sup-comment-user   { background: #1e293b; border-left-color: var(--border); }
[data-theme="dark"] .rental-status-panel { background: #1a1a00 !important; border-color: #fde68a !important; }
[data-theme="dark"] #rental-status-panel { background: #1a2500 !important; }
[data-theme="dark"] .token-box          { background: #0a0f1a; }
[data-theme="dark"] .admin-token-box    { background: #0a0f1a; }
[data-theme="dark"] .badge-verified     { background: #14532d; color: #86efac; }
[data-theme="dark"] .badge-unverified   { background: #3b2800; color: #fde68a; }
[data-theme="dark"] .badge-resolved     { background: #14532d; color: #86efac; }
[data-theme="dark"] .badge-pending      { background: #3b2800; color: #fde68a; }
[data-theme="dark"] .badge-locked       { background: #3b0f0f; color: #f87171; }
[data-theme="dark"] .my-item-row        { border-color: var(--border); }
[data-theme="dark"] #location-modal-overlay > div { background: var(--card) !important; color: var(--text); }
[data-theme="dark"] .cal-nav-btn        { background: var(--card); }
[data-theme="dark"] #cal-confirm-box    { background: #0c2d1f; border-color: #22c55e; }
[data-theme="dark"] #cal-confirm-summary { color: #86efac; }
[data-theme="dark"] .admin-item-row     { background: transparent; }
[data-theme="dark"] .admin-item-row:hover { background: #253347; }
[data-theme="dark"] .um-row             { background: transparent; }
[data-theme="dark"] .um-header          { background: var(--bg); }
[data-theme="dark"] .um-stat-card       { background: #0f172a; }
[data-theme="dark"] .page-footer a      { color: #60a5fa; }

/* PC 기준 디자인을 유지하기 위해 OS 다크모드 자동 감지는 비활성화 */

[data-theme="dark"] button,
[data-theme="dark"] a {
  -webkit-tap-highlight-color: transparent;
}
[data-theme="dark"] button:focus,
[data-theme="dark"] button:focus-visible,
[data-theme="dark"] a:focus,
[data-theme="dark"] a:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}
[data-theme="dark"] .cal-nav-btn:hover,
[data-theme="dark"] .cal-nav-btn:active {
  background: rgba(247,243,234,.15) !important;
  color: var(--text) !important;
  border-color: rgba(247,243,234,.25) !important;
}
[data-theme="dark"] .header-loc-btn:hover,
[data-theme="dark"] .header-loc-btn:active,
[data-theme="dark"] .header-nav-btn:hover,
[data-theme="dark"] .header-nav-btn:active,
[data-theme="dark"] .filter-btn:hover,
[data-theme="dark"] .filter-btn:active,
[data-theme="dark"] .menu-my-btn:hover,
[data-theme="dark"] .menu-my-btn:active {
  background: rgba(247,243,234,.15) !important;
  border-color: rgba(247,243,234,.25) !important;
  color: var(--text) !important;
}
[data-theme="dark"] .tag-pill {
  -webkit-tap-highlight-color: transparent;
}
[data-theme="dark"] .tag-pill.active {
  box-shadow: none !important;
}
[data-theme="dark"] .tag-pill:focus,
[data-theme="dark"] .tag-pill:focus-visible,
[data-theme="dark"] .tag-pill:active {
  outline: none !important;
  box-shadow: none !important;
}
[data-theme="dark"] .hamburger-btn:hover,
[data-theme="dark"] .hamburger-btn:active,
[data-theme="dark"] #header-theme-btn:hover,
[data-theme="dark"] #header-theme-btn:active {
  background: rgba(247,243,234,.18) !important;
  border-color: rgba(247,243,234,.28) !important;
}