/* =========================================================
   GranHub 2.3 — correção estrutural de viewport / admin / mobile
   Carregado POR ÚLTIMO para neutralizar regras antigas conflitantes.
   ========================================================= */

:root{
  --gh-admin-sidebar:236px;
  --gh-topbar-h:68px;
  --gh-page-gap:22px;
}

html{
  width:100%;
  min-width:0;
  overflow-x:hidden;
}
body{
  width:100%;
  min-width:0;
  overflow-x:hidden!important;
}
#app{min-width:0;width:100%}

/* Marca equilibrada: sem círculo, sem cápsula, sem fundo */
.sidebar-brand,
.admin-sidebar-brand{
  height:58px!important;
  min-height:58px!important;
  padding:0 8px!important;
  margin:0 0 8px!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.sidebar-brand .logo-image,
.admin-sidebar-brand .logo-image,
.brand-logo-main{
  width:128px!important;
  max-width:100%!important;
  height:auto!important;
  max-height:34px!important;
  object-fit:contain!important;
  object-position:left center!important;
  border:0!important;
  border-radius:0!important;
  background:none!important;
  box-shadow:none!important;
  padding:0!important;
}

/* ---------- ADMIN: correção principal de cortes ---------- */
.admin-app{
  --gh-sidebar:var(--gh-admin-sidebar)!important;
  width:100%!important;
  min-width:0!important;
  min-height:100dvh!important;
  background:#f4f7fb!important;
  overflow:visible!important;
}
.admin-sidebar{
  position:fixed!important;
  left:0!important;
  top:0!important;
  bottom:0!important;
  width:var(--gh-admin-sidebar)!important;
  height:100dvh!important;
  padding:12px 10px 10px!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  z-index:500!important;
}
.admin-sidebar .sidebar-nav{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-width:thin;
  padding:4px 2px 12px!important;
}
.admin-sidebar .sidebar-foot{
  flex:0 0 auto!important;
  margin-top:8px!important;
  padding-top:8px!important;
  background:#091f42;
}
.admin-sidebar .nav-link{
  min-height:39px!important;
  padding:9px 10px!important;
  border-radius:9px!important;
  font-size:.79rem!important;
}
.admin-sidebar .nav-section{
  padding:9px 9px 6px!important;
  font-size:.62rem!important;
}

.admin-main{
  margin-left:var(--gh-admin-sidebar)!important;
  width:calc(100% - var(--gh-admin-sidebar))!important;
  max-width:none!important;
  min-width:0!important;
  min-height:100dvh!important;
  overflow:visible!important;
  padding:0!important;
}
.admin-topbar{
  position:fixed!important;
  top:0!important;
  left:var(--gh-admin-sidebar)!important;
  right:0!important;
  width:auto!important;
  height:var(--gh-topbar-h)!important;
  min-height:var(--gh-topbar-h)!important;
  padding:0 18px!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  z-index:450!important;
  background:rgba(255,255,255,.96)!important;
  border-bottom:1px solid #dde7f3!important;
  box-shadow:0 5px 18px rgba(19,55,99,.035)!important;
  backdrop-filter:blur(15px)!important;
}
.admin-content{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:1640px!important;
  min-width:0!important;
  margin:0 auto!important;
  padding:calc(var(--gh-topbar-h) + 22px) clamp(16px,2vw,28px) 48px!important;
  overflow:visible!important;
}
.admin-content>*{max-width:100%;min-width:0}
.admin-top-title-wrap{min-width:0;line-height:1.1}
.admin-top-title-wrap small{font-size:.61rem!important}
.admin-topbar .top-title{font-size:.92rem!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-topbar .topbar-actions{margin-left:auto!important;min-width:0!important;display:flex!important;align-items:center!important;gap:7px!important}
.admin-environment-chip{white-space:nowrap}

/* Cabeçalhos nunca escondem conteúdo */
.admin-content .page-head,
.portal-content .page-head{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:16px!important;
  min-width:0!important;
  margin:0 0 18px!important;
  padding:0!important;
}
.admin-content .page-head>div:first-child,
.portal-content .page-head>div:first-child{min-width:0;max-width:900px}
.admin-content .page-head h1,
.portal-content .page-head h1{margin:3px 0 0!important;line-height:1.12!important}
.admin-content .page-head p,
.portal-content .page-head p{max-width:780px!important;overflow-wrap:anywhere}
.page-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;flex-wrap:wrap!important;min-width:0!important;max-width:100%!important}

/* Cards/formulários do Admin */
.admin-card,
.admin-metric,
.card,
.settings-renewed{
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
.admin-card{overflow:visible!important}
.admin-metrics{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:12px!important;
}
.admin-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr)!important;
  gap:14px!important;
}
.field-row{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px!important;
}
.field,.field-row>*{min-width:0!important;max-width:100%!important}
.field input,.field textarea,.field select,.search-input{
  box-sizing:border-box!important;
  min-width:0!important;
  max-width:100%!important;
  width:100%!important;
}

/* CONFIGURAÇÕES: corrige exatamente o encavalamento mostrado */
.settings-renewed{
  display:block!important;
  padding:clamp(16px,2vw,24px)!important;
}
.settings-section-title{
  display:flex!important;
  align-items:flex-start!important;
  gap:10px!important;
  margin:0 0 14px!important;
}
.settings-section-title>span{flex:0 0 auto;margin-top:2px}
.settings-section-title h3{margin:0!important;font-size:.9rem!important}
.settings-section-title p{margin:4px 0 0!important;font-size:.72rem!important;line-height:1.45!important;color:var(--gh-muted)!important}
.global-banner-editor{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px!important;
  align-items:start!important;
}
.global-banner-upload{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  padding:12px!important;
  border:1px solid #dce8f6!important;
  border-radius:12px!important;
  background:#fbfdff!important;
  overflow:hidden!important;
}
.global-banner-preview{
  display:block!important;
  width:100%!important;
  height:clamp(128px,15vw,190px)!important;
  margin:0 0 10px!important;
  overflow:hidden!important;
  border-radius:9px!important;
  border:1px solid #e0eaf7!important;
  background:#eaf3ff!important;
}
.global-banner-preview img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
.global-banner-upload>span:last-child{display:block!important;min-width:0!important}
.global-banner-upload strong{display:block!important;margin-bottom:3px!important}
.global-banner-upload small{display:block!important;margin:0 0 9px!important;line-height:1.4!important}
.global-banner-upload input[type="file"]{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  font-size:.72rem!important;
}
.settings-renewed .field-row{margin-top:18px!important}

/* tabelas: desktop rola somente a tabela, nunca a página horizontal */
.table-wrap,
.responsive-cards{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
  -webkit-overflow-scrolling:touch;
}
.admin-content table{width:100%!important;max-width:100%!important}
.admin-content th,.admin-content td{vertical-align:middle!important}
.table-actions{display:flex!important;gap:6px!important;flex-wrap:wrap!important;justify-content:flex-end!important}

/* Modais utilizáveis mesmo em telas baixas */
.modal-backdrop{
  position:fixed!important;
  inset:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:14px!important;
  align-items:flex-start!important;
  justify-content:center!important;
}
.modal{
  width:min(720px,100%)!important;
  max-width:calc(100vw - 28px)!important;
  max-height:calc(100dvh - 28px)!important;
  margin:auto!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
}
.modal.large{width:min(1040px,100%)!important}
.modal .modal-body{min-height:0!important;overflow:auto!important;overscroll-behavior:contain}
.modal .modal-head,.modal .modal-footer{flex:0 0 auto!important}

/* Relógio — limpo e discreto */
.brasilia-clock{
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  padding:6px 10px!important;
  border:1px solid #dce8f7!important;
  border-radius:10px!important;
  background:#fff!important;
  box-shadow:none!important;
  color:#183e6b!important;
  white-space:nowrap!important;
}
.brasilia-clock-icon{
  width:28px!important;
  height:28px!important;
  border-radius:8px!important;
  display:grid!important;
  place-items:center!important;
  flex:0 0 auto!important;
  color:#0870ea!important;
  background:#edf5ff!important;
}
.brasilia-clock-icon svg{width:14px!important;height:14px!important}
.brasilia-clock strong{
  display:block!important;
  margin:0!important;
  font-size:.78rem!important;
  line-height:1.05!important;
  font-variant-numeric:tabular-nums!important;
  letter-spacing:.01em!important;
}
.brasilia-clock small{
  display:block!important;
  margin:3px 0 0!important;
  color:#7a90aa!important;
  font-size:.57rem!important;
  line-height:1!important;
  text-transform:capitalize!important;
}

/* Portal também recebe proteção contra corte */
.portal-app,.portal-main,.portal-content{min-width:0!important;max-width:100%!important}
.portal-content{box-sizing:border-box!important}
.portal-sidebar .sidebar-nav{min-height:0!important}

/* ---------- NOTEBOOK ---------- */
@media(max-width:1366px){
  :root{--gh-admin-sidebar:220px;--gh-topbar-h:64px}
  .admin-sidebar .nav-link{font-size:.75rem!important;padding:8px 9px!important;min-height:36px!important}
  .admin-sidebar .nav-section{font-size:.59rem!important;padding-top:8px!important}
  .sidebar-brand .logo-image,.admin-sidebar-brand .logo-image,.brand-logo-main{width:122px!important;max-height:32px!important}
  .admin-content{padding-inline:18px!important}
  .admin-metrics{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .global-banner-preview{height:150px!important}
}

@media(max-width:1120px){
  .admin-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .admin-grid,.admin-calendar-layout,.viewer-admin-card{grid-template-columns:1fr!important}
  .portfolio-grid-admin{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .topbar-actions .admin-environment-chip{display:none!important}
  .global-banner-preview{height:140px!important}
}

/* ---------- TABLET / MOBILE ---------- */
@media(max-width:980px){
  :root{--gh-topbar-h:62px}
  .admin-sidebar,
  .portal-sidebar{
    width:min(286px,88vw)!important;
    transform:translateX(-104%)!important;
    transition:transform .25s cubic-bezier(.2,.8,.2,1)!important;
    box-shadow:22px 0 48px rgba(5,32,71,.2)!important;
  }
  .admin-sidebar.open,.portal-sidebar.open{transform:translateX(0)!important}
  .admin-main,.portal-main{
    margin-left:0!important;
    width:100%!important;
    max-width:100%!important;
  }
  .admin-topbar{
    left:0!important;
    height:var(--gh-topbar-h)!important;
    min-height:var(--gh-topbar-h)!important;
    padding:0 12px!important;
  }
  .admin-content{padding:calc(var(--gh-topbar-h) + 16px) 14px 34px!important}
  .mobile-menu{display:grid!important;flex:0 0 auto!important}
  .mobile-overlay{z-index:490!important}
  .admin-topbar .brasilia-clock,.portal-topbar .brasilia-clock{display:none!important}
  .admin-topbar .user-chip>span:nth-child(2){display:none!important}
  .admin-topbar .user-chip{width:42px!important;max-width:42px!important;padding:4px!important}
  .page-head{flex-direction:column!important;align-items:stretch!important}
  .page-actions{justify-content:flex-start!important;width:100%!important}
  .field-row{grid-template-columns:1fr!important}
  .global-banner-editor{grid-template-columns:1fr!important}
  .global-banner-preview{height:min(190px,34vw)!important;min-height:130px!important}
}

@media(max-width:700px){
  .admin-content{padding-left:10px!important;padding-right:10px!important}
  .admin-metrics{grid-template-columns:1fr 1fr!important;gap:8px!important}
  .admin-metric{padding:12px!important}
  .admin-card,.settings-renewed{padding:13px!important}
  .portfolio-grid-admin{grid-template-columns:1fr!important}
  .page-actions{display:grid!important;grid-template-columns:1fr!important}
  .page-actions>.btn,.page-actions>a.btn{width:100%!important}
  .responsive-cards{
    overflow:visible!important;
    border:0!important;
    background:transparent!important;
  }
  .responsive-cards table,.responsive-cards tbody,.responsive-cards tr,.responsive-cards td{display:block!important;width:100%!important;min-width:0!important}
  .responsive-cards thead{display:none!important}
  .responsive-cards tr{margin-bottom:10px!important;padding:8px!important;border:1px solid var(--gh-border)!important;border-radius:11px!important;background:#fff!important}
  .responsive-cards td{display:grid!important;grid-template-columns:92px minmax(0,1fr)!important;gap:8px!important;border:0!important;padding:7px!important;overflow-wrap:anywhere!important}
  .responsive-cards td::before{content:attr(data-label);font-size:.62rem;font-weight:800;color:#8094ad;text-transform:uppercase;letter-spacing:.04em}
  .responsive-cards td[data-label="Ações"]{display:block!important}
  .responsive-cards td[data-label="Ações"]::before{display:block!important;margin-bottom:7px!important}
  .responsive-cards td[data-label="Ações"] .table-actions{justify-content:flex-start!important}
  .responsive-cards td[data-label="Ações"] .btn{flex:1 1 120px!important}
}

@media(max-width:480px){
  :root{--gh-topbar-h:60px}
  .admin-top-title-wrap small{display:none!important}
  .admin-topbar .top-title{font-size:.84rem!important}
  .admin-topbar .topbar-actions{gap:5px!important}
  .admin-topbar .icon-btn{width:38px!important;height:38px!important}
  .admin-metrics{grid-template-columns:1fr!important}
  .settings-section-title{gap:8px!important}
  .global-banner-preview{height:132px!important}
  .modal-backdrop{padding:7px!important}
  .modal{max-width:calc(100vw - 14px)!important;max-height:calc(100dvh - 14px)!important}
}

/* Uploads do Admin com aparência consistente */
.global-banner-upload input[type="file"]::file-selector-button{
  border:1px solid #cfe0f4;
  border-radius:8px;
  padding:7px 10px;
  margin-right:9px;
  background:#edf5ff;
  color:#135eaf;
  font-weight:750;
  cursor:pointer;
}
.global-banner-upload input[type="file"]::file-selector-button:hover{background:#e2efff}
