/* trip · 출장 계획·정산 화면 — 테마2 v2 기본 기준(04_work/theme/docs/기본기준_테마2v2.md): 명함앱 뼈대(왼쪽 메뉴 · 폰 아래 탭)
   선 --t-line · 조작부 테두리 = 흐린 글자 50% + 선 50% · 모서리 단추 6px 카드 10px · 그림자 없음 · 폰·터치 누를 곳 44px · 글자 크기는 --t-fsb 하나 */
:root{--ui-primary:#1F4F86;--ui-on-primary:#fff;--ui-h:38px;--ui-ctl:color-mix(in srgb,var(--t-muted) 50%,var(--t-line));
  --ui-muted:color-mix(in srgb,var(--t-muted) 80%,var(--t-text));
  --k-out:var(--t-blue);--k-dom:var(--t-green);--k-abroad:var(--t-purple)}
@media (pointer:coarse),(max-width:768px){:root{--ui-h:44px}}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--ui-primary:#4076B4}}
[data-theme=dark]{--ui-primary:#4076B4}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;background:var(--t-bg);color:var(--t-text)}
body{font:var(--t-body)/var(--t-line-height) var(--t-font);word-break:keep-all;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
a{color:var(--t-blue)}
:focus-visible{outline:2px solid var(--t-blue);outline-offset:2px}
h1,h2,h3{margin:0;line-height:1.35}
h2{font-size:var(--t-h2)}
h3{font-size:var(--t-h3)}

/* 뼈대 */
.shell{display:flex;min-height:100vh}
.sidebar{width:220px;flex:none;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;background:var(--t-bar-bg);color:var(--t-on-bar);border-right:1px solid var(--t-line)}
.brand{display:flex;gap:10px;padding:16px;border-bottom:1px solid var(--t-line)}
.brand .lbar{flex:none;width:6px;border-radius:3px;background:var(--t-accent)}
.brand .btx{display:flex;flex-direction:column}
.brand small{font-size:11px;font-weight:700;letter-spacing:.16em;color:var(--ui-muted)}
.brand b{font-size:var(--t-app-title);font-weight:700}
.brand span{font-size:var(--t-small);color:var(--ui-muted)}
.nav{padding:8px;display:flex;flex-direction:column;gap:2px}
.nav a{display:flex;align-items:center;height:40px;padding:0 12px;border-radius:6px;color:inherit;text-decoration:none;font-weight:600;font-size:var(--t-table)}
.nav a.on{background:var(--t-surface);font-weight:800;box-shadow:inset 3px 0 0 var(--t-accent),0 0 0 1px var(--t-line)}
.side-foot{margin-top:auto;padding:12px 16px;border-top:1px solid var(--t-line)}
.col{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{position:sticky;top:0;z-index:10;height:52px;display:flex;align-items:center;gap:10px;padding:0 var(--t-gut);background:var(--t-bar-bg);border-bottom:1px solid var(--t-line)}
.topbar h1{font-size:var(--t-bar-title);font-weight:600}
.sp{flex:1}
.wrap{width:100%;max-width:1200px;padding:18px var(--t-gut) 90px}
.tabbar{display:none}
body.out .sidebar,body.out .tabbar{display:none!important}
@media (max-width:768px){
  .sidebar{display:none}
  .tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--t-bar-bg);border-top:1px solid var(--t-line);padding-bottom:env(safe-area-inset-bottom)}
  .tabbar a{flex:1;display:flex;align-items:center;justify-content:center;height:56px;color:inherit;text-decoration:none;font-weight:700;font-size:var(--t-table)}
  .tabbar a.on{box-shadow:inset 0 3px 0 var(--t-accent)}
}

/* 조작부 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:var(--ui-h);padding:0 14px;border-radius:6px;border:1px solid var(--ui-ctl);background:var(--t-surface);color:var(--t-text);font:inherit;font-weight:600;font-size:var(--t-table);cursor:pointer;text-decoration:none;white-space:nowrap}
.btn.sm{min-height:34px;padding:0 10px;font-size:var(--t-small)}
@media (pointer:coarse),(max-width:768px){.btn.sm{min-height:44px}}
.btn.primary{background:var(--ui-primary);border-color:var(--ui-primary);color:var(--ui-on-primary)}
.btn.warn{color:var(--t-bad)}
.btn.on{background:var(--t-soft);box-shadow:inset 0 -3px 0 var(--t-accent)}
input,select,textarea{font:inherit;font-size:var(--t-table);color:var(--t-text);background:var(--t-surface);border:1px solid var(--ui-ctl);border-radius:6px;padding:7px 9px;width:100%;min-height:var(--ui-h)}
textarea{min-height:64px;resize:vertical}
input[type=checkbox]{width:20px;height:20px;min-height:0;accent-color:var(--ui-primary)}
label{display:flex;flex-direction:column;gap:4px;font-size:var(--t-small);font-weight:700;color:var(--ui-muted)}
label.inline{flex-direction:row;align-items:center;gap:8px;color:var(--t-text);font-weight:600}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}
.stack{display:flex;flex-direction:column;gap:12px}
.muted{color:var(--ui-muted);font-size:var(--t-small)}
.msg{margin:0;color:var(--t-bad);min-height:1.2em;font-size:var(--t-small)}
.msg.ok{color:var(--t-ok)}
.card{background:var(--t-surface);border:1px solid var(--t-line);border-radius:10px;padding:16px}
.empty{padding:32px;text-align:center;color:var(--ui-muted)}
.chip{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:999px;font-size:12px;font-weight:800;border:1px solid currentColor}
.k-out{color:var(--k-out)}.k-dom{color:var(--k-dom)}.k-abroad{color:var(--k-abroad)}
.st-plan{color:var(--t-blue)}.st-done{color:var(--t-warn)}.st-settled{color:var(--t-ok)}

/* 목록 */
.month{margin:18px 0 8px;display:flex;align-items:baseline;gap:10px}
.month h2{font-size:var(--t-h3)}
.trips{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
.trip{display:flex;flex-direction:column;gap:6px;background:var(--t-surface);border:1px solid var(--t-line);border-radius:10px;padding:14px;color:inherit;text-decoration:none;border-left:4px solid var(--k-out)}
.trip.dom{border-left-color:var(--k-dom)}.trip.abroad{border-left-color:var(--k-abroad)}
.trip b{font-size:var(--t-h3)}
.trip .sum{font-weight:800;font-size:var(--t-h3)}

/* 계획 */
.plan{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:1000px){.plan{grid-template-columns:1fr}}
.stop{display:grid;grid-template-columns:44px 1fr 1fr 70px auto;gap:6px;align-items:end;padding:8px 0;border-bottom:1px solid var(--t-line)}
.stop .n{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--ui-primary);color:#fff;font-weight:800}
@media (max-width:640px){.stop{grid-template-columns:36px 1fr auto}.stop .a,.stop .d{grid-column:2/4}}
#map{height:340px;border-radius:10px;border:1px solid var(--t-line);background:var(--t-soft)}
.est table{width:100%;border-collapse:collapse;font-size:var(--t-table)}
.est td,.est th{padding:8px 6px;border-bottom:1px solid var(--t-line);text-align:left;vertical-align:top}
.est td.amt,.est th.amt{text-align:right;white-space:nowrap;font-weight:700}
.est .total td{font-size:var(--t-h3);font-weight:800;border-bottom:none}
.est .detail{color:var(--ui-muted);font-size:var(--t-small)}
.notes li{color:var(--t-warn);font-size:var(--t-small)}
.links{display:flex;gap:8px;flex-wrap:wrap}

/* 설정 */
.tbl{width:100%;border-collapse:collapse;font-size:var(--t-table)}
.tbl th,.tbl td{border:1px solid var(--t-line);padding:4px;text-align:center}
.tbl th{background:var(--t-soft);font-size:var(--t-small)}
.tbl input{min-height:34px;padding:4px 6px;text-align:right}
.scroll{overflow-x:auto}
details>summary{cursor:pointer;font-weight:800;padding:6px 0}
