/* 사무용(AOS.Web) 전용 스타일.
   MudBlazor는 Material Design이라 여백이 넉넉한데, 사무용은 한 화면에 표를 많이
   띄우는 업무 화면이라 밀도를 좁힌다. 현장용(AOS.Field)은 장갑 낀 손으로 쓰므로
   이 파일을 공유하지 않는다 — 터치 타깃을 좁히면 안 된다. */

/* ── 레이아웃(청색 사이드바 + 밝은 상단바) ── */

.aos-appbar {
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

/* 사이드바 메뉴: 어두운 바탕 위 흰 텍스트, 활성 항목은 밝은 알약형 하이라이트. */
.aos-nav .mud-nav-link {
    border-radius: 8px;
    margin: 1px 4px;
    color: var(--mud-palette-drawer-text) !important;
}

.aos-nav .mud-nav-link .mud-nav-link-icon {
    color: var(--mud-palette-drawer-icon) !important;
}

.aos-nav .mud-nav-link:hover {
    background: rgba(255, 255, 255, .08);
}

.aos-nav .mud-nav-link.active {
    background: rgba(255, 255, 255, .16);
    color: #fff !important;
}

.aos-nav .mud-nav-link.active .mud-nav-link-icon {
    color: #fff !important;
}

.aos-nav-group {
    color: rgba(255, 255, 255, .45);
    display: block;
    letter-spacing: 1.5px;
}

/* ── 사이드바 접힘(Mini) 상태: 텍스트는 숨기고 아이콘만 남긴다 ── */

.aos-drawer .aos-mini-only {
    display: none;
}

.aos-drawer .aos-user {
    padding-left: 20px;
    padding-right: 20px;
}

.mud-drawer--closed.aos-drawer .aos-full-only {
    display: none;
}

.mud-drawer--closed.aos-drawer .aos-mini-only {
    display: block;
}

.mud-drawer--closed.aos-drawer .aos-brand {
    padding: 16px 8px;
}

.mud-drawer--closed.aos-drawer .aos-nav-group {
    display: none;
}

.mud-drawer--closed.aos-drawer .aos-nav .mud-nav-link-text {
    display: none;
}

.mud-drawer--closed.aos-drawer .aos-nav .mud-nav-link {
    justify-content: center;
    padding-left: 12px;
    padding-right: 12px;
}

.mud-drawer--closed.aos-drawer .aos-nav .mud-nav-link .mud-nav-link-icon {
    margin-right: 0;
}

.mud-drawer--closed.aos-drawer .aos-user {
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
}

/* ── 업무용 밀도 ── */

/* 표: 행 높이와 좌우 여백을 줄여 한 화면에 더 많은 행이 들어가게 한다. */
.mud-table-dense .mud-table-cell {
    padding: 4px 12px;
    font-size: 0.8125rem;
}

.mud-table-dense .mud-table-cell.mud-table-cell-header {
    font-weight: 600;
    white-space: nowrap;
}

/* 카드·페이퍼: 등록 폼이 화면 위쪽을 덜 차지하게. */
.aos-form-card {
    padding: 12px 16px;
}

/* 입력 라벨이 촘촘한 폼에서 줄바꿈되지 않게. */
.aos-form-card .mud-input-label {
    white-space: nowrap;
}

/* 툴바·헤딩 아래 여백 축소. */
.aos-page-title {
    margin-bottom: 12px;
}

/* 숫자 열 정렬 — 금액·수량이 자릿수로 맞아 보이게. */
.aos-num {
    font-variant-numeric: tabular-nums;
    text-align: right;
}

/* ── Blazor 로딩·오류 UI (index.html이 참조) ── */

.loading-progress {
    position: absolute;
    display: block;
    width: 8rem;
    height: 8rem;
    inset: 20vh 0 auto 0;
    margin: 0 auto 0 auto;
}

.loading-progress circle {
    fill: none;
    stroke: #e0e0e0;
    stroke-width: 0.6rem;
    transform-origin: 50% 50%;
    transform: rotate(-90deg);
}

.loading-progress circle:last-child {
    stroke: #1B5E9C;
    stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
    transition: stroke-dasharray 0.05s ease-in-out;
}

.loading-progress-text {
    position: absolute;
    text-align: center;
    font-weight: bold;
    inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}

.loading-progress-text:after {
    content: var(--blazor-load-percentage-text, "불러오는 중");
}

#blazor-error-ui {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 3000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

.blazor-error-boundary {
    background: #b32121;
    padding: 1rem;
    color: white;
}

.blazor-error-boundary::after {
    content: "오류가 발생했습니다.";
}