/* ============================================================
   Central de Solicitações Administrativas — Painel de Gestão
   Paleta e tipografia seguem a identidade visual já em uso na página
   "Central de Solicitações Administrativas" do próprio site (referência
   mais fiel do que o Template Institucional de apresentações, que usa
   fonte diferente): fonte Barlow Condensed (títulos) + Barlow (texto) ·
   navy #102569 · coral #FA5F41 · vinho #991F62 · creme #F1E9D7
   ============================================================ */

.tpe-central {
	--tc-orange: #FA5F41;
	--tc-navy: #102569;
	--tc-wine: #991F62;
	--tc-cream: #F1E9D7;
	--tc-white: #ffffff;
	--tc-gray: #f7f5f2;
	--tc-border: #e3ddd0;
	--tc-text: #1a1a1a;
	--tc-muted: #6b6459;
	--tc-green: #2E7D32;
	--tc-green-bg: #DCFCE7;
	--tc-orange-bg: #FEF0EC;
	--tc-radius: 10px;

	font-family: 'Barlow', sans-serif;
	color: var(--tc-text);
	width: 100%;
	margin: 0 auto;
}
.tpe-central *, .tpe-central *::before, .tpe-central *::after { box-sizing: border-box; }

.tc-frame {
	border-top: 3px solid var(--tc-orange);
	border-radius: var(--tc-radius);
	overflow: hidden;
	box-shadow: 0 4px 24px rgba(16,37,105,.08);
}

.tpe-central--locked {
	background: var(--tc-gray, #f7f5f2);
	border-left: 4px solid #FA5F41;
	padding: 24px 28px;
	font-family: 'Barlow', sans-serif;
}

/* Header */
.tc-header {
	background: var(--tc-navy);
	color: var(--tc-cream);
	padding: 28px 32px;
	border-radius: var(--tc-radius) var(--tc-radius) 0 0;
}
.tc-header-eyebrow {
	font-family: 'Barlow', sans-serif;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 3px;
	text-transform: uppercase;
	color: var(--tc-orange);
	margin-bottom: 8px;
}
.tc-header-title {
	font-family: 'Barlow', sans-serif;
	font-weight: 900;
	font-size: 34px;
	text-transform: uppercase;
	line-height: 1;
	margin: 0 0 8px;
	color: var(--tc-white);
}
.tc-header-sub { font-size: 14px; color: rgba(241,233,215,.78); margin: 0; font-weight: 500; }

/* KPIs */
.tc-kpis {
	display: flex; gap: 14px; flex-wrap: wrap;
	background: var(--tc-white);
	padding: 20px 32px;
	border-left: 1px solid var(--tc-border);
	border-right: 1px solid var(--tc-border);
}
.tc-kpi {
	flex: 1; min-width: 130px;
	background: var(--tc-gray);
	border-radius: var(--tc-radius);
	padding: 14px 18px;
	text-align: center;
	border-top: 3px solid var(--tc-navy);
}
.tc-kpi--aberto { border-top-color: var(--tc-orange); }
.tc-kpi--tratando { border-top-color: #C9962B; }
.tc-kpi--concluido { border-top-color: var(--tc-green); }
.tc-kpi--compras { border-top-color: var(--tc-wine); }
.tc-kpi-num { font-family: 'Barlow', sans-serif; font-weight: 900; font-size: 30px; color: var(--tc-navy); line-height: 1; }
.tc-kpi-lbl { font-size: 11px; color: var(--tc-muted); margin-top: 4px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; }

/* Tabs */
.tc-tabs {
	display: flex; gap: 4px; flex-wrap: wrap;
	background: var(--tc-white);
	padding: 0 32px;
	border-left: 1px solid var(--tc-border);
	border-right: 1px solid var(--tc-border);
	border-bottom: 1px solid var(--tc-border);
}
.tc-tab {
	background: none; border: none; cursor: pointer;
	font-family: 'Barlow', sans-serif;
	font-weight: 700; font-size: 14px; letter-spacing: .3px;
	color: var(--tc-muted);
	padding: 12px 16px;
	border-bottom: 3px solid transparent;
	transition: all .15s;
}
.tc-tab:hover { color: var(--tc-navy); }
.tc-tab.active { color: var(--tc-wine); border-bottom-color: var(--tc-wine); }

/* Panels */
.tc-panel {
	display: none;
	background: var(--tc-white);
	border: 1px solid var(--tc-border);
	border-top: none;
	border-radius: 0 0 var(--tc-radius) var(--tc-radius);
	padding: 20px 32px 32px;
}
.tc-panel.active { display: block; }

/* Toolbar */
.tc-toolbar { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; align-items: center; }
.tc-input, .tc-select {
	border: 1.5px solid var(--tc-border);
	border-radius: 8px;
	padding: 8px 12px;
	font-size: 13px;
	font-family: 'Barlow', sans-serif;
	background: var(--tc-white);
}
.tc-input { flex: 1; min-width: 220px; }
.tc-input:focus, .tc-select:focus { outline: none; border-color: var(--tc-navy); }

.tc-btn {
	font-family: 'Barlow', sans-serif;
	font-weight: 700; font-size: 13px; letter-spacing: .5px; text-transform: uppercase;
	border-radius: 8px; padding: 9px 16px; border: none; cursor: pointer;
	white-space: nowrap;
}
.tc-btn--primary { background: var(--tc-navy); color: var(--tc-white); }
.tc-btn--primary:hover { background: var(--tc-wine); }
.tc-btn--ghost { background: var(--tc-gray); color: var(--tc-navy); border: 1.5px solid var(--tc-border); }
.tc-btn--ghost:hover { background: #ece5d6; }

/* Table */
.tc-table-wrap { overflow-x: auto; }
.tc-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.tc-table thead th {
	background: var(--tc-navy); color: var(--tc-cream);
	padding: 10px 12px; text-align: left; white-space: nowrap;
	font-family: 'Barlow', sans-serif; font-weight: 700; font-size: 11px;
	text-transform: uppercase; letter-spacing: .5px;
}
.tc-table tbody tr { cursor: pointer; transition: background .12s; }
.tc-table tbody tr:hover { background: var(--tc-gray); }
.tc-table tbody tr:not(:last-child) td { border-bottom: 1px solid var(--tc-border); }
.tc-table td { padding: 10px 12px; vertical-align: middle; }
.tc-table td.tc-id { font-weight: 800; color: var(--tc-navy); }

.tc-badge {
	display: inline-block; padding: 3px 10px; border-radius: 99px;
	font-size: 11px; font-weight: 700; white-space: nowrap;
}
.tc-badge--aberto { background: #DBEAFE; color: #1E40AF; }
.tc-badge--tratando { background: #FEF3C7; color: #92400E; }
.tc-badge--concluido { background: var(--tc-green-bg); color: #166534; }
.tc-badge--outro { background: #EDE9FE; color: #5B21B6; }

.tc-stars { color: var(--tc-orange); letter-spacing: 1px; }

.tc-loading, .tc-empty { text-align: center; padding: 40px; color: var(--tc-muted); font-size: 14px; }
.tc-spinner {
	display: inline-block; width: 16px; height: 16px;
	border: 2px solid var(--tc-border); border-top-color: var(--tc-navy);
	border-radius: 50%; animation: tc-spin .7s linear infinite; vertical-align: -3px;
}
@keyframes tc-spin { to { transform: rotate(360deg); } }
.tc-error { background: #FFF5F5; border: 1px solid #FED7D7; color: #C53030; padding: 14px 16px; border-radius: 8px; font-size: 13px; }

/* Modal */
.tc-overlay {
	position: fixed; inset: 0; background: rgba(16,37,105,.55);
	display: none; align-items: center; justify-content: center; z-index: 9999; padding: 16px;
}
.tc-overlay.open { display: flex; }
.tc-modal {
	background: var(--tc-white); border-radius: 12px; width: 100%; max-width: 680px; max-height: 88vh;
	display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,.35);
	font-family: 'Barlow', sans-serif;
}
.tc-modal-head { padding: 18px 22px; border-bottom: 1px solid var(--tc-border); display: flex; justify-content: space-between; gap: 12px; background: var(--tc-gray); }
.tc-modal-head h3 { font-family: 'Barlow', sans-serif; font-weight: 800; font-size: 18px; color: var(--tc-navy); margin: 0; text-transform: uppercase; }
.tc-modal-sub { font-size: 12px; color: var(--tc-muted); margin-top: 2px; }
.tc-modal-close { background: none; border: none; font-size: 20px; cursor: pointer; color: var(--tc-muted); line-height: 1; }
.tc-modal-body { padding: 20px 22px; overflow-y: auto; flex: 1; }
.tc-modal-foot { padding: 14px 22px; border-top: 1px solid var(--tc-border); display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.tc-readonly-note { font-size: 11px; color: var(--tc-muted); font-style: italic; }

.tc-det-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.tc-det-item { background: var(--tc-gray); border-radius: 8px; padding: 10px 12px; }
.tc-det-item .tc-dk { font-size: 10px; color: var(--tc-muted); text-transform: uppercase; letter-spacing: .4px; margin-bottom: 2px; font-weight: 700; }
.tc-det-item .tc-dv { font-size: 13px; font-weight: 500; word-break: break-word; }

@media (max-width: 720px) {
	.tc-header, .tc-kpis, .tc-tabs, .tc-panel { padding-left: 16px; padding-right: 16px; }
	.tc-det-grid { grid-template-columns: 1fr; }
}

/* Avaliar Atendimento */
.tc-aval-stars { display: flex; gap: 6px; justify-content: center; margin: 20px 0 4px; }
.tc-aval-star {
	font-size: 40px; line-height: 1; cursor: pointer; color: var(--tc-border);
	transition: color .12s, transform .12s; user-select: none;
}
.tc-aval-star:hover { transform: scale(1.08); }
.tc-aval-star--on { color: var(--tc-orange); }
.tc-aval-comment {
	display: block; width: 100%; box-sizing: border-box; margin-top: 16px; padding: 10px 12px;
	border: 1px solid var(--tc-border); border-radius: 8px; font-family: 'Barlow', sans-serif;
	font-size: 14px; color: var(--tc-text); resize: vertical;
}
.tc-aval-comment:focus { outline: none; border-color: var(--tc-navy); }
.tc-aval-err { color: #C53030; font-size: 13px; margin-top: 8px; }
.tc-aval-submit {
	display: block; width: 100%; margin-top: 16px; padding: 12px 18px; border: none;
	background: var(--tc-orange); color: var(--tc-white); border-radius: 8px;
	font-family: 'Barlow', sans-serif; font-weight: 700; font-size: 15px; cursor: pointer;
	transition: opacity .12s;
}
.tc-aval-submit:disabled { opacity: .5; cursor: not-allowed; }
.tc-aval-submit:not(:disabled):hover { opacity: .9; }