/* Componentes compartilhados e área administrativa. Mantém Bootstrap/JSF existentes. */
:root {
    --ui-ink: #293747;
    --ui-muted: #667587;
    --ui-border: #e0e5eb;
    --ui-blue: #2563a6;
    --ui-bg: #f5f6f8;
    --ui-sidebar: #fff;
    --ui-sidebar-width: 252px;
}
.esic-app {
    background: var(--ui-bg);
    color: var(--ui-ink);
    font: 14px/1.55 "Segoe UI", Arial, sans-serif;
}
.esic-app #wrapper { background: transparent; }
.esic-app .navbar-static-top {
    position: fixed; top: 0; left: 0; right: 0; z-index: 1030;
    height: 68px; margin: 0; border: 0; background: #fff;
    box-shadow: 0 1px 0 var(--ui-border);
}
.esic-app .navbar-header { width: var(--ui-sidebar-width); height: 68px; padding: 18px 20px; }
.esic-app .navbar-header img { width: 196px; max-width: 100%; height: auto; }
.topbar-context { height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 34px; color: var(--ui-muted); }
.account-link { display: flex; align-items: center; gap: 9px; color: var(--ui-ink); font-weight: 600; max-width: 45%; }
.account-link span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Navegação: tarefas diárias, cadastros recolhíveis e conta sempre acessível. */
.esic-app .sidebar { position: fixed; top: 68px; bottom: 0; left: 0; width: var(--ui-sidebar-width); margin: 0; display: flex; flex-direction: column; background: var(--ui-sidebar); border-right: 1px solid var(--ui-border); z-index: 2; }
.sidebar-layout { display: flex; flex-direction: column; flex: 1; min-height: 0; margin: 0; }
.sidebar-shortcut { padding: 22px 16px 8px; }
.esic-app .sidebar-create { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 42px; padding: 10px 12px; border-radius: 7px; background: var(--ui-blue); color: #fff; font-size: 13px; font-weight: 600; text-decoration: none; }
.esic-app .sidebar-create:hover, .esic-app .sidebar-create:focus { background: #1d5189; }
.sidebar-menu, .sidebar-submenu { list-style: none; padding: 0; margin: 0; }
.esic-app .sidebar li { border: 0; }
.sidebar-menu { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 10px 14px 20px; scrollbar-width: thin; scrollbar-color: #cbd5df transparent; }
.esic-app .sidebar .nav-section { color: #788596; font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; padding: 20px 12px 8px; }
.esic-app .sidebar .nav-section:first-child { padding-top: 10px; }
.esic-app .sidebar-menu > li > a, .sidebar-group { display: flex; align-items: center; gap: 11px; width: 100%; min-height: 42px; margin: 3px 0; padding: 10px 12px; border: 0; border-radius: 7px; background: transparent; color: #526174; font: inherit; font-size: 13px; font-weight: 500; line-height: 1.5; text-align: left; text-decoration: none; }
.sidebar-group { cursor: pointer; }
.sidebar-menu > li > a > i, .sidebar-group > i:first-child { width: 18px; flex: 0 0 18px; text-align: center; font-size: 16px; color: #7c899a; }
.esic-app .sidebar-menu > li > a:hover, .sidebar-group:hover { background: #f3f6f9; color: #293747; }
.esic-app .sidebar-menu > li > a.active { background: #eaf2fc; color: #215b9c; font-weight: 600; }
.esic-app .sidebar-menu > li > a.active > i { color: #2563a6; }
.sidebar-group[aria-expanded="true"] { color: #293747; }
.sidebar-group.has-current { color: #215b9c; background: #f4f7fc; }
.sidebar-group.has-current > i:first-child { color: #2563a6; }
.sidebar-group .menu-chevron { margin-left: auto; font-size: 14px; transition: transform .15s ease; }
.sidebar-group[aria-expanded="true"] .menu-chevron { transform: rotate(180deg); }
.sidebar-submenu { margin: 4px 0 9px 20px; padding-left: 14px; border-left: 1px solid #e0e6ee; }
.sidebar-submenu[hidden] { display: none; }
.esic-app .sidebar-submenu a { position: relative; display: block; padding: 9px 10px; margin: 2px 0; border-radius: 5px; font-size: 12px; line-height: 1.5; color: #667587; text-decoration: none; }
.esic-app .sidebar-submenu a:hover { color: #293747; background: #f3f6f9; }
.esic-app .sidebar-submenu a.active { color: #215b9c; background: #eaf2fc; font-weight: 600; }
.sidebar-submenu a.active::before { content: ""; position: absolute; left: -18px; top: calc(50% - 3px); width: 6px; height: 6px; border-radius: 50%; background: #3876b8; }
.sidebar-footer { display: flex; align-items: center; gap: 8px; flex-shrink: 0; padding: 14px 16px; border-top: 1px solid var(--ui-border); }
.esic-app .sidebar-profile { display: flex; flex: 1; align-items: center; gap: 10px; min-width: 0; color: #526174; text-decoration: none; border-radius: 6px; }
.sidebar-avatar { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; background: #edf2f7; border-radius: 50%; color: #74859a; }
.sidebar-profile strong, .sidebar-profile small { display: block; }
.sidebar-profile strong { font-size: 12px; font-weight: 600; }
.sidebar-profile small { color: #7b8898; font-size: 11px; margin-top: 1px; }
.esic-app .sidebar-profile.active, .esic-app .sidebar-profile:hover { color: #215b9c; }
.esic-app .sidebar-logout, .sidebar-close { position: relative; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 0; border-radius: 6px; background: transparent; color: #74859a; font-size: 17px; text-decoration: none; }
.esic-app .sidebar-logout:hover, .sidebar-close:hover { background: #f3f6f9; color: #293747; }
.sidebar-mobile-heading, .sidebar-backdrop { display: none; }
.esic-app #page-wrapper { margin: 68px 0 0 var(--ui-sidebar-width); padding: 26px 28px; border: 0; background: var(--ui-bg); min-height: calc(100vh - 68px); }
.page-heading { margin: 0 0 22px; }
.page-eyebrow { color: var(--ui-muted); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; font-weight: 600; margin-bottom: 6px; }
.esic-app .page-heading h1 { font-family: inherit; color: var(--ui-ink); font-size: 26px; line-height: 1.25; font-weight: 600; margin: 0; }
.page-content { min-width: 0; margin: 0; padding: 24px; background: #fff; border: 1px solid var(--ui-border); border-radius: 8px; box-shadow: none; }
.esic-app .page-content > h3:first-child { margin-top: 0; }
.esic-app h3, .esic-app h4, .esic-app legend { font-family: inherit; color: var(--ui-ink); }
.esic-app h3 { font-size: 20px; }
.esic-app legend { font-size: 17px; font-weight: 600; padding-bottom: 12px; border-color: var(--ui-border); }
.form-intro { color: var(--ui-muted); margin: 0 0 25px; max-width: 760px; }
.form-section { border: 0; padding: 0; margin: 0 0 30px; min-width: 0; }
.form-section > legend { margin-bottom: 20px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 24px; align-items: start; width: 100%; }
.form-grid > * { min-width: 0; display: block; }
.form-grid > br, .form-grid > hr { display: none; }
.form-grid .field-full { grid-column: 1 / -1; }
.form-grid .form-grid { display: grid; width: 100%; }
.form-grid label, .esic-app .page-content label { display: inline-block; font-size: 13px; font-weight: 600; color: var(--ui-ink); margin-bottom: 6px; }
.form-grid label + br { display: none; }
.form-grid .form-control, .esic-app .page-content .form-control {
    width: 100%; max-width: none; height: 40px; padding: 8px 11px;
    background: #fff; border: 1px solid #cbd6e2; border-radius: 5px;
    box-shadow: none; font-size: 14px; color: var(--ui-ink);
}
.form-grid textarea.form-control, .esic-app .page-content textarea.form-control { height: auto; min-height: 110px; resize: vertical; line-height: 1.6; }
.form-grid .form-control:focus, .esic-app .page-content .form-control:focus { border-color: var(--ui-blue); outline: 0; box-shadow: 0 0 0 3px #2563a61c; }
.form-grid .form-control[disabled], .form-grid .form-control[readonly], .esic-app .form-control[disabled] { background: #eef2f6; color: var(--ui-muted); }
.field-help { display: block; color: var(--ui-muted); font-size: 12px; line-height: 1.5; margin: 8px 0 0; }
.form-grid input[type="checkbox"], .esic-app input[type="checkbox"] { width: 17px; height: 17px; margin: 0 8px 0 0; accent-color: var(--ui-blue); vertical-align: middle; flex-shrink: 0; }
.check-field { display: flex !important; align-items: center; gap: 2px; padding: 11px 14px; min-height: 42px; background: #f5f8fc; border: 1px solid var(--ui-border); border-radius: 5px; }
.check-field label { margin: 0 !important; font-weight: 500 !important; cursor: pointer; }
.field-status { align-self: end; }
.esic-app .btn, .form-actions .btn { padding: 10px 18px; border-radius: 5px; font-size: 13px; font-weight: 600; box-shadow: none; line-height: 1.5; }
.esic-app .btn-primary { background: var(--ui-blue); border-color: var(--ui-blue); }
.esic-app .btn-primary:hover, .esic-app .btn-primary:focus { background: #104c92; border-color: #104c92; }
.esic-app .link-voltar { display: inline-block; padding: 10px 16px; color: var(--ui-muted); font-size: 13px; font-weight: 600; margin-left: 6px; }
.form-actions { display: flex; align-items: center; gap: 8px; border-top: 1px solid var(--ui-border); margin-top: 28px; padding-top: 22px; }
.esic-app hr { border-color: var(--ui-border); margin: 26px 0; }
.esic-app .page-content .row { margin-bottom: 18px; }
.esic-app .table { font-size: 13px; }
.esic-app .table > thead > tr > th { background: #f4f7fb; color: #4a6075; border-bottom: 1px solid var(--ui-border); font-size: 12px; font-weight: 600; padding: 11px 12px; }
.esic-app .table > tbody > tr > td { border-top: 1px solid #e8eef4; padding: 11px 12px; vertical-align: middle; }
.esic-app .table-striped > tbody > tr:nth-of-type(odd) { background: #fafbfd; }
.esic-app .table tbody tr:hover { background: #f2f7fc; }
.esic-app .alert { border-radius: 5px; font-size: 13px; }
.unit-search { max-width: 400px; margin: 16px 0; }
.unit-options { width: 100%; border-collapse: separate; }
.unit-options tbody { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.unit-options tr { display: block; min-width: 0; }
.unit-options td { display: flex; align-items: center; min-height: 56px; height: 100%; border: 1px solid var(--ui-border); border-radius: 5px; padding: 12px 14px; background: #fff; }
.unit-options td:has(input:checked) { background: #eef5fd; border-color: #7ba9db; }
.unit-options label { margin: 0 !important; font-size: 12px !important; font-weight: 500 !important; line-height: 1.5; cursor: pointer; overflow-wrap: anywhere; flex: 1; }
.unit-options tr[hidden] { display: none; }
.selection-toolbar { display: flex; align-items: baseline; justify-content: space-between; gap: 15px; }
.selection-count { color: var(--ui-blue); font-size: 12px; font-weight: 600; white-space: nowrap; }
.skip-link { position: fixed; left: 12px; top: -60px; z-index: 2000; background: #fff; padding: 12px 18px; }
.skip-link:focus { top: 12px; }
.esic-app a:focus-visible, .esic-app button:focus-visible, .esic-app input[type="checkbox"]:focus-visible { outline: 3px solid #639de0; outline-offset: 3px; }
/* Form fields must stay together in the HTML generated by JSF. */
.editor-form { max-width: 1120px; }
.page-content:has(> .editor-form) { max-width: 1170px; }
.page-content:has(.form-grid-code) { max-width: 930px; }
.form-grid-code { grid-template-columns: minmax(120px, 1fr) minmax(0, 3fr); max-width: 880px; }
.form-grid-four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.form-grid > div:empty { display: none; }
.form-grid .upload-action { margin-top: 10px; }
.esic-app .page-content .dataTables_wrapper .row { margin-bottom: 0; }
.esic-app .dataTables_wrapper > .row:first-child { margin-bottom: 16px; }
.esic-app .dashboard-panel .dataTables_wrapper > .row:first-child { display: none; }
.esic-app .dataTables_wrapper > .row:last-child { margin-top: 14px; }
.esic-app .dataTables_wrapper label { font-weight: 400; color: var(--ui-muted); margin-bottom: 0; }
.esic-app .dataTables_wrapper select.form-control { display: inline-block; width: 76px; height: 34px; padding: 5px 8px; margin: 0 5px; }
.esic-app .dataTables_wrapper input.form-control { display: inline-block; width: 220px; height: 34px; padding: 5px 10px; margin-left: 8px; }
.esic-app .table { width: 100% !important; margin: 0 !important; border-collapse: collapse !important; }
.esic-app .table td { overflow-wrap: anywhere; }
.esic-app .dashboard-table td:nth-child(2) span { color: #aa4545 !important; }
.esic-app .dataTables_info, .esic-app .pagination { font-size: 12px; }
.esic-app .pagination > .active > a { background: var(--ui-blue); border-color: var(--ui-blue); }
.table-scroll { overflow-x: auto; width: 100%; }
.table-scroll > table { min-width: 640px; }
.table-scroll > .table-boots-custom { min-width: 1120px; }
.esic-app .table-boots-custom td:nth-child(-n+3), .esic-app .dashboard-table td:nth-child(-n+2) { white-space: nowrap; }
.esic-app .table-boots-custom td:nth-child(4) { min-width: 220px; }
.list-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 22px; }
.table-actions { display: flex; align-items: center; justify-content: center; gap: 6px; }
.esic-app .table-action { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; flex: 0 0 36px; border: 1px solid var(--ui-border); border-radius: 6px; background: #fff; color: #526174; font-size: 15px; text-decoration: none; }
.esic-app .table-action:hover, .esic-app .table-action:focus { color: var(--ui-blue); background: #edf3fb; border-color: #b9cee5; text-decoration: none; }
.esic-app .table-action-danger { color: #aa4545; }
.esic-app .table-action-danger:hover, .esic-app .table-action-danger:focus { color: #923737; background: #fbeeed; border-color: #e7bebb; }
.esic-app .table td:has(> .table-actions), .esic-app .table:has(.table-actions) th:last-child { width: 1%; white-space: nowrap; text-align: center; }
.status-badge { display: inline-block; padding: 3px 8px; border-radius: 4px; background: #edf1f5; color: #526174; font-size: 11px; font-weight: 600; white-space: nowrap; }
.status-ATENDIDA { background: #e9f5ef; color: #2b7353; }
.status-ABERTA { background: #edf3fb; color: #28609a; }
.page-content:has(> .dashboard) { padding: 0; border: 0; background: transparent; }
.metric-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; margin-bottom: 24px; }
.metric-card { position: relative; display: flex; flex-direction: column; padding: 18px; border: 1px solid var(--ui-border); border-radius: 8px; background: #fff; }
.metric-icon { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin-bottom: 14px; border-radius: 6px; background: #edf1f5; color: #627287; font-size: 15px; }
.metric-blue { background: #edf3fb; color: #3974ae; }
.metric-neutral { background: #edf1f5; color: #627287; }
.metric-green { background: #e9f5ef; color: #2b7353; }
.metric-red { background: #fbeeed; color: #b6534b; }
.metric-amber { background: #fff5e5; color: #96651c; }
.metric-label { color: var(--ui-muted); font-size: 12px; }
.metric-value { font-size: 28px; font-weight: 600; line-height: 1.3; margin-top: 4px; }
.dashboard-lists { display: grid; gap: 22px; }
.dashboard-panel { min-width: 0; padding: 22px; background: #fff; border: 1px solid var(--ui-border); border-radius: 8px; }
.esic-app .dashboard-panel h3 { font-size: 17px; font-weight: 600; margin: 0 0 20px; }
.dashboard-charts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 24px; }

/* Página inicial do cidadão. */
.page-content:has(> .citizen-dashboard) { padding: 0; border: 0; background: transparent; }
.citizen-dashboard { display: grid; gap: 22px; min-width: 0; }
.citizen-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 340px); gap: 22px; align-items: stretch; }
.citizen-hero-main { position: relative; overflow: hidden; min-height: 240px; padding: 30px; border-radius: 10px; background: linear-gradient(135deg, #174f83, #256da8); color: #fff; box-shadow: 0 16px 34px rgba(23, 79, 131, .15); }
.citizen-hero-main::after { content: ""; position: absolute; right: -62px; bottom: -88px; width: 280px; height: 280px; border: 34px solid rgba(255,255,255,.12); border-radius: 50%; }
.citizen-kicker { position: relative; z-index: 1; display: inline-flex; align-items: center; min-height: 28px; padding: 5px 12px; border-radius: 999px; background: rgba(255,255,255,.14); font-size: 12px; font-weight: 700; }
.esic-app .citizen-hero-main h2 { position: relative; z-index: 1; max-width: 700px; margin: 22px 0 12px; color: #fff; font-family: inherit; font-size: 31px; font-weight: 600; line-height: 1.25; letter-spacing: -.02em; }
.citizen-hero-main p { position: relative; z-index: 1; max-width: 690px; margin: 0 0 24px; color: rgba(255,255,255,.88); font-size: 15px; line-height: 1.65; }
.citizen-actions { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 10px; }
.esic-app .citizen-action-primary { background: #fff; border-color: #fff; color: #174f83; }
.esic-app .citizen-action-primary:hover, .esic-app .citizen-action-primary:focus { background: #f4f8fc; border-color: #f4f8fc; color: #174f83; }
.esic-app .citizen-action-secondary { border-color: rgba(255,255,255,.42); background: rgba(255,255,255,.1); color: #fff; }
.esic-app .citizen-action-secondary:hover, .esic-app .citizen-action-secondary:focus { background: rgba(255,255,255,.18); border-color: rgba(255,255,255,.55); color: #fff; }
.citizen-help-card, .citizen-panel, .citizen-metric { min-width: 0; background: #fff; border: 1px solid var(--ui-border); border-radius: 10px; }
.citizen-help-card { padding: 24px; }
.esic-app .citizen-help-card h3, .esic-app .citizen-panel-heading h3 { margin: 0; color: var(--ui-ink); font-family: inherit; font-size: 17px; font-weight: 600; }
.citizen-help-card p, .citizen-panel-heading p { margin: 7px 0 0; color: var(--ui-muted); font-size: 13px; line-height: 1.6; }
.citizen-help-card ul { list-style: none; margin: 18px 0; padding: 0; display: grid; gap: 10px; }
.citizen-help-card li { display: flex; gap: 9px; color: #4f6174; font-size: 13px; line-height: 1.45; }
.citizen-help-card li i { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 22px; height: 22px; border-radius: 50%; background: #e9f5ef; color: #2b7353; font-size: 11px; }
.citizen-help-link, .citizen-panel-link { color: var(--ui-blue); font-size: 13px; font-weight: 600; text-decoration: none; }
.citizen-help-link:hover, .citizen-panel-link:hover { color: #174f83; text-decoration: none; }
.citizen-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.citizen-metric { display: grid; grid-template-columns: 42px minmax(0, 1fr); grid-template-areas: "icon label" "icon value" "icon help"; column-gap: 14px; align-items: center; padding: 18px; }
.citizen-metric .metric-icon { grid-area: icon; width: 42px; height: 42px; margin: 0; border-radius: 10px; }
.citizen-metric .metric-label { grid-area: label; color: var(--ui-muted); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.citizen-metric .metric-value { grid-area: value; margin: 1px 0; font-size: 28px; line-height: 1.1; }
.citizen-metric small { grid-area: help; color: var(--ui-muted); font-size: 12px; }
.citizen-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 340px); gap: 22px; align-items: start; }
.citizen-side { display: grid; gap: 22px; }
.citizen-panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 20px 22px; border-bottom: 1px solid var(--ui-border); }
.citizen-request-list { display: grid; }
.citizen-request-item { display: grid; grid-template-columns: minmax(100px, 130px) minmax(0, 1fr) auto minmax(88px, 116px) 42px; gap: 16px; align-items: center; padding: 18px 22px; border-bottom: 1px solid #edf1f5; }
.citizen-request-item:last-child { border-bottom: 0; }
.citizen-request-protocol span, .citizen-request-deadline span { display: block; margin-bottom: 3px; color: var(--ui-muted); font-size: 11px; }
.citizen-request-protocol strong { color: #174f83; font-family: Consolas, monospace; font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.esic-app .citizen-request-main h4 { margin: 0 0 5px; color: var(--ui-ink); font-family: inherit; font-size: 14px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.citizen-request-main p { margin: 0; color: var(--ui-muted); font-size: 12px; }
.citizen-request-main i { margin-right: 5px; }
.citizen-request-deadline strong { font-size: 13px; font-weight: 600; white-space: nowrap; }
.citizen-request-action { justify-self: end; }
.citizen-empty { display: flex; flex-direction: column; align-items: center; padding: 34px 18px; text-align: center; }
.citizen-empty-compact { padding: 22px 18px; }
.citizen-empty > i { display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; margin-bottom: 14px; border-radius: 50%; background: #f3f6f9; color: #8796a7; font-size: 23px; }
.citizen-empty strong { font-weight: 600; }
.citizen-empty p { margin: 5px 0 16px; color: var(--ui-muted); font-size: 13px; }
.citizen-next-deadline { padding: 22px; }
.citizen-next-deadline > strong { display: block; margin: 14px 0 8px; font-size: 30px; line-height: 1; }
.citizen-next-deadline p { margin: 0 0 16px; color: #4f6174; line-height: 1.55; overflow-wrap: anywhere; }
.citizen-steps { counter-reset: citizen-step; display: grid; gap: 18px; margin: 0; padding: 22px; list-style: none; }
.citizen-steps li { counter-increment: citizen-step; position: relative; min-height: 42px; padding-left: 54px; }
.citizen-steps li::before { content: counter(citizen-step); position: absolute; left: 0; top: 0; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 9px; background: #edf3fb; color: var(--ui-blue); font-size: 13px; font-weight: 700; }
.citizen-steps strong { display: block; margin-bottom: 3px; font-weight: 600; }
.citizen-steps span { display: block; color: var(--ui-muted); font-size: 12px; line-height: 1.5; }
@media (max-width: 1200px) {
    .metric-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dashboard-charts { grid-template-columns: minmax(0, 1fr); }
    .citizen-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .citizen-hero, .citizen-layout { grid-template-columns: minmax(0, 1fr); }
    .citizen-side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1100px) { .esic-app #page-wrapper { padding: 24px; } .page-content { padding: 22px; } }
@media (max-width: 767px) {
    .esic-app .navbar-header { width: 100%; padding: 17px 18px; }
    .esic-app .navbar-header img { width: 190px; }
    .esic-app .navbar-toggle { margin: 2px 0 0 12px; border-color: #cbd6e2; border-radius: 6px; }
    .esic-app .navbar-toggle .icon-bar { background-color: var(--ui-ink); }
    .topbar-context { display: none; }
    .esic-app .sidebar { width: min(300px, calc(100vw - 48px)); bottom: 0; visibility: hidden; transform: translateX(-100%); transition: transform .18s ease, visibility .18s; border: 0; box-shadow: 8px 0 28px #142c431a; }
    .esic-app.menu-open { overflow: hidden; }
    .esic-app.menu-open .sidebar { visibility: visible; transform: translateX(0); }
    .sidebar-mobile-heading { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px 0; color: var(--ui-ink); }
    .sidebar-shortcut { padding-top: 12px; }
    .sidebar-backdrop:not([hidden]) { display: block; position: fixed; top: 68px; right: 0; bottom: 0; left: 0; background: #182d4566; z-index: 1; }
    .sidebar-menu { padding-bottom: 12px; }
    .esic-app .sidebar-submenu a { min-height: 42px; padding-top: 12px; padding-bottom: 12px; }
    .esic-app #page-wrapper { margin-left: 0; padding: 22px 14px; }
    .esic-app .page-heading h1 { font-size: 23px; }
    .page-content { padding: 20px 16px; border-radius: 9px; }
    .form-grid, .form-grid-code, .form-grid-four, .unit-options tbody { grid-template-columns: minmax(0, 1fr); }
    .form-grid { gap: 20px; }
    .esic-app .page-content .row > [class*="col-"] { margin-bottom: 16px; }
    .form-actions { flex-wrap: wrap; }
    .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .metric-card { padding: 15px; }
    .dashboard-panel { padding: 16px; }
    .citizen-hero-main { min-height: 0; padding: 24px 20px; }
    .esic-app .citizen-hero-main h2 { font-size: 25px; }
    .citizen-help-card { padding: 20px 16px; }
    .citizen-metrics, .citizen-side { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    .citizen-metric { padding: 16px; }
    .citizen-panel-heading { padding: 18px 16px; }
    .citizen-request-item { grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 18px 16px; }
    .citizen-request-protocol, .citizen-request-main, .citizen-request-deadline { grid-column: 1 / -1; }
    .citizen-request-status { grid-column: 1; }
    .citizen-request-action { grid-column: 2; grid-row: 4; }
    .citizen-next-deadline, .citizen-steps { padding: 18px 16px; }
    .esic-app .dataTables_filter { margin-top: 10px; }
    .esic-app .dataTables_wrapper input.form-control { width: 170px; }
    .esic-app .dataTables_wrapper .row > [class*="col-"] { margin-bottom: 0; }
    .selection-toolbar { align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) { .esic-app .sidebar, .menu-chevron { transition: none; } }

/* Relatório administrativo em HTML, pronto para impressão pelo navegador. */
.page-content:has(> .reports-page) { padding: 0; border: 0; background: transparent; }
.reports-page { display: grid; gap: 22px; }
.report-selector, .report-document { min-width: 0; background: #fff; border: 1px solid var(--ui-border); border-radius: 8px; }
.report-selector { padding: 24px; }
.report-selector-heading, .report-section-heading, .report-cover { display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; }
.report-selector-heading h2, .report-cover h2, .report-section h3 { margin: 0; font-family: inherit; color: var(--ui-ink); font-weight: 600; line-height: 1.3; }
.report-selector-heading h2, .report-cover h2 { font-size: 24px; }
.report-section h3 { font-size: 18px; }
.report-selector-heading p, .report-subtitle { margin: 7px 0 0; color: var(--ui-muted); }
.report-kicker { margin: 0 0 6px; color: var(--ui-muted); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.report-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; flex-shrink: 0; }
.report-actions .btn { min-height: 40px; }
.report-actions i { margin-right: 6px; }
.report-filter-box { margin: 24px 0 0; }
.report-filter-box legend { font-size: 15px; margin-bottom: 16px; }
.report-document { padding: 30px; }
.report-cover { padding-bottom: 24px; border-bottom: 1px solid var(--ui-border); }
.report-filter-summary { display: grid; grid-template-columns: repeat(2, minmax(130px, 1fr)); gap: 12px 18px; min-width: 360px; margin: 0; }
.report-filter-summary div { min-width: 0; }
.report-filter-summary dt { color: var(--ui-muted); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; }
.report-filter-summary dd { margin: 3px 0 0; color: var(--ui-ink); font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.report-metrics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin: 24px 0; }
.report-metric { min-width: 0; padding: 16px; border: 1px solid #dfe6ee; border-radius: 7px; background: #f8fafc; }
.report-metric span, .report-metric small { display: block; color: var(--ui-muted); font-size: 12px; }
.report-metric strong { display: block; margin: 4px 0 2px; color: var(--ui-ink); font-size: 28px; font-weight: 600; line-height: 1.2; }
.report-section { margin-top: 28px; }
.report-section-heading { margin-bottom: 16px; }
.report-grid-sections { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.report-grid-sections .report-section { min-width: 0; margin-top: 0; }
.report-wide-section { grid-column: 1 / -1; }
.report-summary-table th:nth-child(2), .report-summary-table td:nth-child(2), .report-summary-table th:nth-child(3), .report-summary-table td:nth-child(3) { width: 150px; }
.report-bar { position: relative; height: 8px; margin-bottom: 5px; overflow: hidden; border-radius: 999px; background: #e8edf3; }
.report-bar span { display: block; height: 100%; min-width: 2px; max-width: 100%; border-radius: inherit; background: #3974ae; }
.report-percent { color: var(--ui-muted); font-size: 12px; }
.report-note { margin: 12px 0 0; color: var(--ui-muted); font-size: 12px; }
.report-callout { display: flex; flex-direction: column; gap: 6px; padding: 16px; border: 1px solid #dfe6ee; border-radius: 7px; background: #f8fafc; }
.report-callout strong { color: var(--ui-ink); font-size: 24px; line-height: 1.2; }
.report-callout span { color: var(--ui-muted); font-size: 12px; }
.report-callout-muted strong { font-size: 16px; }
.report-providences-table { min-width: 980px; }
.report-providences-table td:last-child { min-width: 260px; white-space: pre-wrap; }
.report-items-table { min-width: 1120px; }
.report-items-table td:first-child { font-family: Consolas, monospace; white-space: nowrap; }
.report-items-table td:nth-child(2) strong, .report-items-table td:nth-child(2) span { display: block; }
.report-items-table td:nth-child(2) span { margin-top: 4px; color: var(--ui-muted); font-size: 12px; }
.report-empty { display: flex; flex-direction: column; align-items: center; padding: 46px 20px; text-align: center; }
.report-empty i { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-bottom: 14px; border-radius: 50%; background: #f1f5f9; color: #8796a7; font-size: 22px; }
.report-empty strong { font-size: 16px; font-weight: 600; }
.report-empty p { margin: 5px 0 0; color: var(--ui-muted); }
.report-output-page { min-height: 100vh; margin: 0; background: #e9edf2; color: var(--ui-ink); font: 14px/1.55 "Segoe UI", Arial, sans-serif; }
.report-output { max-width: 1120px; margin: 0 auto; padding: 72px 28px 44px; }
.report-output .report-document { box-shadow: 0 18px 45px #1f2d3d1c; }
.report-output .report-cover h1 { margin: 0; font-family: inherit; font-size: 28px; font-weight: 600; line-height: 1.25; color: var(--ui-ink); }
.report-output-actions { position: fixed; top: 0; left: 0; right: 0; z-index: 20; display: flex; justify-content: flex-end; gap: 8px; padding: 14px 28px; background: #fff; border-bottom: 1px solid var(--ui-border); box-shadow: 0 1px 4px #1f2d3d14; }
.report-output-actions i { margin-right: 6px; }
.report-organization { display: flex; align-items: center; gap: 18px; margin-bottom: 24px; padding-bottom: 20px; border-bottom: 1px solid var(--ui-border); }
.report-organization-logo { display: block; flex: 0 0 auto; max-width: 120px; max-height: 82px; object-fit: contain; }
.report-organization-logo[hidden] { display: none; }
.report-organization-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.report-organization-text strong { color: var(--ui-ink); font-size: 19px; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
.report-organization-text span { color: var(--ui-muted); font-size: 12px; line-height: 1.35; overflow-wrap: anywhere; }
.report-break-after { break-after: page; page-break-after: always; }
.report-request { margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--ui-border); break-inside: avoid; page-break-inside: avoid; }
.report-request:first-child { margin-top: 0; }
.report-request-heading { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; margin-bottom: 18px; }
.report-request-group { margin: 0 0 5px; color: var(--ui-muted); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.report-request h3 { margin: 0; font-family: inherit; font-size: 18px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.report-request-date { flex-shrink: 0; padding: 5px 9px; border-radius: 5px; background: #f1f5f9; color: #506174; font-size: 12px; font-weight: 600; }
.report-request-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 18px; margin: 0; }
.report-request-grid div { min-width: 0; }
.report-request-grid dt { color: var(--ui-muted); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.report-request-grid dd { margin: 3px 0 0; overflow-wrap: anywhere; }
.report-request-text { margin-top: 18px; padding: 16px; border: 1px solid #e2e8f0; border-radius: 7px; background: #fafbfd; }
.report-request-text h4 { margin: 0 0 9px; font-family: inherit; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #4b6076; }
.report-request-text p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.75; }
@media (max-width: 1200px) {
    .report-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .report-selector-heading, .report-cover { flex-direction: column; }
    .report-actions { justify-content: flex-start; }
    .report-filter-summary { width: 100%; min-width: 0; }
    .report-grid-sections { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
    .report-selector, .report-document { padding: 18px 16px; }
    .report-selector-heading h2, .report-cover h2 { font-size: 21px; }
    .report-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .report-metric { padding: 14px; }
    .report-filter-summary { grid-template-columns: minmax(0, 1fr); }
    .report-output { padding: 76px 14px 28px; }
    .report-output-actions { padding: 12px 14px; }
    .report-organization { align-items: flex-start; flex-direction: column; }
    .report-organization-logo { max-width: 96px; max-height: 72px; }
    .report-request-grid { grid-template-columns: minmax(0, 1fr); }
    .report-request-heading { flex-direction: column; }
}

@media print {
    @page { margin: 12mm; }
    body, .esic-app, .report-output-page { background: #fff !important; color: #111827 !important; font-size: 11px; }
    .esic-app .navbar-static-top, .sidebar, .sidebar-backdrop, .skip-link, .page-heading, .report-controls { display: none !important; }
    .report-output-actions { display: none !important; }
    .esic-app #page-wrapper { margin: 0 !important; padding: 0 !important; min-height: 0 !important; }
    .page-content, .page-content:has(> .reports-page) { padding: 0 !important; border: 0 !important; background: #fff !important; }
    .reports-page, .report-document { display: block !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; box-shadow: none !important; }
    .report-output { max-width: none !important; padding: 0 !important; }
    .report-output .report-cover h1 { font-size: 20px; }
    .report-organization { margin-bottom: 14px; padding-bottom: 12px; }
    .report-organization-logo { max-width: 86px; max-height: 58px; }
    .report-organization-text strong { font-size: 15px; }
    .report-organization-text span { font-size: 10px; }
    .report-cover, .report-section { break-inside: avoid; page-break-inside: avoid; }
    .report-cover { padding-bottom: 14px; }
    .report-filter-summary { min-width: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .report-grid-sections { display: block; }
    .report-grid-sections .report-section { margin-top: 16px; }
    .report-metrics { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; margin: 14px 0; }
    .report-metric { padding: 8px; background: #fff; border-color: #cfd8e3; }
    .report-metric strong { font-size: 18px; }
    .table-scroll { overflow: visible !important; }
    .report-items-table, .report-summary-table, .report-providences-table { min-width: 0 !important; font-size: 10px; }
    .esic-app .table > thead > tr > th, .esic-app .table > tbody > tr > td { padding: 6px; border-color: #d9e0e8; }
    .esic-app a { color: inherit !important; text-decoration: none !important; }
    .report-request { margin-top: 18px; padding-top: 18px; }
    .report-request-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 12px; }
    .report-request-text { padding: 10px; border-radius: 0; }
}

/* Detalhes da solicitação: resumo, conteúdo e contexto do atendimento. */
.page-content:has(> .request-details) { padding: 0; border: 0; background: transparent; }
.request-details { min-width: 0; }
.request-back { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 18px; font-size: 13px; }
.request-messages { padding: 0; list-style: none; }
.request-card { min-width: 0; padding: 24px; background: #fff; border: 1px solid var(--ui-border); border-radius: 9px; }
.request-summary { margin-bottom: 22px; }
.request-summary-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.request-protocol { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 10px; min-width: 0; font-size: 12px; }
.request-protocol > span { color: var(--ui-muted); }
.request-protocol strong { font-family: Consolas, monospace; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.request-summary .status-badge { padding: 5px 10px; border-radius: 5px; }
.status-ABERTO { background: #edf3fb; color: #28609a; }
.status-NEGADA { background: #fbeeed; color: #a7453e; }
.status-PRORROGADA, .status-RECURSO { background: #fff5e5; color: #8d601e; }
.esic-app .request-summary h2 { margin: 18px 0 10px; font-family: inherit; font-size: 24px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.request-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; color: var(--ui-muted); font-size: 13px; }
.request-tags i { margin-right: 5px; }
.request-type { padding-left: 14px; border-left: 1px solid var(--ui-border); }
.request-summary-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; margin-top: 22px; padding-top: 20px; border-top: 1px solid #edf0f3; }
.request-dates { display: flex; flex-wrap: wrap; gap: 14px 28px; margin: 0; }
.request-details dt { color: var(--ui-muted); font-size: 12px; font-weight: 400; margin-bottom: 4px; }
.request-details dd { margin: 0; font-size: 14px; overflow-wrap: anywhere; }
.request-dates dd { font-weight: 600; }
.request-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.request-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 310px); align-items: start; gap: 22px; }
.request-main, .request-sidebar { display: grid; min-width: 0; gap: 22px; }
.esic-app .request-section-title { display: flex; align-items: center; gap: 10px; margin: 0 0 22px; font-family: inherit; font-size: 16px; font-weight: 600; line-height: 1.4; }
.request-section-title > i { color: #7c8c9e; font-size: 17px; }
.request-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.8; color: #435164; }
.request-facts { display: grid; gap: 18px; margin: 0; }
.request-facts:not(:has(> div)) { display: none; }
.request-registration { margin-top: 20px; padding-top: 16px; border-top: 1px solid #edf0f3; font-size: 12px; color: var(--ui-muted); overflow-wrap: anywhere; }
.request-registration > span { display: block; }
.request-person-name { margin-bottom: 5px; font-weight: 600; overflow-wrap: anywhere; }
.request-hint { margin: 0; color: var(--ui-muted); font-size: 12px; }
.request-person-name + .request-facts:has(> div), .request-hint + .request-facts:has(> div) { margin-top: 18px; }
.request-person-details { margin-top: 20px; padding-top: 16px; border-top: 1px solid #edf0f3; }
.request-person-details summary { display: flex; justify-content: space-between; gap: 12px; cursor: pointer; color: var(--ui-blue); font-size: 13px; list-style: none; }
.request-person-details summary::-webkit-details-marker { display: none; }
.request-person-details summary::after { content: "+"; font-weight: 600; }
.request-person-details[open] summary::after { content: "−"; }
.request-person-details[open] summary { margin-bottom: 18px; }
.request-count { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; padding: 3px 7px; border-radius: 5px; background: #f0f3f7; color: #627287; font-size: 12px; }
.request-empty { display: flex; flex-direction: column; align-items: center; padding: 14px 10px 22px; text-align: center; }
.request-empty > i { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-bottom: 14px; border-radius: 50%; background: #f3f6f9; color: #8897a8; font-size: 23px; }
.request-empty strong { font-weight: 600; }
.request-empty p { margin: 5px 0 0; font-size: 13px; color: var(--ui-muted); }
.request-message { padding: 22px 0; border-top: 1px solid #edf0f3; }
.request-message:first-child { padding-top: 0; border-top: 0; }
.request-message:last-child { padding-bottom: 0; }
.request-message-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.request-message-avatar { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 36px; height: 36px; border-radius: 50%; background: #edf3fb; color: #5780aa; }
.request-message-author { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.request-message-author strong { display: block; font-size: 13px; font-weight: 600; }
.request-message-author > span { display: block; margin-top: 2px; font-size: 12px; color: var(--ui-muted); }
.request-attachment { margin-top: 16px; }
.request-attachment a { display: inline-flex; align-items: center; gap: 9px; padding: 8px 12px; background: #f5f7fa; border: 1px solid var(--ui-border); border-radius: 6px; font-size: 12px; }
.request-message-visibility { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-top: 16px; padding: 12px 14px; background: #f7f9fb; border-radius: 6px; font-size: 12px; }
.request-message-visibility > span { color: var(--ui-muted); }
.request-message-visibility i { margin-right: 5px; }
.request-details a:focus-visible, .request-person-details summary:focus-visible { outline: 2px solid var(--ui-blue); outline-offset: 3px; }
@media (max-width: 1150px) {
    .request-layout { grid-template-columns: minmax(0, 1fr); }
    .request-sidebar { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
}
@media (max-width: 767px) {
    .request-card { padding: 20px 16px; }
    .request-summary, .request-main, .request-sidebar { gap: 16px; }
    .request-summary { margin-bottom: 16px; }
    .request-layout { gap: 16px; }
    .request-sidebar { grid-template-columns: minmax(0, 1fr); }
    .request-summary-top { align-items: flex-start; }
    .request-protocol { flex-direction: column; gap: 3px; }
    .request-protocol strong { max-width: 100%; font-size: 12px; }
    .esic-app .request-summary h2 { font-size: 21px; }
    .request-dates { gap: 14px 22px; }
    .request-actions { width: 100%; }
    .request-actions .btn { flex: 1 1 auto; }
    .request-message-visibility { align-items: flex-start; flex-direction: column; }
}