/* RCO Consultoria — portal (acesso, clientes, usuários/perfis, histórico). Requer rco-theme.css e rco.css. */
body.portal{min-height:100vh;display:flex;flex-direction:column;background:var(--bg)}
.portal-main{flex:1;width:100%;max-width:1240px;margin:0 auto;padding:36px 28px 64px;outline:none}
.portal-footer{border-top:1px solid var(--border);padding:22px;text-align:center;font-size:12.5px;color:var(--subtle)}
.portal h1{font-size:clamp(28px,3.4vw,40px);margin-bottom:8px}
.portal h2{font-size:20px;letter-spacing:-.02em;margin-bottom:0}
.portal h3{font-size:17px;letter-spacing:-.015em;margin-bottom:6px}
.muted{color:var(--muted);font-size:14px;line-height:1.6;margin:0 0 8px}
.grow{flex:1}
.warn-text{color:var(--warn)!important;font-weight:600}

.page-loading{display:flex;align-items:center;gap:12px;padding:48px 0;color:var(--muted);font-size:15px}
.spinner{width:20px;height:20px;border-radius:50%;border:2.5px solid var(--border);border-top-color:var(--accent);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:28px;flex-wrap:wrap}
.page-head .eyebrow{margin-bottom:10px}
.page-lead{color:var(--muted);font-size:15.5px;max-width:680px;margin:0}
.head-stats{display:flex;gap:10px}
.stat{padding:10px 16px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);font-size:13px;color:var(--muted)}
.stat b{display:block;font-size:22px;color:var(--text-strong);letter-spacing:-.02em}
.crumbs{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--muted);margin-bottom:18px;flex-wrap:wrap}
.crumbs a{display:inline-flex;align-items:center;gap:6px;color:var(--accent-text);font-weight:600}
.crumbs a:hover{text-decoration:underline}
.crumbs .ico{width:16px;height:16px}

/* Painéis e cartões */
.split{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(320px,1fr);gap:24px;align-items:start}
.panel,.card,.table-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.panel{padding:24px}
.panel.sticky{position:sticky;top:calc(var(--appbar-h) + 20px)}
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.card{padding:22px;display:flex;flex-direction:column}
.card-icon{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent-text);margin-bottom:14px}
.card-actions{margin-top:auto;padding-top:12px;display:flex;gap:8px;flex-wrap:wrap}
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:18px;margin-top:22px}
.portal .alert{margin-bottom:18px}
.portal .alert span{display:block}

.hero-panel{display:grid;grid-template-columns:1fr 1.15fr;gap:28px;align-items:center;padding:30px;border-radius:var(--radius);background:var(--rco-charcoal);color:#E6E8E1;box-shadow:var(--shadow-md)}
html[data-theme=dark] .hero-panel{background:#0E100D;border:1px solid var(--border)}
.hero-panel h2{color:#fff;font-size:26px;margin-bottom:8px}
.hero-panel p{color:#B9BEB2;font-size:14.5px;margin:0}
.hero-panel .eyebrow{color:var(--rco-orange);margin-bottom:10px}
.quick-views{display:grid;gap:10px}
.quick-views a{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:var(--radius-sm);background:#2A2E28;border:1px solid #393E36;color:#fff;transition:border-color .15s,background .15s}
html[data-theme=dark] .quick-views a{background:#1A1D19;border-color:#2C3029}
.quick-views a:hover{border-color:var(--rco-orange);background:#30342D}
.quick-views .ico{width:22px;height:22px;color:var(--rco-orange)}
.quick-views span{font-size:13px;color:#A9AEA2;line-height:1.4}
.quick-views b{display:block;color:#fff;font-size:15px}

.perm-list{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:7px}
.perm-list li{display:flex;align-items:center;gap:9px;font-size:13.5px}
.perm-list li.yes .ico{color:var(--good)}
.perm-list li.no{color:var(--subtle)}
.perm-list li.no .ico{color:var(--subtle)}
.perm-list .ico{width:16px;height:16px}

.inline-form{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-top:auto;padding-top:10px}
.inline-form .field{flex:0 0 120px}

/* Campos do portal */
.portal form{display:grid;gap:18px}
.field{display:grid;gap:6px}
.field>label,.field-label{font-size:14px;font-weight:650;color:var(--text-strong)}
.req,.opt{font-size:11px;font-weight:650;letter-spacing:.02em;margin-left:4px;padding:1px 7px;border-radius:999px;vertical-align:1px}
.req{color:var(--accent-text);background:var(--accent-soft)}
.opt{color:var(--subtle);background:var(--surface-3)}
.field.compact label{font-size:12.5px}
.field.is-disabled{opacity:.55}
.password-wrap{position:relative}
.password-wrap input{padding-right:50px}
.reveal{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:40px;height:38px;border:0;border-radius:6px;background:transparent;color:var(--muted);display:grid;place-items:center;cursor:pointer}
.reveal:hover{background:var(--surface-2);color:var(--text)}
.pw-meter{font-size:13px;margin-top:-8px;min-height:0}
.pw-meter span{display:inline-flex;gap:6px;align-items:center}
.pw-meter .ok{color:var(--good)}.pw-meter .bad{color:var(--warn)}
.pw-meter .ico{width:15px;height:15px}
.button.block{width:100%}
.button.danger-solid{background:var(--bad-fill);border-color:var(--bad-fill);color:#fff}
.button.danger-solid:hover{filter:brightness(.95)}
fieldset{border:0;padding:0;margin:0;min-width:0;display:grid;gap:8px}
legend{font-size:14px;font-weight:650;color:var(--text-strong);padding:0;margin-bottom:8px}
.choice,.check-row{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);cursor:pointer;transition:border-color .15s,background .15s}
.choice:hover,.check-row:hover{border-color:var(--border-strong)}
.choice:has(input:checked),.check-row:has(input:checked){border-color:var(--accent-border);background:var(--accent-soft)}
.choice:has(input:disabled),.check-row:has(input:disabled){cursor:not-allowed;opacity:.7}
.choice input,.check-row input{margin-top:2px}
.choice span,.check-row span{display:grid;gap:2px;font-size:14px;line-height:1.4}
.choice small,.check-row small{color:var(--muted);font-size:12.5px;line-height:1.45}
.check-row.slim{padding:8px 10px;border-color:transparent;background:transparent}
.check-row.slim:has(input:checked){background:var(--accent-soft);border-color:transparent}
.perm-group{gap:6px}

/* Acesso (login, convite, instalação) */
.auth{display:grid;grid-template-columns:1fr 1fr;max-width:1040px;margin:12px auto 0;border-radius:20px;overflow:hidden;border:1px solid var(--border);box-shadow:var(--shadow-md);background:var(--surface)}
.auth-aside{background:radial-gradient(90% 70% at 100% 0%,rgba(249,105,19,.28),transparent 60%),var(--rco-charcoal);color:#E6E8E1;padding:44px 40px;display:flex;flex-direction:column}
.auth-logo{width:200px;height:auto;margin-bottom:auto}
.auth-tag{margin:44px 0 10px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--rco-orange);font-weight:700}
.auth-aside h2{color:#fff;font-size:28px;line-height:1.2;margin-bottom:24px}
.auth-aside ul{list-style:none;padding:0;margin:0;display:grid;gap:12px;font-size:14px;color:#C9CDC2}
.auth-aside li{display:flex;gap:10px;align-items:center}
.auth-aside .ico{color:var(--rco-orange)}
.auth-card{padding:44px 44px 36px}
.auth-card .eyebrow{margin-bottom:10px}
.auth-card h1{font-size:32px}
.auth-lead{color:var(--muted);font-size:15px;margin-bottom:22px}
.auth-foot{margin-top:22px;padding-top:18px;border-top:1px solid var(--divider);display:grid;gap:12px;font-size:13.5px;color:var(--muted)}
.auth-foot p{display:flex;gap:8px;align-items:flex-start;margin:0;line-height:1.5}
.auth-foot .ico{width:16px;height:16px;margin-top:2px}

/* Clientes */
.client-list{display:grid;gap:12px}
.client-item{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:16px 18px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2);flex-wrap:wrap}
.client-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:4px}
.client-title h3{margin:0}
.client-meta{display:flex;gap:6px 16px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin:0}
.client-meta a{display:inline-flex;gap:5px;align-items:center;color:var(--text)}
.client-meta a:hover{color:var(--accent-text);text-decoration:underline}
.client-meta .ico{width:14px;height:14px}
.client-actions{display:flex;gap:6px;flex-wrap:wrap}

.search{position:relative;display:flex;align-items:center;flex:1;min-width:200px;max-width:380px}
.search .ico{position:absolute;left:12px;color:var(--subtle);width:17px;height:17px;pointer-events:none}
.search input{padding-left:38px;min-height:42px;font-size:14px}
.select-inline select{min-height:42px;font-size:14px;width:auto}
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.toolbar .button.primary{margin-left:auto}
.toolbar .muted{margin:0}

/* Abas */
.tabs{display:inline-flex;gap:4px;padding:4px;border-radius:999px;background:var(--surface-3);margin-bottom:20px}
.tabs button{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border:0;border-radius:999px;background:transparent;color:var(--muted);font-weight:650;font-size:14px}
.tabs button[aria-selected=true]{background:var(--surface);color:var(--text-strong);box-shadow:var(--shadow-sm)}
.tabs .count{font-size:11.5px;padding:1px 7px;border-radius:999px;background:var(--surface-2);border:1px solid var(--border)}

/* Tabela de usuários (vira cartões no celular) */
.table-card{overflow:hidden}
.data-table{width:100%;border-collapse:collapse;font-size:14px}
.data-table th{text-align:left;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--subtle);font-weight:700;padding:12px 16px;background:var(--surface-2);border-bottom:1px solid var(--border)}
.data-table td{padding:12px 16px;border-bottom:1px solid var(--divider);vertical-align:middle;overflow-wrap:anywhere}
.data-table tr:last-child td{border-bottom:0}
.data-table tbody tr:hover td{background:var(--surface-2)}
.cell-strong{font-weight:600;color:var(--text-strong)}
.row-actions{text-align:right;white-space:nowrap}
.row-actions .button{margin-left:4px}

.profile-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.profile-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.profile-top h3{margin:4px 0 0}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}

.empty{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;padding:36px 20px;color:var(--muted);font-size:14px;background:var(--surface-2);border-radius:var(--radius-sm)}
.empty .ico{width:28px;height:28px;color:var(--subtle)}
.empty p{margin:0}
.empty.small{padding:18px}

/* Convite */
.invitation{position:relative;display:flex;gap:16px;padding:22px 56px 22px 22px;margin-bottom:24px;border:1px solid var(--accent-border);background:var(--accent-soft);border-radius:var(--radius);outline:none;scroll-margin-top:90px}
.invitation-icon{width:42px;height:42px;flex:none;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center}
.invitation h2{font-size:18px;margin-bottom:6px}
.invitation p{font-size:14px;color:var(--text);margin:0 0 12px}
.invitation .field-help{margin:10px 0 0}
.invitation-body{flex:1;min-width:0}
.copy-row{display:flex;gap:8px}
.copy-row input{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:13px}
.invitation-close{position:absolute;right:12px;top:12px}

/* Histórico */
.timeline{display:grid;gap:10px}
.day{font-size:13px!important;letter-spacing:.08em!important;text-transform:uppercase;color:var(--subtle)!important;margin:18px 0 4px!important}
.day:first-child{margin-top:0!important}
.event{display:flex;gap:14px;padding:16px 18px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm)}
.event-icon{width:36px;height:36px;flex:none;border-radius:50%;background:var(--surface-3);color:var(--muted);display:grid;place-items:center}
.event-body{flex:1;min-width:0}
.event-title{display:flex;justify-content:space-between;gap:12px;margin:0 0 2px;font-size:14.5px;color:var(--text-strong)}
.event-title time{font-size:12.5px;color:var(--subtle);white-space:nowrap}
.event-meta{margin:0;font-size:13.5px;color:var(--muted);overflow-wrap:anywhere}
.event details{margin-top:8px;font-size:13px}
.event summary{cursor:pointer;color:var(--accent-text);font-weight:600;width:max-content}
.change-block{margin-top:12px}
.change-title{font-weight:650;margin:0 0 6px}
.table-scroll{overflow:auto;max-width:100%}
.change-table{width:100%;border-collapse:collapse;font-size:12.5px}
.change-table th,.change-table td{text-align:left;padding:7px 10px;border-bottom:1px solid var(--divider);overflow-wrap:anywhere}
.change-table th{background:var(--surface-2);font-weight:650;color:var(--muted)}
.portal pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:320px;overflow:auto;background:var(--surface-2);border:1px solid var(--border);padding:14px;border-radius:var(--radius-xs);font-size:12px}

/* Diálogo */
.portal-dialog{width:min(560px,calc(100vw - 24px));max-height:min(88vh,860px);padding:0;border:1px solid var(--border);border-radius:16px;background:var(--surface);color:var(--text);box-shadow:var(--shadow-lg);overflow:hidden}
.portal-dialog.wide{width:min(760px,calc(100vw - 24px))}
.portal-dialog[open]{display:flex;flex-direction:column}
.portal-dialog::backdrop{background:rgba(12,14,11,.55);backdrop-filter:blur(2px)}
.portal-dialog>form{display:flex;flex-direction:column;gap:0;min-height:0;max-height:inherit}
.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 22px;border-bottom:1px solid var(--divider)}
.dialog-body{padding:22px;overflow:auto;display:grid;gap:18px;min-height:0}
.dialog-body p{margin:0}
.dialog-foot{display:flex;justify-content:flex-end;gap:10px;padding:16px 22px;border-top:1px solid var(--divider);background:var(--surface-2)}
.picker{border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px;background:var(--surface-2)}
.picker-tools{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.picker-tools .search{max-width:none}
.picker-list{max-height:280px;overflow:auto;display:grid;gap:10px;padding-right:4px}
.picker-area-name{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--subtle);font-weight:700;margin:4px 0 2px!important}
.picker-count{font-size:13px;color:var(--muted);margin:10px 0 0!important}

.state-card{max-width:620px;margin:40px auto;text-align:center;padding:40px 32px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.state-card>.ico{width:40px;height:40px;color:var(--accent-text);margin-bottom:12px}
.state-card h1{font-size:26px}
.state-card p{color:var(--muted)}
.state-card .actions{justify-content:center;margin-top:18px}

/* Notificação */
#message[data-kind=error]{background:var(--bad-fill);color:#fff}
#message[data-kind=ok]{background:var(--ink)}

@media (max-width:980px){
  .split{grid-template-columns:1fr}
  .panel.sticky{position:static}
  .hero-panel{grid-template-columns:1fr}
  .auth{grid-template-columns:1fr;max-width:560px}
  .auth-aside{display:none}
}
@media (max-width:700px){
  .portal-main{padding:22px 14px 48px}
  .page-head{margin-bottom:20px}
  .page-head>.button{width:100%}
  .panel,.card{padding:18px}
  .hero-panel{padding:22px}
  .auth{margin:0;border-radius:16px}
  .auth-card{padding:28px 20px 24px}
  .auth-card h1{font-size:27px}
  .client-actions{width:100%}
  .client-actions .button{flex:1 1 auto}
  .toolbar .search{max-width:none;flex-basis:100%}
  .toolbar .select-inline,.toolbar .select-inline select{flex:1 1 100%;width:100%}
  .toolbar .button.primary{margin-left:0;flex:1 1 100%}
  .tabs{display:flex}
  .tabs button{flex:1;justify-content:center}
  .data-table thead{display:none}
  .data-table,.data-table tbody,.data-table tr,.data-table td{display:block;width:100%}
  .data-table tr{padding:12px 14px;border-bottom:1px solid var(--divider)}
  .data-table td{border:0;padding:4px 0;display:flex;gap:10px;align-items:center}
  .data-table td[data-label]::before{content:attr(data-label);flex:0 0 72px;font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--subtle);font-weight:700}
  .row-actions{text-align:left;padding-top:8px!important;flex-wrap:wrap}
  .row-actions .button{margin:0 6px 0 0}
  .invitation{flex-direction:column;padding:18px}
  .invitation-close{top:10px;right:10px}
  .copy-row{flex-direction:column}
  .dialog-body{padding:18px}
  .dialog-foot .button{flex:1}
  .event{padding:14px}
  .event-title{flex-direction:column;gap:0}
  .head-stats{width:100%}
  .stat{flex:1}
}

/* Caderno de processos na visão geral e nos perfis */
.head-actions{display:flex;gap:10px;flex-wrap:wrap}
.proc-panel{display:flex;align-items:center;gap:18px;margin-top:18px;padding:20px 22px;background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--accent);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.proc-panel .card-icon{margin:0;flex:none}
.proc-panel>div:nth-child(2){flex:1;min-width:0}
.proc-panel h2{font-size:18px;margin:0 0 4px}
.proc-panel .muted{margin:0}
.perm-group-title{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--subtle);font-weight:700;margin:10px 0 2px!important}
.perm-group-title:first-of-type{margin-top:0!important}
@media (max-width:700px){.proc-panel{flex-direction:column;align-items:flex-start}.proc-panel .button{width:100%}.head-actions{width:100%}.head-actions .button{flex:1}}
