/* FLAITOPS Professional — Overview / shell (modular, não monólito) */

.visually-hidden{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

/* —— Overview hero: área útil sem World/tubo —— */
body.pro-overview-active #workspaceWorldWrap,
body.pro-overview-active .workspace-world-wrap{
  display:none!important;
}
body.pro-overview-active:not(.pro-overview-chat) #workspaceTypingArea,
body.pro-overview-active:not(.pro-overview-chat) .workspace-pro-compose-foot,
body.pro-overview-active:not(.pro-overview-chat) #workspaceChatChips,
body.pro-overview-active:not(.pro-overview-chat) #workspaceProQuick,
body.pro-overview-active:not(.pro-overview-chat) #workspaceChatMessages,
body.pro-overview-active:not(.pro-overview-chat) #workspaceChatIntro,
body.pro-overview-active:not(.pro-overview-chat) #workspaceExpandBtn,
body.pro-overview-active:not(.pro-overview-chat) #workspaceChatMobileBack{
  display:none!important;
}
body.pro-overview-active:not(.pro-overview-chat).workspace-pane-layout .workspace-chat-pane{
  display:none!important;
}
body.pro-overview-active:not(.pro-overview-chat).workspace-pane-layout.workspace-pane-desk-open .workspace-desk-pane{
  display:flex!important;
  flex:1 1 auto;
  min-width:0;
  width:100%;
}
body.pro-overview-active .workspace-desk-scroll{
  max-width:none;
}
body.workspace-professional.pro-overview-active .workspace-rail-add-btn{
  display:none!important;
}

/* —— Overview conversa: chat full (bolhas iguais ao chat normal) —— */
body.pro-overview-chat #workspaceProfessionalOverview{
  display:none!important;
}
body.pro-overview-chat.workspace-pane-layout .workspace-desk-pane{
  display:none!important;
}
body.pro-overview-chat.workspace-pane-layout .workspace-chat-pane,
body.pro-overview-chat.workspace-pane-layout.workspace-pane-chat-open .workspace-chat-pane{
  display:flex!important;
  flex:1 1 auto;
  min-width:0;
  width:100%;
}
body.pro-overview-chat #workspaceTypingArea,
body.pro-overview-chat .workspace-pro-compose-foot,
body.pro-overview-chat #workspaceChatMessages{
  display:flex!important;
}
body.pro-overview-chat .workspace-pro-compose-foot{
  flex-direction:column;
}
body.pro-overview-chat #workspaceProQuick{display:none!important}
body.pro-overview-chat #workspaceChatChips{display:none!important}

/* Popup sugestão World */
.pro-world-suggest{
  position:fixed;
  inset:0;
  z-index:1200;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:1.25rem;
  background:rgba(3,10,18,.45);
  backdrop-filter:blur(4px);
}
.pro-world-suggest[hidden]{display:none!important}
.pro-world-suggest-card{
  width:min(420px,100%);
  margin-bottom:max(4.5rem,8vh);
  border-radius:18px;
  border:1px solid rgba(72,255,31,.28);
  background:linear-gradient(180deg,rgba(12,24,36,.96),rgba(8,16,26,.98));
  box-shadow:0 22px 60px rgba(0,0,0,.4),0 0 28px rgba(72,255,31,.08);
  padding:1.15rem 1.2rem 1.1rem;
  color:var(--text,#eef3f1);
}
.pro-world-suggest-title{
  margin:0 0 .35rem;
  font-size:1.05rem;
  font-weight:700;
  letter-spacing:-.01em;
}
.pro-world-suggest-body{
  margin:0 0 1rem;
  font-size:.9rem;
  line-height:1.45;
  color:var(--muted,#9aafb8);
}
.pro-world-suggest-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}
.pro-world-suggest-open,
.pro-world-suggest-dismiss{
  border-radius:999px;
  font:inherit;
  font-size:.86rem;
  font-weight:700;
  padding:.55rem 1rem;
  cursor:pointer;
}
.pro-world-suggest-open{
  border:0;
  background:var(--green,#48ff1f);
  color:#04140c;
}
.pro-world-suggest-dismiss{
  border:1px solid rgba(255,255,255,.14);
  background:transparent;
  color:inherit;
}
.pro-world-suggest-dismiss:hover{
  border-color:rgba(72,255,31,.4);
  color:var(--green,#48ff1f);
}

#workspaceProfessionalOverview{
  position:relative;
  min-height:min(100%, calc(100vh - 5.5rem));
  padding:clamp(1.2rem,3vh,2.1rem) clamp(1.1rem,2.8vw,2.5rem) 1.8rem;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  overflow:hidden;
  background:
    linear-gradient(180deg, rgba(4,10,18,.35) 0%, rgba(4,10,18,.55) 42%, rgba(4,10,18,.94) 100%),
    #060c14;
}

#workspaceProfessionalOverview[hidden]{display:none!important}

.pro-ov{
  position:relative;
  z-index:1;
  width:100%;
  max-width:1120px;
  margin:0 auto;
}

.pro-ov-atmosphere{
  position:absolute;
  inset:-12% -18% auto -12%;
  height:min(72vh, 640px);
  z-index:0;
  pointer-events:none;
  overflow:hidden;
  mask-image:linear-gradient(180deg, #000 0%, #000 48%, transparent 100%);
  -webkit-mask-image:linear-gradient(180deg, #000 0%, #000 48%, transparent 100%);
}
.pro-ov-atmosphere-img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 28%;
  opacity:.92;
  filter:saturate(1.05) contrast(1.04);
  transform:scale(1.02);
}
.pro-ov-atmosphere-veil{
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse 70% 55% at 55% 35%, transparent 20%, rgba(4,10,18,.45) 100%),
    linear-gradient(90deg, rgba(4,10,18,.55) 0%, transparent 38%, transparent 70%, rgba(4,10,18,.35) 100%),
    linear-gradient(180deg, rgba(4,10,18,.2) 0%, transparent 40%, rgba(4,10,18,.75) 100%);
}
.pro-ov-map{
  width:100%;
  height:100%;
  display:block;
}
.pro-ov-route{
  animation:pro-ov-route-dash 18s linear infinite;
}
.pro-ov-route-b{
  animation-duration:26s;
  animation-direction:reverse;
}
@keyframes pro-ov-route-dash{
  to{stroke-dashoffset:-120}
}
@media (prefers-reduced-motion:reduce){
  .pro-ov-route,.pro-ov-route-b{animation:none}
}

.pro-ov-hero{
  position:relative;
  z-index:1;
  margin:0 0 clamp(1.4rem,3vh,2.1rem);
  max-width:720px;
}

.pro-ov-greet{
  margin:0 0 .45rem;
  color:var(--green,#48ff1f);
  font-size:.9rem;
  font-weight:650;
  letter-spacing:.01em;
}

.pro-ov-title{
  margin:0 0 1.15rem;
  font-size:clamp(1.75rem,2.8vw,2.35rem);
  font-weight:700;
  letter-spacing:-.035em;
  line-height:1.14;
  color:var(--text,#eef3f1);
}

body.light-theme .pro-ov-title{color:#102018}

/* Tubo Overview */
.pro-ov-form.hero-start-trigger{
  width:100%;
  max-width:none;
  margin:0 0 .95rem;
  cursor:default;
  min-height:54px;
  gap:.55rem;
  padding:.36rem .4rem .36rem .95rem;
  border-color:rgba(72,255,31,.22);
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.014)),rgba(8,14,22,.78);
  box-shadow:0 14px 40px rgba(0,0,0,.28),0 0 18px rgba(72,255,31,.04);
}
.pro-ov-form .pro-ov-field{
  display:block;
  width:100%;
}
.pro-ov-form .hero-compose-main{
  flex:1;
  min-width:0;
  display:flex;
  align-items:center;
}
.pro-ov-form .hero-compose-input{
  width:100%;
  border:0;
  outline:0;
  background:transparent;
  color:var(--text);
  font:inherit;
  font-size:.9rem;
  padding:.15rem 0;
}
.pro-ov-form .hero-compose-input::placeholder{
  color:var(--muted2,rgba(198,211,226,.42));
}
.pro-ov-submit{
  appearance:none;
  flex-shrink:0;
  width:42px;
  height:42px;
  border:0;
  border-radius:999px;
  background:var(--green,#48ff1f);
  color:#04140c;
  display:grid;
  place-items:center;
  cursor:pointer;
  transition:transform .15s ease, filter .15s ease;
}
.pro-ov-submit .material-symbols-rounded{font-size:1.2rem;font-weight:700}
.pro-ov-submit:hover{filter:brightness(1.06);transform:scale(1.03)}

.pro-ov-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
}

.pro-ov-action{
  appearance:none;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(10,16,24,.5);
  color:rgba(230,238,244,.88);
  border-radius:999px;
  padding:.4rem .74rem;
  font:inherit;
  font-size:.76rem;
  font-weight:650;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  backdrop-filter:blur(12px);
  transition:border-color .2s ease,background .2s ease,color .2s ease;
}

.pro-ov-action .material-symbols-rounded{
  font-size:.98rem;
  opacity:.85;
}

body.light-theme .pro-ov-action{
  border-color:rgba(8,24,18,.12);
  background:#fff;
  color:#2a3a30;
}

.pro-ov-action:hover{
  border-color:rgba(72,255,31,.4);
  background:rgba(72,255,31,.08);
  color:var(--green,#48ff1f);
}

.pro-ov-body{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);
  gap:1.25rem 1.5rem;
  align-items:start;
}

.pro-ov-side{
  display:grid;
  gap:1rem;
}

.pro-ov-panel{
  min-width:0;
}

.pro-ov-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  margin:0 0 .7rem;
}

.pro-ov-section-head h2{
  margin:0;
  font-size:.66rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted,#9aafb8);
  font-weight:750;
}

.pro-ov-section-link{
  appearance:none;
  border:0;
  background:transparent;
  color:var(--green,#48ff1f);
  font:inherit;
  font-size:.7rem;
  font-weight:700;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:.15rem;
  padding:0;
}

.pro-ov-section-link .material-symbols-rounded{font-size:.9rem}
.pro-ov-section-link:hover{
  text-decoration:underline;
  text-underline-offset:.12em;
}

.pro-ov-chip-list,
.pro-ov-brief-list,
.pro-ov-suggest-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:.45rem;
}

.pro-ov-chip{
  width:100%;
  text-align:left;
  border:0;
  background:transparent;
  color:inherit;
  cursor:pointer;
  font:inherit;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:.55rem;
  align-items:center;
  padding:.42rem .2rem;
  border-radius:.55rem;
  transition:background .15s ease,color .15s ease;
}
.pro-ov-chip .material-symbols-rounded{
  font-size:1.05rem;
  color:rgba(160,180,198,.7);
}
.pro-ov-chip-title{
  font-size:.84rem;
  font-weight:650;
  color:rgba(230,238,244,.9);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.pro-ov-chip-meta{
  font-size:.66rem;
  color:var(--muted,#9aafb8);
  white-space:nowrap;
}
.pro-ov-chip:hover{
  background:rgba(255,255,255,.04);
}
.pro-ov-chip:hover .material-symbols-rounded,
.pro-ov-chip:hover .pro-ov-chip-title{
  color:var(--green,#48ff1f);
}

.pro-ov-brief-card{
  width:100%;
  text-align:left;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(12,18,28,.72);
  border-radius:1rem;
  padding:.85rem .9rem;
  color:inherit;
  cursor:pointer;
  font:inherit;
  display:grid;
  gap:.35rem;
  transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.pro-ov-brief-card:hover{
  border-color:rgba(72,255,31,.28);
  background:rgba(16,24,36,.9);
  transform:translateY(-1px);
}
.pro-ov-brief-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
}
.pro-ov-brief-top .material-symbols-rounded{
  font-size:1.15rem;
  color:var(--green,#48ff1f);
}
.pro-ov-brief-card strong{
  font-size:.88rem;
  font-weight:750;
  letter-spacing:-.01em;
}
.pro-ov-brief-meta{
  font-size:.68rem;
  color:var(--muted,#9aafb8);
}
.pro-ov-brief-status{
  display:inline-flex;
  align-items:center;
  gap:.28rem;
  font-size:.62rem;
  font-weight:700;
  color:rgba(196,208,220,.78);
}
.pro-ov-brief-status i{
  width:6px;height:6px;border-radius:999px;background:currentColor;
  box-shadow:0 0 7px currentColor;
}
.pro-ov-brief-status.is-ok{color:#88d840}
.pro-ov-brief-status.is-warning{color:#ffb020}

.pro-ov-suggest{
  width:100%;
  text-align:left;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(10,16,24,.45);
  border-radius:.85rem;
  padding:.65rem .75rem;
  color:rgba(220,230,238,.88);
  cursor:pointer;
  font:inherit;
  font-size:.78rem;
  font-weight:600;
  line-height:1.35;
  display:flex;
  align-items:flex-start;
  gap:.5rem;
  transition:border-color .2s ease,background .2s ease,color .2s ease;
}
.pro-ov-suggest .material-symbols-rounded{
  font-size:1.05rem;
  color:rgba(72,255,31,.75);
  flex-shrink:0;
  margin-top:.05rem;
}
.pro-ov-suggest:hover{
  border-color:rgba(72,255,31,.35);
  background:rgba(72,255,31,.06);
  color:var(--green,#48ff1f);
}

.pro-ov-empty{
  color:var(--muted,#9aafb8);
  font-size:.8rem;
  padding:.7rem .65rem;
  border:1px dashed rgba(255,255,255,.08);
  border-radius:.85rem;
  text-align:center;
}

body.light-theme .pro-ov-brief-card,
body.light-theme .pro-ov-suggest{
  background:#fff;
  border-color:rgba(8,24,18,.08);
  color:#2a3a30;
}
body.light-theme .pro-ov-atmosphere{opacity:.42}
body.light-theme .pro-ov-atmosphere-veil{
  background:
    linear-gradient(180deg, rgba(244,248,246,.15) 0%, rgba(244,248,246,.55) 55%, rgba(244,248,246,.92) 100%),
    radial-gradient(ellipse 70% 55% at 55% 35%, transparent 10%, rgba(244,248,246,.35) 100%);
}

@media (max-width:900px){
  .pro-ov-body{grid-template-columns:1fr}
  #workspaceProfessionalOverview{
    justify-content:flex-start;
    padding-top:1.15rem;
  }
  .pro-ov-hero{max-width:none}
  .pro-ov-atmosphere{height:44vh; inset:-8% -10% auto -8%}
}

@media (max-width:1366px){
  .pro-ov{max-width:1000px}
}

