/* =====================================================================
   Central de Demandas, folha de estilo principal
   Identidade: roxo #7000F5, superfícies brancas sobre #F8F9FC,
   bordas discretas, sombras leves e badges em pílula.
   ===================================================================== */

:root {
  --bg: #F8F9FC;
  --surface: #FFFFFF;
  --surface-2: #FBFBFD;
  --primary: #7000F5;
  --primary-2: #8B32FF;
  --primary-soft: #F3EAFF;
  --primary-softer: #FAF7FF;
  --primary-ring: rgba(112, 0, 245, .12);
  --border: #E6E9F0;
  --border-input: #E1E5EC;
  --divider: #EEF0F5;

  --text: #121829;
  --text-2: #667085;
  --text-3: #98A2B3;
  --text-strong: #273047;

  --success: #08A657;
  --success-text: #0A8A4A;
  --success-bg: #E3F5EB;
  --warning: #F59E0B;
  --warning-text: #B45309;
  --warning-bg: #FEF3DD;
  --danger: #E63950;
  --danger-text: #C8364B;
  --danger-bg: #FCE9EC;
  --info: #356DF3;
  --info-text: #2F5FD0;
  --info-bg: #E8EFFE;

  --radius: 14px;
  --radius-sm: 10px;
  --radius-xs: 8px;
  --shadow: 0 1px 2px rgba(16, 24, 40, .025), 0 8px 24px rgba(16, 24, 40, .035);
  --shadow-hover: 0 4px 8px rgba(16, 24, 40, .04), 0 16px 32px rgba(16, 24, 40, .07);
  --shadow-pop: 0 16px 40px rgba(24, 25, 26, .16);
  --t: .18s ease;

  --sidebar-w: 264px;
  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ---------------------------------------------------------------------
   Base
   --------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(102, 112, 133, .42) transparent;
}
*::-webkit-scrollbar { width: 6px; height: 6px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb {
  min-width: 36px; min-height: 36px;
  border-radius: 999px;
  background: rgba(102, 112, 133, .38);
}
*::-webkit-scrollbar-thumb:hover { background: rgba(102, 112, 133, .58); }
*::-webkit-scrollbar-corner { background: transparent; }
*::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
html { background: var(--bg); -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: .92rem;
  line-height: 1.5;
  color: var(--text);
  background: radial-gradient(circle at 60% -10%, rgba(112, 0, 245, .045), transparent 38%), var(--bg);
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--primary); text-decoration: none; }
a:hover { color: var(--primary-2); }
h1, h2, h3 { margin: 0; line-height: 1.25; }
p { margin: 0; }
img { max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }

.text-muted { color: var(--text-2); }
.text-danger { color: var(--danger-text); }
.small { font-size: .8rem; }
.nowrap { white-space: nowrap; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------------------------------------------------------------------
   Estrutura: sidebar + conteúdo
   --------------------------------------------------------------------- */
.app { display: flex; min-height: 100vh; }

.sidebar {
  position: fixed; inset: 0 auto 0 0; z-index: 40;
  width: var(--sidebar-w);
  display: flex; flex-direction: column;
  background: var(--surface);
  box-shadow: 0 0 24px rgba(24, 25, 26, .06);
  transition: transform .25s ease;
}
.brand {
  display: flex; align-items: center; gap: .7rem;
  padding: 1.5rem 1.4rem 1.4rem;
  color: var(--text);
}
.brand:hover { color: var(--text); }
.brand-mark {
  width: 38px; height: 38px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 11px;
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  color: #fff; font-size: 1.1rem;
  box-shadow: 0 6px 14px rgba(112, 0, 245, .22);
}
.brand-mark.lg { width: 54px; height: 54px; border-radius: 15px; font-size: 1.5rem; }
.brand-text { display: flex; flex-direction: column; min-width: 0; }
.brand-text strong { font-size: .98rem; font-weight: 700; letter-spacing: -.01em; }
.brand-text small { font-size: .74rem; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.nav { flex: 1; overflow-y: auto; padding: .2rem 1rem 1rem; display: flex; flex-direction: column; gap: .2rem; }
.nav-label {
  font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .09em;
  color: var(--text-3);
  padding: 1rem .9rem .45rem;
}
.nav-label:first-child { padding-top: .3rem; }
.nav a {
  display: flex; align-items: center; gap: .75rem;
  min-height: 42px; padding: .6rem .9rem;
  border-radius: var(--radius-sm);
  color: var(--text-2); font-weight: 500; font-size: .88rem;
  transition: background var(--t), color var(--t), box-shadow var(--t);
}
.nav a i { font-size: 1.02rem; width: 1.2rem; text-align: center; }
.nav a span:not(.nav-count) { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nav a:hover { background: var(--primary-softer); color: var(--primary); }
.nav a.active {
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  color: #fff; font-weight: 600;
  box-shadow: 0 6px 16px rgba(112, 0, 245, .18);
}
.nav-count {
  min-width: 22px; height: 20px; padding: 0 .45rem;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px;
  background: var(--divider); color: var(--text-2);
  font-size: .7rem; font-weight: 700; font-variant-numeric: tabular-nums;
}
.nav-count.is-alert { background: var(--warning-bg); color: var(--warning-text); }
.nav a.active .nav-count { background: rgba(255, 255, 255, .22); color: #fff; }

.sidebar-footer {
  display: flex; align-items: center; gap: .4rem;
  margin: 0 1rem; padding: 1rem .2rem 1.2rem;
  border-top: 1px solid var(--border);
}
.sidebar-footer form { margin: 0; }
.user-chip { display: flex; align-items: center; gap: .65rem; flex: 1; min-width: 0; padding: .25rem; border-radius: var(--radius-xs); }
.user-chip:hover { background: var(--primary-softer); }
.user-info { display: flex; flex-direction: column; min-width: 0; }
.user-name { font-size: .84rem; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-role { font-size: .72rem; color: var(--text-2); }
.user-chip:hover .user-name { color: var(--primary); }

.sidebar-backdrop { display: none; }

.main { flex: 1; min-width: 0; margin-left: var(--sidebar-w); display: flex; flex-direction: column; }

/* Barra superior */
.topbar {
  display: flex; align-items: center; gap: 1rem;
  padding: 1.35rem 0 1.1rem;
  margin: 0 2rem;
  border-bottom: 1px solid var(--border);
}
.icon-btn.topbar-toggle { display: none; }
.topbar-titles { flex: 1; min-width: 0; }
.page-title { font-size: 1.55rem; font-weight: 700; letter-spacing: -.02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-subtitle { font-size: .84rem; color: var(--text-3); margin-top: .15rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topbar-tools { display: flex; align-items: center; gap: .75rem; }
.topbar-date { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.25; padding-left: .4rem; }
.topbar-date span { font-size: .64rem; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; color: var(--text-3); }
.topbar-date strong { font-size: .86rem; font-weight: 600; }

.content { padding: 1.6rem 2rem 3rem; display: flex; flex-direction: column; gap: 1.25rem; }

/* Busca global */
.global-search { position: relative; width: 280px; }
.global-search > i { position: absolute; left: .85rem; top: 50%; transform: translateY(-50%); color: var(--text-3); pointer-events: none; }
.global-search input {
  width: 100%; height: 40px; padding: 0 .9rem 0 2.3rem;
  border: 1px solid var(--border-input); border-radius: var(--radius-sm);
  background: var(--surface); font-size: .85rem;
  transition: border-color var(--t), box-shadow var(--t);
}
.global-search input:hover { border-color: #CDB1FF; }
.global-search input:focus { outline: none; border-color: var(--primary-2); box-shadow: 0 0 0 3px var(--primary-ring); }
.search-results {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 60;
  min-width: 320px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow-pop); padding: .4rem; max-height: 420px; overflow-y: auto;
}
.search-item { display: flex; align-items: center; gap: .6rem; padding: .55rem .6rem; border-radius: var(--radius-xs); color: var(--text); }
.search-item:hover, .search-item.is-active { background: var(--primary-softer); color: var(--text); }
.search-item-text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.search-item-text strong { font-size: .85rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.search-item-text small { font-size: .74rem; color: var(--text-2); }
.search-empty { padding: .8rem; font-size: .82rem; color: var(--text-2); text-align: center; }
.search-all { display: block; text-align: center; font-size: .8rem; font-weight: 600; padding: .5rem; border-top: 1px solid var(--divider); margin-top: .3rem; }

/* ---------------------------------------------------------------------
   Botões
   --------------------------------------------------------------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  height: 40px; padding: 0 1rem;
  border: 1px solid transparent; border-radius: var(--radius-sm);
  font-size: .86rem; font-weight: 600; white-space: nowrap;
  text-decoration: none; cursor: pointer;
  transition: background var(--t), border-color var(--t), color var(--t), box-shadow var(--t), transform var(--t);
}
.btn:disabled { opacity: .6; cursor: not-allowed; }
.btn-primary {
  background: linear-gradient(135deg, var(--primary), var(--primary-2)); color: #fff;
  box-shadow: 0 6px 16px rgba(112, 0, 245, .18);
}
.btn-primary:hover { color: #fff; transform: translateY(-1px); box-shadow: 0 8px 20px rgba(112, 0, 245, .24); }
.btn-primary:active { transform: none; }
.btn-light { background: var(--surface); border-color: var(--border-input); color: var(--text-strong); }
.btn-light:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-softer); }
.btn-light.has-filters { border-color: var(--primary); color: var(--primary); background: var(--primary-soft); }
.btn-success { background: var(--success); color: #fff; box-shadow: 0 6px 16px rgba(8, 166, 87, .18); }
.btn-success:hover { color: #fff; background: #07964E; }
.btn-danger { background: var(--danger); color: #fff; }
.btn-danger:hover { color: #fff; background: #D22F45; }
.btn-outline-danger { background: var(--surface); border-color: #F3B5BF; color: var(--danger-text); }
.btn-outline-danger:hover { background: var(--danger-bg); border-color: var(--danger); color: var(--danger-text); }
.btn-sm { height: 32px; padding: 0 .75rem; font-size: .8rem; border-radius: var(--radius-xs); }
.btn-lg { height: 46px; padding: 0 1.3rem; font-size: .92rem; }
.btn-block { width: 100%; }
.btn-count {
  min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px;
  background: var(--primary); color: #fff; font-size: .68rem; display: inline-flex; align-items: center; justify-content: center;
}
.btn.is-loading { position: relative; color: transparent !important; pointer-events: none; }
.btn.is-loading::after {
  content: ''; position: absolute; width: 16px; height: 16px;
  border: 2px solid rgba(255, 255, 255, .6); border-top-color: #fff; border-radius: 50%;
  animation: spin .7s linear infinite;
}
.btn-light.is-loading::after, .btn-outline-danger.is-loading::after { border-color: var(--border); border-top-color: var(--primary); }
@keyframes spin { to { transform: rotate(360deg); } }

.icon-btn {
  width: 36px; height: 36px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid transparent; border-radius: var(--radius-sm);
  background: transparent; color: var(--text-2); font-size: 1rem;
  transition: background var(--t), color var(--t), border-color var(--t);
}
.icon-btn:hover { background: var(--primary-soft); color: var(--primary); }
.icon-btn.sm { width: 30px; height: 30px; font-size: .88rem; border-radius: var(--radius-xs); background: var(--divider); }
.icon-btn.sm:hover { background: var(--primary); color: #fff; }
.icon-btn.xs { width: 24px; height: 24px; font-size: .78rem; border-radius: 6px; }
.icon-btn.danger:hover, .icon-btn.sm.danger:hover { background: var(--danger-bg); color: var(--danger); }
.icon-btn.logout:hover { background: var(--danger-bg); color: var(--danger); }
.link-btn { border: 0; background: none; padding: 0; color: var(--primary); font-size: .8rem; font-weight: 600; cursor: pointer; }
.link-btn:hover { color: var(--primary-2); text-decoration: underline; }

/* Sino de notificações */
.dropdown { position: relative; }
.bell { position: relative; border: 1px solid var(--border-input); background: var(--surface); width: 40px; height: 40px; }
.bell-count {
  position: absolute; top: -5px; right: -5px;
  min-width: 18px; height: 18px; padding: 0 4px;
  border-radius: 999px; border: 2px solid var(--bg);
  background: var(--danger); color: #fff;
  font-size: .62rem; font-weight: 700; line-height: 14px; text-align: center;
}
.dropdown-menu {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 60;
  display: none;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow-pop);
}
.dropdown.open .dropdown-menu { display: block; }
.notif-menu { width: 360px; max-width: calc(100vw - 24px); overflow: hidden; }
.notif-head { display: flex; align-items: center; justify-content: space-between; padding: .85rem 1rem; border-bottom: 1px solid var(--divider); }
.notif-head strong { font-size: .92rem; }
.notif-list { max-height: 380px; overflow-y: auto; }
.notif-item { display: flex; gap: .7rem; padding: .75rem 1rem; color: var(--text); border-bottom: 1px solid var(--divider); position: relative; }
.notif-item:hover { background: var(--primary-softer); color: var(--text); }
.notif-item.is-unread { background: #FCFAFF; }
.notif-item.is-unread::before { content: ''; position: absolute; left: .4rem; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: var(--primary); }
.notif-item p { font-size: .82rem; line-height: 1.4; }
.notif-item small { font-size: .72rem; color: var(--text-3); }
.notif-empty { padding: 1.4rem 1rem; text-align: center; color: var(--text-2); font-size: .84rem; }
.notif-foot { display: block; text-align: center; padding: .7rem; font-size: .82rem; font-weight: 600; }
.notif-icon {
  width: 32px; height: 32px; flex-shrink: 0; border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--primary-soft); color: var(--primary); font-size: .92rem;
}

/* ---------------------------------------------------------------------
   Alertas e toasts
   --------------------------------------------------------------------- */
.alert {
  display: flex; align-items: flex-start; gap: .6rem;
  padding: .8rem 1rem; border-radius: var(--radius-sm);
  font-size: .86rem; font-weight: 500; border: 1px solid transparent;
}
.alert i { font-size: 1rem; margin-top: .05rem; }
.alert-success { background: var(--success-bg); color: var(--success-text); border-color: #C9EED9; }
.alert-error { background: var(--danger-bg); color: var(--danger-text); border-color: #F6C9D0; }
.alert.is-hiding { opacity: 0; transform: translateY(-4px); transition: opacity .3s, transform .3s; }

.toasts { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 200; display: flex; flex-direction: column; gap: .5rem; pointer-events: none; }
.toast {
  display: flex; align-items: center; gap: .6rem;
  min-width: 260px; max-width: 380px;
  padding: .8rem 1rem; border-radius: var(--radius-sm);
  background: var(--text); color: #fff; font-size: .85rem; font-weight: 500;
  box-shadow: var(--shadow-pop);
  animation: toast-in .25s ease;
  pointer-events: auto;
}
.toast.is-error { background: var(--danger-text); }
.toast i { font-size: 1rem; }
.toast.is-success i { color: #5EE0A0; }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } }

/* ---------------------------------------------------------------------
   Cards de indicadores
   --------------------------------------------------------------------- */
.stats { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .9rem; }
.stats-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.stat {
  --tone: var(--primary); --tone-bg: rgba(112, 0, 245, .06);
  position: relative; display: flex; flex-direction: column;
  padding: 1rem 1.1rem;
  background: radial-gradient(circle at 85% 10%, var(--tone-bg), transparent 45%), var(--surface);
  border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow); color: var(--text);
  transition: transform var(--t), box-shadow var(--t), border-color var(--t);
}
.stat:hover { transform: translateY(-2px); box-shadow: var(--shadow-hover); border-color: #DADFE8; color: var(--text); }
.stat-icon {
  width: 36px; height: 36px; border-radius: 11px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--tone); color: #fff; font-size: 1rem;
}
.stat-label { margin-top: .85rem; min-height: 2.4em; font-size: .7rem; font-weight: 600; line-height: 1.2; text-transform: uppercase; letter-spacing: .03em; color: var(--text-2); display: flex; align-items: flex-end; }
.stat-value { font-size: 1.7rem; font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; }
.stat.tone-primary { --tone: var(--primary); --tone-bg: rgba(112, 0, 245, .06); }
.stat.tone-neutral { --tone: #8A94A6; --tone-bg: rgba(138, 148, 166, .08); }
.stat.tone-info { --tone: var(--info); --tone-bg: rgba(53, 109, 243, .06); }
.stat.tone-warning { --tone: #EA7A1B; --tone-bg: rgba(234, 122, 27, .07); }
.stat.tone-amber { --tone: var(--warning); --tone-bg: rgba(245, 158, 11, .08); }
.stat.tone-danger { --tone: #E0566A; --tone-bg: rgba(224, 86, 106, .07); }
.stat.tone-success { --tone: var(--success); --tone-bg: rgba(8, 166, 87, .06); }

/* ---------------------------------------------------------------------
   Painéis
   --------------------------------------------------------------------- */
.panel {
  background: var(--surface);
  border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 1.2rem 1.3rem;
  min-width: 0;
}
.panel-flush { padding: 0; overflow: hidden; }
.panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.panel-head h2 { font-size: .98rem; font-weight: 700; display: flex; align-items: center; gap: .5rem; }
.panel-head p { font-size: .8rem; color: var(--text-3); margin-top: .2rem; }
.panel-hint { font-size: .74rem; color: var(--text-3); white-space: nowrap; display: inline-flex; align-items: center; gap: .3rem; }
.link-more { font-size: .8rem; font-weight: 600; white-space: nowrap; display: inline-flex; align-items: center; gap: .3rem; }
.count-pill { font-size: .7rem; font-weight: 700; padding: .12rem .5rem; border-radius: 999px; background: var(--divider); color: var(--text-2); }
.panel-foot { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; padding: .9rem 1.2rem; border-top: 1px solid var(--divider); font-size: .82rem; }
.panel-foot.plain { border: 0; padding: .4rem 0 0; }
.panel-callout { border-color: #F6DDB0; background: linear-gradient(180deg, #FFFBF3, var(--surface) 140px); }

.grid-2 { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.stack { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; }

/* Linhas compactas de tarefa */
.task-rows { display: flex; flex-direction: column; margin: 0 -.5rem; }
.task-row {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: .7rem .5rem; border-radius: var(--radius-sm);
  color: var(--text); border-bottom: 1px solid var(--divider);
  transition: background var(--t);
}
.task-row:last-child { border-bottom: 0; }
.task-row:hover { background: var(--primary-softer); color: var(--text); }
.task-row-main { min-width: 0; display: flex; flex-direction: column; }
.task-row-title { font-weight: 600; font-size: .88rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.task-row-meta { font-size: .76rem; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.task-row-side { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }
.reason { font-size: .7rem; font-weight: 700; padding: .22rem .55rem; border-radius: 6px; white-space: nowrap; }
.reason-danger { background: var(--danger-bg); color: var(--danger-text); }
.reason-warning { background: var(--warning-bg); color: var(--warning-text); }
.reason-neutral { background: var(--divider); color: var(--text-2); }

/* ---------------------------------------------------------------------
   Badges
   --------------------------------------------------------------------- */
.badge {
  --c: var(--text-2); --b: var(--divider);
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .3rem .65rem; border-radius: 999px;
  background: var(--b); color: var(--c);
  font-size: .72rem; font-weight: 600; line-height: 1; white-space: nowrap;
}
.badge::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex-shrink: 0; }

.st-todo              { --c: #5D6679; --b: #EEF0F5; }
.st-in_progress       { --c: #2F5FD0; --b: #E8EFFE; }
.st-waiting_info      { --c: #C2610C; --b: #FDEFE2; }
.st-internal_review   { --c: #7A3FD1; --b: #F1E9FD; }
.st-waiting_approval  { --c: #9A6B00; --b: #FDF4D7; }
.st-changes_requested { --c: #C8364B; --b: #FCE9EC; }
.st-done              { --c: #0A8A4A; --b: #E3F5EB; }

.badge-flat {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .26rem .55rem; border-radius: 6px;
  font-size: .72rem; font-weight: 600; white-space: nowrap; line-height: 1.2;
  background: var(--divider); color: var(--text-2);
}
.badge-flat i { font-size: .78rem; }
.pr-low    { background: #F2F4F7; color: #7A8499; }
.pr-normal { background: #EEF1FB; color: #4F5D8A; }
.pr-high   { background: #FFF1E3; color: #C2610C; }
.pr-urgent { background: #FCE9EC; color: #C8364B; }
.ps-not_closed { background: #F2F4F7; color: #5D6679; }
.ps-checking   { background: #FDF4D7; color: #9A6B00; }
.type-badge { background: var(--primary-softer); color: #5B2BB5; }

.seal-print {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .26rem .6rem; border-radius: 6px;
  border: 1.5px solid #0A8A4A; color: #0A8A4A; background: #F1FBF5;
  font-size: .68rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap;
}
.seal-print.lg { font-size: .8rem; padding: .5rem .85rem; border-width: 2px; border-radius: 8px; }

.owner {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .28rem .6rem; border-radius: 999px;
  font-size: .72rem; font-weight: 700; white-space: nowrap;
}
.owner i { font-size: .8rem; }
.owner-agency { background: var(--primary-soft); color: var(--primary); }
.owner-client { background: #FFEFD6; color: #B45309; box-shadow: inset 0 0 0 1px #F8D49A; }
.owner-none   { background: var(--success-bg); color: var(--success-text); }

.due { display: inline-flex; align-items: center; gap: .3rem; font-size: .78rem; font-weight: 500; white-space: nowrap; color: var(--text-2); }
.due i { font-size: .8rem; }
.due-none { color: var(--text-3); }
.due-near { color: var(--text-strong); }
.due-soon { color: #B45309; font-weight: 700; }
.due-late { color: var(--danger-text); font-weight: 700; }
.due-done { color: var(--text-3); }

/* Avatares */
.avatar {
  width: 36px; height: 36px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  font-size: .76rem; font-weight: 700; letter-spacing: .02em;
  background: var(--primary-soft); color: var(--primary);
}
.avatar-sm { width: 26px; height: 26px; font-size: .62rem; }
.avatar.tone-0 { background: #F1E9FD; color: #6A2BD9; }
.avatar.tone-1 { background: #E8EFFE; color: #2F5FD0; }
.avatar.tone-2 { background: #E3F5EB; color: #0A8A4A; }
.avatar.tone-3 { background: #FFF1E3; color: #C2610C; }
.avatar.tone-4 { background: #FCE9EC; color: #C8364B; }
.avatar.tone-5 { background: #E6F6F7; color: #0E7C86; }
.avatar-empty { background: var(--divider); color: var(--text-3); }
.person { display: inline-flex; align-items: center; gap: .5rem; white-space: nowrap; }

/* Estado vazio */
.empty { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .3rem; padding: 2rem 1rem; }
.empty-icon { width: 46px; height: 46px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--primary-softer); color: #B8A1DD; font-size: 1.25rem; margin-bottom: .3rem; }
.empty.is-ok .empty-icon { background: var(--success-bg); color: var(--success); }
.empty-title { font-size: .9rem; font-weight: 600; color: #475467; }
.empty-text { font-size: .8rem; color: var(--text-3); max-width: 340px; }

/* ---------------------------------------------------------------------
   Barra de ferramentas / filtros
   --------------------------------------------------------------------- */
.toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .75rem; }
.toolbar-left, .toolbar-right { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; min-width: 0; }
.toolbar-left { flex: 1; }
.search-field { position: relative; flex: 1 1 240px; max-width: 340px; }
.search-field i { position: absolute; left: .85rem; top: 50%; transform: translateY(-50%); color: var(--text-3); pointer-events: none; }
.search-field input {
  width: 100%; height: 40px; padding: 0 .9rem 0 2.3rem;
  border: 1px solid var(--border-input); border-radius: var(--radius-sm); background: var(--surface); font-size: .85rem;
}
.search-field input:hover { border-color: #CDB1FF; }
.search-field input:focus { outline: none; border-color: var(--primary-2); box-shadow: 0 0 0 3px var(--primary-ring); }

.select {
  appearance: none; -webkit-appearance: none;
  height: 40px; padding: 0 2.1rem 0 .85rem;
  border: 1px solid var(--border-input); border-radius: var(--radius-sm);
  background: var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 12 8'%3E%3Cpath fill='%23667085' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat right .8rem center;
  font-size: .84rem; font-weight: 500; color: var(--text-strong);
  cursor: pointer; max-width: 100%;
  transition: border-color var(--t), box-shadow var(--t);
}
input.select { padding-right: .85rem; background-image: none; cursor: text; }
.select:hover { border-color: #CDB1FF; }
.select:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-ring); }

.segmented { position: relative; display: inline-flex; max-width: 100%; overflow-x: auto; padding: 3px; gap: 2px; border-radius: var(--radius-sm); background: #EEF0F5; scrollbar-width: none; }
.segmented label, .segmented a {
  display: inline-flex; align-items: center; height: 34px; padding: 0 .85rem;
  border-radius: 8px; font-size: .82rem; font-weight: 600; color: var(--text-2); cursor: pointer; white-space: nowrap;
  transition: background var(--t), color var(--t);
}
.segmented input { position: absolute; opacity: 0; pointer-events: none; }
.segmented label:hover, .segmented a:hover { color: var(--text); }
.segmented .active { background: var(--surface); color: var(--primary); box-shadow: 0 1px 3px rgba(16, 24, 40, .08); }

.view-switch { display: inline-flex; border: 1px solid var(--border-input); border-radius: var(--radius-sm); overflow: hidden; background: var(--surface); }
.view-switch a { width: 40px; height: 38px; display: inline-flex; align-items: center; justify-content: center; color: var(--text-2); }
.view-switch a + a { border-left: 1px solid var(--border-input); }
.view-switch a.active { background: var(--primary-soft); color: var(--primary); }

.filters-panel {
  flex-basis: 100%;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: .75rem;
  padding: 1rem; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface);
  align-items: end;
}
.filter { display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.filter span { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-3); }
.filter .select, .filter .mselect, .filter .mselect-toggle { width: 100%; }
.filter-clear { height: 40px; display: inline-flex; align-items: center; gap: .35rem; color: var(--text-2); }
.date-range { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }

/* ---------------------------------------------------------------------
   Tabelas
   --------------------------------------------------------------------- */
.table-wrap { position: relative; overflow-x: auto; }
.table { width: 100%; border-collapse: separate; border-spacing: 0; }
.table thead th {
  text-align: left; white-space: nowrap;
  font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-2);
  padding: .85rem .7rem .75rem; border-bottom: 1px solid var(--border); background: var(--surface-2);
}
.table tbody td { padding: .75rem .7rem; border-bottom: 1px solid var(--divider); vertical-align: middle; font-size: .85rem; }
.table tbody tr:last-child td { border-bottom: 0; }
.table tbody tr { transition: background var(--t); }
.table tbody tr:hover { background: var(--primary-softer); }
.table th:first-child, .table td:first-child { padding-left: 1.2rem; }
.table th:last-child, .table td:last-child { padding-right: 1.2rem; }
.table .col-actions { text-align: right; white-space: nowrap; width: 1%; }
.table .col-actions form { display: inline; }
.table .col-actions > * + * { margin-left: .3rem; }
.table tr.is-inactive td { opacity: .55; }
.cell-title { min-width: 200px; max-width: 300px; }
.cell-meta { display: block; font-size: .75rem; color: var(--text-3); margin-top: .1rem; }
.cell-title a { color: var(--text); font-weight: 600; }
.cell-title a:hover { color: var(--primary); }
.flag-info { margin-left: .35rem; color: #C2610C; font-size: .82rem; }

/* Select de status com a cor do próprio status */
.status-select {
  appearance: none; -webkit-appearance: none;
  height: 28px; padding: 0 1.7rem 0 .7rem;
  border: 0; border-radius: 999px;
  background: var(--b) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='6' viewBox='0 0 12 8'%3E%3Cpath fill='%23667085' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat right .6rem center;
  color: var(--c); font-size: .72rem; font-weight: 700; cursor: pointer;
  transition: filter var(--t), box-shadow var(--t);
}
.status-select:hover { filter: brightness(.96); }
.status-select:focus { outline: none; box-shadow: 0 0 0 3px var(--primary-ring); }
.table .status-select { max-width: 172px; text-overflow: ellipsis; }
.status-select:disabled { cursor: not-allowed; opacity: .85; }
.status-select option { background: #fff; color: var(--text); font-weight: 500; }
.status-select.lg { height: 40px; padding: 0 2.2rem 0 1rem; font-size: .84rem; border-radius: var(--radius-sm); background-position: right .85rem center; }
.status-select.is-saving { opacity: .55; pointer-events: none; }

/* Paginação */
.pagination { display: flex; align-items: center; gap: .25rem; }
.pagination a, .pagination span {
  min-width: 34px; height: 34px; padding: 0 .5rem;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--radius-xs); font-size: .82rem; font-weight: 600; color: var(--text-2);
}
.pagination a { border: 1px solid var(--border-input); background: var(--surface); }
.pagination a:hover { border-color: var(--primary); color: var(--primary); }
.pagination .current { background: var(--primary); color: #fff; }
.pagination .disabled { color: var(--text-3); opacity: .5; }

/* ---------------------------------------------------------------------
   Kanban
   --------------------------------------------------------------------- */
.kanban-period {
  display: flex; align-items: center; gap: .6rem; margin-bottom: .9rem;
  padding: .65rem .8rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
}
.kanban-period-title { min-width: 170px; text-align: center; line-height: 1.15; }
.kanban-period-title span { display: block; color: var(--text-3); font-size: .66rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.kanban-period-title strong { font-size: .92rem; text-transform: capitalize; }
.kanban-origin-legend { display: flex; align-items: center; gap: 1rem; margin-left: auto; color: var(--text-2); font-size: .75rem; }
.kanban-origin-legend span { display: inline-flex; align-items: center; gap: .35rem; }
.origin-dot { width: 9px; height: 9px; border-radius: 50%; background: #7C3AED; }
.origin-dot.is-extra { background: #E8791A; }
.kanban {
  display: grid; grid-auto-flow: column;
  grid-auto-columns: minmax(300px, calc((100% - 3.6rem) / 5));
  gap: .9rem; overflow-x: auto; padding-bottom: .8rem;
  scroll-snap-type: x proximity;
}
.kanban-col {
  display: flex; flex-direction: column; min-height: 420px;
  background: #F1F3F8; border-radius: var(--radius); padding: .7rem;
  scroll-snap-align: start;
}
.kanban-col-head { display: flex; align-items: center; gap: .5rem; padding: .3rem .35rem .7rem; }
.kanban-col-head h2 { flex: 1; font-size: .82rem; font-weight: 700; }
.kanban-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--c); }
.kanban-count { font-size: .72rem; font-weight: 700; color: var(--text-2); background: var(--surface); border-radius: 999px; padding: .08rem .5rem; }
/* Kanban ocupa toda a altura disponível; cada coluna rola por dentro */
@media (min-width: 768px) {
  .page-kanban .main { height: 100vh; }
  .page-kanban .content { flex: 1; min-height: 0; padding-bottom: 1.25rem; }
  .page-kanban .kanban { flex: 1; min-height: 0; }
  .page-kanban .kanban-col { min-height: 0; }
  .page-kanban .kanban-list { overflow-y: auto; padding-right: 2px; }
}
.kanban-list { flex: 1; display: flex; flex-direction: column; gap: .6rem; min-height: 80px; border-radius: var(--radius-sm); transition: background var(--t), box-shadow var(--t); }
.kanban.is-dragging-board { scroll-snap-type: none; }
/* Coluna de destino ao arrastar: fundo lilás uniforme + espaço tracejado no fim da lista */
.kanban-col { transition: background var(--t), box-shadow var(--t); }
.kanban-col.is-over { background: #F1EAFD; box-shadow: inset 0 0 0 1.5px rgba(112, 0, 245, .22); }
.kanban-col.is-over .kanban-empty { display: none; }
.kanban-col.is-over .kanban-list::after {
  content: "Soltar aqui";
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  min-height: 64px; border: 1.5px dashed rgba(112, 0, 245, .35); border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, .55); color: var(--primary); font-size: .78rem; font-weight: 600;
}
.kanban-empty { font-size: .78rem; color: var(--text-3); text-align: center; padding: 1.4rem .5rem; border: 1.5px dashed #D9DDE6; border-radius: var(--radius-sm); }
.kanban-col-foot { padding: .6rem .3rem 0; font-size: .74rem; text-align: center; }
.kcard {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: .8rem .85rem; box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
  display: flex; flex-direction: column; gap: .45rem;
  transition: box-shadow var(--t), transform var(--t), opacity var(--t);
}
.kcard.origin-contract { border-left: 4px solid #7C3AED; }
.kcard.origin-extra { border-left: 4px solid #E8791A; }
.kcard-meta { display: flex; align-items: center; justify-content: space-between; gap: .55rem; min-width: 0; }
.kcard-meta .due { flex-shrink: 0; }
.kcard-origin { display: flex; align-items: center; gap: .3rem; color: #6D28D9; font-size: .68rem; font-weight: 700; }
.kcard.origin-extra .kcard-origin { color: #C25D0B; }
.kcard-origin span { color: var(--text-3); font-weight: 600; }
.kcard.is-carryover { background: #FFFCF7; }
.kcard[draggable="true"] { cursor: grab; }
.kcard:hover { box-shadow: var(--shadow-hover); }
.kcard.is-dragging { opacity: .45; transform: rotate(1deg); }
.kcard.is-saving { opacity: .6; pointer-events: none; }
.kcard-top { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.kcard-type { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-3); }
.kcard-title { font-weight: 600; font-size: .88rem; color: var(--text); line-height: 1.35; }
.kcard-title:hover { color: var(--primary); }
.kcard-client { font-size: .76rem; color: var(--text-2); margin-top: -.25rem; }
.kcard-flag { font-size: .72rem; font-weight: 600; color: #C2610C; background: #FDEFE2; padding: .25rem .5rem; border-radius: 6px; align-self: flex-start; }
.kcard-badges { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.kcard-foot { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding-top: .45rem; border-top: 1px solid var(--divider); }
.kcard-select { display: none; }

@media (max-width: 767px) {
  .kanban-period { flex-wrap: wrap; }
  .kanban-period-title { min-width: 0; flex: 1; }
  .kanban-origin-legend { width: 100%; margin-left: 0; justify-content: center; }
}

/* ---------------------------------------------------------------------
   Tela da tarefa
   --------------------------------------------------------------------- */
.back-link { display: inline-flex; align-items: center; gap: .35rem; font-size: .82rem; font-weight: 600; color: var(--text-2); align-self: flex-start; }
.back-link:hover { color: var(--primary); }
.task-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1.5rem; padding: 1.4rem 1.5rem; }
.task-header-main { min-width: 0; }
.task-badges { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; margin-bottom: .7rem; }
.task-title { font-size: 1.45rem; font-weight: 700; letter-spacing: -.02em; overflow-wrap: anywhere; }
.task-sub { display: flex; flex-wrap: wrap; gap: .4rem 1rem; margin-top: .55rem; font-size: .8rem; color: var(--text-2); align-items: center; }
.task-sub i { color: var(--text-3); }
.task-header-actions { display: flex; align-items: flex-end; gap: .6rem; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; }
.task-header-actions form { margin: 0; }
.inline-field { display: flex; flex-direction: column; gap: .25rem; }
.inline-field > span { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--text-3); }

.owner-banner {
  display: flex; align-items: center; gap: .9rem;
  padding: .9rem 1.2rem; border-radius: var(--radius);
  border: 1px solid var(--border); background: var(--surface);
}
.owner-banner strong { display: block; font-size: .92rem; }
.owner-banner span { font-size: .82rem; color: var(--text-2); }
.owner-banner-icon { width: 40px; height: 40px; border-radius: 12px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; font-size: 1.15rem; }
.owner-banner-agency .owner-banner-icon { background: var(--primary-soft); color: var(--primary); }
.owner-banner-client { background: #FFF8EC; border-color: #F6D9A6; }
.owner-banner-client .owner-banner-icon { background: #FFE7C2; color: #B45309; }
.owner-banner-client strong { color: #92400E; }
.owner-banner-none { background: #F3FBF6; border-color: #CBEBD8; }
.owner-banner-none .owner-banner-icon { background: var(--success-bg); color: var(--success-text); }

.approval-box {
  display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; flex-wrap: wrap;
  padding: 1.2rem 1.4rem; border-radius: var(--radius);
  background: linear-gradient(135deg, #FBF8FF, #F3EAFF); border: 1px solid #DCC6FF;
}
.approval-box h3 { font-size: 1rem; display: flex; align-items: center; gap: .5rem; color: #4B1C9C; }
.approval-box p { font-size: .83rem; color: var(--text-2); margin-top: .25rem; max-width: 560px; }
.approval-actions { display: flex; gap: .6rem; flex-wrap: wrap; }
.approval-actions form { margin: 0; }

.task-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 1.25rem; align-items: start; }
.task-main, .task-side { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; }
.prose { font-size: .9rem; line-height: 1.65; color: #344054; overflow-wrap: anywhere; }

.info-panel.is-pending { border-color: #F6D9A6; box-shadow: 0 0 0 3px rgba(245, 158, 11, .08), var(--shadow); }
.info-callout { background: #FFF8EC; border-left: 3px solid var(--warning); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; padding: .9rem 1rem; margin-bottom: .9rem; }
.info-callout-label { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: #B45309; }
.info-callout p { font-size: .95rem; font-weight: 500; color: var(--text); margin-top: .2rem; }
.info-actions { display: flex; gap: .6rem; flex-wrap: wrap; }
.info-actions form { margin: 0; }
.info-done { display: flex; gap: .7rem; align-items: flex-start; margin-bottom: .9rem; }
.info-done > i { color: var(--success); font-size: 1.1rem; }
.info-done small { font-size: .76rem; color: var(--text-3); }

.inline-form { padding: 1rem; margin-bottom: 1rem; border-radius: var(--radius-sm); background: var(--surface-2); border: 1px solid var(--divider); }
.inline-form-actions { display: flex; justify-content: flex-end; gap: .5rem; }
.link-grid { grid-template-columns: 1fr 1.4fr .8fr; }

.links-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: .7rem; }
.link-card { display: flex; align-items: center; gap: .3rem; border: 1px solid var(--border); border-radius: var(--radius-sm); padding-right: .5rem; background: var(--surface); transition: border-color var(--t), box-shadow var(--t); }
.link-card:hover { border-color: #CDB1FF; box-shadow: 0 4px 14px rgba(112, 0, 245, .07); }
.link-card form { margin: 0; }
.link-card-main { flex: 1; min-width: 0; display: flex; align-items: center; gap: .7rem; padding: .75rem .4rem .75rem .8rem; color: var(--text); }
.link-card-main:hover { color: var(--text); }
.link-icon { width: 38px; height: 38px; border-radius: 10px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; background: var(--primary-soft); color: var(--primary); font-size: 1.05rem; }
.link-text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.link-text strong { font-size: .85rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.link-text small { font-size: .72rem; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.link-open { color: var(--text-3); font-size: .8rem; }
.link-card:hover .link-open { color: var(--primary); }

/* Comentários */
.comments { display: flex; flex-direction: column; gap: 1rem; margin-bottom: 1.1rem; }
.comment { display: flex; gap: .75rem; }
.comment-body { flex: 1; min-width: 0; background: var(--surface-2); border: 1px solid var(--divider); border-radius: 4px var(--radius) var(--radius) var(--radius); padding: .7rem .9rem; }
.comment.from-client .comment-body { background: #FFFBF3; border-color: #F8E6C4; }
.comment-body header { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-bottom: .3rem; }
.comment-body header strong { font-size: .84rem; }
.comment-body header time { font-size: .74rem; color: var(--text-3); }
.comment-body header form { margin: 0 0 0 auto; }
.comment-text { font-size: .87rem; line-height: 1.55; color: #344054; overflow-wrap: anywhere; }
.comment.is-new { animation: toast-in .3s ease; }
.role-tag { font-size: .64rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: .14rem .45rem; border-radius: 5px; background: var(--primary-soft); color: var(--primary); }
.role-tag.is-client, .role-tag.role-client { background: #FFEFD6; color: #B45309; }
.role-tag.role-admin { background: #E8EFFE; color: #2F5FD0; }
.comment-form { display: flex; gap: .75rem; align-items: flex-start; padding-top: 1rem; border-top: 1px solid var(--divider); }
.comment-input { flex: 1; min-width: 0; border: 1px solid var(--border-input); border-radius: var(--radius); background: var(--surface); transition: border-color var(--t), box-shadow var(--t); }
.comment-input:focus-within { border-color: var(--primary-2); box-shadow: 0 0 0 3px var(--primary-ring); }
.comment-input textarea { display: block; width: 100%; border: 0; resize: vertical; min-height: 64px; padding: .75rem .9rem .3rem; background: transparent; font-size: .87rem; border-radius: var(--radius); }
.comment-input textarea:focus { outline: none; }
.comment-input-foot { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .4rem .5rem .5rem .9rem; }
.comment-input-foot small { font-size: .72rem; }

/* Detalhes laterais */
.details { margin: 0; display: flex; flex-direction: column; }
.details > div { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .6rem 0; border-bottom: 1px solid var(--divider); }
.details > div:last-child { border-bottom: 0; }
.details dt { font-size: .8rem; color: var(--text-2); }
.details dd { margin: 0; font-size: .84rem; font-weight: 600; text-align: right; display: flex; flex-direction: column; align-items: flex-end; }
.details dd small { font-size: .72rem; font-weight: 500; color: var(--text-3); }

.print-seal-box { display: flex; flex-direction: column; align-items: flex-start; gap: .45rem; padding: .9rem; margin-bottom: .9rem; border-radius: var(--radius-sm); background: #F3FBF6; }
.print-seal-box small { font-size: .76rem; color: var(--text-2); }
.print-form { margin: 0; }

.notes-panel { background: #FCFCFD; border-style: dashed; }
.note-form { display: flex; flex-direction: column; align-items: flex-end; gap: .5rem; margin-bottom: .9rem; }
.notes { display: flex; flex-direction: column; gap: .6rem; }
.note { padding: .65rem .8rem; border-radius: var(--radius-sm); background: #FFFBEA; border: 1px solid #F4E7B5; }
.note p { font-size: .84rem; color: #3D3A2A; overflow-wrap: anywhere; }
.note small { font-size: .72rem; color: #8B8468; }

/* Linha do tempo */
.timeline { list-style: none; margin: 0; padding: 0; position: relative; }
.timeline::before { content: ''; position: absolute; left: 13px; top: 6px; bottom: 6px; width: 2px; background: var(--divider); }
.timeline-item { position: relative; display: flex; gap: .75rem; padding-bottom: 1rem; }
.timeline-item:last-child { padding-bottom: 0; }
.timeline-dot {
  position: relative; z-index: 1;
  width: 28px; height: 28px; flex-shrink: 0; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .76rem; border: 2px solid var(--surface);
  background: var(--divider); color: var(--text-2);
}
.timeline-dot.tone-primary { background: var(--primary-soft); color: var(--primary); }
.timeline-dot.tone-info { background: var(--info-bg); color: var(--info-text); }
.timeline-dot.tone-success { background: var(--success-bg); color: var(--success-text); }
.timeline-dot.tone-warning { background: var(--warning-bg); color: var(--warning-text); }
.timeline-dot.tone-danger { background: var(--danger-bg); color: var(--danger-text); }
.timeline-body { min-width: 0; padding-top: .2rem; }
.timeline-body p { font-size: .82rem; line-height: 1.45; color: #344054; }
.timeline-body time { font-size: .72rem; color: var(--text-3); }
.timeline-body blockquote { margin: .3rem 0; padding: .35rem .6rem; border-left: 2px solid var(--warning); background: #FFF8EC; font-size: .8rem; color: var(--text-2); border-radius: 0 6px 6px 0; }

/* ---------------------------------------------------------------------
   Formulários
   --------------------------------------------------------------------- */
.form-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 1.25rem; align-items: start; }
.form-main, .form-side { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; }
.form-side { position: sticky; top: 1rem; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; }
.form-group { display: block; margin-bottom: 1rem; }
.form-group:last-child { margin-bottom: 0; }
.form-label { display: block; font-size: .8rem; font-weight: 600; color: var(--text-strong); margin-bottom: .35rem; }
.req { color: var(--danger); }
.form-control {
  display: block; width: 100%;
  min-height: 42px; padding: .55rem .85rem;
  border: 1px solid var(--border-input); border-radius: var(--radius-sm);
  background: var(--surface); font-size: .88rem; color: var(--text);
  transition: border-color var(--t), box-shadow var(--t);
}
textarea.form-control { resize: vertical; line-height: 1.55; }
select.form-control {
  appearance: none; -webkit-appearance: none; padding-right: 2.2rem;
  background: var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 12 8'%3E%3Cpath fill='%23667085' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat right .9rem center;
}
.form-control:hover { border-color: #CDB1FF; }
.form-control:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-ring); }
.form-control:disabled { background: var(--divider); cursor: not-allowed; }
.form-control::placeholder, textarea::placeholder, input::placeholder { color: var(--text-3); }
.form-help { font-size: .75rem; color: var(--text-3); margin-top: .35rem; }
.form-actions { display: flex; gap: .6rem; justify-content: flex-end; }
.form-actions .btn-primary { flex: 1; }

.input-password { position: relative; }
.input-password .form-control { padding-right: 2.8rem; }
.input-password .icon-btn { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; }

.switch { display: flex; align-items: center; gap: .65rem; cursor: pointer; font-size: .86rem; font-weight: 500; margin-bottom: .8rem; user-select: none; }
.switch input { position: absolute; opacity: 0; pointer-events: none; }
.switch-ui { position: relative; width: 38px; height: 22px; flex-shrink: 0; border-radius: 999px; background: #D5D9E2; transition: background var(--t); }
.switch-ui::after { content: ''; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .15); transition: transform var(--t); }
.switch input:checked + .switch-ui { background: var(--primary); }
.switch input:checked + .switch-ui::after { transform: translateX(16px); }
.switch input:focus-visible + .switch-ui { box-shadow: 0 0 0 3px var(--primary-ring); }
.reveal { animation: toast-in .2s ease; }

/* Acesso às páginas (modal de usuário) */
.access-box { margin: 1.1rem 0 0; padding: 1rem 1rem .3rem; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-2); }
.access-box legend { padding: 0 .4rem; font-size: .8rem; font-weight: 700; color: var(--text-strong); }
.access-box > .form-help { margin: 0 0 .8rem; }
.access-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; }
.access-item { margin-bottom: .75rem; font-size: .84rem; }
.access-tag { display: inline-flex; align-items: center; gap: .25rem; margin-left: .35rem; font-size: .68rem; font-weight: 600; color: var(--text-2); background: var(--divider); padding: .14rem .45rem; border-radius: 5px; white-space: nowrap; }
div.stat:hover { transform: none; box-shadow: var(--shadow); border-color: var(--border); }
@media (max-width: 575px) { .access-list { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------------
   Visão do cliente
   --------------------------------------------------------------------- */
.needs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: .9rem; }
.need-card { display: flex; flex-direction: column; gap: .55rem; padding: 1rem 1.1rem; border-radius: var(--radius); background: var(--surface); border: 1px solid #F3DEB5; box-shadow: var(--shadow); }
.need-card-top { display: flex; align-items: center; justify-content: space-between; gap: .5rem; flex-wrap: wrap; }
.need-card h3 { font-size: .98rem; font-weight: 700; }
.need-card h3 a { color: var(--text); }
.need-card h3 a:hover { color: var(--primary); }
.need-text { font-size: .83rem; color: var(--text-2); flex: 1; }
.need-card .btn { align-self: flex-start; }
.need-kind { display: inline-flex; align-items: center; gap: .35rem; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: .25rem .55rem; border-radius: 6px; }
.need-kind.is-info { background: #FDEFE2; color: #C2610C; }
.need-kind.is-approval { background: #FDF4D7; color: #9A6B00; }

/* Materiais concluídos */
.materials-list { display: flex; flex-direction: column; gap: .8rem; }
.material-head { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; margin-bottom: .8rem; }
.material-title { font-size: .98rem; font-weight: 700; color: var(--text); }
.material-title:hover { color: var(--primary); }
.chip-links { display: flex; flex-wrap: wrap; gap: .5rem; }
.chip-link { display: inline-flex; align-items: center; gap: .4rem; padding: .45rem .8rem; border-radius: 999px; background: var(--primary-softer); border: 1px solid #E7DAFF; color: #5B2BB5; font-size: .8rem; font-weight: 600; }
.chip-link:hover { background: var(--primary); border-color: var(--primary); color: #fff; }

/* Atividades */
.day-label { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--text-3); margin: 1.1rem 0 .6rem; }
.day-label:first-child { margin-top: 0; }
.activity-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.activity-list li { display: flex; gap: .75rem; padding: .6rem 0; border-bottom: 1px solid var(--divider); }
.activity-list li:last-child { border-bottom: 0; }
.activity-text p { font-size: .85rem; color: #344054; }
.activity-text small { font-size: .74rem; color: var(--text-3); }

/* Página de notificações */
.notif-page-list { list-style: none; margin: 0; padding: 0; }
.notif-page-list li { display: flex; align-items: center; gap: .8rem; padding: .85rem 1.2rem; border-bottom: 1px solid var(--divider); }
.notif-page-list li:last-child { border-bottom: 0; }
.notif-page-list li.is-unread { background: #FCFAFF; }
.notif-page-list li form { margin: 0; }
.notif-text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.notif-text a, .notif-text span { color: var(--text); font-size: .86rem; }
.notif-page-list li.is-unread .notif-text a { font-weight: 600; }
.notif-text small { font-size: .74rem; color: var(--text-3); }

/* ---------------------------------------------------------------------
   Modais
   --------------------------------------------------------------------- */
.modal {
  position: fixed; inset: 0; z-index: 100;
  display: flex; align-items: center; justify-content: center;
  padding: 1rem; background: rgba(18, 24, 41, .45);
  animation: fade-in .15s ease;
}
@keyframes fade-in { from { opacity: 0; } }
.modal-dialog {
  width: 100%; max-width: 560px; max-height: calc(100vh - 2rem); overflow-y: auto;
  background: var(--surface); border-radius: 16px; box-shadow: 0 16px 40px rgba(36, 35, 33, .18);
  animation: pop-in .18s ease;
}
.modal-sm { max-width: 420px; }
@keyframes pop-in { from { opacity: 0; transform: translateY(8px) scale(.98); } }
.modal-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.05rem 1.4rem; border-bottom: 1px solid var(--border); }
.modal-title { font-size: 1.02rem; font-weight: 700; }
.modal-body { padding: 1.3rem 1.4rem; }
.modal-footer { display: flex; justify-content: flex-end; gap: .6rem; padding: .9rem 1.4rem; border-top: 1px solid var(--border); background: var(--surface-2); }
.confirm-body { text-align: center; padding-top: 1.8rem; }
.confirm-body h3 { font-size: 1.05rem; margin-top: .8rem; }
.confirm-body p { font-size: .88rem; color: var(--text-2); margin-top: .4rem; }
.confirm-icon { width: 48px; height: 48px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--primary-soft); color: var(--primary); font-size: 1.3rem; }
.modal.is-danger .confirm-icon { background: var(--danger-bg); color: var(--danger); }
.modal.is-danger [data-confirm-ok] { background: var(--danger); box-shadow: none; }

/* ---------------------------------------------------------------------
   Login / telas de autenticação
   --------------------------------------------------------------------- */
.auth-page { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.auth-page.single { grid-template-columns: 1fr; }
.auth-side {
  position: relative; overflow: hidden;
  display: flex; align-items: center; justify-content: center; padding: 3rem;
  background: linear-gradient(145deg, #5E00CF 0%, var(--primary) 45%, var(--primary-2) 100%);
  color: #fff;
}
.auth-side::before, .auth-side::after { content: ''; position: absolute; border-radius: 50%; background: rgba(255, 255, 255, .06); }
.auth-side::before { width: 520px; height: 520px; top: -180px; right: -160px; }
.auth-side::after { width: 380px; height: 380px; bottom: -160px; left: -120px; }
.auth-side-inner { position: relative; z-index: 1; max-width: 420px; }
.auth-side .brand-mark { background: rgba(255, 255, 255, .16); box-shadow: none; margin-bottom: 1.6rem; }
.auth-side h2 { font-size: 1.9rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; }
.auth-side p { margin-top: .8rem; font-size: .98rem; color: rgba(255, 255, 255, .8); }
.auth-points { list-style: none; padding: 0; margin: 1.8rem 0 0; display: flex; flex-direction: column; gap: .7rem; }
.auth-points li { display: flex; align-items: center; gap: .6rem; font-size: .9rem; color: rgba(255, 255, 255, .92); }
.auth-points i { font-size: 1.05rem; }
.auth-main { display: flex; align-items: center; justify-content: center; padding: 2rem 1rem; }
.auth-card {
  width: 100%; max-width: 410px;
  background: var(--surface); border: 1px solid var(--border); border-radius: 18px;
  padding: 2.3rem 2.2rem; box-shadow: var(--shadow-hover);
  display: flex; flex-direction: column;
}
.auth-card .alert { margin-bottom: 1rem; }
.auth-brand { display: flex; align-items: center; gap: .7rem; margin-bottom: 1.8rem; }
.auth-brand div { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.auth-brand strong { font-size: .95rem; }
.auth-brand small { font-size: .76rem; color: var(--text-3); overflow: hidden; text-overflow: ellipsis; }
.auth-card h1 { font-size: 1.45rem; font-weight: 700; letter-spacing: -.02em; }
.auth-lead { font-size: .86rem; color: var(--text-2); margin: .35rem 0 1.4rem; }
.auth-card .btn-block { margin-top: .4rem; }
.auth-alt { text-align: center; margin-top: 1.1rem; font-size: .84rem; }
.error-card { text-align: center; align-items: center; margin: auto; }
.error-card h1 { margin-top: .4rem; }
.error-card p { color: var(--text-2); margin: .5rem 0 1.4rem; }
.error-code { font-size: 3rem; font-weight: 800; line-height: 1; background: linear-gradient(135deg, var(--primary), var(--primary-2)); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ---------------------------------------------------------------------
   Responsivo
   --------------------------------------------------------------------- */
@media (max-width: 1400px) {
  .stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 768px) and (max-width: 1599px) {
  .table .col-wide { display: none; }
}
@media (max-width: 1200px) {
  .task-layout, .form-layout { grid-template-columns: minmax(0, 1fr); }
  .form-side { position: static; }
  .grid-2 { grid-template-columns: minmax(0, 1fr); }
  .global-search { width: 220px; }
}
@media (max-width: 991px) {
  .sidebar { transform: translateX(-100%); }
  .sidebar.open { transform: translateX(0); box-shadow: var(--shadow-pop); }
  .sidebar-backdrop.open { display: block; position: fixed; inset: 0; z-index: 35; background: rgba(18, 24, 41, .4); }
  .main { margin-left: 0; }
  .topbar { margin-inline: 1rem; gap: .6rem; }
  .icon-btn.topbar-toggle { display: inline-flex; border: 1px solid var(--border-input); background: var(--surface); }
  .topbar-date { display: none; }
  .content { padding: 1.2rem 1rem 2.5rem; }
  .auth-page { grid-template-columns: 1fr; }
  .auth-side { display: none; }
}
@media (max-width: 767px) {
  .page-title { font-size: 1.2rem; }
  .page-subtitle { display: none; }
  .topbar { flex-wrap: wrap; }
  .topbar-tools { order: 3; flex-basis: 100%; }
  .global-search { flex: 1; width: auto; }
  .stats, .stats-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
  .stat { padding: .8rem .9rem; }
  .stat-label { margin-top: .6rem; }
  .stat-value { font-size: 1.4rem; }
  .panel { padding: 1rem; }
  .panel-flush { padding: 0; }
  .toolbar-left, .toolbar-right { width: 100%; }
  .search-field { max-width: none; }
  .toolbar-right .btn-primary { flex: 1; }
  .form-grid, .link-grid { grid-template-columns: 1fr; }
  .task-header { flex-direction: column; padding: 1.1rem; }
  .task-header-actions { justify-content: flex-start; width: 100%; }
  .task-title { font-size: 1.2rem; }
  .task-row { flex-direction: column; align-items: flex-start; gap: .45rem; }
  .task-row-side { flex-wrap: wrap; }
  .approval-actions, .approval-actions form, .approval-actions .btn { width: 100%; }

  /* Tabelas viram cartões */
  .table thead { display: none; }
  .table, .table tbody, .table tr, .table td { display: block; width: 100%; }
  .table tbody tr { padding: .8rem 1rem; border-bottom: 1px solid var(--divider); }
  .table tbody td { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .3rem 0 !important; border: 0; }
  .table tbody td[data-label]::before { content: attr(data-label); font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-3); flex-shrink: 0; }
  .table tbody td.cell-title { display: block; padding-bottom: .5rem !important; font-size: .95rem; min-width: 0; }
  .table tbody td.cell-title::before { display: none; }
  .table .col-actions { width: 100%; text-align: left; padding-top: .6rem !important; justify-content: flex-end; }

  /* Kanban: rolagem horizontal com cartões mais estreitos */
  .kanban { grid-auto-columns: 84%; }
  .kcard-select { display: block; width: 100%; }
  .kcard-select.status-select { border-radius: 8px; }

  .comment-form > .avatar { display: none; }
  .notif-menu { position: fixed; left: 12px; right: 12px; top: 70px; width: auto; }
  .search-results { min-width: 0; }
  .modal { align-items: flex-end; padding: 0; }
  .modal-dialog { max-width: none; border-radius: 16px 16px 0 0; max-height: 92vh; }
  .toasts { left: 1rem; right: 1rem; }
  .toast { max-width: none; }
  .auth-card { padding: 1.8rem 1.4rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ---------------------------------------------------------------------
   Filtro de seleção múltipla
   --------------------------------------------------------------------- */
.mselect { position: relative; min-width: 0; }
.mselect-toggle { display: flex; align-items: center; min-width: 170px; max-width: 260px; text-align: left; }
.mselect-label { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mselect.has-value .mselect-toggle { border-color: var(--primary); color: var(--primary); background-color: var(--primary-softer); }
.mselect.open .mselect-toggle { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-ring); }
.mselect-menu {
  display: none; position: absolute; top: calc(100% + 6px); left: 0; z-index: 70;
  min-width: 100%; width: max-content; max-width: 300px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow-pop);
}
.mselect.open .mselect-menu { display: block; }
.mselect-options { max-height: 300px; overflow-y: auto; padding: .4rem; }
.mselect-opt {
  display: flex; align-items: center; gap: .6rem; padding: .45rem .55rem;
  border-radius: var(--radius-xs); font-size: .84rem; cursor: pointer; user-select: none;
}
.mselect-opt:hover { background: var(--primary-softer); }
.mselect-opt input { width: 16px; height: 16px; flex-shrink: 0; margin: 0; accent-color: var(--primary); cursor: pointer; }
.mselect-foot { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .55rem .7rem; border-top: 1px solid var(--divider); }
.filters-panel .mselect-toggle { max-width: none; }
@media (max-width: 767px) {
  .toolbar-left > .mselect { flex: 1 1 45%; }
  .mselect-toggle { min-width: 0; max-width: none; width: 100%; }
  .mselect-menu { max-width: calc(100vw - 2rem); }
}
/* ---------------------------------------------------------------------
   Contratos
   --------------------------------------------------------------------- */
.st-planned  { --c: #6B7280; --b: #FFFFFF; box-shadow: inset 0 0 0 1px #D5D9E2; }
.st-replaced { --c: #8A6D3B; --b: #F6EFE3; }
.og-contract   { background: #EEF1FB; color: #4353D9; }
.og-extra      { background: #FFF1E3; color: #C2610C; }
.og-substitute { background: #F6EFE3; color: #8A6D3B; }
.cell-meta .badge-flat { margin-left: .25rem; padding: .1rem .4rem; font-size: .66rem; vertical-align: 1px; }
.is-invalid { border-color: var(--danger) !important; box-shadow: 0 0 0 3px rgba(230, 57, 80, .12) !important; }

.meter { position: relative; height: 8px; border-radius: 999px; background: var(--divider); overflow: hidden; display: flex; }
.meter > span { display: block; height: 100%; background: linear-gradient(90deg, var(--primary), var(--primary-2)); }
.meter.stacked { flex: 1; min-width: 80px; }
.meter .m-done { background: var(--success); }
.meter .m-prod { background: var(--info); }
.meter .m-repl { background: #C9A46A; }
.cell-count { font-size: .8rem; color: var(--text-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.cell-count strong { color: var(--text); }
.legend { display: flex; flex-wrap: wrap; gap: .4rem .9rem; font-size: .74rem; color: var(--text-2); }
.legend span { display: inline-flex; align-items: center; gap: .35rem; }
.legend i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.lg-done { background: var(--success); }
.lg-prod { background: var(--info); }
.lg-repl { background: #C9A46A; }
.lg-plan { background: var(--divider); box-shadow: inset 0 0 0 1px #D5D9E2; }

.contract-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 1rem; }
.contract-card { display: flex; flex-direction: column; gap: .9rem; color: var(--text); transition: box-shadow var(--t), transform var(--t); }
.contract-card:hover { color: var(--text); box-shadow: var(--shadow-hover); transform: translateY(-2px); }
.contract-card-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.contract-card-top strong { display: block; font-size: 1rem; }
.contract-card-top small { font-size: .78rem; color: var(--text-2); }
.contract-card-stats { display: flex; flex-wrap: wrap; gap: .3rem 1rem; font-size: .78rem; color: var(--text-2); }
.contract-card-stats strong { color: var(--text); }

.contract-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.contract-head-main { flex: 1; min-width: 0; }
.contract-kpis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .8rem; margin-top: .4rem; }
.contract-kpis > div { padding: .7rem .8rem; border-radius: var(--radius-sm); background: var(--surface-2); border: 1px solid var(--divider); }
.contract-kpis strong { display: block; font-size: 1.45rem; font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; }
.contract-kpis span { font-size: .72rem; color: var(--text-2); }
.contract-kpis .k-done strong { color: var(--success-text); }
.contract-kpis .k-prod strong { color: var(--info-text); }
.contract-kpis .k-repl strong { color: #8A6D3B; }
.contract-kpis .k-extra strong { color: #C2610C; }

.contract-alert { display: flex; gap: .8rem; align-items: flex-start; padding: .9rem 1.1rem; border-radius: var(--radius); background: #FFF8EC; border: 1px solid #F6D9A6; }
.contract-alert > i { color: #B45309; font-size: 1.15rem; margin-top: .1rem; }
.contract-alert strong { display: block; color: #92400E; font-size: .9rem; }
.contract-alert span { font-size: .82rem; color: var(--text-2); }

.item-balance { display: flex; flex-direction: column; }
.item-balance-row { display: grid; grid-template-columns: minmax(180px, 280px) 1fr; gap: 1.2rem; align-items: center; padding: .7rem 0; border-bottom: 1px solid var(--divider); }
.item-balance-row:last-child { border-bottom: 0; }
.item-balance-name strong { display: block; font-size: .88rem; }
.item-balance-name small { font-size: .75rem; color: var(--text-3); }
.item-balance-meter, .month-meter { display: flex; align-items: center; gap: .7rem; }

.months { display: flex; flex-direction: column; gap: .5rem; }
.month { border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); }
.month.is-current { border-color: #C9B2FF; box-shadow: 0 0 0 3px rgba(112, 0, 245, .06); }
.month > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: .8rem; padding: .75rem 1rem; user-select: none; }
.month > summary::-webkit-details-marker { display: none; }
.month > summary:hover { background: var(--primary-softer); border-radius: var(--radius-sm); }
.month-title { display: flex; flex-direction: column; min-width: 150px; }
.month-title strong { font-size: .88rem; }
.month-title small { font-size: .74rem; color: var(--text-3); }
.month-meter { flex: 1; max-width: 360px; margin-left: auto; }
.month-chevron { color: var(--text-3); transition: transform var(--t); }
.month[open] .month-chevron { transform: rotate(180deg); }
.slot-list { list-style: none; margin: 0; padding: .2rem .6rem .6rem; border-top: 1px solid var(--divider); }
.slot { display: flex; align-items: center; gap: .7rem; padding: .5rem .4rem; border-radius: var(--radius-xs); }
.slot + .slot { border-top: 1px dashed var(--divider); }
.slot:hover { background: var(--surface-2); }
.slot-check, .slot-check-placeholder { width: 17px; height: 17px; flex-shrink: 0; margin: 0; accent-color: var(--primary); cursor: pointer; }
.slot-label { font-size: .72rem; font-weight: 700; color: var(--text-3); text-transform: uppercase; letter-spacing: .03em; min-width: 120px; white-space: nowrap; }
.slot-title { flex: 1; min-width: 0; font-size: .85rem; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.slot.slot-planned .slot-title { color: var(--text-2); }
.slot.slot-replaced .slot-title { color: var(--text-3); text-decoration: line-through; }
.slot-side { display: flex; align-items: center; gap: .6rem; flex-shrink: 0; }
.slot-side .slot-replaced { display: inline-block; font-size: .76rem; color: #8A6D3B; white-space: nowrap; max-width: 260px; overflow: hidden; text-overflow: ellipsis; }

.substitute-bar {
  position: sticky; bottom: 1rem; z-index: 30;
  display: flex; align-items: center; gap: 1rem;
  margin-top: 1rem; padding: .8rem 1rem .8rem 1.2rem;
  border-radius: var(--radius); background: var(--text); color: #fff; box-shadow: var(--shadow-pop);
}
.substitute-bar span { flex: 1; font-size: .88rem; }
.substitute-bar .link-btn { color: #C9B2FF; }
.substitute-summary { font-size: .86rem; color: var(--text-2); margin-bottom: 1rem; }
.substitute-mode { margin-bottom: 1rem; }

.sub-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.sub-list li { padding: .75rem 0; border-bottom: 1px solid var(--divider); }
.sub-list li:last-child { border-bottom: 0; }
.sub-list-head { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
.sub-list-head a { color: var(--text); }
.sub-list-head a:hover { color: var(--primary); }
.sub-list p { font-size: .8rem; color: var(--text-2); margin-top: .25rem; }
.sub-list small { font-size: .74rem; color: var(--text-3); }
.contract-lists { align-items: stretch; }

.contract-banner { display: flex; align-items: center; gap: .9rem; flex-wrap: wrap; padding: .9rem 1.2rem; border-radius: var(--radius); border: 1px solid var(--border); background: var(--surface); }
.contract-banner-text { flex: 1; min-width: 220px; }
.contract-banner-text strong { display: block; font-size: .92rem; }
.contract-banner-text span { font-size: .82rem; color: var(--text-2); }
.contract-banner-actions { display: flex; gap: .5rem; flex-wrap: wrap; margin: 0; }
.contract-banner.is-planned { background: #FAFAFC; border-style: dashed; border-color: #CDD2DC; }
.contract-banner.is-planned .owner-banner-icon { background: #EEF1FB; color: #4353D9; }
.contract-banner.is-replaced, .contract-banner.is-substitute { background: #FBF7F0; border-color: #EBDCC2; }
.contract-banner.is-replaced .owner-banner-icon, .contract-banner.is-substitute .owner-banner-icon { background: #F6EFE3; color: #8A6D3B; }
.contract-banner.is-extra { background: #FFF8F0; border-color: #F8D9B8; }
.contract-banner.is-extra .owner-banner-icon { background: #FFF1E3; color: #C2610C; }

.items-table { display: flex; flex-direction: column; gap: .5rem; }
.items-head, .items-row { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1.3fr) 80px minmax(0, 1.1fr) 32px; gap: .6rem; align-items: center; }
.items-head span { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-3); }
.help-list { margin: 0; padding-left: 1.1rem; display: flex; flex-direction: column; gap: .5rem; font-size: .82rem; color: var(--text-2); }
.origin-fixed { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; font-size: .84rem; }

@media (max-width: 1200px) {
  .contract-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .contract-head { flex-direction: column; }
  .contract-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .item-balance-row { grid-template-columns: 1fr; gap: .4rem; }
  .month > summary { flex-wrap: wrap; }
  .month-meter { max-width: none; width: 100%; margin-left: 0; }
  .slot { flex-wrap: wrap; }
  .slot-label { min-width: 0; }
  .slot-title { flex-basis: 100%; order: 3; white-space: normal; }
  .items-head { display: none; }
  .items-row { grid-template-columns: 1fr 1fr; padding: .6rem; border: 1px solid var(--divider); border-radius: var(--radius-sm); }
  .items-row > .item-name { grid-column: 1 / -1; }
  .substitute-bar { flex-wrap: wrap; }
  .contract-cards { grid-template-columns: 1fr; }
}
#modeNew, #modeExisting { margin-bottom: 1rem; }
.substitute-bar:has(~ .modal:not([hidden])) { visibility: hidden; }

/* Contador nas abas da lista de tarefas */
.segmented label { gap: .4rem; }
.tab-count { min-width: 20px; height: 18px; padding: 0 .4rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; background: #DDE1E9; color: var(--text-2); font-size: .68rem; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1; }
.segmented .active .tab-count { background: var(--primary); color: #fff; box-shadow: none; }
.tab-count.is-zero { background: transparent; color: var(--text-3); box-shadow: inset 0 0 0 1px #D5D9E2; }
.completed-date { margin-top: .75rem; }
.date-field { text-align: left; margin: 1.1rem 0 0; }