.sidebar { background: #004593; }
:root {
  --green: #004593;
  --green-soft: #eaf2fb;
  --shadow: 0 14px 38px rgba(0, 69, 147, .08);
  --success: #2f7d5a;
  --success-soft: #eaf5ef;
}
.brand-logo { display: block; flex: 0 0 auto; width: 40px; height: 40px; border-radius: 10px; object-fit: contain; background: #fff; }
.brand-logo.large { width: 52px; height: 52px; border-radius: 13px; }
.login-page { background: #edf3fa; }
.login-panel { box-shadow: 0 30px 80px rgba(0, 69, 147, .16); }
.status.success { background: var(--success-soft); color: var(--success); }
.source-dot.online { background: var(--success); }
.clickable-row { cursor: pointer; }
.clickable-row:hover { background: #f7faf8; }
.back-link { display: inline-block; margin-bottom: 8px; }
.panel-body { padding: 20px; }
.company-remarks-panel { margin-bottom: 20px; }
.company-controls-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr); gap: 20px; margin-bottom: 20px; }
.company-controls-grid .company-remarks-panel { margin-bottom: 0; }
.collection-form label { font-size: 14px; font-weight: 600; }
.collection-control { display: flex; align-items: center; gap: 12px; margin-top: 18px; }
.collection-switch { width: 48px; height: 28px; padding: 3px; border: 0; border-radius: 20px; background: #8c97a6; cursor: pointer; }
.collection-switch span { display: block; width: 22px; height: 22px; border-radius: 50%; background: #fff; transition: transform .15s; box-shadow: 0 1px 3px #0003; }
.collection-switch[aria-checked="true"] { background: #004593; }
.collection-switch[aria-checked="true"] span { transform: translateX(20px); }
.collection-switch:focus-visible { outline: 2px solid #3374ba; outline-offset: 3px; }
.collection-switch:disabled { opacity: .6; cursor: wait; }
.collection-error { color: var(--red); font-size: 12px; }
@media (max-width: 1000px) { .company-controls-grid { grid-template-columns: 1fr; } }
.company-remarks-form textarea { display: block; width: 100%; resize: vertical; min-height: 110px; padding: 12px; border: 1px solid var(--line); border-radius: 9px; font: inherit; line-height: 1.6; color: var(--ink); }
.company-remarks-form textarea:focus { outline: 2px solid #3374ba; outline-offset: 1px; }
.company-remarks-form textarea { height: 86px; min-height: 86px; }
.company-remarks-form textarea:read-only { background: #e1e6ed; border-color: #bdc7d4; color: #465366; resize: none; }
.company-history-table { min-width: 900px; }
.history-col-scope { width: 180px; }
.company-history-table .history-col-change { width: calc((100% - 520px) / 2); }
.history-table.company-history-table td { vertical-align: top; }
.company-history-table .history-scope { white-space: normal; overflow-wrap: anywhere; font-size: 12px; color: var(--muted); }
.company-history-table .change-value { display: flex; flex-direction: column; gap: 4px; }
.company-history-table .remark-history-value { white-space: pre-wrap; }
.remarks-error { color: var(--red); font-size: 12px; }
.remark-editor { display: block; margin-top: 4px; color: var(--muted); overflow-wrap: anywhere; }
.history-table td.remark-history-value { white-space: pre-wrap; }
.company-remarks-actions { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 12px; }
.company-remarks-actions .remarks-saved-time { color: var(--muted); font-size: 12px; }
.company-remarks-actions button { flex-shrink: 0; }
.company-remarks-actions button:disabled { opacity: .6; cursor: wait; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.error-panel { border-color: #efc7c4; margin-bottom: 18px; }
.error-panel pre { margin: 0; white-space: pre-wrap; color: #9d352f; }
.detail-section { margin-top: 18px; }
.company-heading { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.company-identity { display: flex; flex-direction: column; gap: 7px; }
.company-title-line { display: flex; align-items: baseline; flex-wrap: wrap; gap: 16px; }
.company-heading .company-name,
.company-heading .company-code { color: var(--ink); font-size: 25px; font-weight: 700; line-height: 1.2; letter-spacing: 0; }
.company-back-button { margin: 0; white-space: nowrap; }
.company-status-line { display: flex; flex-wrap: wrap; gap: 10px; }
.company-heading .company-status { display: inline-flex; align-items: center; color: var(--orange); font-size: 14px; font-weight: 600; line-height: 1.4; }
.company-status-empty { color: var(--muted); }
.company-full-name { display: inline-block; }
.history-block { padding: 24px 22px 26px; }
.history-block h3 { margin-bottom: 16px; font-size: 16px; }
.history-table-wrap { border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.history-table { width: 100%; min-width: 860px; table-layout: fixed; }
.history-col-time { width: 150px; }
.history-col-source { width: 100px; }
.history-col-operation { width: 90px; }
.history-col-change { width: calc((100% - 340px) / 2); }
.history-table th { padding-top: 11px; padding-bottom: 11px; background: #f7f9f7; color: #687269; font-size: 12px; font-weight: 600; }
.history-table td { padding-top: 13px; padding-bottom: 13px; white-space: normal; line-height: 1.55; vertical-align: middle; }
.history-table th:nth-child(4),
.history-table th:nth-child(5),
.history-table td:nth-child(4),
.history-table td:nth-child(5) { width: auto; white-space: normal; overflow-wrap: anywhere; word-break: break-word; vertical-align: top; }
.history-table tbody tr:hover { background: #fbfcfa; }
.history-source { display: inline-flex; align-items: center; padding: 4px 8px; border-radius: 6px; background: var(--green-soft); color: var(--green); font-size: 12px; font-weight: 600; }
.history-operation { display: inline-flex; align-items: center; padding: 4px 9px; border-radius: 999px; background: #f0f1ee; color: #596159; font-size: 12px; font-weight: 600; }
.history-operation.created, .history-operation.restored { background: var(--green-soft); color: var(--green); }
.history-operation.updated { background: var(--orange-soft); color: var(--orange); }
.history-operation.missing { background: #fae9e7; color: var(--red); }
.change-value { display: grid; grid-template-columns: minmax(94px, auto) 1fr; gap: 10px; padding: 3px 0; }
.change-value + .change-value { border-top: 1px dashed #eceeea; margin-top: 4px; padding-top: 7px; }
.change-value strong { color: var(--muted); font-size: 12px; font-weight: 500; }
.change-value span { color: var(--ink); overflow-wrap: anywhere; }
.filter-grid { align-items: flex-end; flex-wrap: wrap; }
.filter-field { display: flex; flex-direction: column; gap: 7px; color: var(--muted); font-size: 12px; }
.filter-grid .filter-field input { min-width: 220px; }
.filter-grid .filter-field:nth-of-type(2) input { min-width: 280px; }
.filter-grid .filter-field select { min-width: 160px; height: 37px; border: 1px solid var(--line); border-radius: 9px; padding: 0 34px 0 12px; background: #fff; color: var(--ink); outline: none; }
.filter-grid .filter-field select:focus { border-color: #6d9988; box-shadow: 0 0 0 3px var(--green-soft); }
.filter-reset { height: 37px; }
.claim-status { color: var(--orange); font-weight: 600; }
.limitation-date.expired { color: var(--red); font-weight: 700; }
.detail-button { display: inline-flex; padding: 6px 10px; border: 1px solid #bfd2ca; border-radius: 7px; font-weight: 600; white-space: nowrap; }
.integrated-table td { vertical-align: top; line-height: 20px; }
.integrated-table th, .integrated-table td { padding:16px 14px; }
.integrated-table .collection-column { width:112px; min-width:112px; white-space:nowrap; }
.integrated-table .stacked-value { align-items: flex-start; line-height: 20px; }
.integrated-list-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 20px; padding: 16px 20px; border-top: 1px solid var(--line); }
.integrated-list-footer .pagination { flex: 1 1 auto; border-top: 0; padding: 0; }
.system-log-link { flex: 0 0 auto; white-space: nowrap; }
.stacked-values { display: flex; flex-direction: column; }
.stacked-value { display: flex; align-items: center; min-height: 27px; line-height: 1.45; white-space: nowrap; }
.stacked-value.claim-status { font-size: 13px; }
.brand { position: relative; padding-right: 46px; }
.sidebar-toggle { position: absolute; right: 2px; top: 3px; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 1px solid rgba(255,255,255,.24); border-radius: 9px; background: rgba(255,255,255,.08); color: #fff; cursor: pointer; transition: background .18s ease, transform .18s ease; }
.sidebar-toggle:hover { background: rgba(255,255,255,.16); }
.sidebar-toggle:focus-visible { outline: 2px solid #f4a261; outline-offset: 2px; }
.sidebar-toggle span { font-size: 26px; line-height: 1; transform: translateY(-1px); }
.nav-icon { flex: 0 0 18px; display: inline-grid; place-items: center; }
.sub-icon { width: 22px; height: 22px; border-radius: 7px; background: rgba(255,255,255,.09); font-size: 11px; }
.app-shell, .sidebar { transition: width .2s ease, grid-template-columns .2s ease, padding .2s ease; }
.sidebar-is-collapsed .app-shell { grid-template-columns: 76px minmax(0,1fr); }
.sidebar-is-collapsed .sidebar { padding-left: 10px; padding-right: 10px; }
.sidebar-is-collapsed .brand { justify-content: center; min-height: 38px; padding-left: 0; padding-right: 0; }
.sidebar-is-collapsed .brand-logo,
.sidebar-is-collapsed .brand-copy,
.sidebar-is-collapsed .nav-label,
.sidebar-is-collapsed .sidebar-footer > div { display: none; }
.sidebar-is-collapsed .sidebar-toggle { position: static; }
.sidebar-is-collapsed .sidebar-toggle span { transform: rotate(180deg) translateY(1px); }
.sidebar-is-collapsed .nav-item,
.sidebar-is-collapsed .nav-group-title,
.sidebar-is-collapsed .nav-subitem { justify-content: center; padding-left: 12px; padding-right: 12px; }
.sidebar-is-collapsed .nav-group-title { margin-top: 4px; }
.sidebar-is-collapsed .sidebar-footer { grid-template-columns: 34px; justify-content: center; padding-left: 0; padding-right: 0; }
.sidebar-is-collapsed .sidebar-footer form { display: none; }
.pagination-enhanced { flex-wrap: wrap; gap: 12px; }
.pagination-pages { display: flex; align-items: center; gap: 5px; }
.page-number,
.page-arrow { display: inline-grid; place-items: center; min-width: 34px; height: 34px; padding: 0 8px; border-radius: 8px; color: var(--ink); font-weight: 500; }
.page-number:hover,
.page-arrow:hover { background: var(--green-soft); color: var(--green); }
.page-number.current { background: var(--green); color: #fff; font-weight: 700; }
.page-arrow { font-size: 27px; font-weight: 300; }
.page-arrow.disabled { color: #c3c8c4; cursor: default; }
.page-arrow.disabled:hover { background: transparent; }
.page-ellipsis { min-width: 25px; text-align: center; color: var(--muted); }
.pagination-jump { display: flex; align-items: center; gap: 7px; color: var(--muted); white-space: nowrap; }
.pagination-jump input { width: 58px; height: 34px; border: 1px solid var(--line); border-radius: 8px; padding: 0 8px; text-align: center; color: var(--ink); outline: none; }
.pagination-jump input:focus,
.page-size-select select:focus { border-color: #6d9988; box-shadow: 0 0 0 3px var(--green-soft); }
.pagination-jump button { height: 34px; border: 1px solid var(--line); border-radius: 8px; padding: 0 13px; background: #fff; color: var(--ink); cursor: pointer; }
.pagination-jump button:hover { border-color: #bfd2ca; color: var(--green); }
.pagination-total { color: var(--muted); white-space: nowrap; }
.page-size-select select { height: 34px; border: 1px solid var(--line); border-radius: 8px; padding: 0 30px 0 10px; background: #fff; color: var(--ink); outline: none; cursor: pointer; }
.clickable-row:hover { background: #f5f8fc; }
.login-form input:focus,
.filter-bar input:focus,
.filter-grid .filter-field select:focus,
.pagination-jump input:focus,
.page-size-select select:focus { border-color: #3374ba; box-shadow: 0 0 0 3px var(--green-soft); }
.detail-button,
.pagination-jump button:hover { border-color: #b8cce4; }
.history-operation.created,
.history-operation.restored { background: var(--success-soft); color: var(--success); }
.date-chip { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-width: 134px; padding-left: 18px; line-height: 1.25; }
.date-chip-label { color: var(--muted); font-size: 12px; font-weight: 500; }
.date-chip-value { color: var(--ink); font-size: 13px; font-weight: 500; white-space: nowrap; }
.dashboard-metric-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1050px) {
  .dashboard-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .sidebar-toggle { display: none; }
  .sidebar-is-collapsed .app-shell { display: block; }
  .sidebar-is-collapsed .sidebar { width: 100%; padding: 24px 16px; }
  .sidebar-is-collapsed .brand-logo,
  .sidebar-is-collapsed .brand-copy,
  .sidebar-is-collapsed .nav-label { display: initial; }
  .sidebar-is-collapsed .brand { justify-content: flex-start; padding: 0 10px 28px; }
  .sidebar-is-collapsed .nav-item,
  .sidebar-is-collapsed .nav-group-title { justify-content: flex-start; }
  .sidebar-is-collapsed .nav-subitem { justify-content: flex-start; padding-left: 45px; }
  .pagination-enhanced { justify-content: center; }
  .pagination-jump { order: 2; }
  .company-heading .company-name,
  .company-heading .company-code { font-size: 22px; }
  .filter-grid .filter-field,
  .filter-grid .filter-field input { width: 100%; min-width: 0; }
  .date-chip { min-width: 0; padding-left: 0; }
  .dashboard-metric-grid { grid-template-columns: 1fr; }
}
.company-history-pagination { display:flex; justify-content:flex-end; align-items:center; gap:12px; flex-wrap:wrap; margin-top:20px; font-size:14px; color:#667085; }
.company-history-pagination label { display:flex; align-items:center; gap:8px; }
.company-history-pagination select { width:auto; padding:8px 12px; border:1px solid #d0d5dd; border-radius:8px; background:#fff; color:#344054; font:inherit; }
.company-history-pagination button:disabled { opacity:.45; cursor:not-allowed; }
.history-page-error { color:#b42318; }
.app-select-native { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip-path:inset(50%)!important; border:0!important; opacity:0; pointer-events:none; }
.app-select-trigger { display:inline-flex; align-items:center; justify-content:space-between; gap:20px; min-height:38px; min-width:90px; padding:8px 12px; border:1px solid #d4dce7; border-radius:9px; background:#fff; color:#263445; font:inherit; font-size:14px; text-align:left; cursor:pointer; transition:border-color .15s, box-shadow .15s; }
.app-select-trigger::after { content:''; width:7px; height:7px; flex-shrink:0; border-right:1.5px solid #66778e; border-bottom:1.5px solid #66778e; transform:rotate(45deg) translateY(-2px); }
.app-select-trigger:hover { border-color:#8aaed5; }
.app-select-trigger:focus-visible, .app-select-trigger[aria-expanded=true] { outline:none; border-color:#004593; box-shadow:0 0 0 3px #00459318; }
.app-select-trigger[aria-expanded=true]::after { transform:rotate(225deg) translate(-2px,-1px); }
.app-select-trigger:disabled { background:#f0f3f7; color:#98a2b3; cursor:not-allowed; }
.app-select-trigger[aria-invalid=true] { border-color:#b42318; }
.app-select-menu { position:fixed; z-index:10000; overflow-y:auto; overscroll-behavior:contain; padding:5px; background:#fff; border:1px solid #dbe4ef; border-radius:11px; box-shadow:0 10px 32px #16385b24; font-size:14px; color:#263445; }
.app-select-option { padding:9px 32px 9px 11px; border-radius:6px; position:relative; cursor:pointer; line-height:20px; overflow-wrap:anywhere; }
.app-select-option:hover, .app-select-option.is-active { background:#f0f5fb; }
.app-select-option[aria-selected=true] { color:#004593; background:#eaf2fc; font-weight:600; }
.app-select-option[aria-selected=true]::after { content:'✓'; position:absolute; right:10px; }
.app-select-option[aria-disabled=true] { color:#a5adba; cursor:not-allowed; }
.filter-grid .filter-field .app-select-trigger { width:100%; min-width:140px; }
.filter-grid .filter-field input { min-width:180px; }
.filter-grid .filter-field:nth-of-type(2) input { min-width:220px; }
.filter-bar.filter-grid { display:grid; grid-template-columns:minmax(125px,1fr) minmax(160px,1.3fr) repeat(3,minmax(125px,1fr)) auto; gap:12px; }
.filter-bar.filter-grid .filter-field { min-width:0; }
.filter-bar.filter-grid .filter-field input, .filter-bar.filter-grid .filter-field .app-select-trigger { width:100%; min-width:0; }
.filter-bar.filter-grid .filter-reset { grid-column:6; justify-self:end; }
.page-heading{min-width:0}.page-back-slot:empty{display:none}.page-back-slot:not(:empty){margin-bottom:16px}.page-back-slot .secondary-button{display:inline-flex;align-items:center;gap:6px;margin:0;white-space:nowrap;font-size:13px;font-weight:500;line-height:1.3;padding:9px 13px}
@media(max-width:1100px) { .filter-bar.filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .filter-bar.filter-grid .filter-reset { grid-column:auto; } }
@media(max-width:600px) { .filter-bar.filter-grid { grid-template-columns:minmax(0,1fr); } }
