.settings-page { min-width: 0; }
.settings-hub-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 4px 0 12px; }
.settings-hub-heading h2 { margin: 0; font: 600 20px/1.3 Arial,sans-serif; }
.settings-hub-heading .search-control { width: 280px; }
.settings-layout { display: grid; grid-template-columns: minmax(0,1fr); align-items: start; }
.settings-primary { min-width: 0; container: settings-workspace / inline-size; }
.settings-group-tabs { border-bottom: 1px solid #e2e6e9; }
.settings-group-tabs button { display: inline-flex; align-items: center; gap: 7px; padding-left: 10px; padding-right: 10px; font-size: 12px; }
.settings-group-tabs svg { width: 16px; height: 16px; flex-shrink: 0; }
.settings-hub .settings-content { padding-top: 12px; }
.settings-tile-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.settings-tile { display: grid; grid-template-columns: 34px minmax(0,1fr) 14px; align-items: center; gap: 10px; min-height: 80px; padding: 12px; text-align: left; border: 1px solid #e1e6ea; border-radius: 6px; background: #fff; color: #16262e; cursor: pointer; }
.settings-tile:hover { border-color: #b48c2a; background: #fffdf7; }
.settings-tile:focus-visible { outline: 2px solid #a57a03; outline-offset: 2px; }
.settings-tile-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #fbf0d9; color: #936417; }
.settings-tile-icon svg { width: 20px; height: 20px; }
.settings-tile > svg { width: 14px; height: 14px; color: #63778a; }
.settings-tile strong { display: block; font-size: 13px; font-weight: 600; line-height: 1.4; }
.settings-tile small { display: block; margin-top: 3px; font-size: 12px; font-weight: 400; line-height: 1.4; color: #65758b; overflow-wrap: anywhere; }
@container settings-workspace (min-width:880px) { .settings-tile-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@container settings-workspace (min-width:1240px) { .settings-tile-grid { grid-template-columns: repeat(4,minmax(0,1fr)); } }
.settings-tile:nth-child(4n+2) .settings-tile-icon { background: #edf4f5; color: #426b70; }
.settings-tile:nth-child(4n+3) .settings-tile-icon { background: #f5eef3; color: #7c476b; }
.settings-detail-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.settings-detail .panel { padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; }
.settings-hub textarea { width: 100%; resize: vertical; font: inherit; }
.company-profile-layout { display: grid; grid-template-columns: minmax(0,2fr) minmax(220px,1fr); gap: 40px; align-items: start; }
.settings-page .company-profile-layout .form-grid { max-width: none; }
.company-logo-editor { border-left: 1px solid #e2e6e9; padding-left: 32px; min-width: 0; }
.company-logo-stage { display: grid; place-items: center; min-height: 160px; margin: 16px 0; border: 1px dashed #cbd3db; background: #fff; }
.company-logo-stage img { max-width: 180px; max-height: 140px; object-fit: contain; }
.company-logo-picker { position: relative; overflow: hidden; cursor: pointer; }
.company-logo-picker input { position: absolute; inset: 0; width: 100%; opacity: 0; cursor: pointer; }
.company-logo-picker:focus-within { outline: 2px solid #a57a03; outline-offset: 2px; }
.company-logo-editor .permission-check { margin-top: 16px; }
.settings-page .settings-unit-default { max-width: none; align-items: end; margin-bottom: 28px; }
.settings-unit-default .button-row { margin: 0; flex-wrap: wrap; }
.settings-print-layouts { margin-top: 32px; padding-top: 20px; border-top: 1px solid #e2e6e9; }
#company-logo-status { color: #a8203e; font-size: 12px; }
@media(max-width:700px) { .company-profile-layout { grid-template-columns: minmax(0,1fr); gap: 24px; }.company-logo-editor { border-left: 0; border-top: 1px solid #e2e6e9; padding: 20px 0 0; }.settings-page .settings-unit-default { grid-template-columns: minmax(0,1fr); } }


@media(max-width:600px) { .settings-hub-heading { flex-wrap: wrap; gap: 10px; }.settings-hub-heading .search-control { width: 100%; }.settings-tile-grid { grid-template-columns: minmax(0,1fr); }.settings-tile { min-height: 76px; }.settings-detail-heading { flex-wrap: wrap; }.settings-hub .settings-actions { margin-left: 0; } }
.settings-shell { gap: 0; grid-template-columns: minmax(0,1fr); }
.settings-navigation { display: flex; align-items: center; gap: 18px; min-width: 0; border-bottom: 1px solid #e2e6e9; }
.settings-tabs { flex: 1; min-width: 0; gap: 4px; padding: 0; scrollbar-width: thin; }
.settings-tabs button { min-height: 48px; border: 0; border-bottom: 3px solid transparent; border-radius: 0; padding: 12px 13px; background: transparent; color: #586573; font-size: 13px; font-weight: 500; }
.settings-tabs button:hover { background: #f1f3f4; color: #15252c; }
.settings-tabs button.active { background: transparent; border-color: #b48817; color: #15252c; font-weight: 600; }
.settings-tabs button:focus-visible { outline: 2px solid #b48817; outline-offset: -4px; }
.settings-actions { display: flex; flex-shrink: 0; padding: 8px 0; }
.settings-page :is(.button,.ghost) { min-height: 36px; padding: 8px 12px; font-size: 13px; font-weight: 600; border-radius: 5px; box-shadow: none; display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.settings-page :is(.button,.ghost) svg { width: 16px; height: 16px; }
.settings-content { padding: 22px 0 0; }
.settings-content > .panel { border: 0; border-radius: 0; padding: 0; background: transparent; box-shadow: none; }
.settings-content :is(h2,h3) { font-family: inherit; letter-spacing: 0; }
.settings-content h2 { font-size: 17px; font-weight: 600; margin: 0 0 16px; }
.settings-content h3 { font-size: 14px; font-weight: 600; }
.settings-section-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 16px; }
.settings-section-head h2 { margin: 0 0 4px; }
.settings-page .catalog-export { position: relative; flex-shrink: 0; }
.settings-directory-toolbar { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.settings-directory-toolbar .admin-search { flex: 1; max-width: 460px; margin: 0; min-width: 0; }
.settings-page .select,.settings-page .input { min-height: 38px; padding: 8px 10px; font-size: 13px; }
.settings-directory-toolbar .select { width: 160px; }
.settings-page .search-control { min-height: 38px; padding: 8px 12px; gap: 10px; }
.settings-page .search-control input { font-size: 13px; }
.settings-page .search-control svg { width: 18px; height: 18px; }
.settings-page .table-wrap { border: 1px solid #e2e6e9; border-radius: 6px; background: #fff; }
.settings-page table { font-size: 13px; }
.settings-page th { background: #f5f7f8; color: #596773; font-size: 11px; font-weight: 600; padding: 12px 16px; }
.settings-page td { padding: 13px 16px; font-size: 13px; vertical-align: middle; }
.settings-page td strong { font-weight: 600; }
.settings-page tbody tr:hover { background: #fafbfc; }
.settings-page .settings-action-cell { text-align: right; width: 76px; }
.settings-page .icon-button { width: 34px; height: 34px; min-height: 34px; padding: 7px; }
.settings-page .pill { font-size: 11px; padding: 4px 9px; text-transform: capitalize; border-radius: 4px; }
.settings-page .access-footer { border: 0; padding: 12px 0; }
.settings-page .access-summary { padding-top: 0; }
.settings-page .profile-summary { margin: 16px 0 24px; gap: 18px; }
.settings-page .audit { gap: 0; }
.settings-page .audit-item { background: transparent; border: 0; border-bottom: 1px solid #e2e6e9; border-radius: 0; padding: 14px 0; }
.settings-page .audit-item strong { font-size: 12px; color: #65717b; font-weight: 500; }
.settings-page .audit-item span { font-size: 14px; }
.settings-page .company-settings .audit { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 32px; }
.settings-page .company-settings .audit-item { display: grid; grid-template-columns: minmax(120px,40%) minmax(0,1fr); align-items: center; gap: 12px; }
.settings-page .form-grid { max-width: none; gap: 16px; }
.settings-page .field label { font-size: 12px; font-weight: 500; text-transform: none; color: #465461; }
.settings-page .records { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.settings-page .record-card { background: #fff; border-radius: 6px; box-shadow: none; padding: 16px; }
.settings-page .inline-form { gap: 6px; }
.settings-page .inline-form input { min-width: 0; }
.settings-page .filters { align-items: end; gap: 12px; padding: 0; margin: 16px 0; }
.settings-page .filters label { font-size: 12px; font-weight: 500; }
.settings-page .measurement-policy-table input { width: 100%; min-width: 75px; min-height: 34px; border: 1px solid #dbe1e5; border-radius: 4px; padding: 6px 8px; font-size: 13px; }
.audit-pagination { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; margin-top: 16px; color: #65717b; font-size: 12px; }
.audit-pagination > span { margin-right: auto; }
.audit-pagination label,.audit-page-controls { display: flex; align-items: center; gap: 8px; }
.audit-pagination .select { width: 72px; }
.audit-page-controls > span { min-width: 80px; text-align: center; }
.audit-page-controls button:disabled { opacity: .4; cursor: not-allowed; }
@media(max-width:1100px) { .settings-navigation { flex-wrap: wrap; gap: 0; }.settings-tabs { flex-basis: 100%; }.settings-actions { margin-left: auto; }.settings-actions:empty { display: none; } }
@media(max-width:700px) { .settings-page .company-settings .audit { grid-template-columns: 1fr; } }
@media(max-width:700px) { .settings-content { padding-top: 16px; }.settings-tabs button { padding: 11px 12px; }.settings-page .records { grid-template-columns: 1fr; }.settings-directory-toolbar { flex-wrap: wrap; }.settings-directory-toolbar .admin-search { flex-basis: 100%; max-width: none; }.settings-directory-toolbar .select { flex: 1; }.settings-page .filters { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }.settings-page .settings-action-cell { width: auto; text-align: left; }.settings-page .access-summary { gap: 14px; }.settings-page .access-summary strong { font-size: 21px; } }
