/* 로고 자리 — 2026-09-08. 대표님 세 가지: 「남색 바탕에서 로고가 묻힌다」·「탭 아이콘이 뭉갠다」·「로그인 배경 Y 를 로고답게」
   ★맨 뒤 새 조각이다. 앞 조각을 헤집지 않고 여기서만 덮는다 (docs/화면조각표.md 규칙).
   조각을 늘렸으므로 yeiltax/settings.py 의 MENU_STYLES 와 views/shell-head.html 의 <link> 도 같이 고쳤다. */

/* ① 상단바와 로그인 왼쪽 패널은 남색(#0c3f6c)이라, 로고의 남색 타일이 바탕에 묻혀 네모가 안 보인다.
      바탕색은 건드리지 않고 로고 둘레에 아주 옅은 테 한 겹으로만 떼어 놓는다.
      모서리는 로고 자체의 반지름과 같게 — 원본 실측 19/382 ≈ 5%.
      ★앞 조각의 `box-shadow: none` 을 덮어야 하므로 그쪽과 같은 선택자를 그대로 적는다. */
.brand-mark,
body:not(.sidebar-collapsed) .brand-mark,
.login-brand-mark {
  border-radius: 5%;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .3), 0 2px 8px rgba(2, 20, 45, .35);
}

/* ② 로그인 왼쪽 배경의 큰 「Y」 글자를 로고 그림으로 바꾼다.
      yeiltax-mark.png 는 원본 로고에서 밝은 부분(글자·막대·궤도·빛번짐)만 흰색으로 뽑은 것이다 — 새로 그린 것이 아니다.
      ★크기는 지금 글자가 차지하던 197px 에서 230px 로만 키웠다 — 획이 가늘어 같은 높이로는 「Y」보다 약하게 보인다. */
.login-internal-copy > span {
  width: 230px;
  height: 230px;
  background: url("../assets/yeiltax-mark.png") left center / contain no-repeat;
  opacity: .13;
  font-size: 0;              /* 「Y」 글자를 없앤다 (HTML 은 안 건드린다) */
  line-height: 0;
}

/* ③ ★병원 매출 화면의 「뒤로」 단추는 로고가 아니라 화살표다 — `shell-tail.html:48` 이 같은 class(.brand-mark)를 쓴다.
      어제 판(abb3023)이 `.brand-mark` 를 통째로 로고 그림 + `font-size:0` 으로 바꿔 놓아 그 화살표가 사라졌고,
      위 ① 규칙까지 얹히면 테두리와 그림자도 붙는다. 그 한 자리만 로고 이전 값으로 되돌린다.
      되돌리는 값은 앞 조각들이 로고 이전에 주던 것 그대로다 —
      40x40 · 모서리 9px(05-temp-registration.css:323) · 하늘색→파랑(10-login-payroll.css:476) · 흰 글자 13px. */
#hospital-revenue-shell .brand-mark {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  aspect-ratio: auto;
  border-radius: 9px;
  background: linear-gradient(145deg, var(--brand-sky), var(--brand-blue));
  box-shadow: 0 8px 18px rgba(8, 47, 82, .2);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
}


/* ============================================================================
   ④ 글자 크기 — 2026-09-08 대표님 「글자크기를 니가 적절하게 바꿔봐」
   ============================================================================
   잰 것: 12px 보다 작은 글자가 163곳(9px 31곳 · 8px 4곳). 글자 크기 종류는 스무 가지가 넘는다.
   여기서 하는 것 셋.
     ㉠ 어떤 글자도 12px 아래로 내려가지 않게 한다
     ㉡ 사람이 오래 읽는 자리(메뉴 · 표 · 입력칸 · 설명글)를 한 단씩 올린다
     ㉢ 자간을 푼다 — 아래 ⑤
   ★`!important` 를 쓴다. 앞 조각(01-base.css 맨 위 · 05-temp-registration.css)이 이미
   `!important` 로 크기를 눌러 놓아, 뒤에 와도 그것 없이는 안 먹는다. 덮을 자리만 골라 쓴다.
   ★줄 높이는 거의 그대로 둔다(표 54→56px) — 한 화면에 들어가는 줄 수를 지키려고. */

/* ㉠ 틀과 좌측 메뉴 — 화면이 바뀌어도 늘 보이는 자리 */
.sidebar .section-title { font-size: 12px; }
.sidebar .menu-item,
.sidebar .menu-group-toggle,
.dashboard-home-button { font-size: 15px; }
.sidebar .menu-subitem { font-size: 14px; }
.brand .eyebrow { font-size: 11px; }
#topbar-page-title { font-size: 24px; }
.topbar-date { font-size: 14px; }
.user-chip strong { font-size: 14px; }
.user-chip span { font-size: 12px; }

/* ㉡ 공용 단추 — 화면 전체에서 같은 크기로 */
.ghost-button { font-size: 14px; }
.primary-button,
.secondary-button { font-size: 15px; }

/* ㉢ 업무 화면 본문 — 01-base.css 맨 위의 눌러 둔 값을 한 단씩 올린다 (대시보드는 그대로 둔다) */
@media (min-width: 761px) {
  .view-section:not(#view-home) { font-size: 15px; line-height: 1.6; }
  .view-section:not(#view-home) h3 { font-size: 19px !important; }
  .view-section:not(#view-home) h4 { font-size: 17px !important; }
  .view-section:not(#view-home) button,
  .view-section:not(#view-home) input:not([type="checkbox"]):not([type="radio"]),
  .view-section:not(#view-home) select,
  .view-section:not(#view-home) textarea,
  .view-section:not(#view-home) .file-label span { font-size: 15px !important; }
  .view-section:not(#view-home) table th,
  .view-section:not(#view-home) table td { font-size: 15px !important; }
  .view-section:not(#view-home) .meta-line,
  .view-section:not(#view-home) .status-text,
  .view-section:not(#view-home) .helper-text,
  .view-section:not(#view-home) .section-description,
  .view-section:not(#view-home) .workspace-helper,
  .view-section:not(#view-home) .withholding-cycle-help { font-size: 14px !important; }

  .workflow-stagebar strong { font-size: 15px !important; }
  .workflow-stagebar small { font-size: 13px !important; }

  /* 거래처 등록 및 관리 — 표가 제일 빽빽한 자리라 따로 눌려 있었다. 같이 올린다. */
  #view-temp_registration .temp-reg-title-actions button { height: 40px; font-size: 15px !important; }
  #view-temp_registration .temp-reg-filter-bar label,
  #view-temp_registration .temp-reg-result-label,
  #view-temp_registration .temp-reg-count,
  #view-temp_registration .temp-reg-list-actions button { font-size: 15px !important; }
  #view-temp_registration .temp-reg-filter-bar select,
  #view-temp_registration .temp-reg-filter-bar input { height: 40px; font-size: 15px !important; }
  #view-temp_registration .temp-reg-table { font-size: 15px !important; }
  #view-temp_registration .temp-reg-table th { height: 46px; }
  #view-temp_registration .temp-reg-table td { height: 56px; }
  #view-temp_registration .temp-reg-company-cell { font-size: 16px !important; }
  #view-temp_registration .temp-reg-tax-label,
  #view-temp_registration .temp-reg-table-status,
  #view-temp_registration .temp-reg-table .temp-reg-withholding-cycle,
  #view-temp_registration .temp-reg-table .temp-reg-tag { font-size: 12px !important; }
  #view-temp_registration .temp-reg-detail-label,
  #view-temp_registration .temp-reg-section-title,
  #view-temp_registration .temp-reg-recent-head h3 { font-size: 15px !important; }
  #view-temp_registration .temp-reg-company-head strong { font-size: 20px !important; }
}

/* ㉣ 12px 아래로 내려가던 작은 조각들 — 태그 · 배지 · 칩 */
.temp-reg-tag,
.temp-reg-type-badge,
.temp-reg-withholding-cycle,
.temp-reg-card-meta,
.temp-reg-tag-input { font-size: 12px; }
.temp-reg-card-main strong { font-size: 15px; }

/* ============================================================================
   ⑤ 자간 — 좁혀 둔 것을 푼다
   ============================================================================
   `body` 에 `letter-spacing: -0.012em` 이 걸려 있다(05-temp-registration.css:281).
   그 값은 Pretendard 를 기준으로 잡은 것인데, ★Pretendard 는 불러오는 곳이 없어서
   실제로 뜨는 글꼴은 맑은 고딕이다. 맑은 고딕은 작은 크기에서 획이 엉겨 붙는다.
   ★글꼴을 실제로 넣을지는 대표님이 정하실 일이라 선언은 안 건드리고, 자간만 되돌린다. */
body { letter-spacing: normal; }


/* ============================================================================
   ⑥ 창 폭 — 2026-09-08 대표님 「창 크기에 따라 메뉴 구성이 이상하게 바뀐다」
   ============================================================================
   잰 것(도는 화면에서 폭을 바꿔 가며 쟀다):
     · 1440~800px  상단바가 세 칸(브랜드 224px | 화면이름 | 사용자칸 318px).
                   가운데 칸이 1440에서 820px → 790에서 210px 로 줄어, 화면 이름과 날짜가 부딪힌다.
     · 760px 아래  ★머리가 세 줄로 쌓인다 — ㉠남색 브랜드 띠(폭 전체) ㉡단추 줄 ㉢화면이름 줄.
                   본문이 시작되기 전에 300px 가까이 먹는다. 좌측 메뉴는 가로로 눕는다(원래 그렇게 짜였다).
   여기서 하는 것: 좁아질 때 ★접는 차례를 정한다. 날짜 → 브랜드 설명 → 브랜드 크기 순으로 접고,
   화면 이름은 마지막까지 지킨다. 760px 아래에서는 머리를 ★세 줄에서 두 줄로 줄인다. */

/* ㉠ 넓을 때 — 화면 이름이 잘려도 말줄임으로. 절대 겹치지 않게. */
@media (min-width: 761px) {
  .topbar-page-context { min-width: 0; }
  #topbar-page-title {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
}

/* ㉡ 1080px 아래 — 날짜부터 접는다. 없어도 일하는 데 지장이 없는 것이 날짜다. */
@media (min-width: 761px) and (max-width: 1080px) {
  .topbar-date { display: none; }
  .user-box .ghost-button { padding-inline: 9px; }
}

/* ㉢ 900px 아래 — 브랜드가 자리를 덜 먹게 줄인다.
      ★윗줄(TAX ACCOUNTING WEB WORKSPACE)은 ★숨기지 않는다 —
      대표님 2026-09-08 「그대로 두어라」(웹 PM 통해 전달). 크기만 줄여 자리를 넘긴다. */
@media (min-width: 761px) and (max-width: 900px) {
  .brand .eyebrow { font-size: 10px; }
  .brand h1 { font-size: 18px; }
}

/* ㉣ 760px 아래 — 머리를 두 줄로. 브랜드와 사용자칸을 한 줄에 나란히 놓는다.
      (앞 조각이 `.topbar { grid-template-columns: 1fr }` 이라 셋이 각각 한 줄씩 차지했다) */
@media (max-width: 760px) {
  .topbar {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    column-gap: 10px;
    padding-top: 8px;
  }
  .brand {
    grid-column: 1; grid-row: 1;
    min-height: 52px;
    margin: 0;
    padding: 0 12px;
    border-radius: 10px;
  }
  .brand .eyebrow { font-size: 10px; }   /* ★숨기지 않는다 — 대표님 「그대로 두어라」 */
  .brand h1 { font-size: 18px; }
  .user-box {
    grid-column: 2; grid-row: 1;
    width: auto;
    justify-content: flex-end;
  }
  .topbar-page-context {
    grid-column: 1 / -1; grid-row: 2;
    height: auto;
    min-height: 44px;
  }
  #topbar-page-title { font-size: 19px; }
  .topbar-date { font-size: 12px; }

  /* 가로로 눕는 메뉴 — 마지막 항목이 가장자리에 붙어 잘려 보이지 않게 끝여백을 준다 */
  .sidebar .menu-card { padding-inline-end: 16px; }
  .sidebar .menu-item,
  .sidebar .menu-group-toggle,
  .dashboard-home-button { font-size: 14px; }
}

/* ㉤ 1100px 아래 — 「거래처 등록 및 관리」의 두 칸(목록 | 상세)을 ★위아래로 눕힌다.
      잰 것: 900px 에서 본문이 676px 인데 오른쪽 상세가 370px 를 고정으로 가져가,
      왼쪽 목록이 250px 밖에 안 남고 그 안의 「전체·법인·개인·검색 결과」가 한 글자씩 접혔다.
      (글자를 키우기 전에도 좁았고, 키우니 접혔다 — 칸을 나누는 자리부터 고친다.)
      ★같이 푸는 것 하나: 이 화면은 창 높이에 맞춰 두 칸을 꽉 채우고 안에서만 굴리는 짜임이다.
      눕히면 그 짜임이 안 맞아 거르개가 눌려 아래 줄과 겹쳤다(실측: 거르개가 124px 인데 안의 것이 140px).
      그래서 좁을 때는 ★높이를 풀고 화면 전체를 굴린다. 목록만 안에서 굴린다. */
@media (min-width: 761px) and (max-width: 1100px) {
  #view-temp_registration .temp-reg-workspace {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    height: auto;
    min-height: 0;
    max-height: none;
  }
  #view-temp_registration .temp-reg-list-pane {
    min-height: 0;
    border-right: 0;
    border-bottom: 1px solid #d8e0ea;
  }
  /* 머리에 붙는 것들은 절대 눌리지 않게 — 눌려서 아래와 겹쳤다 */
  #view-temp_registration .temp-reg-list-tab,
  #view-temp_registration .temp-reg-filter-bar,
  #view-temp_registration .temp-reg-list-toolbar,
  #view-temp_registration .temp-reg-pagination { flex: none; }
  #view-temp_registration .temp-reg-list { max-height: 420px; }
  #view-temp_registration .temp-reg-sidebar {
    border-right: 0;
    border-bottom: 1px solid #d8e0ea;
  }
  #view-temp_registration .temp-reg-detail,
  #view-temp_registration .temp-reg-detail-scroll {
    min-height: 0;
    overflow: visible;
  }
  /* 제목줄은 오른쪽 상세 칸(370px)만큼 비워 두고 있었다 — 눕히면 그 자리가 없다 */
  #view-temp_registration .temp-reg-titlebar { right: 14px; }
}

/* ㉥ 1100px 아래 — 서식 넷(기장계약서·제본신청서·우편봉투·파일철)도 위아래로 눕힌다.
      잰 것: `.contract-workspace`·`.binding-workspace` 가 「작성 520px | 미리보기 370px」 두 칸이라
      최소 890px 를 요구한다. 창 900px 에서 본문이 621px 뿐이라 미리보기가 279px 잘려 나갔다.
      ★이것은 글자를 키우기 전에도 그랬다(내 조각을 꺼도 279px). 같이 고친다. */
@media (min-width: 761px) and (max-width: 1100px) {
  /* ★09-shared-c.css 안에서 두 규칙이 서로 싸운다 — `@max-width:1100px … 1fr` 을 적어 놓고
     바로 뒤에 `@min-width:761px … minmax(520px,1.12fr) minmax(370px,.88fr)` 이 와서 뒤엣것이 이긴다.
     그래서 900px 에서도 두 칸이 그대로였다. 같은 무게(클래스 둘)로 적어야 덮인다. */
  .workspace-form-view .contract-workspace,
  .workspace-form-view .binding-workspace { grid-template-columns: minmax(0, 1fr); }
}

/* ㉦ 부가세 화면의 안내 한 줄이 줄바꿈 금지로 걸려 있어 1,891px 짜리 한 줄이 된다(실측).
      화면 밖으로 1,286px 삐져나갔다. ★이것도 글자를 키우기 전부터 그랬다. 줄이 접히게 푼다. */
.client-board-head .meta-line { white-space: normal; }

/* ㉧ 신고관리 화면들(원천세·부가세·법인세·종합소득세)의 넓은 표 — 창이 좁으면 ★잘려서 못 본다.
      잰 것: 창 900px · 부가세 `.panel` 이 `overflow-x: hidden` 인데 안의 것이 792px 다(칸이 760px 고정).
      바깥으로 172px 이 잘려 나가고 굴릴 수도 없었다. ★글자를 키우기 전부터 그랬다.
      가로로 굴릴 수 있게만 바꾼다 — 이미 잘라 내던 자리라 새로 잘릴 것이 생기지는 않는다. */
@media (max-width: 1180px) {
  .workspace-tax-view .panel { overflow-x: auto; }
}
