/* SPB UI Global v1 — componentes reutilizáveis do sistema
 * Escopo seguro: classes .spb-ui-* e adaptadores apenas dentro das áreas do sistema.
 * Cantos sempre quadrados. Cores derivadas das variáveis já configuradas pelo portal.
 */
:root{
  --spb-ui-primary:var(--spb-primary,var(--primary,#1239e6));
  --spb-ui-primary-hover:var(--spb-primary-hover,var(--primary-dark,#0d2db8));
  --spb-ui-danger:#dc2626;
  --spb-ui-danger-hover:#b91c1c;
  --spb-ui-text:#172033;
  --spb-ui-muted:#667085;
  --spb-ui-border:#d7dee7;
  --spb-ui-surface:#fff;
  --spb-ui-soft:#f8fafc;
  --spb-ui-success:#16803a;
  --spb-ui-success-bg:#ecfdf3;
  --spb-ui-error:#b42318;
  --spb-ui-error-bg:#fef3f2;
  --spb-ui-warning:#b54708;
  --spb-ui-warning-bg:#fffaeb;
  --spb-ui-control-h:46px;
  --spb-ui-gap:16px;
}

.spb-ui-scope,.spb-account-shell,.spb-account-panel,.client-main,.client-content{box-sizing:border-box}
.spb-ui-scope *,.spb-account-shell *,.spb-account-panel *,.client-main *,.client-content *{box-sizing:border-box}

/* Botões globais */
.spb-ui-btn,
.spb-ui-scope .btn,
.spb-account-shell .spb-btn,
.spb-account-shell .spb-account-btn,
.client-main .btn-global{
  min-height:42px;display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:9px 18px;border:1px solid transparent;border-radius:0!important;
  font:700 15px/1.2 inherit;text-decoration:none!important;cursor:pointer;
  transition:background-color .18s ease,border-color .18s ease,color .18s ease,opacity .18s ease;
}
.spb-ui-btn--primary{background:var(--spb-ui-primary)!important;border-color:var(--spb-ui-primary)!important;color:#fff!important}
.spb-ui-btn--primary:hover,.spb-ui-btn--primary:focus{background:var(--spb-ui-primary-hover)!important;border-color:var(--spb-ui-primary-hover)!important;color:#fff!important}
.spb-ui-btn--secondary{background:#fff!important;border-color:var(--spb-ui-border)!important;color:var(--spb-ui-text)!important}
.spb-ui-btn--secondary:hover,.spb-ui-btn--secondary:focus{background:var(--spb-ui-soft)!important;color:var(--spb-ui-text)!important}
.spb-ui-btn--outline{background:#fff!important;border-color:var(--spb-ui-primary)!important;color:var(--spb-ui-primary)!important}
.spb-ui-btn--outline:hover,.spb-ui-btn--outline:focus{background:var(--spb-ui-primary)!important;color:#fff!important}
.spb-ui-btn--danger{background:var(--spb-ui-danger)!important;border-color:var(--spb-ui-danger)!important;color:#fff!important}
.spb-ui-btn--danger:hover,.spb-ui-btn--danger:focus{background:var(--spb-ui-danger-hover)!important;border-color:var(--spb-ui-danger-hover)!important;color:#fff!important}
.spb-ui-btn--danger-outline{background:transparent!important;border-color:var(--spb-ui-danger)!important;color:var(--spb-ui-danger)!important}
.spb-ui-btn--danger-outline:hover,.spb-ui-btn--danger-outline:focus{background:var(--spb-ui-danger)!important;color:#fff!important}
.spb-ui-btn[disabled],.spb-ui-btn.is-loading{opacity:.65;cursor:not-allowed;pointer-events:none}
.spb-ui-btn i,.spb-ui-btn svg{color:inherit!important;fill:currentColor}

/* Campos globais */
.spb-ui-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.spb-ui-label{font-weight:700;font-size:15px;color:var(--spb-ui-text)}
.spb-ui-input,.spb-ui-select,.spb-ui-textarea,
.spb-ui-scope input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.spb-ui-scope select,.spb-ui-scope textarea{
  width:100%;min-width:0;min-height:var(--spb-ui-control-h);padding:10px 13px;
  border:1px solid var(--spb-ui-border);border-radius:0!important;background:#fff;color:var(--spb-ui-text);
  font:400 15px/1.35 inherit;outline:none;transition:border-color .16s ease,box-shadow .16s ease;
}
.spb-ui-textarea,.spb-ui-scope textarea{min-height:120px;resize:vertical}
.spb-ui-input:focus,.spb-ui-select:focus,.spb-ui-textarea:focus,
.spb-ui-scope input:focus,.spb-ui-scope select:focus,.spb-ui-scope textarea:focus{
  border-color:var(--spb-ui-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--spb-ui-primary) 14%,transparent)
}
.spb-ui-help{font-size:13px;color:var(--spb-ui-muted)}
.spb-ui-error-text{font-size:13px;color:var(--spb-ui-error)}
.spb-ui-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--spb-ui-gap)}
.spb-ui-col-12{grid-column:span 12}.spb-ui-col-8{grid-column:span 8}.spb-ui-col-6{grid-column:span 6}.spb-ui-col-4{grid-column:span 4}.spb-ui-col-3{grid-column:span 3}

/* Alertas */
.spb-ui-alert{display:flex;align-items:flex-start;gap:10px;padding:13px 15px;border:1px solid;border-radius:0!important;font-size:14px;line-height:1.45;margin:0 0 16px}
.spb-ui-alert--success{background:var(--spb-ui-success-bg);border-color:#abefc6;color:var(--spb-ui-success)}
.spb-ui-alert--error{background:var(--spb-ui-error-bg);border-color:#fecdca;color:var(--spb-ui-error)}
.spb-ui-alert--warning{background:var(--spb-ui-warning-bg);border-color:#fedf89;color:var(--spb-ui-warning)}
.spb-ui-alert__close{margin-left:auto;border:0;background:transparent;color:inherit;font-size:20px;line-height:1;cursor:pointer;padding:0}

/* Cards, tabelas e estado vazio */
.spb-ui-card{background:var(--spb-ui-surface);border:1px solid var(--spb-ui-border);border-radius:0!important;padding:20px;min-width:0}
.spb-ui-card__title{margin:0 0 12px;font-size:20px;font-weight:800;color:var(--spb-ui-text)}
.spb-ui-table-wrap{width:100%;overflow-x:auto;border:1px solid var(--spb-ui-border);background:#fff}
.spb-ui-table{width:100%;border-collapse:collapse;min-width:680px}
.spb-ui-table th,.spb-ui-table td{padding:12px 14px;border-bottom:1px solid var(--spb-ui-border);text-align:left;vertical-align:middle}
.spb-ui-table th{background:var(--spb-ui-soft);font-size:13px;text-transform:uppercase;letter-spacing:.02em;color:var(--spb-ui-text)}
.spb-ui-empty{text-align:center;padding:42px 22px;border:1px dashed var(--spb-ui-border);background:#fff;color:var(--spb-ui-muted)}
.spb-ui-empty__icon{font-size:36px;color:var(--spb-ui-primary);margin-bottom:12px}
.spb-ui-empty h3{margin:0 0 7px;color:var(--spb-ui-text);font-size:20px}

/* Loading */
.spb-ui-spinner{width:20px;height:20px;border:2px solid rgba(255,255,255,.42);border-top-color:currentColor;border-radius:50%!important;animation:spb-ui-spin .7s linear infinite}
.spb-ui-loading-overlay{position:fixed;inset:0;z-index:2147483000;display:none;align-items:center;justify-content:center;background:rgba(15,23,42,.48)}
.spb-ui-loading-overlay.is-open{display:flex}
.spb-ui-loading-box{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--spb-ui-border);padding:18px 22px;color:var(--spb-ui-text);font-weight:700}
.spb-ui-loading-box .spb-ui-spinner{color:var(--spb-ui-primary);border-color:#dbe3ff;border-top-color:var(--spb-ui-primary)}
@keyframes spb-ui-spin{to{transform:rotate(360deg)}}

/* Modal global */
.spb-ui-modal{position:fixed;inset:0;z-index:2147482000;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(15,23,42,.58)}
.spb-ui-modal.is-open{display:flex!important}
.spb-ui-modal__dialog{width:min(620px,100%);max-height:calc(100vh - 40px);overflow:auto;background:#fff;border:1px solid var(--spb-ui-border);border-radius:0!important;box-shadow:0 24px 70px rgba(15,23,42,.22)}
.spb-ui-modal__header,.spb-ui-modal__footer{display:flex;align-items:center;gap:12px;padding:17px 20px}
.spb-ui-modal__header{border-bottom:1px solid var(--spb-ui-border)}
.spb-ui-modal__body{padding:20px}
.spb-ui-modal__footer{justify-content:flex-end;border-top:1px solid var(--spb-ui-border);flex-wrap:wrap}
.spb-ui-modal__title{margin:0;font-size:22px;font-weight:800;color:var(--spb-ui-text)}
.spb-ui-modal__close{margin-left:auto;width:38px;height:38px;display:inline-grid;place-items:center;border:1px solid var(--spb-ui-border);background:#fff;color:var(--spb-ui-text);font-size:24px;cursor:pointer;border-radius:0!important}
body.spb-ui-modal-open{overflow:hidden!important}

/* Adaptadores seguros: somente área do usuário/admin.
 * IMPORTANTE: ações destrutivas nunca herdam a cor primária.
 */
.spb-account-shell button[style*="background: #ffffff"]:not(.danger):not(.spb-account-btn-danger):not(.spb-ui-btn--danger-outline),
.spb-account-shell a[style*="background: #ffffff"]:not(.danger):not(.spb-account-btn-danger):not(.spb-ui-btn--danger-outline),
.spb-account-shell button[style*="background:#ffffff"]:not(.danger):not(.spb-account-btn-danger):not(.spb-ui-btn--danger-outline),
.spb-account-shell a[style*="background:#ffffff"]:not(.danger):not(.spb-account-btn-danger):not(.spb-ui-btn--danger-outline),
.client-main button[style*="background: #ffffff"]:not(.danger):not(.spb-account-btn-danger):not(.spb-ui-btn--danger-outline),
.client-main a[style*="background: #ffffff"]:not(.danger):not(.spb-account-btn-danger):not(.spb-ui-btn--danger-outline){
  color:var(--spb-ui-primary)!important;border-color:var(--spb-ui-primary)!important
}
.spb-account-shell button[style*="background: #ffffff"]:not(.danger):not(.spb-account-btn-danger):not(.spb-ui-btn--danger-outline):hover,
.spb-account-shell a[style*="background: #ffffff"]:not(.danger):not(.spb-account-btn-danger):not(.spb-ui-btn--danger-outline):hover,
.spb-account-shell button[style*="background:#ffffff"]:not(.danger):not(.spb-account-btn-danger):not(.spb-ui-btn--danger-outline):hover,
.spb-account-shell a[style*="background:#ffffff"]:not(.danger):not(.spb-account-btn-danger):not(.spb-ui-btn--danger-outline):hover,
.client-main button[style*="background: #ffffff"]:not(.danger):not(.spb-account-btn-danger):not(.spb-ui-btn--danger-outline):hover,
.client-main a[style*="background: #ffffff"]:not(.danger):not(.spb-account-btn-danger):not(.spb-ui-btn--danger-outline):hover{
  background:var(--spb-ui-primary)!important;color:#fff!important
}

@media(max-width:991px){.spb-ui-col-8,.spb-ui-col-6,.spb-ui-col-4,.spb-ui-col-3{grid-column:span 6}}
@media(max-width:767px){
  .spb-ui-grid{grid-template-columns:1fr;gap:14px}.spb-ui-col-12,.spb-ui-col-8,.spb-ui-col-6,.spb-ui-col-4,.spb-ui-col-3{grid-column:1/-1}
  .spb-ui-card{padding:16px}.spb-ui-modal{padding:10px;align-items:flex-end}.spb-ui-modal__dialog{max-height:calc(100vh - 20px)}
  .spb-ui-modal__footer{display:grid;grid-template-columns:1fr}.spb-ui-modal__footer .spb-ui-btn{width:100%}
  .spb-ui-table{min-width:0}.spb-ui-table thead{display:none}.spb-ui-table,.spb-ui-table tbody,.spb-ui-table tr,.spb-ui-table td{display:block;width:100%}
  .spb-ui-table tr{border-bottom:1px solid var(--spb-ui-border);padding:9px 0}.spb-ui-table td{border:0;padding:7px 13px}.spb-ui-table td[data-label]:before{content:attr(data-label);display:block;font-size:11px;font-weight:800;text-transform:uppercase;color:var(--spb-ui-muted);margin-bottom:3px}
}