/* WhatsApp Merkezi — shared shell for all five tabs. No WhatsApp API or template logic here. */
body.whatsapp-route .page-heading,
body.whatsapp-route .page-footer{display:none!important}
body.whatsapp-route #other-view{min-width:0}
.wa-center.wa-unified{display:grid;gap:14px;min-width:0}
.wa-center.wa-unified .wa-hero{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:16px 19px;border-radius:19px;background:#fff;border:1px solid #deeae4;
  box-shadow:0 6px 24px rgba(20,65,49,.045)
}
.wa-center.wa-unified .wa-title-line{min-width:0}
.wa-center.wa-unified .wa-title-line h2{
  margin:0;font-size:clamp(20px,2.1vw,25px);letter-spacing:-.5px;
  color:#163a2e;font-weight:800;line-height:1.3
}
.wa-center.wa-unified .wa-connection-card{
  display:flex;align-items:center;gap:12px;min-width:0;
  padding:10px 13px;background:#f8fcfa;border:1px solid #dbece2;
  border-radius:13px;box-shadow:none
}
.wa-center.wa-unified .wa-connection-card>div{
  min-width:0;display:grid;gap:2px;margin-right:6px
}
.wa-center.wa-unified .wa-connection-card strong{
  font-size:13px;color:#183b2f;font-weight:800
}
.wa-center.wa-unified .wa-connection-card small{
  color:#798e85;font-size:11px;overflow-wrap:anywhere
}
.wa-center.wa-unified .wa-connection-card.connected i{
  background:#10a66b;box-shadow:0 0 0 6px #e7f6ed;flex:0 0 10px
}
.wa-center.wa-unified .wa-connect-btn{
  width:auto;min-height:36px;margin-left:auto;padding:8px 12px;
  white-space:nowrap;border-radius:10px;background:#e7f6ee;
  color:#14734e;font-size:12px;font-weight:750
}
.wa-center.wa-unified .wa-connect-btn:hover{background:#d8efdf}
.wa-center.wa-unified .wa-tabs{
  display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;
  border:1px solid #e1e9e5;background:#f0f5f2;
  border-radius:17px;padding:6px;overflow:visible
}
.wa-center.wa-unified .wa-tabs button,
.wa-center.wa-unified .wa-tabs button.active{
  display:flex;align-items:center;justify-content:center;
  min-width:0;min-height:45px;padding:10px 8px;margin:0;
  border:0;border-radius:11px;white-space:normal;
  font-weight:750;line-height:1.25;font-size:clamp(12px,1.18vw,15px);
  color:#607a70;background:transparent;box-shadow:none;
  text-align:center;transition:background-color .16s ease,color .16s ease
}
.wa-center.wa-unified .wa-tabs button.active{
  color:#087d52;background:#e1f4e8;
  box-shadow:inset 0 -3px #10936b
}
.wa-center.wa-unified .wa-tabs button:hover:not(.active){background:#fff;color:#184d38}
.wa-center.wa-unified .wa-tabs button:focus-visible{
  outline:2px solid #078b5c;outline-offset:2px
}
.wa-center.wa-unified #wa-content{min-width:0}
.wa-center.wa-unified .wa-panel{
  border-color:#e0e9e4;border-radius:18px;
  box-shadow:0 5px 21px rgba(27,69,46,.035)
}
.wa-center.wa-unified .wa-panel-head h3{color:#173f31;font-weight:800}
.wa-center.wa-unified .wa-panel-head p{color:#758a81}
.wa-center.wa-unified .wa-main-grid{grid-template-columns:minmax(0,1fr)}
.wa-center.wa-unified .wa-main-grid>div{min-width:0}
.wa-center.wa-unified .wa-stats article{border-color:#e0e9e4;box-shadow:0 5px 21px rgba(27,69,46,.035)}
.wa-center.wa-unified .wa-stats strong{color:#173c2f}
.wa-center.wa-unified .wa-status.ready{color:#07754c}
.wa-center.wa-unified .wa-panel .primary{background:#078c5e;color:#fff}
.wa-center.wa-unified .wa-panel .primary:disabled{opacity:.6}
@media(max-width:820px){
  body.whatsapp-route main{padding-bottom:16px}
  .wa-center.wa-unified .wa-hero{
    flex-direction:column;align-items:stretch;gap:11px;
    padding:14px 15px
  }
  .wa-center.wa-unified .wa-title-line h2{font-size:22px}
  .wa-center.wa-unified .wa-connection-card{width:100%;flex-wrap:wrap}
  .wa-center.wa-unified .wa-connection-card>div{flex:1;min-width:115px}
  .wa-center.wa-unified .wa-connect-btn{width:auto;max-width:100%;margin-left:auto}
  .wa-center.wa-unified .wa-tabs{
    grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;
    overflow:visible;padding:5px
  }
  .wa-center.wa-unified .wa-tabs button,
  .wa-center.wa-unified .wa-tabs button.active{
    order:initial;grid-column:span 2;min-width:0;
    min-height:42px;padding:9px 3px;box-shadow:none;
    font-size:clamp(11px,3.35vw,13px)
  }
  .wa-center.wa-unified .wa-tabs button.active{
    box-shadow:inset 0 -3px #10936b
  }
  /* Always the same 3 + 2 + 2 arrangement, regardless of the selected tab. */
  .wa-center.wa-unified .wa-tabs button[data-wa-tab="overview"]{order:1;grid-column:span 2}
  .wa-center.wa-unified .wa-tabs button[data-wa-tab="inbox"]{order:2;grid-column:span 2}
  .wa-center.wa-unified .wa-tabs button[data-wa-tab="campaigns"]{order:3;grid-column:span 2}
  .wa-center.wa-unified .wa-tabs button[data-wa-tab="templates"]{order:4;grid-column:span 3}
  .wa-center.wa-unified .wa-tabs button[data-wa-tab="customers"]{order:5;grid-column:span 3}
  .wa-center.wa-unified .wa-tabs button[data-wa-tab="orders"]{order:6;grid-column:span 3}
  .wa-center.wa-unified .wa-tabs button[data-wa-tab="voice"]{order:7;grid-column:span 3}
  .wa-center.wa-unified .wa-panel{padding:14px}
  .wa-center.wa-unified .wa-inbox-modern{padding:0}
  .wa-center.wa-unified .wa-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:370px){
  .wa-center.wa-unified .wa-tabs button,
  .wa-center.wa-unified .wa-tabs button.active{font-size:11px;padding:8px 2px}
  .wa-center.wa-unified .wa-connection-card .wa-connect-btn{font-size:11px}
}
@media(prefers-reduced-motion:reduce){
  .wa-center.wa-unified .wa-tabs button{transition:none}
}

/* Instagram hero counterpart — WhatsApp colors only; connection APIs remain untouched. */
.wa-center.wa-unified .wa-hero{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:154px;padding:24px 28px;gap:25px;
  border:1px solid rgba(207,231,216,.95);border-radius:26px;
  background:
    radial-gradient(circle at 76% 18%,rgba(25,183,112,.18),transparent 27%),
    radial-gradient(circle at 94% 79%,rgba(12,156,123,.13),transparent 30%),
    linear-gradient(135deg,rgba(255,255,255,.98),rgba(241,251,245,.96));
  box-shadow:0 18px 48px rgba(28,95,63,.075)
}
.wa-center.wa-unified .wa-hero::before{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  right:11%;top:-68px;width:420px;height:245px;border-radius:50%;
  border:1px solid rgba(26,165,104,.16);
  transform:rotate(-11deg);
  box-shadow:0 0 0 21px rgba(28,177,99,.045),0 0 0 43px rgba(10,159,103,.035)
}
.wa-center.wa-unified .wa-hero-copy{position:relative;z-index:1;min-width:0;flex:1}
.wa-center.wa-unified .wa-hero-eyebrow{
  display:block;margin-bottom:11px;
  font-size:11px;letter-spacing:.15em;font-weight:900;color:#258e61
}
.wa-center.wa-unified .wa-hero-copy h2{
  margin:0;color:#123e32;font-size:clamp(30px,3vw,36px);
  line-height:1.08;letter-spacing:-1.2px;font-weight:820;
}
.wa-center.wa-unified .wa-hero-copy h2 b{
  color:#0a9b69;font-weight:820;
}
.wa-center.wa-unified .wa-hero-copy p{
  margin:13px 0 0;max-width:625px;
  color:#627f73;font-size:14px;line-height:1.55;
}
.wa-center.wa-unified .wa-hero .wa-connection-card{
  position:relative;z-index:1;flex:none;max-width:100%;
  background:rgba(255,255,255,.87);backdrop-filter:blur(10px);
  box-shadow:0 8px 30px rgba(26,107,66,.055)
}
@media(max-width:820px){
  .wa-center.wa-unified .wa-hero{
    align-items:stretch;min-height:0;gap:18px;
    padding:24px 22px;
  }
  .wa-center.wa-unified .wa-hero::before{
    right:-36%;top:-65px;width:340px;height:230px;
  }
  .wa-center.wa-unified .wa-hero-copy h2{font-size:clamp(27px,7vw,33px)}
  .wa-center.wa-unified .wa-hero-copy p{font-size:13px;line-height:1.6}
  .wa-center.wa-unified .wa-hero .wa-connection-card{
    width:100%;box-shadow:0 5px 20px rgba(26,107,66,.04)
  }
}
@media(max-width:380px){
  .wa-center.wa-unified .wa-hero{padding:19px 16px}
  .wa-center.wa-unified .wa-hero-copy h2{font-size:27px}
  .wa-center.wa-unified .wa-hero-eyebrow{font-size:10px}
}
