/* ============================================================
 * 品宏外贸CRM系统 - 谷歌广告页面样式
 * ============================================================ */

/* 顶部切换工具栏固定 */
.google-ads-toolbar{
  position:sticky;
  top:50px;
  z-index:20;
  background:#f5f7fa;
  padding:10px 0;
  margin:-10px 0 8px 0;
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
}

.ads-period-tabs{
  display:flex;
  gap:4px;
  background:#f5f5f5;
  padding:3px;
  border-radius:6px;
}
.ads-tab{
  padding:6px 16px;
  font-size:12px;
  border-radius:4px;
  color:#666;
  cursor:pointer;
  transition:all 0.15s;
  border:none;
  background:transparent;
}
.ads-tab:hover{background:#e8e8e8;}
.ads-tab.active{background:#fff;color:#e94560;font-weight:600;box-shadow:0 1px 3px rgba(0,0,0,0.1);}

/* 视图切换按钮 */
.ads-view-tabs{
  display:flex;
  gap:4px;
  background:#f5f5f5;
  padding:3px;
  border-radius:6px;
  flex-wrap:wrap;
}
.ads-view-tab{
  padding:6px 12px;
  font-size:12px;
  border-radius:4px;
  color:#666;
  cursor:pointer;
  transition:all 0.15s;
  border:none;
  background:transparent;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:100%;
}
.ads-view-tab:hover{background:#e8e8e8;}
.ads-view-tab.active{background:#fff;color:#1a6dd6;font-weight:600;box-shadow:0 1px 3px rgba(0,0,0,0.1);}

/* 小屏幕适配 */
@media (max-width:768px){
  .ads-view-tab{
    padding:6px 8px;
    font-size:11px;
  }
  .ads-tab{
    padding:6px 10px;
    font-size:11px;
  }
}

.ads-section{
  background:#fff;
  border-radius:8px;
  padding:16px;
  border:1px solid #f0f0f0;
}
.ads-section-title{
  margin-bottom:12px;
  padding-bottom:10px;
  border-bottom:1px solid #f0f0f0;
}
.ads-chart{
  margin-bottom:16px;
}

/* 标签样式 */
.tag{
  display:inline-block;
  padding:2px 8px;
  border-radius:4px;
  font-size:11px;
  font-weight:500;
}
.tag-blue{background:#e6f7ff;color:#1890ff;}
.tag-green{background:#f6ffed;color:#52c41a;}
.tag-orange{background:#fff7e6;color:#fa8c16;}